@media (max-width: 1024px) {
    .auth-layout,
    .profile-shell,
    .dashboard-grid,
    .stats-row,
    .feature-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 900px) {
    .auth-layout {
        gap: 18px;
    }

    .container {
        width: min(100vw - 24px, 100%);
    }

    .header-row {
        min-height: 84px;
        align-items: flex-start;
        flex-direction: column;
        justify-content: center;
        padding: 14px 0;
    }

    .brand-lockup {
        width: 100%;
        align-items: center;
    }

    .brand-logo {
        height: 44px;
    }

    .brand-copy-stack {
        min-width: 0;
    }

    .header-actions,
    .inline-row,
    .toolbar-form,
    .status-row,
    .admin-head-actions {
        width: 100%;
    }

    .header-actions .btn,
    .inline-row .btn {
        flex: 1 1 180px;
    }

    .main-shell {
        padding: 20px 0 36px;
    }

    .hero-card,
    .form-card,
    .dashboard-hero,
    .posting-hero,
    .posting-workspace,
    .posting-stat-card,
    .summary-card,
    .profile-main-card,
    .verification-card,
    .admin-head,
    .table-card,
    .info-card {
        padding: 22px 18px;
    }

    .page-title {
        font-size: clamp(1.95rem, 7vw, 2.8rem);
    }

    .small-title {
        font-size: clamp(1.55rem, 5vw, 2.1rem);
    }

    .card-head h2 {
        font-size: 1.6rem;
    }

    .split-fields {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .btn,
    .field input,
    .field select,
    .field textarea {
        min-height: 50px;
    }

    .toolbar-form .btn {
        width: 100%;
    }

    .account-form .btn,
    .account-form .field,
    .google-block .btn {
        width: 100%;
    }

    .verification-summary,
    .otp-meta {
        padding: 14px;
    }

    .posting-hero,
    .preview-grid {
        grid-template-columns: 1fr;
        display: grid;
    }

    .posting-hero-actions,
    .posting-stats {
        display: grid;
        grid-template-columns: 1fr;
    }

    .content-card {
        flex-direction: column;
        align-items: stretch;
    }

    .content-info {
        align-items: flex-start;
    }

    .content-offer-line {
        max-width: 100%;
    }

    .card-actions {
        width: 100%;
        max-width: none;
        justify-content: stretch;
    }

    .card-actions .btn-sm {
        flex: 1 1 calc(50% - 6px);
    }

    .form-grid,
    .helper-fields {
        grid-template-columns: 1fr;
    }

    .modal-box,
    .smart-modal-box {
        width: min(100vw - 20px, 100%);
        padding: 22px 18px;
    }

    .studio-array-row,
    .media-input-row {
        flex-wrap: wrap;
    }

    .media-input-row {
        grid-template-columns: 1fr;
    }

    .media-state-badge {
        justify-self: start;
    }

    .studio-array-remove,
    .studio-array-add,
    .media-btns,
    .media-btns .btn-media {
        width: 100%;
    }

    .media-btns {
        justify-content: stretch;
    }

    .smart-intro-badges {
        justify-content: flex-start;
    }

    .smart-span-two {
        grid-column: auto;
    }

    .smart-review-actions {
        flex-direction: column;
        align-items: stretch;
    }

    .smart-review-actions-right,
    .modal-footer-actions,
    .smart-modal-actions {
        width: 100%;
        justify-content: stretch;
    }

    .smart-review-actions-right .btn,
    .modal-footer-actions .btn,
    .smart-modal-actions .btn {
        width: 100%;
    }

    .admin-nav,
    .table-inline-actions {
        width: 100%;
    }

    .admin-head-actions .btn {
        width: 100%;
    }
}

@media (max-width: 640px) {
    .brand-mark {
        font-size: 1.55rem;
    }

    .brand-copy {
        font-size: 0.68rem;
    }

    .brand-logo-wrap {
        padding: 6px 10px;
    }

    .header-actions {
        gap: 10px;
    }

    .header-actions .btn {
        width: 100%;
    }

    .admin-nav-link,
    .table-inline-actions .btn {
        width: 100%;
        justify-content: center;
    }

    .table-inline-actions,
    .action-group {
        width: 100%;
    }

    .service-section {
        padding: 14px;
    }

    .feature-panel,
    .verification-summary,
    .otp-meta {
        padding: 14px;
    }

    .posting-hero-actions {
        width: 100%;
    }

    .action-btns,
    .card-actions {
        width: 100%;
    }

    .action-btns .btn-create-smart,
    .action-btns .magic-btn-smart,
    .card-actions .btn-sm {
        width: 100%;
    }

    .status-pill {
        width: 100%;
        justify-content: center;
    }

    .status-badge {
        width: 100%;
        justify-content: center;
    }

    .status-badge .status-dot {
        background: #64748b;
    }

    .status-badge.state-active .status-dot {
        background: var(--c-success);
    }

    .status-badge.state-inactive .status-dot {
        background: var(--c-danger);
    }

    .status-badge.state-pending_review .status-dot {
        background: var(--c-warning);
    }

    .status-badge.state-deleted .status-dot {
        background: var(--c-danger);
    }

    .data-table th,
    .data-table td {
        padding: 14px 10px;
        font-size: 0.92rem;
    }
}

@media (max-width: 480px) {
    .container {
        width: min(100vw - 18px, 100%);
    }

    .btn {
        width: 100%;
        padding: 12px 16px;
    }

    .modal-box,
    .smart-modal-box {
        padding: 18px 14px;
        border-radius: 20px;
    }

    .public-nav-btn {
        padding: 12px 16px;
    }

    .inline-row {
        flex-direction: column;
        align-items: stretch;
    }

    .flash {
        padding: 13px 14px;
    }

    .detail-list {
        padding-left: 18px;
    }

    .table-card {
        padding: 18px 14px;
    }

    .preview-gallery {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .moderation-form {
        min-width: 0;
    }
}