:root {
    --ink: #151a21;
    --paper: #f4f6f8;
    --paper-strong: #ffffff;
    --surface: rgba(255, 255, 255, .92);
    --surface-strong: #ffffff;
    --line: #d9e0e7;
    --muted: #66707d;
    --blue: #215fbd;
    --green: #1f8a5b;
    --gold: #b7862c;
    --violet: #b7862c;
    --violet-soft: rgba(33, 95, 189, .1);
    --dark: #111820;
    --dark-soft: #1d2732;
    --warn: #b3432c;
    --focus: rgba(33, 95, 189, .18);
    --radius: 8px;
    --shadow: 0 16px 40px rgba(17, 24, 32, .1);
    --shadow-soft: 0 8px 22px rgba(17, 24, 32, .07);
    color-scheme: light;
}

.intake-hero-enterprise {
    grid-template-columns: minmax(0, 1fr) minmax(300px, .45fr);
    align-items: stretch;
    padding-top: 3.6rem;
}

.intake-hero-enterprise .intake-copy {
    display: grid;
    align-content: end;
    gap: .95rem;
    max-width: 850px;
}

.intake-hero-enterprise h1 {
    max-width: 900px;
    letter-spacing: 0;
}

.intake-hero-enterprise .lead {
    max-width: 760px;
}

.executive-panel {
    border-left: 0;
    border-top: 3px solid color-mix(in srgb, var(--gold), var(--blue) 35%);
    background:
        linear-gradient(145deg, rgba(255, 255, 255, .96), rgba(244, 247, 250, .9)),
        var(--surface-strong);
}

:root[data-theme="dark"] .executive-panel {
    background:
        linear-gradient(145deg, rgba(31, 36, 31, .95), rgba(18, 21, 18, .88)),
        var(--surface-strong);
}

.intake-form-enterprise {
    display: grid;
    grid-template-columns: 300px minmax(0, 1fr);
    align-items: start;
    gap: 1.25rem;
    margin-bottom: 2rem;
}

.intake-rail {
    position: sticky;
    top: 1rem;
    display: grid;
    gap: .9rem;
}

.intake-rail .progress-shell,
.intake-rail .step-nav,
.rail-note {
    box-shadow: var(--shadow-soft);
}

.intake-form-enterprise .step-nav {
    position: static;
    grid-template-columns: 1fr;
    gap: .35rem;
    margin: 0;
    padding: .55rem;
    backdrop-filter: blur(18px);
}

.intake-form-enterprise .step-nav button {
    justify-content: flex-start;
    text-align: left;
    min-height: 2.8rem;
    padding: 0 .85rem;
}

.intake-form-enterprise .step-nav button.is-active {
    background:
        linear-gradient(135deg, var(--dark), color-mix(in srgb, var(--dark), var(--blue) 16%));
    color: #fff;
}

.rail-note {
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
    padding: 1rem;
}

.rail-note span {
    display: block;
    color: var(--gold);
    font-size: .78rem;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.rail-note p {
    margin: .45rem 0 0;
    color: var(--muted);
    line-height: 1.5;
}

.intake-panels {
    min-width: 0;
}

.intake-form-enterprise .form-section {
    grid-template-columns: minmax(220px, .34fr) minmax(0, 1fr);
    padding: 1.45rem;
    border-color: color-mix(in srgb, var(--line), var(--dark) 8%);
    background:
        linear-gradient(180deg, color-mix(in srgb, var(--surface-strong), transparent 2%), var(--surface)),
        var(--surface-strong);
}

.intake-form-enterprise .form-section > div:first-child {
    border-right: 1px solid var(--line);
    padding-right: 1.2rem;
}

.intake-form-enterprise .form-section > div:first-child h2 {
    margin-bottom: .55rem;
}

.intake-form-enterprise .form-section > div:first-child p:last-child {
    color: var(--muted);
    line-height: 1.55;
}

.intake-form-enterprise input,
.intake-form-enterprise select,
.intake-form-enterprise textarea {
    min-height: 3rem;
    background: color-mix(in srgb, var(--surface-strong), var(--paper-strong) 70%);
}

.intake-form-enterprise textarea {
    min-height: 7rem;
}

.conditional-field.is-hidden-conditional {
    display: none;
}

.dense-choice-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.compact-choice-grid {
    grid-template-columns: 1fr;
}

.reference-grid {
    display: grid;
    grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
    gap: 1rem;
}

.scope-matrix,
.service-category-grid {
    display: grid;
    gap: 1rem;
}

.scope-group,
.service-category {
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: color-mix(in srgb, var(--surface-strong), transparent 4%);
    padding: 1rem;
}

.scope-group h3,
.service-category h4 {
    margin: 0 0 .8rem;
    font-size: .9rem;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--muted);
}

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

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

.budget-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.package-choice {
    position: relative;
}

.package-choice .choice-copy em {
    font-style: normal;
    color: var(--gold);
    font-weight: 900;
}

.choice-copy {
    min-width: 0;
}

.budget-choice {
    min-height: 4rem;
}

.budget-choice span {
    line-height: 1.25;
}

.intake-form-enterprise .choice,
.intake-form-enterprise .service-option {
    border-radius: 8px;
}

.intake-form-enterprise .choice:has(input:checked),
.intake-form-enterprise .service-option:has(input:checked) {
    border-color: color-mix(in srgb, var(--gold), var(--blue) 26%);
    background:
        linear-gradient(145deg, rgba(183, 134, 44, .11), rgba(33, 95, 189, .07)),
        var(--surface-strong);
}

.intake-form-enterprise .step-actions {
    padding-right: 0;
}

@media (max-width: 1120px) {
    .dense-choice-grid,
    .budget-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .package-grid,
    .service-category .service-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 900px) {
    .intake-hero-enterprise,
    .intake-form-enterprise {
        grid-template-columns: 1fr;
    }

    .intake-rail {
        position: static;
    }

    .intake-form-enterprise .step-nav {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .intake-form-enterprise .step-nav button {
        justify-content: center;
        text-align: center;
        padding: 0 .55rem;
    }

    .intake-form-enterprise .form-section {
        grid-template-columns: 1fr;
    }

    .intake-form-enterprise .form-section > div:first-child {
        border-right: 0;
        border-bottom: 1px solid var(--line);
        padding: 0 0 1rem;
    }

    .reference-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 640px) {
    .intake-hero-enterprise {
        padding-top: 1.8rem;
    }

    .intake-form-enterprise .step-nav,
    .dense-choice-grid,
    .budget-grid,
    .field-grid {
        grid-template-columns: 1fr;
    }

    .intake-form-enterprise .form-section,
    .scope-group,
    .service-category {
        padding: 1rem;
    }

    .intake-form-enterprise .step-actions {
        justify-content: stretch;
    }

    .intake-form-enterprise .step-actions .button {
        flex: 1;
    }
}

/* Intake V2: close adaptation of the provided dark enterprise mockup */
.public-page.public-page-intake-v2 {
    margin: 0;
    min-height: 100vh;
    color: #e2e1ef;
    background: #11131c;
    font-family: "Inter", "Segoe UI", sans-serif;
}

.public-page-intake-v2 .material-symbols-outlined {
    font-variation-settings:
        "FILL" 0,
        "wght" 500,
        "GRAD" 0,
        "opsz" 24;
    line-height: 1;
}

.public-page-intake-v2 main {
    width: min(1260px, calc(100% - 2rem));
    margin: 0 auto;
}

.crm-intake-shell {
    padding: 0 0 3rem;
}

.crm-intake-topbar {
    width: min(1260px, calc(100% - 2rem));
    margin: 0 auto;
    padding: 1rem 0 .5rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
}

.crm-intake-brand {
    color: #f3f1fa;
    font-size: .8rem;
    font-weight: 700;
    letter-spacing: .22em;
    text-transform: uppercase;
}

.crm-intake-topbar-actions {
    display: flex;
    align-items: center;
    gap: .75rem;
}

.crm-preview-flag {
    min-height: 2.2rem;
    border: 1px solid rgba(126, 240, 168, .28);
    border-radius: 999px;
    background: rgba(57, 217, 143, .12);
    color: #a6f1c2;
    padding: 0 .85rem;
    display: inline-flex;
    align-items: center;
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.crm-top-action {
    min-height: 3.1rem;
    border: 1px solid rgba(84, 92, 118, .72);
    border-radius: 999px;
    background: linear-gradient(180deg, rgba(35, 38, 50, .96), rgba(24, 26, 35, .96));
    color: #eef1ff;
    padding: 0 1.22rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .45rem;
    font-size: .83rem;
    font-weight: 700;
    letter-spacing: .01em;
    cursor: pointer;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .05), 0 10px 24px rgba(6, 8, 14, .16);
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease, background-color .18s ease, color .18s ease;
}

.crm-top-action:hover,
.crm-footer-button:hover {
    transform: translateY(-1px);
}

.crm-top-action:focus-visible,
.crm-footer-button:focus-visible,
.crm-package-nav-chip:focus-visible,
.crm-package-arrow:focus-visible,
.crm-intake-stepnav button:focus-visible {
    outline: none;
    border-color: rgba(184, 195, 255, .78);
    box-shadow: 0 0 0 1px rgba(184, 195, 255, .85), 0 0 0 4px rgba(184, 195, 255, .14);
}

.crm-top-action .material-symbols-outlined,
.crm-footer-button .material-symbols-outlined {
    font-size: 1rem;
}

.crm-top-action-primary {
    border-color: rgba(160, 242, 188, .26);
    background: linear-gradient(135deg, #54d882, #8af0b0 56%, #c8ffe0);
    color: #07130b;
    box-shadow: 0 16px 34px rgba(25, 102, 58, .26), inset 0 1px 0 rgba(255, 255, 255, .2);
}

.crm-top-action-primary span,
.crm-top-action-primary .material-symbols-outlined,
.crm-footer-button-primary span,
.crm-footer-button-primary .material-symbols-outlined {
    color: inherit;
}

.crm-top-action-primary:hover,
.crm-footer-button-primary:hover {
    border-color: rgba(160, 242, 188, .42);
    box-shadow: 0 18px 38px rgba(25, 102, 58, .3), inset 0 1px 0 rgba(255, 255, 255, .22);
}

.crm-intake-layout {
    display: grid;
    grid-template-columns: 256px minmax(0, 1fr);
    gap: 1.5rem;
    width: min(1260px, calc(100% - 2rem));
    margin: 0 auto;
    padding: 1rem 0 2.5rem;
}

.crm-intake-sidebar {
    position: sticky;
    top: 1.5rem;
    align-self: start;
    display: flex;
    flex-direction: column;
    gap: 2rem;
    padding-top: 1rem;
}

.crm-progress-head h2,
.crm-step-header h1,
.crm-block-head h3,
.crm-scope-card h4,
.crm-service-group h4 {
    font-family: "Plus Jakarta Sans", "Inter", sans-serif;
}

.crm-progress-head h2 {
    margin: 0 0 .45rem;
    color: #f0edf8;
    font-size: 2rem;
    line-height: 1.08;
}

.crm-progress-head p {
    margin: 0;
    color: #8e90a2;
    font-size: .95rem;
}

.crm-intake-stepnav {
    display: flex;
    flex-direction: column;
    gap: .55rem;
}

.crm-intake-stepnav button {
    min-height: 3.15rem;
    border: 1px solid rgba(67, 70, 86, .62);
    border-radius: .85rem;
    background: linear-gradient(180deg, rgba(31, 33, 44, .95), rgba(22, 24, 32, .95));
    color: #c4c5d9;
    padding: 0 1rem;
    display: flex;
    align-items: center;
    gap: .7rem;
    text-align: left;
    cursor: pointer;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .03);
    transition: border-color .18s ease, background-color .18s ease, color .18s ease, transform .18s ease, box-shadow .18s ease;
}

.crm-intake-stepnav button span:last-child {
    font-size: .86rem;
    font-weight: 600;
}

.crm-intake-stepnav button:hover {
    transform: translateY(-1px);
    border-color: rgba(184, 195, 255, .35);
    background: linear-gradient(180deg, rgba(36, 40, 54, .98), rgba(28, 31, 42, .98));
    box-shadow: 0 14px 24px rgba(6, 8, 14, .14);
}

.crm-intake-stepnav button.is-active {
    border-color: rgba(92, 206, 140, .38);
    background: linear-gradient(135deg, rgba(38, 74, 58, .62), rgba(28, 33, 41, .98));
    color: #f6fff8;
    box-shadow: 0 16px 28px rgba(12, 24, 18, .2), inset 0 0 0 1px rgba(87, 221, 134, .16);
}

.crm-intake-stepnav button.is-complete {
    color: #9ff0bc;
    border-color: rgba(126, 240, 168, .26);
}

.crm-side-note {
    border: 1px solid rgba(67, 70, 86, .5);
    border-radius: .9rem;
    background: #191b24;
    padding: 1rem;
}

.crm-side-note-label {
    margin: 0 0 .7rem;
    color: #dfe6f5;
    font-size: .88rem;
    font-weight: 700;
    letter-spacing: .01em;
}

.crm-side-note-call {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .55rem;
    width: 100%;
    min-height: 3rem;
    padding: .9rem 1rem;
    border: 1px solid rgba(87, 221, 134, .38);
    border-radius: .85rem;
    background: linear-gradient(180deg, rgba(87, 221, 134, .18), rgba(40, 54, 46, .32));
    color: #f6fffa;
    text-decoration: none;
    font-weight: 700;
    letter-spacing: 0;
    box-shadow: 0 0 0 1px rgba(87, 221, 134, .08), 0 14px 32px rgba(10, 18, 13, .22);
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease, background .18s ease;
}

.crm-side-note-call:hover,
.crm-side-note-call:focus-visible {
    transform: translateY(-1px);
    border-color: rgba(126, 240, 168, .58);
    background: linear-gradient(180deg, rgba(87, 221, 134, .24), rgba(40, 54, 46, .4));
    box-shadow: 0 0 0 1px rgba(87, 221, 134, .14), 0 18px 38px rgba(10, 18, 13, .28);
}

.crm-side-note-call:focus-visible {
    outline: none;
}

.crm-side-note-call .material-symbols-outlined {
    font-size: 1.15rem;
}

.crm-intake-main {
    min-width: 0;
}

.crm-step-header {
    margin-bottom: 1.5rem;
}

.crm-step-kicker {
    margin: 0 0 .7rem;
    color: #b8c3ff;
    font-size: .82rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.crm-step-badge {
    width: 3rem;
    height: 3rem;
    margin-bottom: 1rem;
    border-radius: 999px;
    display: inline-grid;
    place-items: center;
    border: 1px solid rgba(184, 195, 255, .35);
    background: rgba(46, 91, 255, .14);
    color: #dce3ff;
    font-size: .82rem;
    font-weight: 600;
}

.crm-step-header h1 {
    margin: 0 0 .75rem;
    color: #f1eef7;
    font-size: clamp(2.4rem, 5vw, 4rem);
    line-height: 1.05;
    letter-spacing: 0;
}

.crm-step-header p {
    margin: 0;
    color: #c4c5d9;
    font-size: 1.14rem;
}

.crm-intake-card {
    border: 1px solid rgba(67, 70, 86, .55);
    border-radius: 1.5rem;
    background: rgba(29, 31, 41, .88);
    box-shadow: 0 30px 80px rgba(0, 0, 0, .26);
    padding: 1.6rem;
}

.crm-error-box {
    margin-bottom: 1.5rem;
    border: 1px solid rgba(255, 180, 171, .28);
    background: rgba(147, 0, 10, .2);
    color: #ffdad6;
}

.crm-inline-error {
    margin: .75rem 0 0;
    color: #ffb4ab;
    font-size: .88rem;
    font-weight: 600;
}

.crm-error-summary {
    margin: 0 0 1.5rem;
    border: 1px solid rgba(255, 180, 171, .18);
    border-radius: 1rem;
    background: rgba(255, 255, 255, .02);
    padding: 1rem;
    display: grid;
    gap: .9rem;
}

.crm-error-summary-head {
    display: grid;
    gap: .2rem;
}

.crm-error-summary-head strong {
    color: #ffdad6;
    font-size: .98rem;
}

.crm-error-summary-head span {
    color: #f0c5bf;
    font-size: .88rem;
}

.crm-error-summary-list {
    display: grid;
    gap: .7rem;
}

.crm-error-summary-item {
    width: 100%;
    border: 1px solid rgba(255, 180, 171, .14);
    border-radius: .9rem;
    background: rgba(147, 0, 10, .16);
    padding: .9rem 1rem;
    display: grid;
    gap: .2rem;
    text-align: left;
    cursor: pointer;
    transition: border-color .18s ease, background-color .18s ease, transform .18s ease;
}

.crm-error-summary-item:hover {
    border-color: rgba(255, 180, 171, .32);
    background: rgba(147, 0, 10, .22);
    transform: translateY(-1px);
}

.crm-error-summary-step {
    color: #ffb4ab;
    font-size: .73rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.crm-error-summary-title {
    color: #fff1ef;
    font-size: .95rem;
    font-weight: 700;
}

.crm-error-summary-text {
    color: #f2d1cc;
    font-size: .88rem;
    line-height: 1.45;
}

.crm-step-panel {
    display: none;
}

.crm-step-panel.is-active {
    display: grid;
    gap: 1.8rem;
    animation: crm-step-enter .24s ease both;
}

.crm-section-block,
.crm-form-stack {
    display: grid;
    gap: 1rem;
}

.crm-block-head {
    display: grid;
    gap: .35rem;
}

.crm-block-head h3 {
    margin: 0;
    color: #f1eef7;
    font-size: 1.15rem;
}

.crm-block-head p {
    margin: 0;
    color: #c4c5d9;
    line-height: 1.55;
}

.crm-divider {
    border: 0;
    border-top: 1px solid rgba(67, 70, 86, .35);
    margin: 0;
}

.crm-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.crm-col-span-2 {
    grid-column: 1 / -1;
}

.public-page-intake-v2 label {
    display: grid;
    gap: .5rem;
    color: #cfd4ea;
    font-size: .84rem;
    font-weight: 600;
}

.public-page-intake-v2 label small {
    color: #8e90a2;
    font-size: .8rem;
    line-height: 1.45;
}

.public-page-intake-v2 input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
.public-page-intake-v2 select,
.public-page-intake-v2 textarea {
    width: 100%;
    min-height: 3rem;
    border: 1px solid #2b3450;
    border-radius: .7rem;
    background: #0a0c10;
    color: #e2e1ef;
    padding: .9rem 1rem;
    font-family: "Inter", "Segoe UI", sans-serif;
    transition: border-color .18s ease, box-shadow .18s ease, background-color .18s ease;
}

.public-page-intake-v2 textarea {
    min-height: 7rem;
    resize: vertical;
}

.public-page-intake-v2 input:not([type="checkbox"]):not([type="radio"]):not([type="file"])::placeholder,
.public-page-intake-v2 textarea::placeholder {
    color: rgba(142, 144, 162, .75);
}

.public-page-intake-v2 input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):focus,
.public-page-intake-v2 select:focus,
.public-page-intake-v2 textarea:focus {
    outline: none;
    border-color: #b8c3ff;
    box-shadow: 0 0 0 1px #b8c3ff;
}

.public-page-intake-v2 input[type="checkbox"],
.public-page-intake-v2 input[type="radio"] {
    appearance: none;
    -webkit-appearance: none;
    width: 1.35rem;
    min-width: 1.35rem;
    height: 1.35rem;
    min-height: 1.35rem;
    margin: 0;
    padding: 0;
    border: 1px solid rgba(142, 144, 162, .9);
    background: rgba(255, 255, 255, .02);
    display: inline-grid;
    place-items: center;
    flex: 0 0 auto;
    cursor: pointer;
    transition: border-color .18s ease, background-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.public-page-intake-v2 input[type="checkbox"] {
    border-radius: .12rem;
}

.public-page-intake-v2 input[type="radio"] {
    border-radius: 999px;
}

.public-page-intake-v2 input[type="checkbox"]::before,
.public-page-intake-v2 input[type="radio"]::before {
    content: "";
    display: block;
    transition: transform .16s ease, opacity .16s ease;
    opacity: 0;
}

.public-page-intake-v2 input[type="checkbox"]::before {
    width: .82rem;
    height: .6rem;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 12'%3E%3Cpath d='M1.5 6.5 5.5 10.5 14.5 1.5' fill='none' stroke='%2308110c' stroke-linecap='round' stroke-linejoin='round' stroke-width='2.6'/%3E%3C/svg%3E");
    transform: scale(.55);
}

.public-page-intake-v2 input[type="radio"]::before {
    width: .58rem;
    height: .58rem;
    border-radius: 999px;
    background: #08110c;
    transform: scale(.5);
}

.public-page-intake-v2 input[type="checkbox"]:checked,
.public-page-intake-v2 input[type="radio"]:checked {
    border-color: #57dd86;
    background: #57dd86;
    box-shadow: 0 0 0 1px rgba(87, 221, 134, .2), 0 0 18px rgba(57, 217, 143, .16);
}

.public-page-intake-v2 input[type="checkbox"]:checked::before,
.public-page-intake-v2 input[type="radio"]:checked::before {
    opacity: 1;
}

.public-page-intake-v2 input[type="checkbox"]:checked::before {
    transform: scale(1);
}

.public-page-intake-v2 input[type="radio"]:checked::before {
    transform: scale(1);
}

.public-page-intake-v2 input[type="checkbox"]:focus-visible,
.public-page-intake-v2 input[type="radio"]:focus-visible {
    outline: none;
    border-color: #b8c3ff;
    box-shadow: 0 0 0 1px #b8c3ff, 0 0 0 4px rgba(184, 195, 255, .16);
}

.crm-field-green input,
.crm-field-green select,
.crm-field-green textarea,
.conditional-field:not(.is-hidden-conditional) input,
.conditional-field:not(.is-hidden-conditional) select,
.conditional-field:not(.is-hidden-conditional) textarea {
    border-color: rgba(87, 221, 134, .35);
    box-shadow: 0 0 0 1px rgba(87, 221, 134, .16), 0 0 18px rgba(57, 217, 143, .08);
    animation: crm-green-pulse 2.6s ease-in-out infinite;
}

.crm-chip-grid,
.crm-style-grid,
.crm-package-grid,
.crm-budget-grid,
.crm-service-grid,
.crm-upload-grid,
.crm-scope-grid {
    display: grid;
    gap: 1rem;
}

.crm-scope-empty {
    border: 1px dashed rgba(67, 70, 86, .68);
    border-radius: .95rem;
    background: rgba(17, 19, 28, .42);
    padding: 1rem 1.1rem;
    color: #bcc1d4;
    font-size: .95rem;
    line-height: 1.55;
}

.crm-chip-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.crm-chip-grid-tight {
    gap: .8rem;
}

.crm-chip-grid-compact {
    grid-template-columns: 1fr;
    gap: .7rem;
}

.crm-chip,
.crm-style-card,
.crm-budget-card,
.crm-package-card,
.crm-service-card {
    cursor: pointer;
}

.crm-chip input,
.crm-style-card input,
.crm-budget-card input,
.crm-package-card input,
.crm-service-card input,
.crm-checkline input {
    width: auto;
}

.crm-style-card,
.crm-budget-card,
.crm-package-card,
.crm-service-card,
.crm-checkline {
    position: relative;
    --crm-indicator-top: .95rem;
    --crm-indicator-right: .95rem;
    --crm-indicator-size: 1.2rem;
}

.crm-budget-card input,
.crm-package-card input,
.crm-service-card input,
.crm-checkline input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.crm-style-card::after,
.crm-budget-card::after,
.crm-package-card::after,
.crm-service-card::after,
.crm-checkline::after {
    content: "";
    position: absolute;
    top: var(--crm-indicator-top);
    right: var(--crm-indicator-right);
    width: var(--crm-indicator-size);
    height: var(--crm-indicator-size);
    border: 1px solid rgba(142, 144, 162, .9);
    border-radius: .16rem;
    background: rgba(255, 255, 255, .02);
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .08);
    transition: border-color .18s ease, background-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.crm-style-card::before,
.crm-budget-card::before,
.crm-package-card::before,
.crm-service-card::before,
.crm-checkline::before {
    content: "";
    position: absolute;
    top: var(--crm-indicator-top);
    right: var(--crm-indicator-right);
    width: var(--crm-indicator-size);
    height: var(--crm-indicator-size);
    background-repeat: no-repeat;
    background-position: center;
    background-size: .78rem .58rem;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 12'%3E%3Cpath d='M1.5 6.5 5.5 10.5 14.5 1.5' fill='none' stroke='%2308110c' stroke-linecap='round' stroke-linejoin='round' stroke-width='2.6'/%3E%3C/svg%3E");
    opacity: 0;
    transform: scale(.72);
    transition: opacity .16s ease, transform .16s ease;
    z-index: 1;
    pointer-events: none;
}

.crm-chip {
    min-height: 3.1rem;
    border: 1px solid rgba(67, 70, 86, .6);
    border-radius: .9rem;
    background: #20222d;
    padding: .95rem 1rem;
    display: grid;
    grid-template-columns: 1.35rem minmax(0, 1fr);
    align-items: center;
    gap: .7rem;
    position: relative;
    transition: border-color .18s ease, transform .18s ease, box-shadow .18s ease, background-color .18s ease;
}

.crm-chip input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.crm-chip-box {
    width: 1.1rem;
    height: 1.1rem;
    border: 1px solid rgba(142, 144, 162, .9);
    border-radius: .12rem;
    background: rgba(255, 255, 255, .02);
    display: inline-grid;
    place-items: center;
    transition: border-color .18s ease, background-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.crm-chip-box::after {
    content: "";
    width: .76rem;
    height: .56rem;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 12'%3E%3Cpath d='M1.5 6.5 5.5 10.5 14.5 1.5' fill='none' stroke='%2308110c' stroke-linecap='round' stroke-linejoin='round' stroke-width='2.6'/%3E%3C/svg%3E");
    opacity: 0;
    transform: scale(.65);
    transition: opacity .16s ease, transform .16s ease;
}

.crm-chip-label {
    color: #f1eef7;
    font-size: .95rem;
    font-weight: 500;
    line-height: 1.35;
    min-width: 0;
}

.crm-chip-label-wrap {
    min-width: 0;
    display: inline-flex;
    align-items: center;
    gap: .5rem;
}

.crm-chip-label-wrap .crm-tooltip {
    flex: 0 0 auto;
}

.crm-chip-label-wrap .crm-tooltip-panel {
    right: auto;
    left: 50%;
    transform: translate(-50%, .3rem);
}

.crm-chip-label-wrap .crm-tooltip:hover .crm-tooltip-panel,
.crm-chip-label-wrap .crm-tooltip:focus-within .crm-tooltip-panel {
    transform: translate(-50%, 0);
}

.crm-chip input:checked + .crm-chip-box {
    border-color: #57dd86;
    background: #57dd86;
    box-shadow: 0 0 0 1px rgba(87, 221, 134, .2), 0 0 18px rgba(57, 217, 143, .16);
}

.crm-chip input:checked + .crm-chip-box::after {
    opacity: 1;
    transform: scale(1);
}

.crm-chip input:focus-visible + .crm-chip-box {
    outline: none;
    border-color: #b8c3ff;
    box-shadow: 0 0 0 1px #b8c3ff, 0 0 0 4px rgba(184, 195, 255, .16);
}

.crm-chip-compact {
    min-height: 0;
}

.crm-chip:hover,
.crm-style-card:hover,
.crm-budget-card:hover,
.crm-package-card:hover,
.crm-service-card:hover,
.crm-upload-card:hover {
    transform: translateY(-1px);
    border-color: rgba(184, 195, 255, .3);
}

.crm-chip:has(input:checked),
.crm-budget-card:has(input:checked),
.crm-package-card:has(input:checked),
.crm-service-card:has(input:checked),
.crm-style-card:has(input:checked),
.crm-checkline:has(input:checked) {
    border-color: rgba(87, 221, 134, .44);
    background: linear-gradient(145deg, rgba(57, 217, 143, .12), rgba(32, 34, 45, .96));
    box-shadow: 0 0 0 1px rgba(87, 221, 134, .18), 0 0 22px rgba(57, 217, 143, .08);
    animation: crm-selected-pulse 2.6s ease-in-out infinite;
}

.crm-style-card:has(input:checked)::after,
.crm-budget-card:has(input:checked)::after,
.crm-package-card:has(input:checked)::after,
.crm-service-card:has(input:checked)::after,
.crm-checkline:has(input:checked)::after {
    border-color: #57dd86;
    background: #57dd86;
    box-shadow: 0 0 0 1px rgba(87, 221, 134, .2), 0 0 18px rgba(57, 217, 143, .16);
}

.crm-style-card:has(input:checked)::before,
.crm-budget-card:has(input:checked)::before,
.crm-package-card:has(input:checked)::before,
.crm-service-card:has(input:checked)::before,
.crm-checkline:has(input:checked)::before {
    opacity: 1;
    transform: scale(1);
}

.crm-style-card:has(input:focus-visible)::after,
.crm-budget-card:has(input:focus-visible)::after,
.crm-package-card:has(input:focus-visible)::after,
.crm-service-card:has(input:focus-visible)::after,
.crm-checkline:has(input:focus-visible)::after {
    border-color: #b8c3ff;
    box-shadow: 0 0 0 1px #b8c3ff, 0 0 0 4px rgba(184, 195, 255, .16);
}

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

.crm-style-card {
    min-height: 8.4rem;
    border: 1px solid rgba(67, 70, 86, .6);
    border-radius: .95rem;
    background: #20222d;
    padding: 0;
}

.crm-style-card input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.crm-style-card > div {
    height: 100%;
    padding: 1.35rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.crm-style-card .material-symbols-outlined {
    color: #b8c3ff;
    font-size: 2rem;
}

.crm-style-card strong {
    color: #f1eef7;
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.4;
}

.crm-reference-card {
    display: grid;
    gap: 1rem;
    border: 1px solid rgba(67, 70, 86, .5);
    border-radius: .95rem;
    background: #20222d;
    padding: 1.25rem;
}

.crm-reference-list {
    display: grid;
    gap: 1rem;
}

.crm-reference-card textarea {
    min-height: 7.6rem;
}

.crm-reference-add {
    min-height: 4.25rem;
    border: 2px dashed rgba(67, 70, 86, .9);
    border-radius: .95rem;
    background: rgba(25, 27, 36, .35);
    color: #8e90a2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .55rem;
    font-size: .95rem;
    font-weight: 600;
    cursor: pointer;
    transition: border-color .18s ease, color .18s ease, background-color .18s ease, transform .18s ease;
}

.crm-reference-add:hover {
    transform: translateY(-1px);
    border-color: rgba(184, 195, 255, .28);
    color: #c4c5d9;
    background: rgba(32, 34, 45, .55);
}

.crm-reference-add .material-symbols-outlined {
    font-size: 1.1rem;
}

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

.crm-upload-card {
    min-height: 11rem;
    border: 2px dashed rgba(67, 70, 86, .75);
    border-radius: .95rem;
    background: rgba(10, 12, 16, .42);
    padding: 1.5rem;
    display: grid;
    place-items: center;
    gap: .5rem;
    text-align: center;
    position: relative;
}

.crm-upload-card .material-symbols-outlined {
    width: 3rem;
    height: 3rem;
    border-radius: 999px;
    display: grid;
    place-items: center;
    background: #2c2f3b;
    color: #c4c5d9;
    font-size: 1.4rem;
}

.crm-upload-card strong {
    color: #f1eef7;
    font-size: 1rem;
}

.crm-upload-card small {
    color: #c4c5d9;
    line-height: 1.45;
}

.crm-upload-card input {
    position: absolute;
    inset: 0;
    opacity: 0;
    cursor: pointer;
}

.crm-upload-card-wide {
    grid-column: span 1;
}

.crm-scope-grid,
.crm-service-groups {
    display: grid;
    gap: 1rem;
}

.crm-scope-card,
.crm-service-group {
    border: 1px solid rgba(67, 70, 86, .5);
    border-radius: .95rem;
    background: #20222d;
    padding: 1.1rem;
}

.crm-scope-card h4,
.crm-service-group h4 {
    margin: 0 0 .9rem;
    color: #c4c5d9;
    font-size: .8rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
}

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

.crm-service-card {
    min-height: 6rem;
    border: 1px solid rgba(67, 70, 86, .6);
    border-radius: .9rem;
    background: #191b24;
    padding: 1rem;
    display: grid;
    align-content: start;
    gap: .55rem;
}

.crm-service-card span,
.crm-package-card strong {
    color: #f1eef7;
    font-size: .96rem;
    font-weight: 600;
}

.crm-service-card small,
.crm-package-card small,
.crm-package-card li {
    color: #c4c5d9;
    line-height: 1.45;
}

.crm-package-grid {
    grid-template-columns: 1fr;
}

.crm-package-nav {
    display: flex;
    flex-wrap: wrap;
    gap: .7rem;
    margin-bottom: 1rem;
}

.crm-package-nav-chip {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    min-height: 2.6rem;
    border-radius: 999px;
    border: 1px solid rgba(76, 81, 102, .72);
    background: linear-gradient(180deg, rgba(32, 35, 45, .95), rgba(24, 26, 35, .95));
    padding: 0 1rem;
    color: #d0d5e7;
    font-size: .88rem;
    font-weight: 700;
    cursor: pointer;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .03);
    transition: border-color .18s ease, background-color .18s ease, color .18s ease, transform .18s ease, box-shadow .18s ease;
}

.crm-package-nav-chip:hover {
    transform: translateY(-1px);
    border-color: rgba(184, 195, 255, .34);
    background: linear-gradient(180deg, rgba(38, 41, 53, .98), rgba(29, 31, 42, .98));
    color: #f1eef7;
    box-shadow: 0 12px 24px rgba(6, 8, 14, .14);
}

.crm-package-nav-chip.is-active {
    border-color: rgba(87, 221, 134, .44);
    background: linear-gradient(135deg, rgba(41, 84, 64, .5), rgba(28, 32, 40, .98));
    color: #eafff1;
    box-shadow: 0 0 0 1px rgba(87, 221, 134, .16), 0 14px 28px rgba(12, 24, 18, .18);
}

.crm-package-nav-chip small {
    display: inline-flex;
    align-items: center;
    min-height: 1.35rem;
    padding: 0 .45rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, .06);
    color: #b7f6cd;
    font-size: .64rem;
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
}

.crm-package-nav-chip--recommended {
    border-color: rgba(126, 240, 168, .28);
    background: rgba(57, 217, 143, .08);
}

.crm-package-showcase {
    position: relative;
    display: grid;
    gap: .9rem;
    min-width: 0;
}

.crm-package-carousel-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.crm-package-carousel-kicker {
    color: #9ca3bd;
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.crm-package-carousel-arrows {
    display: flex;
    align-items: center;
    gap: .55rem;
}

.crm-package-carousel-arrows.is-hidden {
    display: none;
}

.crm-package-arrow {
    width: 2.7rem;
    height: 2.7rem;
    border-radius: 999px;
    border: 1px solid rgba(76, 81, 102, .72);
    background: linear-gradient(180deg, rgba(32, 35, 45, .96), rgba(23, 25, 34, .96));
    color: #e2e1ef;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04), 0 12px 24px rgba(6, 8, 14, .16);
    transition: border-color .18s ease, background-color .18s ease, color .18s ease, transform .18s ease, opacity .18s ease, box-shadow .18s ease;
}

.crm-package-arrow:hover:not(:disabled) {
    transform: translateY(-1px);
    border-color: rgba(184, 195, 255, .34);
    background: linear-gradient(180deg, rgba(39, 42, 55, .98), rgba(30, 33, 44, .98));
    box-shadow: 0 14px 28px rgba(6, 8, 14, .18);
}

.crm-package-arrow:disabled {
    opacity: .38;
    cursor: default;
}

.crm-package-arrow .material-symbols-outlined {
    font-size: 1.15rem;
}

.crm-package-viewport {
    position: relative;
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
}

.crm-package-viewport::before,
.crm-package-viewport::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: .45rem;
    width: 1.2rem;
    pointer-events: none;
    opacity: 0;
    transition: opacity .18s ease;
    z-index: 1;
}

.crm-package-viewport::before {
    left: 0;
    background: linear-gradient(90deg, rgba(17, 19, 28, .96), rgba(17, 19, 28, 0));
}

.crm-package-viewport::after {
    right: 0;
    background: linear-gradient(270deg, rgba(17, 19, 28, .96), rgba(17, 19, 28, 0));
}

.crm-package-viewport.is-scrollable:not(.is-at-start)::before {
    opacity: 1;
}

.crm-package-viewport.is-scrollable:not(.is-at-end)::after {
    opacity: 1;
}

.crm-package-card {
    --crm-package-accent: rgba(126, 240, 168, .55);
    --crm-indicator-top: 1.25rem;
    --crm-indicator-right: 1.5rem;
    position: relative;
    z-index: 2;
    min-height: 100%;
    border: 1px solid rgba(67, 70, 86, .6);
    border-radius: .95rem;
    background:
        linear-gradient(180deg, color-mix(in srgb, var(--crm-package-accent) 12%, transparent), transparent 28%),
        linear-gradient(180deg, rgba(33, 35, 46, .98), rgba(23, 25, 34, .98));
    padding: 1.6rem 1.8rem 1.6rem 1.6rem;
    display: grid;
    gap: 1.25rem;
    align-content: start;
    overflow: visible;
    scroll-snap-align: start;
}

.crm-package-card--basic {
    --crm-package-accent: rgba(146, 154, 180, .42);
}

.crm-package-card--standard {
    --crm-package-accent: rgba(127, 221, 162, .5);
}

.crm-package-card--pro {
    --crm-package-accent: rgba(135, 179, 255, .54);
}

.crm-package-card--premium {
    --crm-package-accent: rgba(126, 240, 168, .72);
    border-color: rgba(126, 240, 168, .36);
    box-shadow: 0 20px 40px rgba(15, 24, 20, .28);
}

.crm-package-card--enterprise {
    --crm-package-accent: rgba(222, 198, 134, .62);
    border-color: rgba(222, 198, 134, .28);
}

.crm-package-card:has(input:checked) {
    z-index: 3;
}

.crm-package-head {
    display: grid;
    gap: .45rem;
    padding-right: 2.9rem;
}

.crm-package-label-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .55rem;
}

.crm-package-card em {
    display: block;
    color: #7ef0a8;
    font-style: normal;
    font-size: .9rem;
    font-weight: 700;
}

.crm-package-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 1.65rem;
    padding: 0 .65rem;
    border-radius: 999px;
    border: 1px solid rgba(126, 240, 168, .28);
    background: rgba(87, 221, 134, .1);
    color: #b7f6cd;
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.crm-package-headline {
    margin: 0;
    color: #ffffff;
    font-size: 1.18rem;
    font-weight: 700;
    line-height: 1.46;
}

.crm-package-description {
    display: block;
    color: #d5d7e6;
    font-size: 1rem;
    line-height: 1.68;
}

.crm-package-card ul {
    margin: 0;
    padding: 0;
    list-style: none;
    display: grid;
    gap: .82rem;
}

.crm-package-card li {
    position: relative;
    padding-left: 1.1rem;
    line-height: 1.62;
}

.crm-package-card li::before {
    content: "";
    position: absolute;
    left: 0;
    top: .52rem;
    width: .38rem;
    height: .38rem;
    border-radius: 999px;
    background: color-mix(in srgb, var(--crm-package-accent) 92%, #ffffff 8%);
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--crm-package-accent) 16%, transparent);
}

.crm-package-meta {
    margin-top: .35rem;
    border-top: 1px solid rgba(255, 255, 255, .07);
    padding-top: 1.15rem;
    display: grid;
    gap: 1rem;
}

.crm-package-meta-row {
    display: grid;
    grid-template-columns: 1fr;
    gap: .35rem;
    padding-right: 1.3rem;
}

.crm-package-meta-label {
    color: #9ca3bd;
    font-size: .8rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.crm-package-meta-value {
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    gap: .45rem;
    color: #f1eef7;
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.58;
    text-align: left;
    max-width: 28ch;
}

.crm-tooltip {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    outline: none;
}

.crm-tooltip-trigger {
    width: 1.05rem;
    height: 1.05rem;
    border-radius: 999px;
    border: 1px solid rgba(196, 197, 217, .25);
    background: rgba(255, 255, 255, .05);
    color: #c8cde0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: .66rem;
    font-weight: 700;
    line-height: 1;
}

.crm-tooltip-panel {
    position: absolute;
    right: 0;
    bottom: calc(100% + .65rem);
    width: min(19rem, calc(100vw - 4rem));
    border: 1px solid rgba(67, 70, 86, .72);
    border-radius: .8rem;
    background: rgba(9, 11, 17, .98);
    box-shadow: 0 20px 40px rgba(0, 0, 0, .38);
    padding: .8rem .9rem;
    color: #e5e7f3;
    font-size: .84rem;
    font-weight: 500;
    line-height: 1.55;
    text-align: left;
    display: none;
    transform: translateY(.3rem);
    z-index: 12;
    white-space: normal;
    pointer-events: none;
}

.crm-tooltip:hover .crm-tooltip-panel,
.crm-tooltip:focus-within .crm-tooltip-panel {
    display: block;
    transform: translateY(0);
    pointer-events: auto;
}

.crm-package-note {
    margin-top: 1rem;
    border: 1px solid rgba(67, 70, 86, .45);
    border-radius: .95rem;
    background: rgba(17, 19, 28, .56);
    overflow: hidden;
}

.crm-package-note summary {
    list-style: none;
    cursor: pointer;
    padding: .95rem 1.05rem;
    color: #d6daea;
    font-size: .9rem;
    font-weight: 600;
}

.crm-package-note summary::-webkit-details-marker {
    display: none;
}

.crm-package-note summary::after {
    content: "+";
    float: right;
    color: #8e90a2;
    font-size: 1rem;
}

.crm-package-note[open] summary::after {
    content: "−";
}

.crm-package-note-body {
    display: grid;
    gap: .45rem;
    padding: 0 1.05rem 1rem;
    border-top: 1px solid rgba(67, 70, 86, .35);
}

.crm-package-note p {
    margin: 0;
    color: #bcc1d4;
    font-size: .84rem;
    line-height: 1.55;
}

@media (min-width: 1101px) {
    .crm-package-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 1.3rem;
    }
}

@media (max-width: 1480px) {
    .crm-package-grid {
        display: flex;
        gap: 1rem;
        width: 100%;
        max-width: 100%;
        overflow-x: auto;
        overflow-y: hidden;
        padding-inline: .45rem;
        padding-bottom: .45rem;
        scroll-padding-inline: .45rem;
        scroll-snap-type: x proximity;
        scrollbar-width: thin;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior-x: contain;
    }

    .crm-package-card {
        flex: 0 0 calc(100% - .9rem);
        max-width: 40rem;
        min-width: 0;
    }
}

.crm-budget-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.crm-budget-card {
    min-height: 4.25rem;
    border: 1px solid rgba(67, 70, 86, .6);
    border-radius: .95rem;
    background: #20222d;
    padding: 1rem;
    display: flex;
    align-items: center;
    gap: .65rem;
}

.crm-budget-card span {
    color: #f1eef7;
    font-size: .96rem;
    font-weight: 500;
    line-height: 1.35;
}

.crm-checkline {
    min-height: 0;
    border: 1px solid rgba(67, 70, 86, .5);
    border-radius: .95rem;
    background: #20222d;
    padding: 1rem;
    display: flex;
    align-items: flex-start;
    gap: .75rem;
    color: #e2e1ef;
    line-height: 1.55;
}

.crm-checkline input {
    margin-top: .15rem;
}

.crm-checkline a {
    color: #b8c3ff;
}

.crm-intake-footer {
    margin-top: 1.5rem;
    padding-top: 1.5rem;
    border-top: 1px solid rgba(67, 70, 86, .35);
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
}

.crm-footer-button {
    min-height: 3.2rem;
    border-radius: 999px;
    padding: 0 1.5rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    font-size: .85rem;
    font-weight: 700;
    letter-spacing: .01em;
    border: 1px solid rgba(76, 81, 102, .68);
    cursor: pointer;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04), 0 10px 22px rgba(6, 8, 14, .14);
    transition: transform .18s ease, border-color .18s ease, background-color .18s ease, box-shadow .18s ease, color .18s ease;
}

.crm-footer-button-secondary {
    background: linear-gradient(180deg, rgba(34, 36, 47, .96), rgba(24, 26, 35, .96));
    color: #edf0ff;
}

.crm-footer-button-primary {
    margin-left: auto;
    border-color: rgba(160, 242, 188, .26);
    background: linear-gradient(135deg, #54d882, #8af0b0 56%, #c8ffe0);
    color: #07130b;
    box-shadow: 0 16px 34px rgba(25, 102, 58, .26), inset 0 1px 0 rgba(255, 255, 255, .2);
}

.crm-intake-bottom {
    width: min(1260px, calc(100% - 2rem));
    margin: 0 auto;
    padding: 0 0 1.5rem;
    border-top: 1px solid rgba(67, 70, 86, .35);
    color: #e2e1ef;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    font-size: .82rem;
}

.crm-intake-bottom-links {
    display: flex;
    gap: 1.25rem;
    color: #8e90a2;
}

.crm-intake-bottom a {
    color: inherit;
    text-decoration: none;
}

.is-hidden-conditional {
    display: none !important;
}

.is-muted {
    opacity: .48;
}

@keyframes crm-step-enter {
    from {
        opacity: 0;
        transform: translateY(8px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes crm-green-pulse {
    0%,
    100% {
        box-shadow: 0 0 0 1px rgba(87, 221, 134, .16), 0 0 16px rgba(57, 217, 143, .05);
    }

    50% {
        box-shadow: 0 0 0 1px rgba(87, 221, 134, .28), 0 0 22px rgba(57, 217, 143, .12);
    }
}

@keyframes crm-selected-pulse {
    0%,
    100% {
        box-shadow: 0 0 0 1px rgba(87, 221, 134, .18), 0 0 22px rgba(57, 217, 143, .08);
    }

    50% {
        box-shadow: 0 0 0 1px rgba(87, 221, 134, .28), 0 0 30px rgba(57, 217, 143, .16);
    }
}

@media (max-width: 1100px) {
    .crm-intake-layout {
        grid-template-columns: 220px minmax(0, 1fr);
    }

    .crm-chip-grid,
    .crm-budget-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .crm-service-grid {
        grid-template-columns: 1fr;
    }

    .crm-package-grid {
        gap: .9rem;
    }

    .crm-tooltip-panel {
        right: auto;
        left: 0;
        width: min(15rem, calc(100vw - 5rem));
        max-width: calc(100vw - 5rem);
    }
}

@media (max-width: 900px) {
    .crm-intake-layout {
        grid-template-columns: 1fr;
    }

    .crm-intake-sidebar {
        position: static;
        padding-top: 0;
    }

    .crm-intake-stepnav {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .crm-intake-stepnav button {
        justify-content: center;
    }

    .crm-intake-stepnav button span:last-child {
        display: none;
    }
}

@media (max-width: 720px) {
    .crm-intake-topbar,
    .crm-intake-layout,
    .crm-intake-bottom,
    .public-page-intake-v2 main {
        width: min(1260px, calc(100% - 1rem));
    }

    .crm-intake-topbar {
        flex-wrap: wrap;
    }

    .crm-step-header h1 {
        font-size: 2.25rem;
    }

    .crm-form-grid,
    .crm-chip-grid,
    .crm-style-grid,
    .crm-budget-grid,
    .crm-upload-grid,
    .crm-service-grid {
        grid-template-columns: 1fr;
    }

    .crm-package-grid {
        gap: .85rem;
    }

    .crm-checkline {
        padding: 1rem 3.9rem 1rem 1rem;
    }

    .crm-checkline span {
        display: block;
    }

    .crm-package-nav {
        flex-wrap: nowrap;
        overflow-x: auto;
        padding-bottom: .25rem;
        scrollbar-width: none;
    }

    .crm-package-carousel-head {
        align-items: center;
    }

    .crm-package-nav::-webkit-scrollbar {
        display: none;
    }

    .crm-intake-card {
        padding: 1.1rem;
    }

    .crm-package-meta-row {
        flex-direction: column;
        align-items: flex-start;
    }

    .crm-package-meta-value {
        justify-content: flex-start;
        text-align: left;
    }

    .crm-intake-footer,
    .crm-intake-bottom {
        flex-direction: column;
        align-items: stretch;
    }

    .crm-footer-button,
    .crm-top-action {
        width: 100%;
    }

    .crm-top-action-primary,
    .crm-footer-button-primary {
        margin-left: 0;
    }
}

/* Intake redesign: dark enterprise onboarding */
.public-page.public-page-intake {
    color: #e8edf3;
    background:
        radial-gradient(circle at top left, rgba(79, 209, 124, .08), transparent 22%),
        radial-gradient(circle at top right, rgba(75, 119, 255, .12), transparent 26%),
        linear-gradient(180deg, #0b0f16, #0f141d 42%, #0c1018);
}

:root[data-theme="light"] .public-page.public-page-intake {
    color: #edf2f7;
    background:
        radial-gradient(circle at top left, rgba(79, 209, 124, .05), transparent 22%),
        radial-gradient(circle at top right, rgba(75, 119, 255, .08), transparent 26%),
        linear-gradient(180deg, #111724, #10151e 42%, #0d131b);
}

.public-page-intake .public-header,
.public-page-intake .public-footer,
.public-page-intake main {
    width: min(1320px, calc(100% - 2rem));
    margin-left: auto;
    margin-right: auto;
}

.public-page-intake .public-header {
    padding: 1rem 0 .35rem;
}

.public-page-intake .brand {
    gap: .65rem;
}

.public-page-intake .brand img {
    width: 9rem;
    max-height: 2rem;
    filter: brightness(0) invert(1);
}

.public-page-intake .brand span {
    color: #d9e2ec;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .18em;
    text-transform: uppercase;
}

.public-page-intake .brand::after {
    opacity: .82;
}

.public-page-intake .public-header-link,
.public-page-intake .public-header-customer {
    color: #b3c0cd;
}

.public-page-intake .theme-toggle {
    border-color: rgba(192, 204, 219, .18);
    background: rgba(18, 24, 34, .78);
    color: #edf2f7;
    box-shadow: 0 18px 42px rgba(0, 0, 0, .24);
}

.public-page-intake .theme-toggle:hover {
    border-color: rgba(115, 225, 153, .42);
    background: rgba(22, 30, 42, .92);
}

.public-page-intake .intake-hero-enterprise {
    gap: 1.5rem;
    align-items: end;
    padding-top: .8rem;
    margin-bottom: 1.25rem;
}

.public-page-intake .intake-hero-enterprise .intake-copy {
    gap: 1rem;
}

.public-page-intake .eyebrow {
    color: #7ce7a1;
    letter-spacing: .18em;
}

.public-page-intake .intake-hero-enterprise h1,
.public-page-intake .intake-form-enterprise .form-section h2 {
    font-family: "Plus Jakarta Sans", "Manrope", sans-serif;
}

.public-page-intake .intake-hero-enterprise h1 {
    max-width: 12ch;
    color: #f5f7fb;
    font-size: clamp(2.8rem, 5vw, 4.8rem);
    line-height: 1.02;
}

.public-page-intake .intake-hero-enterprise .lead {
    color: #a5b2c2;
    font-size: 1.08rem;
    line-height: 1.72;
}

.public-page-intake .executive-panel {
    border: 1px solid rgba(202, 214, 228, .12);
    border-top: 1px solid rgba(202, 214, 228, .12);
    border-radius: 24px;
    background:
        linear-gradient(160deg, rgba(24, 30, 42, .95), rgba(16, 22, 32, .88)),
        #151b26;
    box-shadow: 0 26px 60px rgba(0, 0, 0, .22);
}

.public-page-intake .executive-panel span {
    color: #7ce7a1;
}

.public-page-intake .executive-panel strong {
    color: #f5f7fb;
}

.public-page-intake .executive-panel p {
    color: #a7b4c4;
}

.public-page-intake .hero-pills span {
    border-color: rgba(145, 162, 181, .18);
    background: rgba(11, 15, 22, .68);
    color: #dbe5ef;
}

.public-page-intake .notice.error-box {
    border: 1px solid rgba(255, 138, 138, .28);
    background: rgba(98, 25, 32, .52);
    color: #ffd7d7;
    box-shadow: 0 14px 34px rgba(64, 11, 16, .24);
}

.public-page-intake .intake-form-enterprise {
    grid-template-columns: 260px minmax(0, 1fr);
    gap: 1.5rem;
    align-items: start;
}

.public-page-intake .intake-rail {
    top: 1rem;
    gap: 1rem;
}

.public-page-intake .progress-shell,
.public-page-intake .step-nav,
.public-page-intake .rail-note,
.public-page-intake .intake-form-enterprise .form-section {
    border: 1px solid rgba(202, 214, 228, .12);
    background: rgba(20, 25, 35, .9);
    box-shadow: 0 26px 60px rgba(0, 0, 0, .22);
    backdrop-filter: blur(18px);
}

.public-page-intake .progress-shell,
.public-page-intake .rail-note {
    border-radius: 20px;
    padding: 1.1rem 1rem;
}

.public-page-intake .progress-copy {
    display: grid;
    gap: .2rem;
}

.public-page-intake .progress-copy span {
    color: #93a4b8;
    font-size: .78rem;
    letter-spacing: .08em;
}

.public-page-intake .progress-copy strong {
    color: #f5f7fb;
    font-size: 1.5rem;
    line-height: 1.1;
}

.public-page-intake .progress-track {
    height: .72rem;
    background: rgba(120, 136, 158, .16);
}

.public-page-intake .progress-track span {
    background: linear-gradient(90deg, #34d399, #7ce7a1 52%, #b6ffcf);
    box-shadow: 0 0 18px rgba(90, 233, 150, .44);
}

.public-page-intake .step-nav {
    gap: .5rem;
    padding: .7rem;
    border-radius: 24px;
}

.public-page-intake .step-nav button {
    min-height: 3rem;
    border: 1px solid transparent;
    border-radius: 14px;
    background: rgba(255, 255, 255, .02);
    color: #c1cbd6;
    font-size: .94rem;
    font-weight: 800;
    letter-spacing: .01em;
}

.public-page-intake .step-nav button:hover {
    transform: translateY(-1px);
    border-color: rgba(123, 231, 161, .25);
    background: rgba(255, 255, 255, .04);
}

.public-page-intake .step-nav button.is-active {
    border-color: rgba(126, 240, 168, .34);
    background: linear-gradient(135deg, rgba(46, 185, 109, .2), rgba(20, 30, 42, .95));
    color: #f6fbf7;
    box-shadow: inset 0 0 0 1px rgba(126, 240, 168, .12), 0 0 0 1px rgba(126, 240, 168, .06);
}

.public-page-intake .step-nav button.is-complete {
    border-color: rgba(126, 240, 168, .22);
    color: #8ef3b0;
}

.public-page-intake .rail-note span {
    color: #8ef3b0;
}

.public-page-intake .rail-note p {
    color: #9eacbc;
}

.public-page-intake .intake-form-enterprise .form-section {
    gap: 1.5rem;
    margin-bottom: 1.1rem;
    padding: 1.6rem;
    border-radius: 28px;
}

.public-page-intake .intake-form-enterprise .form-section > div:first-child {
    border-right-color: rgba(202, 214, 228, .1);
    padding-right: 1.35rem;
}

.public-page-intake .intake-form-enterprise .form-section > div:first-child p:last-child,
.public-page-intake .muted,
.public-page-intake .choice-copy small,
.public-page-intake .choice-points,
.public-page-intake .service-option small,
.public-page-intake .field-hint,
.public-page-intake .public-footer-nav,
.public-page-intake .public-footer-nav a {
    color: #9dabbc;
}

.public-page-intake .step {
    width: 3.2rem;
    height: 3.2rem;
    display: inline-grid;
    place-items: center;
    margin-bottom: 1rem;
    border: 1px solid rgba(126, 240, 168, .24);
    border-radius: 999px;
    background: rgba(52, 211, 153, .1);
    color: #8ef3b0;
    box-shadow: inset 0 0 0 1px rgba(126, 240, 168, .05);
}

.public-page-intake .intake-form-enterprise .form-section h2 {
    color: #f5f7fb;
    font-size: clamp(2rem, 3vw, 2.5rem);
    line-height: 1.06;
}

.public-page-intake label {
    color: #dfe7f1;
    font-weight: 700;
}

.public-page-intake small {
    display: block;
    font-size: .84rem;
    line-height: 1.55;
}

.public-page-intake input,
.public-page-intake select,
.public-page-intake textarea {
    border-color: rgba(202, 214, 228, .12);
    background: #0a0e15;
    color: #f5f7fb;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .02);
    accent-color: #46d989;
}

.public-page-intake input::placeholder,
.public-page-intake textarea::placeholder {
    color: #708093;
}

.public-page-intake input:hover,
.public-page-intake select:hover,
.public-page-intake textarea:hover {
    border-color: rgba(123, 231, 161, .2);
}

.public-page-intake input:focus,
.public-page-intake select:focus,
.public-page-intake textarea:focus {
    border-color: rgba(123, 231, 161, .52);
    box-shadow: 0 0 0 4px rgba(52, 211, 153, .16), 0 10px 30px rgba(0, 0, 0, .16);
}

.public-page-intake .field-highlight input,
.public-page-intake .field-highlight select,
.public-page-intake .field-highlight textarea,
.public-page-intake .conditional-field:not(.is-hidden-conditional) input,
.public-page-intake .conditional-field:not(.is-hidden-conditional) select,
.public-page-intake .conditional-field:not(.is-hidden-conditional) textarea {
    border-color: rgba(92, 224, 141, .34);
    box-shadow: 0 0 0 1px rgba(92, 224, 141, .08), 0 0 24px rgba(32, 201, 105, .08);
    animation: intake-field-glow 2.6s ease-in-out infinite;
}

.public-page-intake .reference-grid,
.public-page-intake .scope-matrix,
.public-page-intake .service-category-grid,
.public-page-intake .form-stack,
.public-page-intake .choice-block,
.public-page-intake .field-grid {
    gap: 1rem;
}

.public-page-intake .scope-group,
.public-page-intake .service-category {
    border-color: rgba(202, 214, 228, .12);
    border-radius: 20px;
    background: rgba(10, 14, 21, .74);
    padding: 1rem;
}

.public-page-intake .scope-group h3,
.public-page-intake .service-category h4 {
    color: #8da0b5;
}

.public-page-intake .choice,
.public-page-intake .service-option {
    border-color: rgba(202, 214, 228, .12);
    border-radius: 18px;
    background: rgba(20, 25, 35, .82);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .02);
}

.public-page-intake .choice:hover,
.public-page-intake .service-option:hover {
    transform: translateY(-2px);
    border-color: rgba(126, 240, 168, .24);
    box-shadow: 0 18px 36px rgba(0, 0, 0, .18);
}

.public-page-intake .choice span,
.public-page-intake .service-option span,
.public-page-intake .choice-copy strong {
    color: #f3f7fb;
}

.public-page-intake .choice-copy em {
    color: #8ef3b0;
    font-style: normal;
    font-weight: 800;
}

.public-page-intake .choice:has(input:checked),
.public-page-intake .service-option:has(input:checked) {
    border-color: rgba(126, 240, 168, .52);
    background:
        linear-gradient(145deg, rgba(52, 211, 153, .14), rgba(16, 22, 32, .96)),
        rgba(20, 25, 35, .92);
    box-shadow:
        inset 0 0 0 1px rgba(126, 240, 168, .1),
        0 0 0 1px rgba(126, 240, 168, .08),
        0 18px 42px rgba(0, 0, 0, .18);
    animation: intake-selected-glow 2.8s ease-in-out infinite;
}

.public-page-intake .service-option.compact {
    min-height: 6.6rem;
}

.public-page-intake .budget-choice,
.public-page-intake .package-choice {
    overflow: hidden;
}

.public-page-intake .budget-choice span {
    font-size: 1rem;
}

.public-page-intake .checkline {
    padding: 1rem;
    border: 1px solid rgba(202, 214, 228, .12);
    border-radius: 18px;
    background: rgba(11, 15, 22, .58);
}

.public-page-intake .checkline a {
    color: #8ef3b0;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.public-page-intake .step-actions {
    position: sticky;
    bottom: 0;
    padding: 1.1rem 0 .2rem;
    background: linear-gradient(180deg, rgba(12, 16, 24, 0), rgba(12, 16, 24, .92) 36%, rgba(12, 16, 24, .98));
}

.public-page-intake .button,
.public-page-intake .link-button {
    min-height: 3rem;
    border-radius: 999px;
    border-color: rgba(202, 214, 228, .14);
    background: rgba(18, 24, 34, .86);
    color: #edf2f7;
    box-shadow: 0 16px 34px rgba(0, 0, 0, .16);
}

.public-page-intake .button.primary,
.public-page-intake .button.success {
    border-color: rgba(126, 240, 168, .45);
    background: linear-gradient(135deg, #45d78a, #2db56d);
    color: #08110c;
}

.public-page-intake .button:hover {
    box-shadow: 0 20px 40px rgba(0, 0, 0, .22);
}

.public-page-intake .public-footer {
    padding: .5rem 0 2rem;
}

.public-page-intake .public-footer-nav {
    border-top-color: rgba(202, 214, 228, .1);
}

.public-page-intake .public-footer-nav a:hover {
    color: #8ef3b0;
}

@keyframes intake-field-glow {
    0%,
    100% {
        box-shadow: 0 0 0 1px rgba(92, 224, 141, .08), 0 0 16px rgba(32, 201, 105, .05);
    }

    50% {
        box-shadow: 0 0 0 1px rgba(92, 224, 141, .18), 0 0 26px rgba(32, 201, 105, .14);
    }
}

@keyframes intake-selected-glow {
    0%,
    100% {
        box-shadow:
            inset 0 0 0 1px rgba(126, 240, 168, .1),
            0 0 0 1px rgba(126, 240, 168, .08),
            0 18px 42px rgba(0, 0, 0, .18);
    }

    50% {
        box-shadow:
            inset 0 0 0 1px rgba(126, 240, 168, .2),
            0 0 0 1px rgba(126, 240, 168, .16),
            0 0 0 8px rgba(46, 214, 126, .04),
            0 20px 46px rgba(0, 0, 0, .22);
    }
}

@media (max-width: 1120px) {
    .public-page-intake .intake-form-enterprise {
        grid-template-columns: 220px minmax(0, 1fr);
    }
}

@media (max-width: 960px) {
    .public-page-intake .intake-hero-enterprise,
    .public-page-intake .intake-form-enterprise {
        grid-template-columns: 1fr;
    }

    .public-page-intake .intake-rail {
        position: static;
    }

    .public-page-intake .step-nav {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .public-page-intake .intake-form-enterprise .form-section {
        grid-template-columns: 1fr;
        padding: 1.35rem;
    }

    .public-page-intake .intake-form-enterprise .form-section > div:first-child {
        border-right: 0;
        border-bottom: 1px solid rgba(202, 214, 228, .1);
        padding: 0 0 1rem;
    }
}

@media (max-width: 640px) {
    .public-page-intake .public-header,
    .public-page-intake .public-footer,
    .public-page-intake main {
        width: min(1320px, calc(100% - 1rem));
    }

    .public-page-intake .public-header {
        padding-top: .7rem;
    }

    .public-page-intake .intake-hero-enterprise h1 {
        font-size: 2.35rem;
    }

    .public-page-intake .step-nav,
    .public-page-intake .field-grid,
    .public-page-intake .choice-grid,
    .public-page-intake .dense-choice-grid,
    .public-page-intake .budget-grid,
    .public-page-intake .package-grid,
    .public-page-intake .service-grid {
        grid-template-columns: 1fr;
    }

    .public-page-intake .progress-copy strong {
        font-size: 1.2rem;
    }
}

:root[data-theme="dark"] {
    --ink: #eef3ed;
    --paper: #11130f;
    --paper-strong: #181b16;
    --surface: rgba(24, 27, 22, .88);
    --surface-strong: #20241d;
    --line: #3a4338;
    --muted: #aeb9ad;
    --blue: #76b7ff;
    --green: #39d98f;
    --gold: #e2b94d;
    --violet: #d6ac57;
    --violet-soft: rgba(214, 172, 87, .14);
    --dark: #eef3ed;
    --dark-soft: #2a3027;
    --warn: #ff8d73;
    --focus: rgba(57, 217, 143, .2);
    --shadow: 0 24px 56px rgba(0, 0, 0, .34);
    color-scheme: dark;
}

* {
    box-sizing: border-box;
}

body {
    margin: 0;
    min-height: 100vh;
    color: var(--ink);
    background:
        linear-gradient(180deg, #fbfcfd, #eef2f6 72%, #e7edf3);
    font-family: "Manrope", "Aptos", "Segoe UI", sans-serif;
    text-rendering: optimizeLegibility;
}

body.public-page {
    background:
        radial-gradient(circle at top center, rgba(33, 95, 189, .1), transparent 34%),
        radial-gradient(circle at bottom left, rgba(17, 24, 32, .05), transparent 24%),
        linear-gradient(180deg, #fbfcfd, var(--paper) 76%, #e9eef2);
    transition: background-color .3s ease, color .3s ease;
}

:root[data-theme="dark"] body.public-page {
    background:
        radial-gradient(circle at top center, rgba(118, 183, 255, .13), transparent 34%),
        radial-gradient(circle at bottom left, rgba(238, 243, 237, .06), transparent 20%),
        linear-gradient(180deg, #11130f, var(--paper) 76%, #0d0f0c);
}

[hidden] {
    display: none !important;
}

a {
    color: inherit;
    text-decoration: none;
}

img {
    max-width: 100%;
    display: block;
}

button,
input,
select,
textarea {
    font: inherit;
}

input,
select,
textarea {
    width: 100%;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--paper-strong);
    color: var(--ink);
    padding: .85rem .9rem;
    transition: border-color .18s ease, box-shadow .18s ease, background-color .18s ease, transform .18s ease;
}

input:focus,
select:focus,
textarea:focus {
    border-color: var(--green);
    box-shadow: 0 0 0 4px var(--focus);
    outline: none;
}

textarea {
    resize: vertical;
}

label {
    display: grid;
    gap: .4rem;
    color: var(--ink);
    font-weight: 700;
}

.public-header {
    width: min(1180px, calc(100% - 2rem));
    margin: 0 auto;
    padding: 1rem 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.public-header-actions {
    display: flex;
    align-items: center;
    gap: 12px;
}

.public-header-link {
    color: inherit;
    text-decoration: none;
    font-weight: 700;
}

.public-header-customer {
    font-size: 14px;
    opacity: .78;
}

.public-footer {
    width: min(1180px, calc(100% - 2rem));
    margin: 0 auto;
    padding: 0 0 2rem;
}

.public-footer-nav {
    display: flex;
    flex-wrap: wrap;
    gap: .75rem;
    justify-content: center;
    border-top: 1px solid var(--line);
    padding-top: 1rem;
    color: var(--muted);
    font-weight: 800;
}

.public-footer-nav a {
    padding: .35rem .1rem;
}

.public-footer-nav a:hover {
    color: var(--blue);
}

.brand {
    display: inline-flex;
    align-items: center;
    gap: .75rem;
    font-weight: 800;
    position: relative;
}

.brand img {
    width: 10rem;
    height: auto;
    max-height: 2.5rem;
    object-fit: contain;
}

.brand::after {
    content: "";
    width: .42rem;
    height: .42rem;
    border-radius: 999px;
    background: var(--violet);
    box-shadow: .5rem 0 0 var(--blue), 1rem 0 0 var(--green);
    transform: translateX(-.5rem);
}

.theme-toggle {
    min-height: 2.6rem;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
    color: var(--ink);
    padding: .65rem .9rem;
    font-weight: 900;
    cursor: pointer;
    box-shadow: 0 10px 24px rgba(19, 30, 44, .08);
    transition: transform .18s ease, border-color .18s ease, background-color .18s ease;
}

.theme-toggle:hover {
    transform: translateY(-1px);
    border-color: var(--violet);
}

.header-link,
.button,
.link-button {
    min-height: 2.8rem;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--paper-strong);
    color: var(--ink);
    padding: .75rem 1rem;
    font-weight: 800;
    cursor: pointer;
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease, background-color .18s ease;
}

.button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.button:hover {
    transform: translateY(-1px);
    box-shadow: 0 10px 24px rgba(19, 30, 44, .12);
}

.button.primary {
    border-color: var(--blue);
    background: var(--blue);
    color: #fff;
}

.button.success {
    border-color: #14794f;
    background: var(--green);
    color: #fff;
}

.eyebrow,
.step,
.metric-row span,
.record span,
.table-row small,
.detail-list dt {
    color: var(--blue);
    font-size: .78rem;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}

h1,
h2,
h3,
p {
    margin-top: 0;
}

h1 {
    max-width: 12em;
    font-size: 3.1rem;
    line-height: 1;
}

h2 {
    font-size: 2rem;
    line-height: 1.05;
}

h3 {
    font-size: 1.25rem;
}

.lead {
    max-width: 42rem;
    color: var(--muted);
    font-size: 1.08rem;
    line-height: 1.7;
}

.muted {
    color: var(--muted);
}

.auth-shell {
    width: min(1180px, calc(100% - 2rem));
    margin: 0 auto;
    padding: 2.4rem 0 4rem;
}

.auth-stage {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(320px, .95fr);
    gap: 1.15rem;
    align-items: stretch;
}

.auth-stage-tight {
    grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr);
}

.auth-hero-card,
.auth-form-card {
    position: relative;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 28px;
    background: var(--paper-strong);
    box-shadow: 0 24px 70px rgba(17, 24, 32, .08);
}

.auth-hero-card {
    display: grid;
    gap: 1.3rem;
    align-content: start;
    min-height: 100%;
    padding: 1.35rem;
    background:
        radial-gradient(circle at top left, rgba(33, 95, 189, .14), transparent 34%),
        linear-gradient(160deg, rgba(255, 255, 255, .98), rgba(242, 245, 249, .98));
}

.auth-hero-card::after {
    content: "";
    position: absolute;
    inset: auto -10% -24% 42%;
    height: 13rem;
    border-radius: 999px;
    background: radial-gradient(circle, rgba(31, 138, 91, .16), transparent 62%);
    pointer-events: none;
}

.auth-hero-card-compact::after {
    inset: auto -12% -28% 28%;
}

.auth-form-card {
    padding: 1.4rem;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, .98), rgba(247, 249, 251, .98));
}

.auth-form-card-focus::before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: 5px;
    background: linear-gradient(90deg, #111820, var(--blue), var(--green));
}

.auth-badge-row {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
}

.auth-badge {
    min-height: 2rem;
    display: inline-flex;
    align-items: center;
    border: 1px solid color-mix(in srgb, var(--blue), transparent 68%);
    border-radius: 999px;
    background: color-mix(in srgb, var(--blue), transparent 92%);
    padding: .42rem .75rem;
    color: var(--blue);
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.auth-badge-soft {
    border-color: color-mix(in srgb, var(--green), transparent 68%);
    background: color-mix(in srgb, var(--green), transparent 92%);
    color: #166846;
}

.auth-mark {
    position: relative;
    width: 5.6rem;
    height: 5.6rem;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: linear-gradient(145deg, #101720, #253245);
    color: #f7fafc;
    box-shadow: 0 18px 40px rgba(16, 23, 32, .22);
}

.auth-mark-ring {
    position: absolute;
    inset: .42rem;
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: inherit;
}

.auth-mark-core {
    position: relative;
    font-size: 1.5rem;
    font-weight: 800;
    letter-spacing: .08em;
}

.auth-mark-secure {
    background: linear-gradient(145deg, #0f1520, #1d2734 58%, #2b4e47);
}

.auth-copy {
    position: relative;
    z-index: 1;
}

.auth-copy h1 {
    max-width: 10ch;
    margin: .2rem 0 .8rem;
    text-wrap: balance;
}

.auth-copy .lead {
    max-width: 34rem;
}

.auth-signal-grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .75rem;
}

.auth-signal {
    display: grid;
    gap: .35rem;
    min-height: 8rem;
    align-content: start;
    padding: .95rem;
    border: 1px solid rgba(17, 24, 32, .08);
    border-radius: 20px;
    background: rgba(255, 255, 255, .72);
    backdrop-filter: blur(12px);
}

.auth-signal span,
.auth-strength-head span {
    color: var(--blue);
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.auth-signal strong {
    font-size: 1.02rem;
    line-height: 1.3;
}

.auth-signal small,
.auth-form-head p,
.auth-footer-copy p {
    color: var(--muted);
    line-height: 1.6;
}

.auth-form-head {
    display: grid;
    gap: .38rem;
    margin-bottom: 1rem;
}

.auth-form-head h2 {
    margin: 0;
    font-size: clamp(1.9rem, 3vw, 2.5rem);
}

.auth-form {
    gap: .85rem;
}

.auth-label {
    gap: .45rem;
    font-size: .95rem;
}

.auth-label input {
    min-height: 3.3rem;
    border-radius: 16px;
    background: color-mix(in srgb, var(--surface-strong), transparent 4%);
    padding-inline: 1rem;
}

.auth-input-wrap {
    position: relative;
}

.auth-input-wrap input {
    padding-right: 5.8rem;
}

.auth-toggle {
    position: absolute;
    top: 50%;
    right: .65rem;
    transform: translateY(-50%);
    min-height: 2.3rem;
    border: 0;
    border-radius: 999px;
    background: transparent;
    padding: .35rem .55rem;
    color: var(--muted);
    font-size: .82rem;
    font-weight: 800;
    cursor: pointer;
}

.auth-toggle:hover {
    color: var(--ink);
    background: rgba(17, 24, 32, .05);
}

.auth-checkline {
    display: flex;
    align-items: center;
    gap: .75rem;
    color: var(--ink);
    font-size: .95rem;
    font-weight: 600;
}

.auth-checkline input {
    width: 1rem;
    height: 1rem;
    margin: 0;
}

.auth-submit {
    min-height: 3.6rem;
    width: 100%;
    justify-content: space-between;
    border-radius: 18px;
    padding-inline: 1.1rem;
    box-shadow: 0 18px 36px rgba(33, 95, 189, .18);
}

.auth-submit-hero {
    margin-top: .2rem;
}

.auth-error {
    margin: -.2rem 0 0;
    color: #b42318;
    font-size: .9rem;
    font-weight: 700;
}

.auth-footer-copy {
    display: grid;
    gap: .55rem;
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid color-mix(in srgb, var(--line), transparent 10%);
}

.auth-footer-copy a {
    color: var(--blue);
    font-weight: 700;
}

.auth-strength {
    display: grid;
    gap: .55rem;
    padding: .9rem 1rem;
    border: 1px solid color-mix(in srgb, var(--line), transparent 10%);
    border-radius: 20px;
    background: color-mix(in srgb, var(--surface-strong), transparent 6%);
}

.auth-strength-head {
    display: flex;
    justify-content: space-between;
    gap: .75rem;
    align-items: center;
}

.auth-strength-head strong {
    color: var(--ink);
    font-size: .92rem;
}

.auth-strength-bars {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .38rem;
}

.auth-strength-bars span {
    height: .38rem;
    border-radius: 999px;
    background: color-mix(in srgb, var(--line), transparent 8%);
    transition: background-color .18s ease, transform .18s ease;
}

.auth-strength-bars span[data-active="true"] {
    background: linear-gradient(90deg, #111820, var(--green));
    transform: scaleY(1.08);
}

.auth-checklist {
    display: grid;
    gap: .55rem;
}

.auth-check-item {
    display: flex;
    align-items: center;
    gap: .72rem;
    min-height: 2.7rem;
    padding: .72rem .82rem;
    border: 1px solid color-mix(in srgb, var(--line), transparent 8%);
    border-radius: 18px;
    background: rgba(255, 255, 255, .72);
    color: var(--muted);
    font-size: .92rem;
    font-weight: 600;
}

.auth-check-item[data-active="true"] {
    border-color: color-mix(in srgb, var(--green), transparent 55%);
    background: color-mix(in srgb, var(--green), transparent 92%);
    color: #17583c;
}

.auth-check-indicator {
    width: 1rem;
    height: 1rem;
    flex: 0 0 1rem;
    border: 1.5px solid currentColor;
    border-radius: 50%;
    opacity: .7;
}

.auth-check-item[data-active="true"] .auth-check-indicator {
    background: currentColor;
    box-shadow: inset 0 0 0 3px rgba(255, 255, 255, .94);
    opacity: 1;
}

.auth-shell-clean {
    padding-top: min(6vh, 3rem);
}

.public-page-auth {
    min-height: 100vh;
}

.public-main-auth {
    min-height: 100vh;
}

.auth-web-shell {
    min-height: 100vh;
}

.auth-web-layout {
    min-height: 100vh;
    display: grid;
    grid-template-columns: minmax(0, .94fr) minmax(0, 1.06fr);
}

.auth-web-layout-photo {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}

.auth-web-visual {
    position: relative;
    overflow: hidden;
    display: none;
    background:
        radial-gradient(circle at 24% 20%, rgba(120, 174, 255, .2), transparent 18rem),
        radial-gradient(circle at 76% 70%, rgba(255, 255, 255, .08), transparent 16rem),
        linear-gradient(180deg, #0d121a, #0f1620 54%, #0b1017);
    color: #f4f7fb;
}

.auth-web-visual-photo {
    background: #0b1017;
}

.auth-web-visual::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, .06) 0 1px, transparent 1px 28px),
        linear-gradient(225deg, rgba(255, 255, 255, .04) 0 1px, transparent 1px 28px);
    opacity: .28;
    pointer-events: none;
}

.auth-web-visual-photo::before {
    background:
        linear-gradient(90deg, rgba(7, 11, 18, .82) 0%, rgba(7, 11, 18, .42) 36%, rgba(7, 11, 18, .62) 100%),
        linear-gradient(180deg, rgba(9, 14, 23, .18) 0%, rgba(9, 14, 23, .72) 100%);
    opacity: 1;
    z-index: 1;
}

.auth-web-visual-photo::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background:
        radial-gradient(circle at 78% 18%, rgba(86, 127, 255, .18), transparent 22rem),
        radial-gradient(circle at 16% 82%, rgba(255, 255, 255, .08), transparent 18rem);
}

.auth-web-photo-media {
    position: absolute;
    inset: 0;
}

.auth-web-photo-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 58% center;
    filter: saturate(.92) contrast(1.02) brightness(.86);
}

.auth-web-brand,
.auth-web-mobile-brand {
    display: inline-flex;
    align-items: center;
}

.auth-web-brand img,
.auth-web-mobile-brand img {
    width: 11rem;
    height: auto;
}

.auth-web-brand {
    position: absolute;
    top: 2rem;
    left: 2rem;
    z-index: 2;
}

.auth-web-visual-photo .auth-web-brand {
    padding: .72rem .95rem;
    border: 1px solid rgba(255, 255, 255, .08);
    border-radius: 999px;
    background: rgba(8, 13, 21, .46);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
    box-shadow: 0 18px 40px rgba(0, 0, 0, .24);
}

.auth-web-visual-art {
    position: absolute;
    inset: 0;
    overflow: hidden;
}

.auth-web-orb {
    position: absolute;
    display: block;
    border-radius: 28px;
    transform: rotate(-22deg);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
}

.auth-web-orb-one {
    top: 16%;
    left: 14%;
    width: 18rem;
    height: 24rem;
    border: 1px solid rgba(255, 255, 255, .12);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, .2), rgba(255, 255, 255, .03));
    box-shadow: 0 30px 80px rgba(0, 0, 0, .28);
}

.auth-web-orb-two {
    right: 10%;
    bottom: 13%;
    width: 12rem;
    height: 14rem;
    border: 1px solid rgba(118, 183, 255, .24);
    background:
        linear-gradient(180deg, rgba(118, 183, 255, .18), rgba(255, 255, 255, .02));
    box-shadow: 0 22px 70px rgba(0, 0, 0, .24);
}

.auth-web-grid {
    position: absolute;
    inset: auto 14% 12% auto;
    width: 12rem;
    height: 12rem;
    border-radius: 26px;
    border: 1px solid rgba(255, 255, 255, .08);
    background:
        linear-gradient(135deg, rgba(255, 255, 255, .1) 0 1px, transparent 1px 32px),
        linear-gradient(225deg, rgba(255, 255, 255, .06) 0 1px, transparent 1px 32px);
    opacity: .8;
    transform: rotate(10deg);
}

.auth-web-visual-copy {
    position: absolute;
    left: 2rem;
    right: 2rem;
    bottom: 2rem;
    z-index: 2;
    display: grid;
    gap: .7rem;
    max-width: 30rem;
    padding: 1.35rem 1.45rem;
    border: 1px solid rgba(255, 255, 255, .08);
    border-radius: 24px;
    background: rgba(255, 255, 255, .06);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
}

.auth-web-visual-photo .auth-web-visual-copy {
    z-index: 2;
    max-width: 27rem;
    border: 1px solid rgba(255, 255, 255, .12);
    background: linear-gradient(180deg, rgba(8, 13, 21, .42), rgba(8, 13, 21, .78));
    box-shadow: 0 28px 60px rgba(0, 0, 0, .28);
}

.auth-web-visual-copy .eyebrow {
    color: rgba(244, 247, 251, .74);
}

.auth-web-visual-copy h2 {
    margin: 0;
    color: #f8fbff;
    font-size: clamp(2rem, 3.3vw, 3rem);
    line-height: 1.05;
    text-wrap: balance;
}

.auth-web-visual-copy p {
    margin: 0;
    color: rgba(244, 247, 251, .78);
    line-height: 1.6;
}

.auth-web-workspace {
    display: flex;
    flex-direction: column;
    min-width: 0;
    padding: 1.4rem;
}

.auth-web-topbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    min-height: 4rem;
}

.auth-web-theme-toggle {
    box-shadow: none;
}

.auth-web-mobile-brand {
    min-height: 2.4rem;
}

.auth-web-mobile-brand img {
    width: 9.8rem;
}

.auth-web-panel {
    width: min(100%, 31rem);
    margin: auto;
    display: grid;
    gap: 1.25rem;
    padding: 1.75rem;
    border: 1px solid color-mix(in srgb, var(--line), transparent 6%);
    border-radius: 28px;
    background: color-mix(in srgb, var(--paper-strong), transparent 2%);
    box-shadow: 0 32px 80px rgba(17, 24, 32, .08);
}

.auth-stack {
    display: grid;
    gap: 1rem;
}

.auth-stack-centered {
    justify-items: center;
}

.auth-card {
    width: min(100%, 30rem);
}

.auth-card-clean {
    display: grid;
    gap: 1.2rem;
    padding: 1.6rem;
    border: 1px solid color-mix(in srgb, var(--line), transparent 8%);
    border-radius: 26px;
    background: color-mix(in srgb, var(--paper-strong), transparent 2%);
    box-shadow: 0 30px 70px rgba(17, 24, 32, .08);
}

.auth-card-icon {
    width: 3.7rem;
    height: 3.7rem;
    display: grid;
    place-items: center;
    margin: 0 auto;
    border-radius: 18px;
    background: #141a22;
    color: #f7fafc;
    box-shadow: 0 16px 30px rgba(17, 24, 32, .18);
}

:root[data-theme="dark"] .auth-card-icon {
    background: #edf3fb;
    color: #111820;
}

.auth-card-icon svg {
    width: 1.45rem;
    height: 1.45rem;
}

.auth-form-head-centered,
.auth-footer-copy-centered {
    text-align: center;
}

.auth-form-head-left,
.auth-footer-copy-left {
    text-align: left;
}

.auth-form-head-centered h1 {
    max-width: none;
    margin: 0;
    font-size: clamp(2rem, 5vw, 2.7rem);
}

.auth-form-head-left h1 {
    max-width: none;
    margin: 0;
    font-size: clamp(2.2rem, 5vw, 3rem);
    text-wrap: balance;
}

.auth-form-head-centered p:last-child {
    margin: 0;
}

.auth-form-head-left p:last-child {
    margin: 0;
}

.auth-submit-center {
    justify-content: center;
}

.auth-form-spacious {
    gap: .95rem;
}

.auth-card-clean .auth-label input,
.auth-card-clean .auth-input-wrap input {
    min-height: 3.4rem;
    border-radius: 14px;
    background: color-mix(in srgb, var(--surface-strong), transparent 2%);
}

.auth-web-panel .auth-label input,
.auth-web-panel .auth-input-wrap input {
    min-height: 3.35rem;
    border-radius: 14px;
    background: color-mix(in srgb, var(--surface-strong), transparent 2%);
}

.auth-web-panel .auth-checkline {
    font-size: .92rem;
}

.auth-web-panel .auth-strength,
.auth-web-panel .auth-check-item {
    border-radius: 16px;
}

.auth-card-clean .auth-strength,
.auth-card-clean .auth-check-item {
    border-radius: 16px;
}

.auth-card-clean .notice {
    margin: 0;
}

.customer-summary {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(19rem, .58fr);
    gap: 1rem;
    margin-bottom: 1rem;
}

.customer-summary-main,
.customer-summary-item {
    border: 1px solid color-mix(in srgb, var(--line), transparent 6%);
    border-radius: 26px;
    background: color-mix(in srgb, var(--paper-strong), transparent 2%);
    box-shadow: var(--shadow-soft);
}

.customer-summary-main {
    padding: 1.45rem;
}

.customer-summary-main h1 {
    max-width: none;
    margin: .12rem 0 .6rem;
    font-size: clamp(2.2rem, 5vw, 3.6rem);
    text-wrap: balance;
}

.customer-summary-main .lead {
    margin: 0;
}

.customer-summary-meta {
    display: grid;
    gap: .8rem;
}

.customer-summary-item {
    display: grid;
    gap: .3rem;
    padding: 1rem 1.05rem;
}

.customer-summary-item span {
    color: var(--blue);
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.customer-summary-item strong {
    color: var(--ink);
    font-size: 1.04rem;
    line-height: 1.4;
}

.customer-summary-item small {
    color: var(--muted);
    line-height: 1.55;
}

.portal-panel,
.portal-hero-card,
.portal-action,
.portal-payment,
.portal-meeting,
.portal-support-entry,
.customer-project-card,
.customer-project-card-empty,
.customer-hub-timeline-item {
    border-radius: 22px;
}

.portal-panel {
    padding: 1.05rem;
}

.portal-action,
.portal-payment,
.portal-meeting {
    background: color-mix(in srgb, var(--paper-strong), transparent 4%);
}

.customer-project-card-signal {
    background: color-mix(in srgb, var(--blue), transparent 95%);
}

.customer-hub-panel .portal-payment.is-open {
    border-left-color: var(--blue);
}

.portal-shell-dashboard {
    padding-top: 2rem;
}

.customer-hub-hero {
    display: grid;
    grid-template-columns: minmax(0, 1.12fr) minmax(300px, .7fr);
    gap: 1rem;
    align-items: stretch;
    margin-bottom: 1rem;
}

.customer-hub-hero-copy,
.customer-hub-access-card,
.customer-project-card,
.customer-project-card-empty,
.customer-hub-timeline-item {
    border: 1px solid var(--line);
    border-radius: 28px;
    background: var(--paper-strong);
    box-shadow: var(--shadow-soft);
}

.customer-hub-hero-copy {
    position: relative;
    overflow: hidden;
    display: grid;
    gap: 1.15rem;
    padding: 1.3rem;
    background:
        radial-gradient(circle at top left, rgba(33, 95, 189, .12), transparent 32%),
        linear-gradient(155deg, rgba(255, 255, 255, .98), rgba(243, 246, 249, .98));
}

.customer-hub-hero-copy::after {
    content: "";
    position: absolute;
    inset: auto -12% -32% auto;
    width: 16rem;
    height: 16rem;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(31, 138, 91, .12), transparent 64%);
    pointer-events: none;
}

.customer-hub-hero-copy h1 {
    max-width: 11ch;
    margin: .2rem 0 .8rem;
}

.customer-hub-metrics {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .75rem;
}

.customer-hub-metric {
    display: grid;
    gap: .26rem;
    min-height: 7.3rem;
    align-content: start;
    padding: .95rem;
    border: 1px solid rgba(17, 24, 32, .08);
    border-radius: 22px;
    background: rgba(255, 255, 255, .72);
    backdrop-filter: blur(14px);
}

.customer-hub-metric span,
.customer-project-card-head span,
.customer-project-card-signal span,
.customer-project-card-meta span,
.customer-hub-access-card > span {
    color: var(--blue);
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.customer-hub-metric strong {
    font-size: 2rem;
    line-height: .95;
    font-variant-numeric: tabular-nums;
}

.customer-hub-metric small,
.customer-project-card-signal small,
.customer-project-card-empty p,
.customer-hub-access-card small,
.customer-hub-access-item small,
.customer-hub-timeline-item small {
    color: var(--muted);
    line-height: 1.55;
}

.customer-hub-access-card {
    display: grid;
    gap: .9rem;
    align-content: start;
    padding: 1.2rem;
    background:
        linear-gradient(180deg, rgba(17, 24, 32, .96), rgba(28, 36, 47, .98));
    color: #edf3fb;
}

.customer-hub-access-card strong,
.customer-hub-access-item strong {
    color: #fff;
}

.customer-hub-access-card > span,
.customer-hub-access-item span {
    color: #9ec3ff;
}

.customer-hub-access-card small,
.customer-hub-access-item small {
    color: rgba(237, 243, 251, .72);
}

.customer-hub-access-stack {
    display: grid;
    gap: .7rem;
}

.customer-hub-access-item {
    display: grid;
    gap: .24rem;
    padding: .9rem;
    border: 1px solid rgba(255, 255, 255, .08);
    border-radius: 20px;
    background: rgba(255, 255, 255, .05);
}

.customer-hub-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(290px, .42fr);
    gap: 1rem;
    align-items: start;
}

.customer-hub-main,
.customer-hub-side {
    display: grid;
    gap: 1rem;
}

.customer-hub-panel {
    border-radius: 28px;
    padding: 1.15rem;
}

.customer-project-card-list,
.customer-hub-timeline {
    display: grid;
    gap: .85rem;
}

.customer-project-card,
.customer-project-card-empty {
    display: grid;
    gap: .85rem;
    padding: 1rem;
}

.customer-project-card-head {
    display: flex;
    justify-content: space-between;
    align-items: start;
    gap: .8rem;
}

.customer-project-card-head h3,
.customer-project-card-empty h3 {
    margin: .22rem 0 0;
    font-size: 1.4rem;
    line-height: 1.1;
}

.customer-project-card-button {
    min-width: fit-content;
}

.customer-project-card-signal {
    display: grid;
    gap: .35rem;
    padding: .95rem;
    border-radius: 22px;
    background: color-mix(in srgb, var(--blue), transparent 94%);
    border: 1px solid color-mix(in srgb, var(--blue), transparent 72%);
}

.customer-project-card-signal strong {
    display: block;
    color: var(--ink);
    font-size: 1.05rem;
}

.customer-project-pill-row {
    display: flex;
    flex-wrap: wrap;
    gap: .55rem;
}

.customer-project-card-meta {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .7rem;
}

.customer-project-card-meta article {
    display: grid;
    gap: .18rem;
    padding: .82rem .88rem;
    border: 1px solid color-mix(in srgb, var(--line), transparent 8%);
    border-radius: 18px;
    background: color-mix(in srgb, var(--surface-strong), transparent 6%);
}

.customer-project-card-meta strong,
.customer-hub-timeline-item strong {
    color: var(--ink);
}

.customer-project-card-empty {
    background:
        linear-gradient(145deg, rgba(33, 95, 189, .06), transparent 55%),
        var(--paper-strong);
}

.customer-hub-timeline-item {
    position: relative;
    display: grid;
    gap: .24rem;
    padding: .95rem 1rem .95rem 1.2rem;
}

.customer-hub-timeline-item::before {
    content: "";
    position: absolute;
    inset: .95rem auto .95rem .78rem;
    width: 4px;
    border-radius: 999px;
    background: linear-gradient(180deg, var(--blue), var(--green));
}

.customer-hub-timeline-item time {
    color: var(--muted);
    font-size: .82rem;
    font-weight: 700;
}

@media (max-width: 900px) {
    .auth-stage,
    .auth-stage-tight,
    .auth-signal-grid,
    .customer-hub-hero,
    .customer-hub-grid,
    .customer-hub-metrics,
    .customer-project-card-meta,
    .customer-summary {
        grid-template-columns: 1fr;
    }

    .auth-copy h1 {
        max-width: 12ch;
    }

    .customer-project-card-head {
        flex-direction: column;
    }

    .customer-project-card-button {
        width: 100%;
    }

    .auth-web-layout {
        grid-template-columns: 1fr;
    }

    .auth-web-workspace {
        padding: 1rem;
    }
}

@media (max-width: 640px) {
    .auth-shell {
        width: min(100% - 1rem, 1180px);
        padding: 1rem 0 2.4rem;
    }

    .auth-hero-card,
    .auth-form-card {
        border-radius: 24px;
    }

    .auth-hero-card {
        padding: 1rem;
        gap: 1rem;
    }

    .auth-form-card {
        padding: 1rem;
    }

    .auth-mark {
        width: 4.7rem;
        height: 4.7rem;
    }

    .auth-mark-core {
        font-size: 1.2rem;
    }

    .auth-copy h1 {
        margin-bottom: .65rem;
        font-size: clamp(2.2rem, 10vw, 3.2rem);
    }

    .auth-copy .lead,
    .auth-form-head p,
    .auth-footer-copy p {
        font-size: .96rem;
        line-height: 1.6;
    }

    .auth-form-head h2 {
        font-size: 1.7rem;
    }

    .auth-web-topbar {
        min-height: 3.4rem;
    }

    .auth-web-panel {
        width: 100%;
        padding: 1.1rem;
        border-radius: 22px;
        box-shadow: 0 20px 50px rgba(17, 24, 32, .08);
    }

    .auth-web-mobile-brand img {
        width: 9rem;
    }

    .auth-card-clean {
        padding: 1.15rem;
        border-radius: 22px;
    }

    .auth-card-icon {
        width: 3.2rem;
        height: 3.2rem;
        border-radius: 16px;
    }

    .auth-label input,
    .auth-submit {
        min-height: 3.15rem;
    }

    .auth-check-item {
        align-items: flex-start;
    }

    .auth-strength-head {
        align-items: start;
        flex-direction: column;
    }

    .portal-shell-dashboard {
        padding-top: 1.1rem;
    }

    .customer-hub-hero-copy,
    .customer-hub-access-card,
    .customer-hub-panel,
    .customer-project-card,
    .customer-project-card-empty,
    .customer-hub-timeline-item {
        border-radius: 24px;
    }

    .customer-hub-hero-copy,
    .customer-hub-access-card,
    .customer-hub-panel,
    .customer-project-card,
    .customer-project-card-empty {
        padding: 1rem;
    }

    .customer-hub-hero-copy h1 {
        font-size: clamp(2.2rem, 10vw, 3.2rem);
    }

    .customer-hub-metric strong {
        font-size: 1.75rem;
    }

    .customer-summary-main,
    .customer-summary-item {
        border-radius: 22px;
    }

    .customer-summary-main {
        padding: 1.05rem;
    }
}

@media (min-width: 1024px) {
    .auth-web-visual {
        display: block;
    }

    .auth-web-mobile-brand {
        visibility: hidden;
    }
}

.intake-hero,
.intake-form,
.thanks-shell,
.login-shell {
    width: min(1180px, calc(100% - 2rem));
    margin: 0 auto;
}

.intake-hero {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(280px, .8fr);
    gap: 1.25rem;
    align-items: end;
    padding: 3rem 0 2rem;
}

.intake-copy,
.signal-panel,
.intake-form {
    animation: rise-in .48s ease both;
}

.signal-panel {
    animation-delay: .06s;
}

.intake-form {
    animation-delay: .12s;
}

.signal-panel,
.panel,
.form-section,
.project-panel {
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
    box-shadow: var(--shadow);
}

.signal-panel {
    padding: 1.4rem;
    border-left: 4px solid var(--violet);
    position: relative;
    overflow: hidden;
}

.signal-panel span {
    color: var(--violet);
    font-weight: 900;
}

.signal-panel strong {
    display: block;
    margin: .7rem 0;
    font-size: 1.5rem;
    line-height: 1.1;
}

.hero-pills {
    display: flex;
    flex-wrap: wrap;
    gap: .45rem;
    margin-top: 1rem;
}

.hero-pills span {
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: linear-gradient(135deg, var(--violet-soft), transparent), var(--surface-strong);
    color: var(--ink);
    padding: .45rem .6rem;
    font-size: .86rem;
    font-weight: 900;
}

.progress-shell {
    display: grid;
    gap: .65rem;
    margin-bottom: .85rem;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
    padding: .9rem;
    box-shadow: var(--shadow);
}

.progress-copy {
    display: flex;
    justify-content: space-between;
    gap: .75rem;
    align-items: center;
}

.progress-copy span {
    color: var(--violet);
    font-size: .82rem;
    font-weight: 900;
    text-transform: uppercase;
}

.progress-copy strong {
    font-size: 1rem;
}

.progress-track {
    height: .55rem;
    overflow: hidden;
    border-radius: var(--radius);
    background: color-mix(in srgb, var(--line), transparent 34%);
}

.progress-track span {
    display: block;
    width: 16.666%;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, var(--violet), var(--blue), var(--green));
    transition: width .32s ease;
}

.form-section {
    display: grid;
    grid-template-columns: minmax(220px, .42fr) minmax(0, 1fr);
    gap: 1.4rem;
    padding: 1.35rem;
    margin-bottom: 1rem;
}

.step-nav {
    position: sticky;
    top: .75rem;
    z-index: 4;
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: .45rem;
    margin-bottom: 1rem;
    padding: .55rem;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: color-mix(in srgb, var(--surface-strong), transparent 8%);
    box-shadow: var(--shadow);
    backdrop-filter: blur(14px);
}

.step-nav button {
    border: 1px solid transparent;
    border-radius: var(--radius);
    min-height: 2.45rem;
    background: transparent;
    color: var(--muted);
    font-weight: 900;
    cursor: pointer;
    transition: transform .18s ease, background-color .18s ease, color .18s ease, border-color .18s ease;
}

.step-nav button.is-active {
    background: var(--ink);
    color: var(--paper-strong);
}

.step-nav button.is-complete {
    border-color: color-mix(in srgb, var(--violet), transparent 45%);
    color: var(--violet);
}

.step-nav button:hover {
    transform: translateY(-1px);
    border-color: var(--line);
}

.step-panel {
    display: none;
}

.step-panel.is-active {
    display: grid;
    animation: step-in .28s ease both;
}

.step-actions {
    position: sticky;
    bottom: 0;
    display: flex;
    justify-content: flex-end;
    gap: .75rem;
    padding: 1rem 0;
    background: linear-gradient(180deg, transparent, var(--paper) 34%);
    z-index: 3;
}

.field-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.wide {
    grid-column: 1 / -1;
}

.service-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .85rem;
}

.choice-block {
    display: grid;
    gap: .8rem;
}

.choice-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .7rem;
}

.choice {
    min-height: 3.4rem;
    display: flex;
    align-items: center;
    gap: .65rem;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface-strong);
    padding: .85rem;
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease, background-color .18s ease;
}

.choice input {
    width: auto;
}

.choice span {
    font-weight: 900;
}

.choice.package-choice {
    align-items: flex-start;
    min-height: 9.2rem;
}

.choice-copy {
    display: grid;
    gap: .3rem;
}

.choice-copy strong {
    font-size: 1rem;
    line-height: 1.2;
}

.choice-copy small {
    color: var(--muted);
    line-height: 1.45;
}

.choice-points {
    margin: .15rem 0 0;
    padding-left: 1rem;
    color: var(--muted);
    font-size: .88rem;
    line-height: 1.45;
}

.choice-points li {
    margin-bottom: .2rem;
}

.choice:hover,
.service-option:hover {
    transform: translateY(-1px);
    border-color: color-mix(in srgb, var(--violet), transparent 28%);
    box-shadow: 0 12px 26px rgba(19, 30, 44, .1);
}

.choice:has(input:checked),
.service-option:has(input:checked) {
    border-color: var(--violet);
    background:
        linear-gradient(135deg, var(--violet-soft), color-mix(in srgb, var(--green), transparent 92%)),
        var(--surface-strong);
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--violet), transparent 18%);
}

.service-option {
    min-height: 7.4rem;
    align-content: start;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface-strong);
    padding: 1rem;
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease, background-color .18s ease;
}

.service-option.compact {
    min-height: 6.2rem;
}

.service-option input {
    width: auto;
}

.service-option span {
    font-size: 1.05rem;
}

.service-option small {
    color: var(--muted);
    line-height: 1.45;
}

.form-stack {
    display: grid;
    gap: 1rem;
}

.checkline {
    display: flex;
    align-items: flex-start;
    gap: .75rem;
    line-height: 1.5;
}

.checkline input {
    width: auto;
    margin-top: .2rem;
}

.is-muted {
    opacity: .52;
}

.is-muted input {
    cursor: not-allowed;
    background: color-mix(in srgb, var(--line), transparent 55%);
}

.notice {
    border-radius: var(--radius);
    background: var(--surface);
    border: 1px solid #b9dac9;
    padding: 1rem;
    margin-bottom: 1rem;
    color: #164a34;
    font-weight: 800;
}

@keyframes rise-in {
    from {
        opacity: 0;
        transform: translateY(14px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes step-in {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: .001ms !important;
        scroll-behavior: auto !important;
        transition-duration: .001ms !important;
    }
}

.error,
.error-box {
    color: var(--warn);
}

.thanks-shell,
.login-shell {
    min-height: 70vh;
    display: grid;
    align-content: center;
    gap: 1.25rem;
}

.login-shell {
    grid-template-columns: minmax(0, 1fr) minmax(280px, 420px);
    align-items: center;
}

.login-shell .panel {
    padding: 1.25rem;
}

.signing-shell {
    width: min(1280px, calc(100% - 2rem));
    margin: 0 auto;
    padding: 2rem 0 4rem;
}

.signing-head {
    margin-bottom: 1rem;
}

.signing-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(320px, .75fr);
    gap: 1rem;
    align-items: start;
}

.signing-panel,
.signing-document {
    padding: 1.15rem;
}

.signing-document iframe {
    width: 100%;
    height: min(74vh, 820px);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--paper-strong);
}

.signature-canvas {
    display: block;
    width: 100%;
    aspect-ratio: 720 / 220;
    margin: .4rem 0 .75rem;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--paper-strong);
    touch-action: none;
}

.legal-copy {
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: color-mix(in srgb, var(--surface-strong), transparent 8%);
    padding: 1rem;
}

.legal-copy p {
    margin: 0;
    color: var(--ink);
    line-height: 1.65;
}

.hash-value,
.signature-audit .hash-value {
    overflow-wrap: anywhere;
}

.signature-audit .hash-value {
    font-family: ui-monospace, "SFMono-Regular", Consolas, monospace;
    font-size: .92rem;
}

.audit-signature-image {
    max-width: 22rem;
    max-height: 9rem;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--paper-strong);
    padding: .75rem;
}

.admin-page {
    display: grid;
    grid-template-columns: 272px minmax(0, 1fr);
    background:
        linear-gradient(90deg, rgba(33, 95, 189, .045) 0 1px, transparent 1px 48px),
        linear-gradient(180deg, #f8fafc, #eef3f7 68%, #e8eef4);
}

.admin-mobile-bar,
.admin-menu-overlay {
    display: none;
}

.admin-menu-close {
    display: none;
}

.admin-mobile-shell,
.mobile-menu-button,
.mobile-menu-close {
    display: none;
}

.admin-sidebar {
    position: sticky;
    top: 0;
    min-height: 100vh;
    background:
        linear-gradient(180deg, #111820, #151f29);
    color: #edf4ff;
    padding: 1.1rem;
    display: grid;
    grid-template-rows: auto auto 1fr auto;
    align-content: stretch;
    gap: 1rem;
    box-shadow: 1px 0 0 rgba(255, 255, 255, .06);
}

.brand-admin img {
    width: 9.8rem;
    max-height: none;
    padding: .42rem .55rem;
    border-radius: var(--radius);
    background: var(--surface);
}

.brand-admin::after {
    display: none;
}

.admin-sidebar nav {
    display: grid;
    gap: .45rem;
    align-content: start;
}

.admin-sidebar-label {
    margin: .5rem 0 0;
    color: #8fa2b9;
    font-size: .72rem;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.admin-sidebar nav a,
.link-button {
    display: flex;
    align-items: center;
    gap: .62rem;
    border-radius: var(--radius);
    padding: .82rem .9rem;
    color: #d9e7f8;
    background: transparent;
    border: 1px solid transparent;
    text-align: left;
    font-weight: 900;
    letter-spacing: 0;
}

.admin-sidebar nav a::before {
    content: "";
    width: .48rem;
    height: .48rem;
    flex: 0 0 .48rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, .24);
    box-shadow: 0 0 0 3px rgba(255, 255, 255, .04);
}

.admin-sidebar nav a.active::before,
.admin-sidebar nav a:hover::before {
    background: var(--green);
}

.admin-sidebar nav a.active,
.admin-sidebar nav a:hover,
.link-button:hover {
    border-color: rgba(255,255,255,.14);
    background: rgba(255,255,255,.08);
    color: #fff;
}

.admin-sidebar nav a.active {
    box-shadow: inset 3px 0 0 var(--green);
}

.admin-sidebar-footer {
    display: grid;
    gap: .35rem;
    border-top: 1px solid rgba(255, 255, 255, .1);
    padding-top: .9rem;
    color: #d9e7f8;
}

.admin-sidebar-footer span,
.admin-sidebar-footer small {
    display: block;
}

.admin-sidebar-footer span {
    font-weight: 900;
}

.admin-sidebar-footer small {
    color: #8fa2b9;
}

.admin-sidebar-footer form {
    margin-top: .35rem;
}

.admin-main {
    width: 100%;
    max-width: none;
    padding: 1.1rem 1.35rem 2.2rem;
}

.admin-topbar {
    min-height: 3.55rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1rem;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: rgba(255, 255, 255, .78);
    padding: .7rem .85rem;
    box-shadow: var(--shadow-soft);
    backdrop-filter: blur(12px);
}

.admin-topbar div {
    display: grid;
    gap: .1rem;
}

.admin-topbar strong {
    font-size: .98rem;
}

.admin-topbar span {
    color: var(--muted);
    font-size: .88rem;
}

.admin-global-search {
    flex: 1 1 380px;
    max-width: 720px;
    display: grid;
    grid-template-columns: minmax(160px, 1fr) auto auto;
    gap: .5rem;
    align-items: center;
}

.admin-global-search input {
    min-height: 2.55rem;
}

.search-shortcut {
    min-height: 2.1rem;
    display: inline-flex;
    align-items: center;
    border: 1px solid var(--line);
    border-radius: 7px;
    background: color-mix(in srgb, var(--surface-strong), transparent 10%);
    padding: .24rem .45rem;
    color: var(--muted) !important;
    font-size: .72rem !important;
    font-weight: 900;
    white-space: nowrap;
}

.page-heading {
    position: relative;
    overflow: hidden;
    margin-bottom: 1.1rem;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
    padding: 1.25rem;
    box-shadow: var(--shadow-soft);
}

.page-heading::before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: 4px;
    background: linear-gradient(90deg, var(--blue), var(--green), var(--gold));
}

.crm-admin-create-form {
    gap: 1.15rem;
}

.crm-admin-create-overview {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .9rem;
}

.crm-admin-overview-card,
.crm-admin-subsection {
    border: 1px solid var(--line);
    border-radius: 18px;
    background: color-mix(in srgb, var(--surface-strong), var(--surface) 14%);
    box-shadow: var(--shadow-soft);
}

.crm-admin-overview-card {
    min-height: 8.25rem;
    padding: 1rem 1.05rem;
    display: grid;
    gap: .45rem;
    align-content: start;
}

.crm-admin-overview-card strong {
    color: var(--text);
    font-size: .98rem;
}

.crm-admin-overview-card p {
    margin: 0;
    color: var(--muted);
    line-height: 1.55;
    font-size: .9rem;
}

.crm-admin-create-section {
    padding: 1.5rem;
}

.crm-admin-create-body {
    display: grid;
    gap: 1rem;
}

.crm-admin-subsection {
    padding: 1rem;
    display: grid;
    gap: .95rem;
}

.crm-admin-subsection-head {
    display: grid;
    gap: .25rem;
}

.crm-admin-subsection-head h3 {
    margin: 0;
    color: var(--text);
    font-size: 1rem;
    font-weight: 900;
}

.crm-admin-subsection-head p {
    margin: 0;
    color: var(--muted);
    font-size: .9rem;
    line-height: 1.55;
}

.crm-admin-choice-columns,
.crm-admin-service-groups {
    display: grid;
    gap: 1rem;
}

.crm-admin-choice-columns {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.crm-admin-package-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.crm-admin-service-groups {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.crm-admin-service-group {
    display: grid;
    gap: .8rem;
    padding: .95rem;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: color-mix(in srgb, var(--surface), white 4%);
}

.crm-admin-service-group-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
}

.crm-admin-service-group-head strong {
    color: var(--text);
    font-size: .95rem;
}

.crm-admin-service-group-head span {
    color: var(--muted);
    font-size: .78rem;
    font-weight: 800;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.crm-admin-service-grid {
    grid-template-columns: 1fr;
}

.crm-admin-create-form .choice {
    min-height: 3.15rem;
}

.crm-admin-create-form .choice.package-choice {
    min-height: 100%;
}

.crm-admin-create-form .choice-copy {
    gap: .4rem;
}

.crm-admin-create-form .choice-points {
    margin: 0;
    padding-left: 1rem;
}

.crm-admin-create-footer {
    padding-top: .35rem;
}

.crm-admin-stage {
    display: grid;
    gap: 1.25rem;
    padding-bottom: 2.5rem;
    font-family: "Geist", var(--font-sans, Inter, system-ui, sans-serif);
}

.crm-admin-stage-hero {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 1.5rem;
}

.crm-admin-stage-copy {
    display: grid;
    gap: .7rem;
    max-width: 60rem;
}

.crm-admin-stage-eyebrow,
.crm-admin-stage-card-head > span,
.crm-admin-stage-pill > span {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    color: color-mix(in srgb, var(--blue), white 18%);
    font-size: .76rem;
    font-weight: 800;
    letter-spacing: .16em;
    text-transform: uppercase;
}

.crm-admin-stage-copy h1,
.crm-admin-stage-card-head h2 {
    margin: 0;
    font-family: "Newsreader", Georgia, serif;
    letter-spacing: -.02em;
}

.crm-admin-stage-copy h1 {
    font-size: clamp(2.7rem, 4.6vw, 4.3rem);
    line-height: .95;
    max-width: 14ch;
}

.crm-admin-stage-copy p,
.crm-admin-stage-card-head p,
.crm-admin-stage-subcard-head p,
.crm-admin-stage-footer-copy p {
    margin: 0;
    color: var(--muted);
    line-height: 1.6;
}

.crm-admin-stage-back {
    white-space: nowrap;
    min-height: 3.15rem;
    display: inline-flex;
    align-items: center;
}

.crm-admin-stage-overview {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
}

.crm-admin-stage-pill,
.crm-admin-stage-card,
.crm-admin-stage-subcard,
.crm-admin-package-card {
    border: 1px solid color-mix(in srgb, var(--line), white 6%);
    border-radius: 24px;
    background:
        linear-gradient(180deg, color-mix(in srgb, var(--surface-strong), white 2%), color-mix(in srgb, var(--surface), white 1%)),
        var(--surface);
    box-shadow: 0 24px 60px rgba(3, 7, 18, .18);
}

.crm-admin-stage-pill {
    display: grid;
    gap: .55rem;
    min-height: 8rem;
    padding: 1rem 1.1rem;
}

.crm-admin-stage-pill strong {
    color: var(--text);
    font-size: .98rem;
    line-height: 1.45;
}

.crm-admin-stage-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(22rem, .95fr);
    gap: 1.25rem;
    align-items: start;
}

.crm-admin-stage-main,
.crm-admin-stage-side,
.crm-admin-stage-lower {
    display: grid;
    gap: 1.25rem;
}

.crm-admin-stage-card {
    padding: 1.65rem;
}

.crm-admin-stage-card-sticky {
    position: sticky;
    top: 1rem;
}

.crm-admin-stage-card-head,
.crm-admin-stage-subcard-head {
    display: grid;
    gap: .45rem;
    margin-bottom: 1.25rem;
    padding-bottom: 1.1rem;
    border-bottom: 1px solid color-mix(in srgb, var(--line), transparent 6%);
}

.crm-admin-stage-card-head-tight {
    margin-bottom: 1rem;
    padding-bottom: 0;
    border-bottom: 0;
}

.crm-admin-stage-card-head h2 {
    font-size: clamp(2.1rem, 2vw, 2.85rem);
    line-height: 1;
}

.crm-admin-stage-card-head h3,
.crm-admin-stage-subcard-head h3 {
    margin: 0;
    color: var(--text);
    font-size: 1.18rem;
    font-weight: 800;
}

.crm-admin-stage-fields {
    gap: 1rem;
}

.crm-admin-stage-fields label,
.crm-admin-stage-choice-block > label {
    color: color-mix(in srgb, var(--text), white 4%);
    font-size: .83rem;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.crm-admin-stage-fields label {
    display: grid;
    gap: .55rem;
}

.crm-admin-stage-fields input,
.crm-admin-stage-fields select,
.crm-admin-stage-fields textarea {
    min-height: 3.25rem;
    border-radius: 14px;
    border: 1px solid color-mix(in srgb, var(--line), white 5%);
    background: color-mix(in srgb, var(--surface), white 4%);
    color: var(--text);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04);
}

.crm-admin-stage-fields textarea {
    min-height: 8.25rem;
}

.crm-admin-stage-fields input:focus,
.crm-admin-stage-fields select:focus,
.crm-admin-stage-fields textarea:focus {
    border-color: color-mix(in srgb, var(--blue), white 18%);
    box-shadow: 0 0 0 4px rgba(128, 131, 255, .12);
}

.crm-admin-stage-choice-block {
    display: grid;
    gap: .7rem;
}

.crm-admin-stage-choice-block > p {
    margin: -.15rem 0 .15rem;
    color: var(--muted);
    font-size: .92rem;
    text-transform: none;
    letter-spacing: 0;
    font-weight: 500;
}

.crm-admin-stage-inline-choices,
.crm-admin-stage-choice-columns {
    display: grid;
    gap: 1rem;
}

.crm-admin-stage-inline-choices {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.crm-admin-stage-inline-choices .choice,
.crm-admin-stage-choice-columns .choice {
    min-height: 3.5rem;
    padding: .85rem 1rem;
}

.crm-admin-stage-choice-columns {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-top: 1rem;
}

.crm-admin-stage-package-list {
    display: grid;
    gap: .9rem;
}

.crm-admin-package-card {
    position: relative;
    display: grid;
    gap: .75rem;
    padding: 1.15rem 1.15rem 1.2rem;
    cursor: pointer;
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease, background .18s ease;
}

.crm-admin-package-card:hover {
    transform: translateY(-1px);
    border-color: color-mix(in srgb, var(--blue), white 12%);
}

.crm-admin-package-card.is-selected {
    border-color: color-mix(in srgb, var(--blue), var(--green) 30%);
    background:
        linear-gradient(180deg, rgba(34, 45, 71, .96), rgba(22, 30, 48, .96)),
        var(--surface);
    box-shadow: 0 22px 46px rgba(4, 10, 24, .22), inset 0 0 0 1px rgba(79, 219, 200, .14);
}

.crm-admin-package-card.is-featured.is-selected {
    background:
        radial-gradient(circle at top right, rgba(79, 219, 200, .16), transparent 36%),
        linear-gradient(180deg, rgba(34, 45, 71, .98), rgba(21, 30, 47, .96)),
        var(--surface);
}

.crm-admin-package-check {
    position: absolute;
    top: 1rem;
    right: 1rem;
    width: 1.35rem;
    height: 1.35rem;
    border-radius: .35rem;
    border: 1px solid color-mix(in srgb, var(--line), white 16%);
    background: rgba(6, 14, 32, .72);
    transition: all .18s ease;
}

.crm-admin-package-card.is-selected .crm-admin-package-check {
    border-color: transparent;
    background: color-mix(in srgb, var(--green), white 8%);
    box-shadow: 0 0 0 4px rgba(79, 219, 200, .12);
}

.crm-admin-package-card.is-selected .crm-admin-package-check::before {
    content: "";
    position: absolute;
    left: .34rem;
    top: .14rem;
    width: .38rem;
    height: .72rem;
    border: solid #091225;
    border-width: 0 .17rem .17rem 0;
    transform: rotate(45deg);
}

.crm-admin-package-meta,
.crm-admin-package-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
}

.crm-admin-package-meta {
    flex-wrap: wrap;
    padding-right: 2rem;
}

.crm-admin-package-row strong {
    color: var(--text);
    font-size: 1.02rem;
}

.crm-admin-package-badge {
    display: inline-flex;
    align-items: center;
    min-height: 1.8rem;
    padding: 0 .75rem;
    border-radius: 999px;
    border: 1px solid rgba(111, 221, 203, .24);
    background: rgba(79, 219, 200, .1);
    color: color-mix(in srgb, var(--green), white 12%);
    font-size: .73rem;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.crm-admin-package-price {
    color: color-mix(in srgb, var(--green), white 10%);
    font-size: .98rem;
    font-weight: 900;
}

.crm-admin-package-card h4 {
    margin: 0;
    color: var(--text);
    font-size: 1rem;
    line-height: 1.4;
}

.crm-admin-package-points {
    display: grid;
    gap: .45rem;
    margin: 0;
    padding: 0 0 0 1rem;
    color: var(--muted);
    font-size: .92rem;
    line-height: 1.55;
}

.crm-admin-service-groups {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.crm-admin-service-group {
    border-radius: 20px;
    padding: 1rem;
    background: color-mix(in srgb, var(--surface), white 4%);
}

.crm-admin-service-grid {
    grid-template-columns: 1fr;
}

.crm-admin-stage-lower {
    margin-top: .1rem;
}

.crm-admin-stage-contract-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.crm-admin-stage-subcard {
    padding: 1rem;
}

.crm-admin-stage-subcard-head {
    min-height: 5.4rem;
}

.crm-admin-stage-footer {
    position: sticky;
    bottom: 1rem;
    z-index: 8;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-top: 1.2rem;
    padding: 1rem 1.1rem;
    border: 1px solid color-mix(in srgb, var(--line), white 6%);
    border-radius: 20px;
    background: rgba(11, 19, 38, .84);
    backdrop-filter: blur(16px);
    box-shadow: 0 18px 42px rgba(2, 6, 23, .2);
}

.crm-admin-stage-footer-copy {
    display: grid;
    gap: .2rem;
}

.crm-admin-stage-footer-copy strong {
    color: var(--text);
    font-size: 1rem;
}

.crm-admin-stage-footer-actions {
    display: flex;
    align-items: center;
    gap: .8rem;
}

.crm-admin-stage-footer-actions .button {
    min-height: 3.15rem;
}

.crm-admin-agencycore {
    --crm-admin-dashboard-bg: #151c24;
    --crm-admin-dashboard-surface: #1a222c;
    --crm-admin-dashboard-surface-soft: #1e2631;
    --crm-admin-dashboard-border: rgba(55, 65, 81, 0.72);
    --crm-admin-dashboard-border-strong: rgba(79, 91, 109, 0.88);
    --crm-admin-dashboard-text: #d1d5db;
    --crm-admin-dashboard-text-soft: #9ca3af;
    --crm-admin-dashboard-text-strong: #ffffff;
    --crm-admin-dashboard-blue: #3b82f6;
    --crm-admin-dashboard-blue-soft: #5b8def;
    --crm-admin-dashboard-green: #22c55e;
    --crm-admin-dashboard-shadow: 0 16px 28px rgba(0, 0, 0, 0.18);
    --crm-admin-dashboard-radius: 16px;
    color: var(--crm-admin-dashboard-text);
    display: grid;
    gap: 1.25rem;
    padding: 1.25rem 0 2rem;
}

.crm-admin-agencycore,
.crm-admin-agencycore input,
.crm-admin-agencycore select,
.crm-admin-agencycore textarea,
.crm-admin-agencycore button {
    font-family: inherit;
}

.crm-admin-agencycore h1,
.crm-admin-agencycore h2,
.crm-admin-agencycore h3,
.crm-admin-agencycore h4 {
    font-family: inherit;
}

.crm-admin-agencycore-page-head {
    margin-bottom: 0;
}

.crm-admin-agencycore-card-head > span {
    display: block;
    margin-bottom: .55rem;
    color: var(--crm-admin-dashboard-blue-soft);
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .16em;
    text-transform: uppercase;
}

.crm-admin-agencycore-page-head h1 {
    max-width: 15ch;
}

.crm-admin-agencycore-context {
    margin: -.3rem 0 .2rem;
}

.crm-admin-agencycore-page-head .muted,
.crm-admin-agencycore-card-head p,
.crm-admin-agencycore-choice-panel > p,
.crm-admin-agencycore-package p {
    margin: .75rem 0 0;
    color: var(--crm-admin-dashboard-text-soft);
    line-height: 1.55;
}

.crm-admin-agencycore-form {
    display: grid;
    gap: 1.25rem;
}

.crm-admin-agencycore-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(22rem, .78fr);
    gap: 1.5rem;
}

.crm-admin-agencycore-column {
    display: grid;
    gap: 1.5rem;
    min-width: 0;
}

.crm-admin-agencycore-side {
    align-content: start;
}

.crm-admin-agencycore-card,
.crm-admin-agencycore-package,
.crm-admin-agencycore-subpanel {
    border: 1px solid var(--crm-admin-dashboard-border);
    border-radius: var(--crm-admin-dashboard-radius);
    background: var(--crm-admin-dashboard-surface);
    box-shadow: 0 14px 28px rgba(8, 12, 18, 0.14);
}

.crm-admin-agencycore-card {
    padding: 1.15rem;
}

.crm-admin-agencycore-card-head {
    margin-bottom: 1.35rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--crm-admin-dashboard-border);
}

.crm-admin-agencycore-card-head h3 {
    margin: 0;
    color: var(--crm-admin-dashboard-text-strong);
    font-size: 1.32rem;
    line-height: 1.1;
    letter-spacing: -.02em;
    font-weight: 700;
}

.crm-admin-agencycore-card-head-compact {
    margin-bottom: 1rem;
    padding-bottom: 0;
    border-bottom: 0;
}

.crm-admin-agencycore-fields {
    gap: 1rem;
}

.crm-admin-agencycore-stack,
.crm-admin-agencycore-choice-panel {
    display: grid;
    gap: .85rem;
}

.crm-admin-agencycore-fields label,
.crm-admin-agencycore-stack > label,
.crm-admin-agencycore-choice-panel > label,
.crm-admin-agencycore-subpanel h4 {
    display: grid;
    gap: .45rem;
    color: var(--crm-admin-dashboard-text-strong);
    font-size: .84rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.crm-admin-agencycore-subpanel h4 {
    margin: 0 0 1rem;
}

.crm-admin-agencycore input:not([type="checkbox"]):not([type="radio"]),
.crm-admin-agencycore select,
.crm-admin-agencycore textarea {
    min-height: 2.95rem;
    border-radius: 10px;
    border: 1px solid var(--crm-admin-dashboard-border);
    background: var(--crm-admin-dashboard-surface-soft);
    color: var(--crm-admin-dashboard-text);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .03);
}

.crm-admin-agencycore textarea {
    min-height: 7.5rem;
}

.crm-admin-agencycore input:not([type="checkbox"]):not([type="radio"]):focus,
.crm-admin-agencycore select:focus,
.crm-admin-agencycore textarea:focus {
    border-color: var(--crm-admin-dashboard-blue);
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.14);
}

.crm-admin-agencycore-briefing-intro {
    display: grid;
    gap: .9rem;
    margin-bottom: 1rem;
}

.crm-admin-agencycore-briefing-tags {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .75rem;
}

.crm-admin-agencycore-briefing-tags span {
    display: grid;
    gap: .18rem;
    padding: .85rem .95rem;
    border: 1px solid var(--crm-admin-dashboard-border);
    border-radius: 12px;
    background: rgba(30, 38, 49, 0.74);
}

.crm-admin-agencycore-briefing-tags strong {
    color: var(--crm-admin-dashboard-text-strong);
    font-size: .88rem;
}

.crm-admin-agencycore-briefing-tags small {
    color: var(--crm-admin-dashboard-text-soft);
    line-height: 1.45;
}

.crm-admin-agencycore-inline-choices,
.crm-admin-agencycore-choice-columns,
.crm-admin-agencycore-detail-grid,
.crm-admin-agencycore-service-groups {
    display: grid;
    gap: 1rem;
}

.crm-admin-agencycore-inline-choices {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.crm-admin-agencycore-choice-columns {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.crm-admin-agencycore-detail-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.crm-admin-agencycore-subpanel {
    padding: 1.1rem;
    background: var(--crm-admin-dashboard-surface);
}

.crm-admin-agencycore-briefing-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(18rem, .8fr);
    gap: 1rem;
    margin-bottom: 1rem;
}

.crm-admin-agencycore-briefing-notes {
    display: grid;
    gap: .85rem;
}

.crm-admin-agencycore-briefing-notes article {
    border: 1px solid var(--crm-admin-dashboard-border);
    border-radius: .95rem;
    background: var(--crm-admin-dashboard-surface-soft);
    padding: .9rem 1rem;
}

.crm-admin-agencycore-briefing-notes strong,
.crm-admin-agencycore-choice-group strong {
    color: var(--crm-admin-dashboard-text-strong);
    font-size: .9rem;
}

.crm-admin-agencycore-briefing-notes p,
.crm-admin-agencycore-choice-group header {
    margin: .25rem 0 0;
    color: var(--crm-admin-dashboard-text-soft);
    line-height: 1.5;
}

.crm-admin-agencycore-goal-layout,
.crm-admin-agencycore-goal-rail,
.crm-admin-agencycore-choice-groups {
    display: grid;
    gap: 1rem;
}

.crm-admin-agencycore-goal-layout {
    grid-template-columns: minmax(0, 1.1fr) minmax(0, .95fr);
}

.crm-admin-agencycore-choice-panel-spacious {
    gap: 1rem;
}

.crm-admin-agencycore-choice-group {
    display: grid;
    gap: .65rem;
}

.crm-admin-agencycore-choice-group header {
    padding-bottom: .35rem;
    border-bottom: 1px solid var(--crm-admin-dashboard-border);
}

.crm-admin-agencycore-compact-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.crm-admin-agencycore-goal-grid,
.crm-admin-agencycore-style-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.crm-admin-agencycore-packages {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .85rem;
}

.crm-admin-agencycore-package {
    display: grid;
    position: relative;
    gap: .55rem;
    align-content: start;
    min-height: 13.2rem;
    padding: .95rem 1rem 1rem;
    cursor: pointer;
    transition: border-color .18s ease, transform .18s ease, background .18s ease;
}

.crm-admin-agencycore-package:hover {
    transform: translateY(-1px);
    border-color: rgba(128, 131, 255, .5);
}

.crm-admin-agencycore-package.is-selected {
    border-color: rgba(91, 141, 239, 0.42);
    background: linear-gradient(180deg, rgba(91, 141, 239, 0.08), rgba(30, 38, 49, 0.66)), var(--crm-admin-dashboard-surface);
    box-shadow: inset 0 0 0 1px rgba(91, 141, 239, 0.16);
}

.crm-admin-agencycore-package-input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
    width: 0;
    height: 0;
}

.crm-admin-agencycore-package-top,
.crm-admin-agencycore-package-heading,
.crm-admin-agencycore-package-meta {
    display: flex;
    align-items: center;
    gap: .75rem;
}

.crm-admin-agencycore-package-top {
    justify-content: space-between;
    align-items: flex-start;
}

.crm-admin-agencycore-package-heading {
    min-width: 0;
}

.crm-admin-agencycore-package-check {
    width: 1rem;
    height: 1rem;
    position: relative;
    border-radius: 999px;
    border: 1px solid var(--crm-admin-dashboard-border-strong);
    background: var(--crm-admin-dashboard-surface-soft);
    flex: 0 0 auto;
    margin-top: .12rem;
}

.crm-admin-agencycore-package.is-selected .crm-admin-agencycore-package-check {
    border-color: var(--crm-admin-dashboard-blue);
    background: var(--crm-admin-dashboard-blue);
}

.crm-admin-agencycore-choice-check,
.crm-admin-agencycore-service-check,
.crm-admin-agencycore-package-check::after {
    content: "";
}

.crm-admin-agencycore-choice-check,
.crm-admin-agencycore-service-check {
    width: 1rem;
    height: 1rem;
    position: relative;
    flex: 0 0 auto;
    border-radius: .24rem;
    border: 1px solid var(--crm-admin-dashboard-border-strong);
    background: var(--crm-admin-dashboard-surface-soft);
}

.crm-admin-agencycore-choice-check::after,
.crm-admin-agencycore-service-check::after,
.crm-admin-agencycore-package-check::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 46%;
    width: .28rem;
    height: .56rem;
    border-right: 2px solid #fff;
    border-bottom: 2px solid #fff;
    transform: translate(-50%, -50%) rotate(45deg) scale(.65);
    opacity: 0;
    transition: opacity .18s ease, transform .18s ease;
}

.crm-admin-agencycore .choice:has(input:checked) .crm-admin-agencycore-choice-check,
.crm-admin-agencycore .service-option:has(input:checked) .crm-admin-agencycore-service-check {
    border-color: var(--crm-admin-dashboard-blue);
    background: var(--crm-admin-dashboard-blue);
}

.crm-admin-agencycore .choice:has(input:checked) .crm-admin-agencycore-choice-check::after,
.crm-admin-agencycore .service-option:has(input:checked) .crm-admin-agencycore-service-check::after,
.crm-admin-agencycore-package.is-selected .crm-admin-agencycore-package-check::after {
    opacity: 1;
    transform: translate(-50%, -50%) rotate(45deg) scale(1);
}

.crm-admin-agencycore-package strong {
    color: var(--crm-admin-dashboard-text-strong);
    font-size: 1rem;
    line-height: 1.3;
}

.crm-admin-agencycore-package-meta {
    justify-content: flex-end;
    flex-wrap: wrap;
    row-gap: .45rem;
}

.crm-admin-agencycore-package-price {
    color: var(--crm-admin-dashboard-text-strong);
    font-size: .98rem;
    font-weight: 800;
    white-space: nowrap;
}

.crm-admin-agencycore-package-badge {
    display: inline-flex;
    align-items: center;
    min-height: 1.55rem;
    padding: 0 .62rem;
    border-radius: 999px;
    background: rgba(74, 222, 128, .12);
    border: 1px solid rgba(74, 222, 128, .2);
    color: #86efac;
    font-size: .68rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.crm-admin-agencycore-package p {
    margin-top: .15rem;
    font-size: .95rem;
}

.crm-admin-agencycore-package ul {
    margin: 0;
    padding-left: 1.1rem;
    color: var(--crm-admin-dashboard-text-soft);
    font-size: .93rem;
    line-height: 1.42;
    display: grid;
    gap: .18rem;
}

.crm-admin-agencycore-service-groups {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.crm-admin-agencycore-service-group {
    display: grid;
    gap: .85rem;
    padding: 1rem;
    border-radius: 1rem;
    border: 1px solid var(--crm-admin-dashboard-border);
    background: var(--crm-admin-dashboard-surface-soft);
}

.crm-admin-agencycore-service-group-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
}

.crm-admin-agencycore-service-group-head strong {
    color: var(--crm-admin-dashboard-text-strong);
    font-size: .96rem;
}

.crm-admin-agencycore-service-group-head span {
    color: var(--crm-admin-dashboard-text-soft);
    font-size: .74rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.crm-admin-agencycore-service-grid {
    grid-template-columns: 1fr;
}

.crm-admin-agencycore .choice {
    min-height: 3rem;
    display: grid;
    position: relative;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: .7rem;
    padding: .8rem .9rem;
    border-color: var(--crm-admin-dashboard-border);
    background: var(--crm-admin-dashboard-surface-soft);
}

.crm-admin-agencycore .choice input,
.crm-admin-agencycore .service-option input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.crm-admin-agencycore .choice > span:last-child {
    line-height: 1.3;
}

.crm-admin-agencycore .choice:hover,
.crm-admin-agencycore .service-option:hover {
    border-color: rgba(91, 141, 239, 0.28);
    box-shadow: 0 12px 22px rgba(0, 0, 0, .16);
}

.crm-admin-agencycore .choice:has(input:checked),
.crm-admin-agencycore .service-option:has(input:checked) {
    border-color: rgba(91, 141, 239, 0.42);
    background: linear-gradient(180deg, rgba(91, 141, 239, 0.08), rgba(30, 38, 49, 0.66)), var(--crm-admin-dashboard-surface-soft);
    box-shadow: inset 0 0 0 1px rgba(91, 141, 239, 0.16);
}

.crm-admin-agencycore .service-option {
    min-height: 0;
    display: grid;
    position: relative;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: start;
    gap: .35rem .75rem;
    padding: .9rem 1rem;
    border-color: var(--crm-admin-dashboard-border);
    background: var(--crm-admin-dashboard-surface-soft);
}

.crm-admin-agencycore-service-check {
    grid-column: 1;
    grid-row: 1 / span 2;
    margin-top: .1rem;
}

.crm-admin-agencycore .service-option > span:nth-of-type(2) {
    grid-column: 2;
    color: var(--crm-admin-dashboard-text-strong);
    font-size: .98rem;
    line-height: 1.3;
}

.crm-admin-agencycore .service-option small {
    grid-column: 2;
    color: var(--crm-admin-dashboard-text-soft);
    font-size: .83rem;
    line-height: 1.45;
}

.crm-admin-agencycore-footer {
    position: sticky;
    bottom: 0;
    z-index: 16;
    display: flex;
    justify-content: flex-end;
    gap: 1rem;
    padding: 1.5rem 0 0;
    border-top: 1px solid var(--crm-admin-dashboard-border);
    background: linear-gradient(180deg, rgba(21, 28, 36, 0), rgba(21, 28, 36, .96) 18%, rgba(21, 28, 36, 1));
}

.crm-admin-agencycore-footer .button {
    min-height: 3.1rem;
    min-width: 10rem;
}

.crm-admin-agencycore-footer .button.primary {
    background: var(--crm-admin-dashboard-blue);
    border-color: var(--crm-admin-dashboard-blue);
    color: #fff;
}

@media (max-width: 1180px) {
    .crm-admin-agencycore-page-head {
        flex-direction: column;
        align-items: stretch;
    }

    .crm-admin-agencycore-grid,
    .crm-admin-agencycore-detail-grid,
    .crm-admin-agencycore-choice-columns,
    .crm-admin-agencycore-service-groups,
    .crm-admin-agencycore-briefing-grid,
    .crm-admin-agencycore-goal-layout,
    .crm-admin-agencycore-packages {
        grid-template-columns: 1fr;
    }

    .crm-admin-agencycore-briefing-tags {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 900px) {
    .crm-admin-agencycore-inline-choices,
    .crm-admin-agencycore-service-groups,
    .crm-admin-agencycore-compact-grid,
    .crm-admin-agencycore-goal-grid,
    .crm-admin-agencycore-style-grid,
    .crm-admin-agencycore-packages {
        grid-template-columns: 1fr;
    }

    .crm-admin-agencycore-card {
        padding: 1.1rem;
    }
}

@media (max-width: 1280px) {
    .crm-admin-stage-overview,
    .crm-admin-stage-choice-columns,
    .crm-admin-service-groups {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .crm-admin-stage-grid,
    .crm-admin-stage-contract-grid {
        grid-template-columns: 1fr;
    }

    .crm-admin-stage-card-sticky {
        position: static;
    }
}

@media (max-width: 900px) {
    .crm-admin-stage-hero,
    .crm-admin-stage-footer {
        flex-direction: column;
        align-items: stretch;
    }

    .crm-admin-stage-overview,
    .crm-admin-stage-choice-columns,
    .crm-admin-service-groups,
    .crm-admin-stage-inline-choices {
        grid-template-columns: 1fr;
    }

    .crm-admin-stage-card,
    .crm-admin-stage-subcard {
        padding: 1.15rem;
    }

    .crm-admin-stage-card-head h2,
    .crm-admin-stage-copy h1 {
        max-width: none;
    }

    .crm-admin-stage-footer {
        position: static;
    }
}

@media (max-width: 640px) {
    .crm-admin-stage-copy h1 {
        font-size: 2.35rem;
    }

    .crm-admin-stage-fields,
    .crm-admin-stage-footer-actions,
    .crm-admin-stage-overview {
        grid-template-columns: 1fr;
    }

    .crm-admin-stage-footer-actions {
        width: 100%;
    }

    .crm-admin-stage-footer-actions .button {
        flex: 1;
        justify-content: center;
    }
}

@media (max-width: 1180px) {
    .crm-admin-create-overview,
    .crm-admin-choice-columns,
    .crm-admin-service-groups {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 900px) {
    .crm-admin-create-overview,
    .crm-admin-choice-columns,
    .crm-admin-service-groups,
    .crm-admin-package-grid {
        grid-template-columns: 1fr;
    }

    .crm-admin-create-section {
        padding: 1.15rem;
    }
}

.page-heading > * {
    position: relative;
}

.split-heading,
.panel-head,
.project-top {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: flex-start;
}

.metric-row,
.admin-grid-two,
.project-grid {
    display: grid;
    gap: 1rem;
}

.metric-row {
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    margin-bottom: 1rem;
}

.metric-row-focus {
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
}

.dashboard-context-strip {
    display: flex;
    flex-wrap: wrap;
    gap: .55rem;
    margin: -.35rem 0 1rem;
    color: var(--muted);
}

.dashboard-context-strip span {
    display: inline-flex;
    align-items: baseline;
    gap: .35rem;
    min-height: 2.35rem;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: color-mix(in srgb, var(--surface), transparent 10%);
    padding: .45rem .65rem;
    font-size: .86rem;
    font-weight: 800;
}

.dashboard-context-strip strong {
    color: var(--ink);
    font-size: 1rem;
}

.metric-row article,
.panel,
.project-panel {
    padding: 1.15rem;
}

.metric-row article {
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
    box-shadow: var(--shadow-soft);
    transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.metric-row article:hover {
    transform: translateY(-1px);
    border-color: color-mix(in srgb, var(--blue), transparent 58%);
    box-shadow: 0 14px 30px rgba(17, 24, 32, .09);
}

.metric-row strong {
    display: block;
    margin: .2rem 0;
    font-size: 2.15rem;
    line-height: 1;
}

.metric-row small,
.record p {
    color: var(--muted);
    line-height: 1.45;
}

.admin-grid-two,
.project-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.record-list,
.table-list,
.comment-list {
    display: grid;
    gap: .7rem;
}

.record,
.table-row,
.task-row,
.comment-list article {
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
    padding: .9rem;
    transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.record {
    position: relative;
}

.record::before {
    content: "";
    position: absolute;
    inset: .85rem auto .85rem 0;
    width: 3px;
    border-radius: 0 999px 999px 0;
    background: color-mix(in srgb, var(--green), transparent 18%);
}

a.record:hover,
a.table-row:hover {
    transform: translateY(-1px);
    border-color: color-mix(in srgb, var(--blue), transparent 54%);
    box-shadow: var(--shadow-soft);
}

.panel,
.project-panel {
    background: var(--surface);
    box-shadow: var(--shadow-soft);
}

.record strong,
.record small,
.table-row strong,
.table-row small {
    display: block;
}

.table-row {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) .6fr .6fr .6fr;
    gap: .75rem;
    align-items: center;
}

.customer-table-row {
    grid-template-columns: minmax(0, 1.6fr) repeat(5, minmax(110px, .7fr));
}

.admin-list-panel .panel-head {
    margin-bottom: .9rem;
}

.table-head {
    background: var(--surface);
    box-shadow: none;
    pointer-events: none;
}

.table-head span {
    color: var(--blue);
    font-size: .72rem;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.customer-table-row span {
    min-width: 0;
    overflow-wrap: anywhere;
}

.customer-next-action strong {
    color: var(--text);
}

.customer-next-action small {
    margin-top: .16rem;
    color: var(--muted);
    line-height: 1.35;
}

.toolbar,
.inline-form,
.mini-form {
    display: grid;
    gap: .65rem;
}

.toolbar {
    grid-template-columns: minmax(0, 1fr) 220px auto;
    margin-bottom: 1rem;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
    padding: .75rem;
    box-shadow: var(--shadow-soft);
    transition: border-color .18s ease, box-shadow .18s ease;
}

.toolbar:focus-within {
    border-color: color-mix(in srgb, var(--green), transparent 48%);
    box-shadow: 0 0 0 4px var(--focus), var(--shadow-soft);
}

.toolbar-wide {
    grid-template-columns: minmax(220px, 1.2fr) repeat(3, minmax(180px, 1fr)) auto;
}

.toolbar-finance {
    grid-template-columns: minmax(240px, 1.4fr) minmax(180px, .7fr) minmax(190px, .7fr) auto;
}

.inline-form {
    grid-template-columns: repeat(2, minmax(160px, 1fr));
    max-width: 620px;
}

.project-panel {
    margin-top: 1rem;
}

.customer-command-center {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(240px, 340px);
    align-items: stretch;
    gap: 1rem;
}

.customer-command-main {
    display: grid;
    align-content: center;
    gap: .75rem;
    min-width: 0;
}

.customer-command-main h1 {
    max-width: 12em;
}

.customer-command-main .muted {
    order: 2;
}

.customer-command-center > .button {
    display: none;
}

.customer-command-actions {
    order: 3;
    display: flex;
    flex-wrap: wrap;
    gap: .55rem;
}

.customer-command-actions .button {
    min-height: 2.45rem;
}

.customer-command-card {
    display: grid;
    align-content: space-between;
    gap: .75rem;
    border: 1px solid color-mix(in srgb, var(--blue), transparent 68%);
    border-radius: var(--radius);
    background:
        linear-gradient(135deg, color-mix(in srgb, var(--blue), transparent 88%), transparent 54%),
        var(--surface);
    padding: 1rem;
}

.customer-command-card span,
.customer-command-card small {
    color: var(--muted);
    font-weight: 800;
}

.customer-command-card span {
    font-size: .72rem;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.customer-command-card strong {
    font-size: 1.75rem;
    line-height: 1;
}

.customer-status-strip {
    display: flex;
    flex-wrap: wrap;
    gap: .55rem;
    margin: -.2rem 0 1rem;
}

.customer-status-strip div {
    min-height: 2.55rem;
    display: inline-flex;
    align-items: center;
    gap: .48rem;
    border: 1px solid color-mix(in srgb, var(--blue), transparent 76%);
    border-radius: 8px;
    background: color-mix(in srgb, var(--surface), transparent 8%);
    padding: .42rem .62rem;
    box-shadow: 0 8px 22px rgba(15, 23, 42, .05);
}

.customer-status-strip span {
    color: var(--muted);
    font-size: .72rem;
    font-weight: 900;
    text-transform: uppercase;
}

.customer-status-strip strong {
    color: var(--ink);
    font-size: .95rem;
    line-height: 1.1;
}

.customer-next-step {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin: 0 0 1rem;
    border: 1px solid color-mix(in srgb, var(--blue), transparent 62%);
    border-left: 5px solid var(--blue);
    border-radius: var(--radius);
    background:
        linear-gradient(135deg, color-mix(in srgb, var(--blue), transparent 90%), transparent 48%),
        var(--surface);
    padding: 1rem;
    box-shadow: var(--shadow-soft);
}

.customer-next-step.is-critical,
.customer-next-step.is-blocked {
    border-color: color-mix(in srgb, var(--warn), transparent 55%);
    border-left-color: var(--warn);
    background:
        linear-gradient(135deg, color-mix(in srgb, var(--warn), transparent 90%), transparent 48%),
        var(--surface);
}

.customer-next-step.is-waiting {
    border-color: color-mix(in srgb, var(--gold), transparent 55%);
    border-left-color: var(--gold);
}

.customer-next-step.is-done {
    border-color: color-mix(in srgb, var(--green), transparent 58%);
    border-left-color: var(--green);
}

.customer-next-step h2 {
    margin-bottom: .28rem;
}

.customer-next-step-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: .5rem;
}

.customer-focus-panel {
    display: grid;
    gap: .85rem;
    margin: 0 0 1rem;
    border: 1px solid color-mix(in srgb, var(--blue), transparent 70%);
    border-radius: var(--radius);
    background:
        linear-gradient(135deg, color-mix(in srgb, var(--green), transparent 92%), transparent 42%),
        var(--surface);
    padding: 1rem;
    box-shadow: var(--shadow-soft);
}

.customer-focus-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.customer-focus-head h2 {
    margin-bottom: .3rem;
}

.customer-focus-list {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .65rem;
}

.customer-focus-item {
    position: relative;
    min-height: 7.1rem;
    display: grid;
    align-content: space-between;
    gap: .45rem;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
    padding: .85rem;
    transition: transform .18s ease, border-color .18s ease, background-color .18s ease, box-shadow .18s ease;
}

a.customer-focus-item:hover {
    transform: translateY(-1px);
    border-color: color-mix(in srgb, var(--blue), transparent 52%);
    background: var(--surface);
    box-shadow: var(--shadow-soft);
}

.customer-focus-item::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    background: var(--blue);
}

.customer-focus-item.is-payment::before {
    background: var(--warn);
}

.customer-focus-item.is-offer::before {
    background: var(--green);
}

.customer-focus-item.is-material::before {
    background: var(--gold);
}

.customer-focus-item.is-contract::before,
.customer-focus-item.is-handover::before {
    background: var(--blue);
}

.customer-focus-item.is-task::before {
    background: var(--gold);
}

.customer-focus-item.is-completion::before {
    background: var(--warn);
}

.customer-focus-item.is-done::before {
    background: var(--green);
}

.customer-focus-item span,
.project-health-pill {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    color: var(--blue);
    font-size: .72rem;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.customer-focus-item strong,
.customer-focus-item small {
    display: block;
}

.customer-focus-item small {
    color: var(--muted);
    line-height: 1.45;
}

.credential-list,
.meeting-list {
    display: grid;
    gap: .72rem;
}

.credential-card,
.meeting-card {
    position: relative;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: color-mix(in srgb, var(--surface-strong), transparent 22%);
    padding: .85rem;
}

.credential-card::before,
.meeting-card::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    background: var(--blue);
}

.credential-card[open] {
    border-color: color-mix(in srgb, var(--blue), transparent 52%);
}

.meeting-card.is-done::before {
    background: var(--green);
}

.meeting-card.is-canceled::before {
    background: var(--warn);
}

.credential-card summary {
    display: grid;
    gap: .22rem;
    cursor: pointer;
}

.credential-card summary::-webkit-details-marker {
    display: none;
}

.credential-card summary span,
.meeting-card span,
.credential-secret-grid span {
    color: var(--blue);
    font-size: .72rem;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.credential-card summary strong,
.meeting-card strong,
.credential-secret-grid strong,
.credential-secret-grid a {
    color: var(--ink);
    overflow-wrap: anywhere;
}

.credential-card summary small,
.meeting-card small {
    color: var(--muted);
}

.credential-secret-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .55rem;
    margin: .85rem 0;
}

.credential-secret-grid > div {
    display: grid;
    gap: .22rem;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--surface);
    padding: .62rem;
}

.credential-password {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

.credential-edit-form {
    margin-top: .85rem;
    grid-template-columns: repeat(4, minmax(120px, 1fr));
}

.credential-edit-form textarea,
.credential-edit-form button {
    grid-column: 1 / -1;
}

.meeting-card {
    display: grid;
    gap: .42rem;
}

.meeting-card p {
    margin: 0;
    color: var(--muted);
    line-height: 1.45;
}

.customer-quicknav,
.customer-project-nav {
    display: flex;
    flex-wrap: wrap;
    gap: .45rem;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
    padding: .65rem;
    box-shadow: var(--shadow-soft);
}

.customer-quicknav {
    position: sticky;
    top: .75rem;
    z-index: 8;
    margin-bottom: 1rem;
}

.customer-project-nav {
    margin: 1rem 0;
    box-shadow: none;
}

.customer-quicknav a,
.customer-project-nav a,
.customer-project-nav button {
    min-height: 2.35rem;
    display: inline-flex;
    align-items: center;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
    padding: .55rem .75rem;
    color: var(--muted);
    font-weight: 900;
    cursor: pointer;
    transition: border-color .18s ease, color .18s ease, background-color .18s ease;
}

.customer-quicknav a:hover,
.customer-project-nav a:hover,
.customer-project-nav button:hover,
.customer-project-nav button.is-active {
    border-color: color-mix(in srgb, var(--blue), transparent 48%);
    background: var(--surface);
    color: var(--blue);
}

.customer-project-nav button.is-active {
    box-shadow: inset 0 -2px 0 var(--blue);
}

.customer-tab-panel {
    animation: customerTabIn .16s ease-out;
}

.customer-overview-grid {
    align-items: start;
}

.customer-contact-panel {
    order: 1;
}

.customer-activity-panel {
    order: 2;
    display: grid;
    gap: .95rem;
}

.customer-activity-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: .85rem;
}

.customer-activity-head h2 {
    margin-bottom: 0;
}

.customer-timeline {
    display: grid;
    gap: .55rem;
}

.customer-timeline-item {
    position: relative;
    min-height: 5.1rem;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: .18rem .75rem;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: color-mix(in srgb, var(--surface), transparent 5%);
    padding: .72rem .8rem .72rem .95rem;
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

a.customer-timeline-item:hover {
    transform: translateY(-1px);
    border-color: color-mix(in srgb, var(--blue), transparent 52%);
    box-shadow: var(--shadow-soft);
}

.customer-timeline-item::before {
    content: "";
    position: absolute;
    inset: .78rem auto .78rem 0;
    width: 4px;
    border-radius: 0 999px 999px 0;
    background: var(--blue);
}

.customer-timeline-item.is-note::before {
    background: var(--gold);
}

.customer-timeline-item.is-signature::before {
    background: var(--green);
}

.customer-timeline-item.is-review::before {
    background: var(--blue);
}

.customer-timeline-item.is-task::before {
    background: var(--warn);
}

.customer-timeline-item span {
    color: var(--blue);
    font-size: .7rem;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.customer-timeline-item strong,
.customer-timeline-item small {
    display: block;
}

.customer-timeline-item strong,
.customer-timeline-item small {
    min-width: 0;
}

.customer-timeline-item small {
    color: var(--muted);
    line-height: 1.4;
}

.customer-timeline-item time {
    grid-row: 1 / span 3;
    grid-column: 2;
    color: var(--muted);
    font-size: .78rem;
    font-weight: 800;
    white-space: nowrap;
}

.customer-edit-panel {
    order: 3;
    grid-column: 1 / -1;
}

.customer-edit-panel summary {
    min-height: 2.7rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    cursor: pointer;
    color: var(--ink);
    font-weight: 900;
}

.customer-edit-panel summary::after {
    content: "+";
    width: 1.7rem;
    height: 1.7rem;
    display: inline-grid;
    place-items: center;
    border: 1px solid var(--line);
    border-radius: 8px;
    color: var(--blue);
}

.customer-edit-panel[open] summary {
    margin-bottom: .85rem;
    padding-bottom: .75rem;
    border-bottom: 1px solid var(--line);
}

.customer-edit-panel[open] summary::after {
    content: "-";
}

@keyframes customerTabIn {
    from {
        opacity: .78;
        transform: translateY(2px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.customer-project-panel {
    scroll-margin-top: 5.25rem;
}

.customer-section {
    scroll-margin-top: 5.25rem;
}

.project-health-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .5rem;
    margin-top: .85rem;
}

.project-health-label {
    min-height: 2.2rem;
    display: inline-flex;
    align-items: center;
    color: var(--muted);
    font-size: .72rem;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.project-health-pill {
    min-height: 2.35rem;
    gap: .38rem;
    border: 1px solid color-mix(in srgb, var(--blue), transparent 70%);
    border-radius: var(--radius);
    background: color-mix(in srgb, var(--blue), transparent 91%);
    padding: .42rem .68rem;
    color: color-mix(in srgb, var(--blue), var(--ink) 18%);
    letter-spacing: 0;
    text-transform: none;
    box-shadow: 0 8px 18px rgba(15, 23, 42, .05);
}

.project-health-pill span {
    color: inherit;
    font-size: .68rem;
    font-weight: 900;
    letter-spacing: .06em;
    line-height: 1;
    opacity: .82;
    text-transform: uppercase;
}

.project-health-pill strong {
    color: inherit;
    font-size: .82rem;
    line-height: 1;
    white-space: nowrap;
}

.project-health-pill.is-ready {
    border-color: color-mix(in srgb, var(--green), transparent 58%);
    background: color-mix(in srgb, var(--green), transparent 88%);
    color: color-mix(in srgb, var(--green), #062f20 28%);
}

.project-health-pill.is-open {
    border-color: color-mix(in srgb, var(--gold), transparent 52%);
    background: color-mix(in srgb, var(--gold), transparent 88%);
    color: color-mix(in srgb, var(--gold), #4f3510 32%);
}

.project-health-pill.is-critical {
    border-color: color-mix(in srgb, var(--warn), transparent 48%);
    background: color-mix(in srgb, var(--warn), transparent 88%);
    color: color-mix(in srgb, var(--warn), #5b160c 20%);
}

.soft {
    background: rgba(255,255,255,.72);
    box-shadow: none;
}

.chip-row {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    margin-bottom: 1rem;
}

.chip-row span {
    border-radius: var(--radius);
    background: var(--surface);
    border: 1px solid #c9e1d4;
    padding: .45rem .65rem;
    color: #164a34;
    font-weight: 800;
}

.task-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 150px;
    gap: .75rem;
    align-items: center;
}

.detail-list {
    display: grid;
    gap: .8rem;
}

.detail-list div {
    border-bottom: 1px solid var(--line);
    padding-bottom: .7rem;
}

.detail-list dd {
    margin: .2rem 0 0;
}

.task-admin-row {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1.8fr) repeat(4, minmax(120px, .7fr)) auto;
    gap: .75rem;
    align-items: start;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
    padding: .9rem;
    transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease, opacity .18s ease;
}

.task-admin-row::before {
    content: "";
    position: absolute;
    inset: .85rem auto .85rem 0;
    width: 4px;
    border-radius: 0 999px 999px 0;
    background: var(--blue);
}

.task-admin-row.priority-high::before {
    background: var(--warn);
}

.task-admin-row.priority-low::before {
    background: var(--green);
}

.task-admin-row.is-design-review::before,
.record.is-review-record::before {
    background: var(--blue);
}

.task-admin-row.is-design-review {
    border-color: color-mix(in srgb, var(--blue), transparent 72%);
}

.task-admin-row.is-handover::before {
    background: var(--green);
}

.task-admin-row.is-handover {
    border-color: color-mix(in srgb, var(--green), transparent 72%);
}

.task-admin-row.is-completion::before {
    background: var(--warn);
}

.task-admin-row.is-completion {
    border-color: color-mix(in srgb, var(--warn), transparent 70%);
}

.task-admin-row.is-done {
    opacity: .72;
}

.task-admin-row:hover {
    transform: translateY(-1px);
    border-color: color-mix(in srgb, var(--blue), transparent 56%);
    box-shadow: var(--shadow-soft);
}

.task-admin-copy strong,
.task-admin-copy small {
    display: block;
}

.task-admin-copy p {
    margin: .45rem 0 0;
    font-size: .94rem;
}

.task-heading {
    display: grid;
    gap: .2rem;
}

.crm-command-center {
    display: grid;
    grid-template-columns: minmax(260px, .9fr) minmax(170px, .42fr) minmax(340px, 1.35fr);
    gap: .85rem;
    margin-bottom: 1rem;
}

.crm-command-hero,
.crm-command-stack a,
.next-action-panel,
.search-command-panel,
.search-empty-panel,
.finance-pipeline-card,
.project-stage,
.task-kanban-column {
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
    box-shadow: var(--shadow-soft);
}

.crm-command-hero {
    display: grid;
    align-content: space-between;
    gap: .75rem;
    min-height: 15rem;
    background:
        linear-gradient(135deg, color-mix(in srgb, var(--warn), transparent 84%), transparent 62%),
        var(--surface);
    padding: 1rem;
}

.crm-command-hero span,
.crm-command-stack span,
.next-action-item span,
.finance-pipeline-card span,
.project-stage span {
    color: var(--blue);
    font-size: .72rem;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.crm-command-hero strong {
    font-size: clamp(3rem, 8vw, 5.8rem);
    line-height: .9;
    font-variant-numeric: tabular-nums;
}

.crm-command-hero p {
    max-width: 28rem;
    margin: 0;
    color: var(--muted);
}

.crm-command-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
}

.crm-command-stack {
    display: grid;
    gap: .65rem;
}

.crm-command-stack a {
    display: grid;
    gap: .22rem;
    padding: .8rem;
    transition: transform .18s ease, border-color .18s ease;
}

.crm-command-stack a:hover {
    transform: translateY(-1px);
    border-color: color-mix(in srgb, var(--blue), transparent 48%);
}

.crm-command-stack strong {
    font-size: 1.65rem;
    font-variant-numeric: tabular-nums;
}

.crm-command-stack small,
.next-action-item small,
.finance-pipeline-card small,
.project-stage small {
    color: var(--muted);
}

.next-action-panel {
    padding: .85rem;
}

.next-action-list {
    display: grid;
    gap: .48rem;
}

.next-action-item {
    display: grid;
    gap: .14rem;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: color-mix(in srgb, var(--surface-strong), transparent 10%);
    padding: .62rem .7rem;
}

.next-action-item.is-critical {
    border-color: color-mix(in srgb, var(--warn), transparent 48%);
}

.next-action-item.is-waiting {
    border-color: color-mix(in srgb, var(--gold), transparent 48%);
}

.next-action-item.is-review {
    border-color: color-mix(in srgb, var(--blue), transparent 48%);
}

.dashboard-analytics-toggle {
    margin-bottom: 1rem;
}

.dashboard-analytics-toggle > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
    padding: .75rem .85rem;
    cursor: pointer;
    box-shadow: var(--shadow-soft);
}

.dashboard-analytics-toggle > summary span {
    font-weight: 900;
}

.dashboard-analytics-toggle > summary small {
    color: var(--muted);
}

.search-command-panel {
    display: grid;
    grid-template-columns: minmax(220px, 1fr) auto;
    gap: .65rem;
    padding: .85rem;
    margin-bottom: 1rem;
}

.search-result-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}

.search-empty-panel {
    padding: 1rem;
}

.task-focus-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .75rem;
    margin-bottom: .8rem;
}

.task-focus-card {
    min-height: 6.5rem;
    display: grid;
    align-content: space-between;
    gap: .35rem;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background:
        linear-gradient(135deg, color-mix(in srgb, var(--surface), transparent 2%), color-mix(in srgb, var(--blue), transparent 94%)),
        var(--surface);
    padding: .85rem;
    box-shadow: var(--shadow-soft);
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.task-focus-card:hover {
    transform: translateY(-1px);
    border-color: color-mix(in srgb, var(--blue), transparent 50%);
}

.task-focus-card span,
.task-tab-row span,
.task-card-meta span,
.task-filter-panel summary span,
.task-create-form label span,
.task-edit-panel label span {
    font-size: .72rem;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.task-focus-card strong {
    font-size: 2rem;
    line-height: 1;
    font-variant-numeric: tabular-nums;
}

.task-focus-card small {
    color: var(--muted);
}

.task-focus-card.is-critical {
    border-color: color-mix(in srgb, var(--warn), transparent 42%);
    background:
        linear-gradient(135deg, color-mix(in srgb, var(--warn), transparent 86%), transparent 62%),
        var(--surface);
}

.task-create-panel {
    margin-bottom: 1rem;
}

.task-create-form {
    display: grid;
    grid-template-columns: minmax(240px, 1.2fr) repeat(3, minmax(140px, .7fr));
    gap: .65rem;
    align-items: end;
}

.task-create-form label {
    min-width: 0;
    display: grid;
    gap: .28rem;
}

.task-create-form label span {
    color: var(--blue);
}

.task-create-description {
    grid-column: span 3;
}

.task-create-title {
    grid-column: span 2;
}

.task-create-form textarea {
    min-height: 2.75rem;
    resize: vertical;
}

.task-create-form .button {
    min-height: 2.65rem;
}

.task-tab-row {
    display: flex;
    flex-wrap: wrap;
    gap: .45rem;
    margin-bottom: .8rem;
}

.task-tab-row a {
    min-height: 2.55rem;
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
    padding: .45rem .65rem;
}

.task-tab-row a.active {
    border-color: color-mix(in srgb, var(--blue), transparent 35%);
    background: color-mix(in srgb, var(--blue), transparent 90%);
}

.task-tab-row strong {
    min-width: 1.65rem;
    min-height: 1.65rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 7px;
    background: var(--dark);
    color: #fff;
    font-variant-numeric: tabular-nums;
}

.task-search-bar {
    display: grid;
    grid-template-columns: minmax(220px, 1fr) auto;
    gap: .65rem;
    align-items: center;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
    padding: .75rem;
    box-shadow: var(--shadow-soft);
    margin-bottom: .75rem;
}

.task-filter-panel {
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: color-mix(in srgb, var(--surface), transparent 8%);
    padding: .75rem;
    margin-bottom: 1rem;
}

.task-filter-panel summary {
    display: grid;
    gap: .18rem;
    cursor: pointer;
}

.task-filter-panel summary small {
    color: var(--muted);
}

.task-filter-panel .toolbar {
    margin: .75rem 0 0;
    box-shadow: none;
}

.task-board-list {
    display: grid;
    gap: .72rem;
}

.task-admin-row {
    grid-template-columns: auto minmax(0, 1fr) minmax(150px, .34fr) minmax(260px, auto);
    align-items: center;
}

.task-select-box {
    display: grid;
    justify-items: center;
    gap: .2rem;
    color: var(--muted);
    font-size: .68rem;
    font-weight: 800;
}

.task-select-box input {
    width: 1.05rem;
    height: 1.05rem;
    accent-color: var(--blue);
}

.task-bulk-bar {
    display: grid;
    grid-template-columns: minmax(170px, 220px) auto minmax(180px, 1fr);
    gap: .55rem;
    align-items: center;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: color-mix(in srgb, var(--surface), transparent 6%);
    padding: .65rem;
    margin-bottom: .75rem;
}

.task-view-toggle {
    justify-self: end;
    display: inline-flex;
    border: 1px solid var(--line);
    border-radius: 8px;
    overflow: hidden;
}

.task-view-toggle a {
    min-height: 2.25rem;
    display: inline-flex;
    align-items: center;
    padding: .45rem .7rem;
    font-weight: 900;
}

.task-view-toggle a.active {
    background: var(--dark);
    color: #fff;
}

.task-kanban-board {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .75rem;
}

.task-kanban-column {
    min-width: 0;
    padding: .65rem;
    transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.task-kanban-column.is-drop-target {
    border-color: color-mix(in srgb, var(--green), transparent 35%);
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--green), transparent 82%);
    transform: translateY(-1px);
}

.task-kanban-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    margin-bottom: .6rem;
    color: var(--blue);
    font-size: .78rem;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.task-board-list.is-board .task-admin-row {
    grid-template-columns: auto minmax(0, 1fr);
}

.task-board-list.is-board .task-card-state,
.task-board-list.is-board .task-board-status-actions,
.task-board-list.is-board .task-quick-actions,
.task-board-list.is-board .task-edit-panel {
    grid-column: 1 / -1;
}

.task-board-status-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .42rem;
    align-items: center;
}

.task-status-chip {
    min-height: 2.2rem;
    padding: .45rem .68rem;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--surface);
    color: var(--ink);
    font: inherit;
    font-size: .78rem;
    font-weight: 900;
    cursor: pointer;
    transition: background .16s ease, border-color .16s ease, transform .16s ease, color .16s ease;
}

.task-status-chip:hover,
.task-status-chip:focus-visible {
    border-color: color-mix(in srgb, var(--blue), transparent 45%);
    background: color-mix(in srgb, var(--blue), transparent 88%);
    transform: translateY(-1px);
    outline: none;
}

.task-status-chip.active,
.task-status-chip:disabled {
    border-color: color-mix(in srgb, var(--green), transparent 45%);
    background: color-mix(in srgb, var(--green), transparent 84%);
    color: var(--ink);
    cursor: default;
    transform: none;
}

.task-admin-row.is-moving {
    opacity: .74;
    pointer-events: none;
}

@media (max-width: 720px) {
    .task-board-status-actions {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .task-status-chip {
        min-height: 2.45rem;
        padding-inline: .45rem;
        text-align: center;
    }
}

.task-board-list.is-board .task-quick-actions {
    justify-content: flex-start;
}

.task-admin-row[draggable="true"] {
    cursor: grab;
}

.task-admin-row.is-dragging {
    cursor: grabbing;
    opacity: .58;
    transform: scale(.992);
}

.task-admin-row.is-overdue {
    border-color: color-mix(in srgb, var(--warn), transparent 38%);
}

.task-admin-row.is-today {
    border-color: color-mix(in srgb, var(--green), transparent 45%);
}

.task-card-main {
    min-width: 0;
    display: grid;
    gap: .32rem;
}

.task-card-main h3 {
    margin: 0;
    font-size: 1.02rem;
    line-height: 1.25;
    text-wrap: pretty;
}

.task-card-main small {
    color: var(--muted);
}

.task-card-main p {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    margin: .15rem 0 0;
    color: var(--text);
    font-size: .9rem;
    line-height: 1.45;
}

.task-card-meta {
    display: flex;
    flex-wrap: wrap;
    gap: .38rem;
    align-items: center;
}

.task-card-meta span,
.task-due-pill {
    border: 1px solid var(--line);
    border-radius: 7px;
    background: color-mix(in srgb, var(--surface-strong), transparent 12%);
    padding: .28rem .43rem;
    color: var(--muted);
}

.task-type-badge {
    color: var(--blue) !important;
    border-color: color-mix(in srgb, var(--blue), transparent 64%) !important;
    background: color-mix(in srgb, var(--blue), transparent 92%) !important;
}

.task-due-pill.is-overdue {
    color: #7a1e13;
    border-color: color-mix(in srgb, var(--warn), transparent 35%);
    background: color-mix(in srgb, var(--warn), transparent 86%);
}

.task-due-pill.is-today {
    color: #164a34;
    border-color: color-mix(in srgb, var(--green), transparent 40%);
    background: color-mix(in srgb, var(--green), transparent 86%);
}

.task-card-state {
    display: grid;
    gap: .24rem;
}

.task-card-state span {
    color: var(--blue);
    font-size: .75rem;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.task-card-state strong {
    overflow-wrap: anywhere;
}

.task-quick-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: .4rem;
}

.task-quick-actions form {
    margin: 0;
}

.task-edit-panel {
    grid-column: 1 / -1;
    border-top: 1px solid var(--line);
    padding-top: .7rem;
}

.task-edit-panel summary {
    width: fit-content;
    cursor: pointer;
    color: var(--blue);
    font-weight: 900;
}

.task-edit-form {
    display: grid;
    grid-template-columns: repeat(4, minmax(140px, 1fr)) auto;
    gap: .65rem;
    align-items: end;
    margin-top: .7rem;
}

.task-edit-form label {
    display: grid;
    gap: .28rem;
}

.task-edit-panel label span {
    color: var(--blue);
}

.project-stage-rail,
.finance-pipeline {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: .65rem;
    margin: 1rem 0;
}

.project-stage {
    position: relative;
    min-height: 6.5rem;
    display: grid;
    align-content: space-between;
    gap: .3rem;
    padding: .75rem;
    box-shadow: none;
}

.project-stage::before,
.finance-pipeline-card::before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: 4px;
    border-radius: var(--radius) var(--radius) 0 0;
    background: var(--line);
}

.project-stage.is-complete::before {
    background: var(--green);
}

.project-stage.is-current::before,
.project-stage.is-waiting::before {
    background: var(--blue);
}

.project-stage.is-blocked::before,
.finance-pipeline-card.is-critical::before {
    background: var(--warn);
}

.project-stage strong,
.finance-pipeline-card strong {
    font-size: 1rem;
}

.finance-pipeline {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.finance-pipeline-card {
    position: relative;
    min-height: 7.2rem;
    display: grid;
    align-content: space-between;
    gap: .35rem;
    padding: .85rem;
}

.finance-pipeline-card::before {
    background: color-mix(in srgb, var(--blue), transparent 40%);
}

.finance-pipeline-card.is-active {
    border-color: color-mix(in srgb, var(--blue), transparent 35%);
    background: color-mix(in srgb, var(--blue), transparent 92%);
}

.dashboard-work-grid,
.dashboard-payment-panel,
.dashboard-team-panel,
.dashboard-review-panel {
    margin-top: 1rem;
}

.work-center-kpis {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .75rem;
    margin: 0 0 1rem;
}

.work-center-kpis article {
    position: relative;
    min-height: 7.25rem;
    display: grid;
    align-content: space-between;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
    padding: .9rem;
    box-shadow: var(--shadow-soft);
}

.work-center-kpis article::before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: 4px;
    background: var(--blue);
}

.work-center-kpis article.is-critical::before {
    background: var(--warn);
}

.work-center-kpis span,
.work-queue-head span,
.work-action-row span {
    color: var(--blue);
    font-size: .72rem;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.work-center-kpis article.is-critical span {
    color: var(--warn);
}

.work-center-kpis strong {
    color: var(--ink);
    font-size: clamp(1.5rem, 3vw, 2.25rem);
    line-height: 1;
}

.work-center-kpis small,
.work-action-row small {
    color: var(--muted);
    line-height: 1.42;
}

.work-center-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr);
    gap: .85rem;
    align-items: start;
    margin: 0 0 1rem;
}

.work-queue-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .85rem;
}

.work-queue-card {
    display: grid;
    gap: .85rem;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
    padding: 1rem;
    box-shadow: var(--shadow-soft);
}

.work-queue-card.is-critical {
    border-color: color-mix(in srgb, var(--warn), transparent 52%);
}

.work-queue-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: .85rem;
}

.work-queue-head h2 {
    margin-bottom: 0;
}

.work-queue-head > span {
    min-width: 2.25rem;
    min-height: 2.25rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid color-mix(in srgb, var(--blue), transparent 62%);
    border-radius: 999px;
    background: color-mix(in srgb, var(--blue), transparent 91%);
    color: var(--ink);
}

.work-action-list {
    display: grid;
    gap: .58rem;
}

.work-action-row {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: .75rem;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: color-mix(in srgb, var(--surface-strong), transparent 26%);
    padding: .75rem;
}

.work-action-row::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    background: var(--blue);
}

.work-action-row.is-payment::before,
.work-action-row.is-critical::before,
.work-action-row.is-blocked::before {
    background: var(--warn);
}

.work-action-row.is-task::before,
.work-action-row.is-waiting::before {
    background: var(--gold);
}

.work-action-row.is-done::before {
    background: var(--green);
}

.work-action-row a {
    min-width: 0;
    display: grid;
    gap: .18rem;
    color: inherit;
}

.work-action-row strong {
    color: var(--ink);
    line-height: 1.22;
}

.work-action-row .workflow-actions {
    justify-content: flex-end;
}

@media (max-width: 980px) {
    .work-center-kpis {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .work-center-grid,
    .work-queue-grid {
        grid-template-columns: 1fr;
    }

    .customer-next-step {
        display: grid;
    }

    .customer-next-step-actions {
        justify-content: flex-start;
    }

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

@media (max-width: 640px) {
    .work-center-kpis {
        grid-template-columns: 1fr;
    }

    .work-action-row {
        grid-template-columns: 1fr;
    }

    .work-action-row .workflow-actions {
        justify-content: flex-start;
    }

    .credential-secret-grid,
    .credential-edit-form {
        grid-template-columns: 1fr;
    }

    .credential-checklist,
    .calendar-day {
        grid-template-columns: 1fr;
    }

    .portal-hero,
    .meeting-room-head,
    .portal-grid,
    .portal-meeting {
        grid-template-columns: 1fr;
    }

    .meeting-frame-wrap {
        min-height: 32rem;
        height: 72vh;
    }
}

.workflow-command-center {
    display: grid;
    grid-template-columns: minmax(280px, .9fr) minmax(0, 1.55fr);
    gap: .85rem;
    align-items: stretch;
    margin: 1rem 0;
}

.workflow-primary-card,
.workflow-rail,
.workflow-secondary-details {
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
    box-shadow: var(--shadow-soft);
}

.workflow-primary-card {
    position: relative;
    min-height: 14.6rem;
    display: grid;
    align-content: space-between;
    gap: .85rem;
    overflow: hidden;
    padding: 1.05rem;
}

.workflow-primary-card::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 5px;
    background: var(--blue);
}

.workflow-command-center.is-waiting .workflow-primary-card::before {
    background: var(--gold);
}

.workflow-command-center.is-critical .workflow-primary-card::before,
.workflow-command-center.is-blocked .workflow-primary-card::before {
    background: var(--warn);
}

.workflow-command-center.is-done .workflow-primary-card::before {
    background: var(--green);
}

.workflow-primary-card span {
    display: block;
    color: var(--blue);
    font-size: .72rem;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.workflow-command-center.is-waiting .workflow-primary-card span {
    color: var(--gold);
}

.workflow-command-center.is-critical .workflow-primary-card span,
.workflow-command-center.is-blocked .workflow-primary-card span {
    color: var(--warn);
}

.workflow-command-center.is-done .workflow-primary-card span {
    color: var(--green);
}

.workflow-primary-card strong {
    display: block;
    max-width: 18rem;
    color: var(--ink);
    font-size: clamp(1.25rem, 2vw, 1.75rem);
    line-height: 1.05;
}

.workflow-primary-card p {
    max-width: 36rem;
    margin: 0;
    color: var(--muted);
    line-height: 1.5;
}

.workflow-primary-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
}

.workflow-primary-actions form {
    margin: 0;
}

.workflow-primary-actions .button {
    min-height: 2.55rem;
    padding: .65rem .78rem;
}

.workflow-rail {
    min-width: 0;
    display: grid;
    grid-template-columns: repeat(10, minmax(6.25rem, 1fr));
    gap: .55rem;
    padding: .75rem;
    overflow-x: auto;
    scrollbar-width: thin;
}

.workflow-rail-step {
    position: relative;
    min-width: 0;
    min-height: 8.6rem;
    display: grid;
    grid-template-rows: auto auto 1fr;
    gap: .45rem;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: color-mix(in srgb, var(--surface-strong), transparent 8%);
    padding: .72rem;
    transition: transform .18s ease, border-color .18s ease, background-color .18s ease, box-shadow .18s ease;
}

.workflow-rail-step:hover {
    transform: translateY(-1px);
    border-color: color-mix(in srgb, var(--blue), transparent 46%);
    box-shadow: 0 10px 22px rgba(17, 24, 32, .08);
}

.workflow-rail-step::after {
    content: "";
    position: absolute;
    inset: auto .72rem .62rem;
    height: .25rem;
    border-radius: 999px;
    background: var(--line);
}

.workflow-rail-step span {
    width: 1.85rem;
    height: 1.85rem;
    display: inline-grid;
    place-items: center;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: var(--paper-strong);
    color: var(--muted);
    font-size: .78rem;
    font-weight: 900;
}

.workflow-rail-step strong {
    color: var(--ink);
    font-size: .95rem;
    line-height: 1.15;
}

.workflow-rail-step small {
    color: var(--muted);
    font-size: .74rem;
    font-weight: 900;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.workflow-rail-step.is-complete {
    border-color: color-mix(in srgb, var(--green), transparent 54%);
}

.workflow-rail-step.is-complete span,
.workflow-rail-step.is-complete::after {
    background: var(--green);
    border-color: var(--green);
    color: #fff;
}

.workflow-rail-step.is-current {
    border-color: color-mix(in srgb, var(--blue), transparent 36%);
    background:
        linear-gradient(135deg, rgba(33, 95, 189, .1), transparent 58%),
        var(--surface-strong);
}

.workflow-rail-step.is-current span,
.workflow-rail-step.is-current::after {
    background: var(--blue);
    border-color: var(--blue);
    color: #fff;
}

.workflow-rail-step.is-waiting {
    border-color: color-mix(in srgb, var(--gold), transparent 42%);
    background:
        linear-gradient(135deg, rgba(183, 134, 44, .12), transparent 58%),
        var(--surface-strong);
}

.workflow-rail-step.is-waiting span,
.workflow-rail-step.is-waiting::after {
    background: var(--gold);
    border-color: var(--gold);
    color: #fff;
}

.workflow-rail-step.is-blocked {
    border-color: color-mix(in srgb, var(--warn), transparent 38%);
    background:
        linear-gradient(135deg, rgba(179, 67, 44, .12), transparent 58%),
        var(--surface-strong);
}

.workflow-rail-step.is-blocked span,
.workflow-rail-step.is-blocked::after {
    background: var(--warn);
    border-color: var(--warn);
    color: #fff;
}

.workflow-rail-step.is-upcoming {
    opacity: .72;
}

.workflow-secondary-details {
    margin: 1rem 0;
    overflow: hidden;
}

.workflow-secondary-details summary {
    min-height: 3.35rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    padding: .78rem .95rem;
    cursor: pointer;
    list-style: none;
}

.workflow-secondary-details summary::-webkit-details-marker {
    display: none;
}

.workflow-secondary-details summary::after {
    content: "+";
    width: 1.65rem;
    height: 1.65rem;
    display: inline-grid;
    place-items: center;
    flex: 0 0 auto;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    color: var(--blue);
    font-weight: 900;
}

.workflow-secondary-details[open] summary::after {
    content: "-";
}

.workflow-secondary-details summary span {
    color: var(--ink);
    font-weight: 900;
}

.workflow-secondary-details summary small {
    color: var(--muted);
    font-weight: 700;
}

.workflow-action-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 21rem), 1fr));
    gap: .75rem;
    margin: 0;
    padding: 0 .95rem .95rem;
}

.workflow-action-head {
    grid-column: 1 / -1;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: .9rem;
    border: 1px solid color-mix(in srgb, var(--blue), transparent 76%);
    border-radius: var(--radius);
    background:
        linear-gradient(135deg, color-mix(in srgb, var(--blue), transparent 91%), transparent 58%),
        color-mix(in srgb, var(--surface), transparent 8%);
    padding: .78rem .9rem;
}

.workflow-action-head h3 {
    margin: .12rem 0 0;
}

.workflow-action-head > span {
    min-height: 2rem;
    display: inline-flex;
    align-items: center;
    border: 1px solid color-mix(in srgb, var(--blue), transparent 66%);
    border-radius: 8px;
    background: color-mix(in srgb, var(--blue), transparent 91%);
    padding: .38rem .58rem;
    color: var(--blue);
    font-size: .78rem;
    font-weight: 900;
    white-space: nowrap;
}

.dashboard-workflow {
    margin-top: 0;
}

.workflow-action-card {
    position: relative;
    min-height: 9.2rem;
    display: grid;
    align-content: space-between;
    gap: .75rem;
    overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--blue), transparent 76%);
    border-radius: var(--radius);
    background:
        linear-gradient(135deg, color-mix(in srgb, var(--blue), transparent 92%), transparent 58%),
        var(--surface);
    padding: 1rem;
    box-shadow: var(--shadow-soft);
}

.customer-project-panel .workflow-action-grid {
    margin-top: 0;
}

.customer-project-panel .workflow-action-card {
    box-shadow: none;
}

.customer-project-panel .workflow-action-card:first-child {
    border-color: color-mix(in srgb, var(--blue), transparent 50%);
}

.project-clarity-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .75rem;
    margin: 1rem 0;
}

.clarity-card {
    min-height: 8.4rem;
    display: grid;
    align-content: space-between;
    gap: .55rem;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: color-mix(in srgb, var(--surface), transparent 6%);
    padding: .85rem;
}

.clarity-card span {
    color: var(--blue);
    font-size: .72rem;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.clarity-card strong {
    font-size: 1rem;
    line-height: 1.25;
}

.clarity-card small {
    color: var(--muted);
    line-height: 1.45;
}

.clarity-card.is-action {
    border-color: color-mix(in srgb, var(--blue), transparent 55%);
}

.clarity-card.is-payment {
    border-color: color-mix(in srgb, var(--green), transparent 55%);
}

.clarity-card.is-quality {
    border-color: color-mix(in srgb, #f59e0b, transparent 55%);
}

.customer-project-panel .project-top {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(260px, 460px);
    align-items: start;
    gap: 1rem;
}

.customer-project-panel .inline-form {
    justify-self: end;
    width: min(100%, 460px);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: color-mix(in srgb, var(--surface), transparent 12%);
    padding: .75rem;
}

.customer-project-settings {
    justify-self: end;
    width: min(100%, 460px);
    border: 1px solid var(--line);
    border-radius: 8px;
    background: color-mix(in srgb, var(--surface), transparent 7%);
    padding: .72rem;
}

.customer-project-settings summary {
    min-height: 2.35rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    cursor: pointer;
    color: var(--ink);
    font-weight: 900;
}

.customer-project-settings summary::after {
    content: "+";
    width: 1.6rem;
    height: 1.6rem;
    display: inline-grid;
    place-items: center;
    border: 1px solid var(--line);
    border-radius: 8px;
    color: var(--blue);
}

.customer-project-settings[open] summary {
    margin-bottom: .72rem;
    padding-bottom: .65rem;
    border-bottom: 1px solid var(--line);
}

.customer-project-settings[open] summary::after {
    content: "-";
}

.customer-project-settings .inline-form {
    justify-self: stretch;
    width: 100%;
    max-width: none;
    border: 0;
    padding: 0;
    background: transparent;
}

.workflow-action-card::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    background: var(--blue);
}

.workflow-action-card.is-critical::before {
    background: var(--warn);
}

.workflow-action-card.is-done::before {
    background: var(--green);
}

.workflow-action-card.is-start::before {
    background: var(--green);
}

.workflow-action-card.is-material::before {
    background: var(--gold);
}

.workflow-action-card.is-offer {
    border-color: color-mix(in srgb, var(--blue), transparent 58%);
    background:
        linear-gradient(135deg, color-mix(in srgb, var(--blue), transparent 86%), transparent 56%),
        var(--surface);
}

.workflow-action-card.is-contract {
    border-color: color-mix(in srgb, var(--gold), transparent 54%);
    background:
        linear-gradient(135deg, color-mix(in srgb, var(--gold), transparent 86%), transparent 56%),
        var(--surface);
}

.workflow-action-card.is-payment,
.workflow-action-card.is-critical {
    border-color: color-mix(in srgb, var(--warn), transparent 50%);
    background:
        linear-gradient(135deg, color-mix(in srgb, var(--warn), transparent 86%), transparent 56%),
        var(--surface);
}

.workflow-action-card.is-task {
    border-color: color-mix(in srgb, var(--violet), transparent 54%);
    background:
        linear-gradient(135deg, color-mix(in srgb, var(--violet), transparent 87%), transparent 56%),
        var(--surface);
}

.workflow-action-card.is-done {
    border-color: color-mix(in srgb, var(--green), transparent 54%);
    background:
        linear-gradient(135deg, color-mix(in srgb, var(--green), transparent 87%), transparent 56%),
        var(--surface);
}

.workflow-action-card span {
    display: block;
    color: var(--blue);
    font-size: .72rem;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.workflow-action-card.is-critical span {
    color: var(--warn);
}

.workflow-action-card.is-contract span,
.workflow-action-card.is-material span {
    color: var(--gold);
}

.workflow-action-card.is-payment span {
    color: var(--warn);
}

.workflow-action-card.is-task span {
    color: var(--violet);
}

.workflow-action-card.is-done span {
    color: var(--green);
}

.workflow-action-card.is-start span {
    color: var(--green);
}

.workflow-action-card.is-material span {
    color: var(--gold);
}

.workflow-action-card strong {
    display: block;
    margin-top: .2rem;
    font-size: 1.08rem;
}

.workflow-action-card p {
    margin: .35rem 0 0;
    color: var(--muted);
    line-height: 1.45;
}

.workflow-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .45rem;
}

.workflow-actions form {
    margin: 0;
}

.workflow-actions .button {
    min-height: 2.45rem;
    padding: .6rem .72rem;
}

.contract-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .75rem;
    margin-top: 1rem;
}

.contract-actions form {
    margin: 0;
}

.contract-upload-grid,
.billing-grid,
.invoice-upload-grid {
    margin-top: 1rem;
}

.button.compact {
    min-height: 2.25rem;
    padding: .5rem .65rem;
    font-size: .84rem;
}

.billing-assistant-form {
    align-content: start;
}

.payment-helper {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: .8rem;
    align-items: center;
    border: 1px solid color-mix(in srgb, var(--green), transparent 64%);
    border-radius: var(--radius);
    background:
        linear-gradient(135deg, color-mix(in srgb, var(--green), transparent 91%), transparent 58%),
        color-mix(in srgb, var(--surface), transparent 6%);
    padding: .8rem;
}

.payment-helper span {
    display: block;
    color: var(--green);
    font-size: .72rem;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.payment-helper strong,
.payment-helper small {
    display: block;
}

.payment-helper small {
    color: var(--muted);
    line-height: 1.45;
}

.payment-helper-actions,
.payment-inline-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .45rem;
}

.payment-helper-actions {
    justify-content: flex-end;
}

.payment-inline-actions {
    margin-top: -.55rem;
}

.payment-inline-actions .button {
    flex: 0 1 auto;
}

.tax-breakdown-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .65rem;
    margin-top: 1rem;
}

.tax-breakdown-grid article {
    min-width: 0;
    border: 1px solid color-mix(in srgb, var(--blue), transparent 70%);
    border-radius: var(--radius);
    background:
        linear-gradient(135deg, color-mix(in srgb, var(--blue), transparent 92%), transparent 58%),
        color-mix(in srgb, var(--surface), transparent 8%);
    padding: .75rem;
}

.tax-breakdown-grid span {
    display: block;
    color: var(--blue);
    font-size: .7rem;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.tax-breakdown-grid strong,
.tax-breakdown-grid small {
    display: block;
}

.tax-breakdown-grid strong {
    margin-top: .22rem;
}

.tax-breakdown-grid small {
    margin-top: .2rem;
    color: var(--muted);
    line-height: 1.4;
}

.offer-action-panel {
    grid-column: 1 / -1;
}

.accepted-offers-panel,
.accepted-start-panel {
    margin-bottom: 1rem;
}

.accepted-start-panel {
    grid-column: 1 / -1;
    border-color: color-mix(in srgb, var(--green), transparent 58%);
    background:
        linear-gradient(135deg, rgba(31, 138, 91, .1), transparent 42%),
        var(--paper-strong);
}

.start-checklist {
    display: grid;
    grid-template-columns: repeat(4, minmax(150px, 1fr));
    gap: .65rem;
    margin-top: 1rem;
}

.start-checklist span {
    min-height: 4.8rem;
    display: grid;
    align-content: center;
    gap: .25rem;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
    padding: .85rem;
    color: var(--muted);
    font-weight: 800;
}

.start-checklist strong {
    color: var(--green);
}

.material-admin-panel {
    min-width: 0;
}

.material-note-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .65rem;
    margin: .75rem 0 1rem;
}

.material-note-grid article {
    min-width: 0;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
    padding: .85rem;
}

.material-note-grid span {
    display: block;
    margin-bottom: .35rem;
    color: var(--blue);
    font-size: .72rem;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.material-note-grid p {
    margin: 0;
    color: var(--muted);
}

.material-file-list .record strong {
    overflow-wrap: anywhere;
}

.workflow-action-card.is-review::before {
    background: var(--blue);
}

.design-review-record {
    gap: .55rem;
}

.review-reminder-meta {
    display: inline-flex;
    flex-wrap: wrap;
    gap: .35rem;
    color: var(--warn);
    font-weight: 800;
}

.design-review-record strong,
.design-review-record p {
    overflow-wrap: anywhere;
}

.review-feedback-history {
    display: grid;
    gap: .55rem;
    margin-top: .5rem;
}

.review-feedback-history article {
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
    padding: .75rem;
}

.review-feedback-history span {
    display: block;
    margin-bottom: .2rem;
    color: var(--blue);
    font-size: .78rem;
    font-weight: 800;
    text-transform: uppercase;
}

.review-feedback-history p {
    margin: .35rem 0;
    color: var(--muted);
}

.review-shell {
    width: min(1180px, calc(100% - 2rem));
    margin: 0 auto;
    padding: 2rem 0 4rem;
}

.review-head {
    margin-bottom: 1rem;
}

.review-grid {
    display: grid;
    grid-template-columns: minmax(260px, .72fr) minmax(0, 1.28fr);
    gap: 1rem;
    align-items: start;
}

.review-panel {
    padding: 1.15rem;
}

.review-guide {
    position: sticky;
    top: 1rem;
}

.review-guide p {
    color: var(--muted);
}

.review-note {
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
    padding: .85rem;
    margin: 1rem 0;
    color: var(--ink);
}

.review-resource-list {
    display: grid;
    gap: .75rem;
    margin: .9rem 0;
}

.review-resource-list a,
.review-resource-list div {
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
    padding: .85rem;
    color: var(--ink);
    overflow-wrap: anywhere;
}

.review-resource-list a {
    text-decoration: none;
    font-weight: 800;
}

.review-resource-list p {
    margin: .35rem 0 0;
}

.review-design-link {
    width: 100%;
    justify-content: center;
    margin: .35rem 0 .75rem;
}

.review-actions {
    display: grid;
    gap: 1rem;
    min-width: 0;
}

.review-approve {
    display: grid;
    gap: .75rem;
    border-left: 4px solid var(--green);
}

.review-feedback-list {
    display: grid;
    gap: .85rem;
}

.review-feedback-item {
    display: grid;
    gap: .75rem;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
    padding: .9rem;
}

.review-feedback-head,
.review-form-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
}

.review-feedback-head strong {
    font-size: .95rem;
}

.button.ghost {
    background: transparent !important;
    color: var(--muted) !important;
    box-shadow: none !important;
}

.button.ghost:disabled {
    opacity: .45;
    cursor: not-allowed;
}

.inline-check {
    display: flex !important;
    align-items: center;
    gap: .58rem;
    min-height: 2.65rem;
    padding: .72rem .8rem;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--surface);
    color: var(--ink);
    font-weight: 800;
}

.inline-check input {
    width: 1.05rem;
    height: 1.05rem;
    accent-color: var(--blue);
}

.credential-checklist {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .55rem;
    margin: .85rem 0 1rem;
}

.credential-checklist-item {
    display: grid;
    gap: .2rem;
    min-height: 4.1rem;
    padding: .72rem;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--surface);
}

.credential-checklist-item span,
.meeting-reminder-row span,
.calendar-item span,
.calendar-day header span {
    color: var(--muted);
    font-size: .72rem;
    font-weight: 900;
    text-transform: uppercase;
}

.credential-checklist-item strong {
    color: var(--warn);
    font-size: .9rem;
}

.credential-checklist-item.is-ready strong {
    color: var(--green);
}

.credential-checklist-item.is-check strong {
    color: var(--blue);
}

.meeting-reminder-row {
    display: flex;
    gap: .4rem;
    flex-wrap: wrap;
}

.meeting-reminder-row span {
    min-height: 1.75rem;
    display: inline-flex;
    align-items: center;
    padding: .22rem .5rem;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: var(--surface);
}

.meeting-reminder-row span.is-sent {
    border-color: color-mix(in srgb, var(--green), transparent 55%);
    color: var(--green);
}

.calendar-hero {
    align-items: end;
}

.calendar-filter-nav {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    margin: 1rem 0;
}

.calendar-filter-nav a {
    min-height: 2.35rem;
    display: inline-flex;
    align-items: center;
    padding: .5rem .75rem;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--surface);
    color: var(--muted);
    font-weight: 900;
    text-decoration: none;
}

.calendar-filter-nav a.is-active,
.calendar-filter-nav a:hover {
    border-color: color-mix(in srgb, var(--blue), transparent 45%);
    color: var(--blue);
    background: var(--surface-strong);
}

.calendar-timeline {
    display: grid;
    gap: .9rem;
}

.calendar-day {
    display: grid;
    grid-template-columns: minmax(9rem, .24fr) 1fr;
    gap: .85rem;
    padding: .85rem;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--paper-strong);
}

.calendar-day header {
    display: grid;
    align-content: start;
    gap: .25rem;
    padding: .7rem;
    border-radius: 8px;
    background: var(--surface);
}

.calendar-day header strong {
    color: var(--ink);
    font-size: 1.05rem;
}

.calendar-day header small {
    color: var(--muted);
}

.calendar-day-list {
    display: grid;
    gap: .55rem;
}

.calendar-item {
    display: grid;
    gap: .2rem;
    min-height: 4.4rem;
    padding: .72rem .8rem;
    border: 1px solid var(--line);
    border-left: 4px solid var(--blue);
    border-radius: 8px;
    background: var(--surface);
    text-decoration: none;
}

.calendar-item.is-payment {
    border-left-color: var(--warn);
}

.calendar-item.is-task {
    border-left-color: var(--green);
}

.calendar-item strong {
    color: var(--ink);
}

.calendar-item small {
    color: var(--muted);
}

.portal-shell,
.meeting-room-shell {
    width: min(1180px, calc(100% - 2rem));
    margin: 0 auto;
    padding: 2rem 0 3rem;
}

.portal-hero,
.meeting-room-head {
    display: grid;
    grid-template-columns: 1fr minmax(16rem, .32fr);
    gap: 1rem;
    align-items: end;
    margin-bottom: 1rem;
}

.portal-hero h1,
.meeting-room-head h1 {
    margin: .2rem 0;
    color: var(--ink);
    font-size: clamp(2rem, 5vw, 4.8rem);
    line-height: .95;
}

.portal-hero-card,
.portal-panel,
.meeting-room-empty {
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--paper-strong);
    box-shadow: var(--shadow-soft);
}

.portal-hero-card {
    display: grid;
    gap: .2rem;
    min-height: 9rem;
    padding: 1rem;
    align-content: end;
}

.portal-hero-card span,
.portal-section-head .eyebrow,
.portal-action span,
.portal-meeting span,
.portal-payment span {
    color: var(--blue);
    font-size: .72rem;
    font-weight: 900;
    text-transform: uppercase;
}

.portal-hero-card strong {
    color: var(--ink);
    font-size: 1.25rem;
}

.portal-hero-card small,
.portal-action small,
.portal-meeting small,
.portal-payment small,
.portal-contact-list small {
    color: var(--muted);
}

.portal-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(18rem, .36fr);
    gap: 1rem;
    align-items: start;
}

.portal-main,
.portal-side {
    display: grid;
    gap: 1rem;
}

.portal-panel {
    padding: 1rem;
}

.portal-section-head {
    display: grid;
    gap: .16rem;
    margin-bottom: .8rem;
}

.portal-section-head h2 {
    margin: 0;
    color: var(--ink);
}

.portal-action-list,
.portal-meeting-list,
.portal-payment-list,
.portal-contact-list {
    display: grid;
    gap: .6rem;
}

.portal-action,
.portal-meeting,
.portal-payment {
    position: relative;
    display: grid;
    gap: .25rem;
    min-height: 4.7rem;
    padding: .8rem;
    border: 1px solid var(--line);
    border-left: 4px solid var(--blue);
    border-radius: 8px;
    background: var(--surface);
    color: inherit;
    text-decoration: none;
}

.portal-action.is-done,
.portal-payment.is-done {
    border-left-color: var(--green);
}

.portal-payment.is-open {
    border-left-color: var(--warn);
}

.portal-action strong,
.portal-meeting strong,
.portal-payment strong,
.portal-contact-list a {
    color: var(--ink);
}

.portal-meeting {
    grid-template-columns: 1fr auto;
    align-items: center;
}

.portal-support-thread {
    display: grid;
    gap: .65rem;
    margin-top: .85rem;
    padding-top: .85rem;
    border-top: 1px solid color-mix(in srgb, var(--line), transparent 12%);
}

.portal-support-entry {
    display: grid;
    gap: .3rem;
    padding: .75rem;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: color-mix(in srgb, var(--surface-strong), transparent 8%);
}

.portal-support-entry.is-customer {
    border-color: color-mix(in srgb, var(--blue), transparent 58%);
    background: color-mix(in srgb, var(--blue), transparent 94%);
}

.portal-support-entry.is-team {
    border-color: color-mix(in srgb, var(--green), transparent 56%);
    background: color-mix(in srgb, var(--green), transparent 93%);
}

.portal-support-entry.is-system {
    border-style: dashed;
}

.portal-support-entry-head {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: space-between;
    gap: .5rem;
}

.portal-support-entry-head strong {
    color: var(--ink);
    font-size: .95rem;
}

.portal-support-entry-head time,
.portal-support-entry-meta {
    color: var(--muted);
    font-size: .8rem;
}

.portal-support-entry-meta {
    font-weight: 800;
}

.portal-support-entry p {
    margin: 0;
    white-space: pre-line;
    line-height: 1.55;
}

.meeting-frame-wrap {
    overflow: hidden;
    height: min(76vh, 760px);
    min-height: 36rem;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #05070a;
    box-shadow: var(--shadow-soft);
}

.meeting-frame-wrap iframe {
    width: 100%;
    height: 100%;
    display: block;
    border: 0;
    background: #05070a;
}

.meeting-room-empty {
    display: grid;
    gap: .75rem;
    padding: 1.25rem;
}

.portal-admin-link {
    display: grid;
    gap: .22rem;
    min-width: 0;
    margin-bottom: .6rem;
    padding: .65rem;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--surface);
}

.portal-admin-link span {
    color: var(--muted);
    font-size: .72rem;
    font-weight: 900;
    text-transform: uppercase;
}

.portal-admin-link a {
    overflow-wrap: anywhere;
}

.review-state-panel {
    max-width: 760px;
}

.material-shell {
    width: min(1180px, calc(100% - 2rem));
    margin: 0 auto;
    padding: 2rem 0 4rem;
}

.material-head {
    margin-bottom: 1rem;
}

.material-grid {
    display: grid;
    grid-template-columns: minmax(260px, .72fr) minmax(0, 1.28fr);
    gap: 1rem;
    align-items: start;
}

.material-panel {
    padding: 1.15rem;
}

.material-guide {
    position: sticky;
    top: 1rem;
}

.material-need-list,
.material-check-grid {
    display: grid;
    gap: .65rem;
}

.material-need-list {
    margin: 1rem 0;
}

.material-need-list span {
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
    padding: .8rem;
    color: var(--ink);
    font-weight: 800;
}

.material-check-grid {
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
    padding: .85rem;
}

.material-check-grid legend {
    padding: 0 .3rem;
    color: var(--blue);
    font-size: .78rem;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.finance-panel {
    overflow-x: auto;
    margin-bottom: 1rem;
}

.automation-import-panel {
    margin-bottom: 1rem;
}

.automation-import-panel summary {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: .2rem;
    cursor: pointer;
}

.automation-import-panel summary span {
    font-weight: 900;
}

.automation-import-panel summary small {
    color: var(--muted);
}

.automation-import-panel .mini-form {
    grid-template-columns: minmax(220px, 1fr) auto;
    align-items: end;
    margin-top: .85rem;
}

.finance-metrics {
    margin-bottom: .75rem;
}

.finance-tabs {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .65rem;
    margin-bottom: 1rem;
}

.finance-tab {
    min-height: 4.1rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
    padding: .8rem .9rem;
    transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.finance-tab:hover {
    transform: translateY(-1px);
    border-color: color-mix(in srgb, var(--blue), transparent 45%);
    box-shadow: 0 10px 24px rgba(19, 30, 44, .1);
}

.finance-tab.active {
    border-color: var(--blue);
    background: linear-gradient(135deg, color-mix(in srgb, var(--blue), transparent 90%), #fff);
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--blue), transparent 68%);
}

.finance-tab span {
    font-weight: 900;
}

.finance-tab strong {
    min-width: 2.1rem;
    min-height: 2.1rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius);
    background: var(--dark);
    color: #fff;
    padding: .25rem .45rem;
}

.finance-workbench {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: flex-start;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
    padding: 1.05rem;
    margin-bottom: 1rem;
}

.finance-workbench h2 {
    margin-bottom: .45rem;
}

.finance-summary-strip {
    min-width: min(100%, 300px);
    display: grid;
    gap: .45rem;
}

.finance-summary-strip span {
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
    padding: .55rem .65rem;
    color: var(--muted);
    font-weight: 900;
}

.finance-list {
    display: grid;
    gap: .75rem;
}

.finance-row {
    display: grid;
    grid-template-columns: minmax(220px, 1.25fr) minmax(150px, .65fr) minmax(150px, .65fr) minmax(110px, .45fr) minmax(330px, 1.1fr);
    gap: .75rem;
    align-items: center;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
    padding: .95rem;
    transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.finance-row:hover {
    transform: translateY(-1px);
    border-color: color-mix(in srgb, var(--green), transparent 55%);
    box-shadow: var(--shadow-soft);
}

.finance-main strong,
.finance-row strong,
.finance-row small {
    display: block;
}

.finance-kicker {
    display: block;
    margin-bottom: .18rem;
    color: var(--blue);
    font-size: .74rem;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.finance-row small {
    color: var(--muted);
    line-height: 1.45;
}

.status-pill {
    display: inline-flex;
    align-items: center;
    min-height: 2.35rem;
    border: 1px solid #cdd8e5;
    border-radius: var(--radius);
    background: var(--surface);
    color: #26384f;
    padding: .5rem .7rem;
    font-weight: 900;
}

.status-pill.is-overdue {
    border-color: #edc1b5;
    background: var(--surface);
    color: var(--warn);
}

.status-pill.is-paid {
    border-color: #b9dac9;
    background: var(--surface);
    color: #164a34;
}

.finance-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: .45rem;
}

.finance-actions form {
    margin: 0;
}

.finance-actions .button {
    min-height: 2.45rem;
    padding: .62rem .78rem;
}

.finance-actions .button:not(.primary):not(.success),
.workflow-actions .button:not(.primary),
.contract-actions .button:not(.primary) {
    background: color-mix(in srgb, var(--surface-strong), transparent 24%) !important;
    color: var(--muted) !important;
    box-shadow: none !important;
}

.finance-actions .button.success {
    background: color-mix(in srgb, var(--green), transparent 86%) !important;
    border: 1px solid color-mix(in srgb, var(--green), transparent 54%) !important;
    color: var(--green) !important;
    box-shadow: none !important;
}

.finance-actions .button.primary,
.workflow-actions .button.primary,
.contract-actions .button.primary {
    box-shadow: 0 10px 24px color-mix(in srgb, var(--blue), transparent 78%) !important;
}

.finance-setup-grid {
    margin-bottom: 1rem;
}

.legal-admin-grid .panel,
.finance-setup-grid .panel {
    min-width: 0;
}

.legal-editor .panel-head,
.finance-setup-grid .panel-head {
    margin-bottom: .75rem;
}

.recurring-row {
    border-left: 4px solid var(--green);
}

.annex-copy {
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid var(--line);
}

@media (max-width: 1180px) {
    .admin-page {
        grid-template-columns: 232px minmax(0, 1fr);
    }

    .admin-sidebar {
        padding: .95rem;
    }

    .brand-admin img {
        width: 8.7rem;
    }

    .admin-main {
        padding: 1rem;
    }

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

    .finance-row {
        grid-template-columns: minmax(220px, 1.2fr) minmax(140px, .75fr) minmax(140px, .75fr);
    }

    .finance-row > div:nth-child(4),
    .finance-actions {
        grid-column: 1 / -1;
    }

    .finance-actions {
        justify-content: flex-start;
    }

    .workflow-command-center {
        grid-template-columns: 1fr;
    }

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

    .project-clarity-grid {
        grid-template-columns: 1fr;
    }

    .task-focus-strip {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .task-create-form {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .task-create-title,
    .task-create-description {
        grid-column: 1 / -1;
    }

    .task-admin-row {
        grid-template-columns: minmax(0, 1fr);
    }

    .crm-command-center,
    .search-result-grid,
    .finance-pipeline,
    .task-kanban-board {
        grid-template-columns: 1fr;
    }

    .task-card-state,
    .task-quick-actions {
        justify-content: flex-start;
    }

    .task-edit-form {
        grid-template-columns: repeat(2, minmax(140px, 1fr));
    }
}

@media (max-width: 900px) {
    :root {
        --admin-mobile-menu-width: min(84vw, 22rem);
        --admin-mobile-toggle-size: 3rem;
    }

    h1 {
        font-size: 2.25rem;
    }

    .intake-hero,
    .form-section,
    .login-shell,
    .signing-grid,
    .admin-page,
    .admin-grid-two,
    .project-grid,
    .metric-row,
    .finance-tabs {
        grid-template-columns: 1fr;
    }

    body.admin-page {
        display: block;
        min-height: 100vh;
        overflow-x: hidden;
    }

    body.admin-menu-open {
        overflow: hidden;
    }

    .admin-mobile-bar {
        position: fixed;
        top: .72rem;
        left: .72rem;
        right: .72rem;
        z-index: 70;
        min-height: 3.35rem;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: .75rem;
        border: 1px solid rgba(217, 224, 231, .92);
        border-radius: var(--radius);
        background: rgba(255, 255, 255, .9);
        padding: .36rem .42rem .36rem .38rem;
        box-shadow: 0 18px 38px rgba(17, 24, 32, .14);
        backdrop-filter: blur(18px);
        transition: background-color .2s ease, border-color .2s ease, box-shadow .2s ease, backdrop-filter .2s ease, transform .26s cubic-bezier(.2, .8, .2, 1), width .2s ease;
    }

    body.admin-menu-open .admin-mobile-bar {
        opacity: 0;
        pointer-events: none;
        transform: translateX(1.2rem);
    }

    .admin-menu-toggle {
        min-width: 7.3rem;
        min-height: 2.6rem;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: .55rem;
        border: 1px solid rgba(17, 24, 32, .1);
        border-radius: var(--radius);
        background: #111820;
        color: #fff;
        padding: .48rem .72rem .48rem .55rem;
        box-shadow: 0 10px 22px rgba(17, 24, 32, .22);
        cursor: pointer;
        transition: width .2s ease, min-width .2s ease, padding .2s ease, gap .2s ease, transform .2s ease, background-color .2s ease, box-shadow .2s ease;
    }

    body.admin-menu-open .admin-menu-toggle {
        width: var(--admin-mobile-toggle-size);
        min-width: var(--admin-mobile-toggle-size);
        min-height: var(--admin-mobile-toggle-size);
        gap: 0;
        padding: 0;
        border-color: rgba(255,255,255,.16);
    }

    .admin-menu-toggle:hover {
        transform: translateY(-1px);
        background: #172332;
        box-shadow: 0 20px 42px rgba(17, 24, 32, .28);
    }

    .admin-menu-icon {
        position: relative;
        width: 1.45rem;
        height: 1.45rem;
        display: inline-grid;
        place-items: center;
        border-radius: 6px;
        background: rgba(255, 255, 255, .1);
    }

    .admin-menu-icon span {
        position: absolute;
        width: .95rem;
        height: 2px;
        border-radius: 999px;
        background: var(--surface);
        transition: transform .24s cubic-bezier(.2, .8, .2, 1), width .2s ease;
    }

    .admin-menu-icon span:nth-child(1) {
        transform: translateY(-.22rem);
    }

    .admin-menu-icon span:nth-child(2) {
        width: .68rem;
        transform: translate(.14rem, .22rem);
    }

    body.admin-menu-open .admin-menu-icon span:nth-child(1) {
        width: .95rem;
        transform: rotate(45deg);
    }

    body.admin-menu-open .admin-menu-icon span:nth-child(2) {
        width: .95rem;
        transform: rotate(-45deg);
    }

    .admin-menu-label {
        max-width: 5rem;
        overflow: hidden;
        color: #fff;
        font-weight: 900;
        letter-spacing: 0;
        white-space: nowrap;
        transition: max-width .18s ease, opacity .16s ease, transform .18s ease;
    }

    body.admin-menu-open .admin-menu-label {
        max-width: 0;
        opacity: 0;
        transform: translateX(.35rem);
    }

    .admin-mobile-title {
        min-width: 0;
        overflow: hidden;
        color: var(--ink);
        font-weight: 900;
        text-align: right;
        text-overflow: ellipsis;
        white-space: nowrap;
        transition: opacity .18s ease, transform .2s ease, max-width .2s ease;
    }

    body.admin-menu-open .admin-mobile-title {
        max-width: 0;
        opacity: 0;
        transform: translateX(1rem);
    }

    .admin-menu-overlay {
        position: fixed;
        inset: 0;
        z-index: 50;
        display: block;
        background: rgba(17, 24, 32, .46);
        opacity: 0;
        pointer-events: none;
        backdrop-filter: blur(3px);
        transition: opacity .26s ease;
    }

    body.admin-menu-open .admin-menu-overlay {
        opacity: 1;
        pointer-events: auto;
    }

    .admin-sidebar {
        position: fixed;
        top: 0;
        bottom: 0;
        left: 0;
        z-index: 80;
        width: var(--admin-mobile-menu-width);
        min-height: 100dvh;
        grid-template-rows: auto auto 1fr auto;
        gap: .9rem;
        overflow-y: auto;
        padding: 1rem;
        border-right: 1px solid rgba(255, 255, 255, .12);
        border-radius: 0 var(--radius) var(--radius) 0;
        transform: translateX(calc(-100% - 1rem));
        transition: transform .3s cubic-bezier(.2, .8, .2, 1);
        box-shadow: 22px 0 58px rgba(17, 24, 32, .3);
    }

    body.admin-menu-open .admin-sidebar {
        transform: translateX(0);
    }

    .admin-sidebar-head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: .75rem;
    }

    .brand-admin {
        width: fit-content;
        margin-left: 0;
    }

    .brand-admin img {
        width: 8rem;
        padding: .34rem .45rem;
    }

    .admin-sidebar-label {
        display: block;
        margin-top: .2rem;
    }

    .admin-sidebar nav {
        display: grid;
        gap: .5rem;
        overflow: visible;
        margin: 0;
        padding: 0;
        scroll-snap-type: none;
    }

    .admin-sidebar nav a {
        min-height: 2.8rem;
        display: flex;
        align-items: center;
        justify-content: space-between;
        white-space: normal;
        scroll-snap-align: none;
        background: rgba(255,255,255,.06);
        padding: .78rem .86rem;
        transition: transform .18s ease, border-color .18s ease, background-color .18s ease;
    }

    .admin-sidebar nav a::after {
        content: "";
        width: .42rem;
        height: .42rem;
        border-top: 2px solid currentColor;
        border-right: 2px solid currentColor;
        opacity: .55;
        transform: rotate(45deg);
    }

    .admin-sidebar nav a:hover,
    .admin-sidebar nav a.active {
        transform: translateX(2px);
    }

    .admin-menu-close {
        min-height: 2.6rem;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: .48rem;
        border: 1px solid rgba(255,255,255,.14);
        border-radius: var(--radius);
        background: rgba(255,255,255,.08);
        color: #fff;
        padding: .44rem .62rem .44rem .48rem;
        font-weight: 900;
        cursor: pointer;
        transition: background-color .18s ease, border-color .18s ease, transform .18s ease;
    }

    .admin-menu-close:hover {
        border-color: rgba(255,255,255,.24);
        background: rgba(255,255,255,.12);
        transform: translateY(-1px);
    }

    .admin-menu-close .admin-menu-icon {
        width: 1.35rem;
        height: 1.35rem;
    }

    .admin-menu-close .admin-menu-icon span:nth-child(1) {
        width: .9rem;
        transform: rotate(45deg);
    }

    .admin-menu-close .admin-menu-icon span:nth-child(2) {
        width: .9rem;
        transform: rotate(-45deg);
    }

    .admin-sidebar-footer {
        display: grid;
    }

    .customer-quicknav {
        position: static;
    }

    .admin-main {
        padding: 4.85rem .9rem .9rem;
    }

    .admin-topbar,
    .split-heading,
    .panel-head,
    .project-top {
        display: grid;
    }

    .field-grid,
    .service-grid,
    .choice-grid,
    .toolbar,
    .toolbar-wide,
    .toolbar-finance,
    .inline-form,
    .table-row,
    .customer-table-row,
    .task-admin-row,
    .task-row,
    .finance-row {
        grid-template-columns: 1fr;
    }

    .finance-actions {
        justify-content: flex-start;
    }

    .automation-import-panel .mini-form {
        grid-template-columns: 1fr;
    }

    .task-focus-strip,
    .task-search-bar,
    .task-create-form,
    .task-edit-form,
    .search-command-panel,
    .admin-global-search,
    .task-bulk-bar {
        grid-template-columns: 1fr;
    }

    .task-create-title,
    .task-create-description {
        grid-column: auto;
    }

    .admin-global-search {
        max-width: none;
        width: 100%;
    }

    .task-view-toggle {
        justify-self: stretch;
        width: 100%;
    }

    .task-view-toggle a {
        flex: 1;
        justify-content: center;
    }

    .task-tab-row {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .task-tab-row a {
        justify-content: space-between;
    }

    .task-quick-actions {
        justify-content: flex-start;
    }

    .task-quick-actions .button {
        min-height: 2.55rem;
    }

    .finance-workbench {
        display: grid;
    }

    .tax-breakdown-grid {
        grid-template-columns: 1fr;
    }

    .toolbar {
        position: relative;
    }

    .table-head {
        display: none;
    }

    .customer-summary-row {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .customer-focus-head {
        display: grid;
    }

    .customer-quicknav,
    .customer-project-nav {
        flex-wrap: nowrap;
        overflow-x: auto;
        scrollbar-width: none;
    }

    .customer-quicknav::-webkit-scrollbar,
    .customer-project-nav::-webkit-scrollbar {
        display: none;
    }

    .customer-quicknav a,
    .customer-project-nav button {
        white-space: nowrap;
    }

    .workflow-primary-card {
        min-height: auto;
    }

    .workflow-rail {
        grid-template-columns: repeat(10, minmax(7rem, 1fr));
    }

    .workflow-action-grid {
        grid-template-columns: 1fr;
    }

    .review-grid,
    .material-grid {
        grid-template-columns: 1fr;
    }

    .review-guide,
    .material-guide {
        position: static;
    }

    .workflow-actions .button,
    .workflow-actions form,
    .workflow-primary-actions .button,
    .workflow-primary-actions form,
    .contract-actions .button,
    .contract-actions form,
    .payment-inline-actions .button,
    .finance-actions .button,
    .finance-actions form {
        flex: 1 1 13rem;
    }

    .payment-helper {
        grid-template-columns: 1fr;
    }

    .payment-helper-actions {
        justify-content: stretch;
    }

    .payment-helper-actions .button {
        flex: 1 1 5.5rem;
    }
}

@media (max-width: 640px) {
    :root {
        --admin-mobile-menu-width: min(88vw, 21rem);
        --admin-mobile-toggle-size: 2.85rem;
    }

    body.public-page {
        background:
            linear-gradient(130deg, rgba(33, 95, 189, .12), transparent 38%),
            repeating-linear-gradient(135deg, rgba(16, 23, 34, .04) 0 1px, transparent 1px 20px),
            linear-gradient(180deg, var(--paper-strong), var(--paper));
    }

    .public-header,
    .intake-hero,
    .intake-form,
    .thanks-shell,
    .login-shell {
        width: min(100% - 1.5rem, 1180px);
    }

    .public-header {
        padding: .8rem 0;
    }

    .brand {
        gap: .45rem;
        font-size: .95rem;
    }

    .brand img {
        width: 8.2rem;
        max-height: 2.1rem;
    }

    .theme-toggle {
        min-height: 2.35rem;
        padding: .55rem .75rem;
        font-size: .9rem;
    }

    body.admin-page {
        background:
            linear-gradient(180deg, #f8fafc, #eef3f7);
    }

    .admin-sidebar {
        padding: .9rem;
    }

    .admin-mobile-bar {
        top: .55rem;
        left: .55rem;
        right: .55rem;
    }

    .admin-menu-toggle {
        min-width: 6.35rem;
        padding-inline: .5rem .62rem;
    }

    .admin-mobile-title {
        font-size: .94rem;
    }

    .brand-admin img {
        width: 7.25rem;
    }

    .brand-admin {
        margin-left: 0;
    }

    .admin-sidebar nav {
        margin: 0;
        padding-inline: 0;
    }

    .admin-sidebar nav a {
        min-width: 0;
        justify-content: flex-start;
        text-align: left;
    }

    .admin-main {
        padding: 4.55rem .72rem .72rem;
    }

    .admin-topbar {
        min-height: auto;
        gap: .65rem;
        padding: .72rem;
    }

    .admin-topbar .button {
        width: 100%;
    }

    .page-heading,
    .panel,
    .project-panel {
        padding: .92rem;
    }

    .page-heading {
        margin-bottom: .85rem;
    }

    .metric-row {
        gap: .65rem;
    }

    .metric-row strong {
        font-size: 1.8rem;
    }

    .toolbar,
    .customer-quicknav,
    .customer-project-nav,
    .finance-workbench {
        padding: .6rem;
    }

    .customer-summary-row {
        grid-template-columns: 1fr;
    }

    .customer-focus-panel {
        padding: .85rem;
    }

    .customer-focus-list {
        grid-template-columns: 1fr;
    }

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

    .workflow-action-card {
        min-height: auto;
        padding: .92rem;
    }

    .workflow-actions,
    .workflow-primary-actions,
    .contract-actions,
    .finance-actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    .workflow-actions .button,
    .workflow-actions form,
    .workflow-primary-actions .button,
    .workflow-primary-actions form,
    .contract-actions .button,
    .contract-actions form,
    .finance-actions .button,
    .finance-actions form {
        width: 100%;
    }

    .start-checklist {
        grid-template-columns: 1fr;
    }

    .material-note-grid {
        grid-template-columns: 1fr;
    }

    .status-pill {
        width: fit-content;
        max-width: 100%;
    }

    .task-admin-row,
    .finance-row,
    .table-row,
    .record {
        padding: .82rem;
    }

    .legal-content-input {
        min-height: 420px;
    }

    .intake-hero {
        gap: 1rem;
        padding: 1.45rem 0 1rem;
    }

    h1 {
        max-width: 10.5em;
        font-size: 1.95rem;
        line-height: 1.08;
    }

    h2 {
        font-size: 1.6rem;
    }

    .lead {
        font-size: 1rem;
        line-height: 1.55;
    }

    .signal-panel {
        display: none;
    }

    .progress-shell {
        position: sticky;
        top: .55rem;
        z-index: 5;
        padding: .8rem;
        margin-bottom: .65rem;
        backdrop-filter: blur(14px);
    }

    .progress-copy {
        align-items: flex-start;
    }

    .progress-copy strong {
        text-align: right;
    }

    .step-nav {
        display: flex;
        gap: .55rem;
        overflow-x: auto;
        margin: 0 -.75rem .85rem;
        padding: .55rem .75rem;
        scroll-snap-type: x proximity;
        scrollbar-width: none;
    }

    .step-nav::-webkit-scrollbar {
        display: none;
    }

    .step-nav button {
        min-width: 7.5rem;
        min-height: 2.65rem;
        scroll-snap-align: start;
        white-space: nowrap;
    }

    .form-section {
        gap: 1rem;
        padding: 1rem;
    }

    .form-section > div:first-child {
        display: grid;
        gap: .35rem;
    }

    .form-section > div:first-child p:last-child {
        margin-bottom: 0;
        color: var(--muted);
    }

    input,
    select,
    textarea {
        min-height: 3rem;
        padding: .82rem .85rem;
        font-size: 1rem;
    }

    .choice,
    .service-option {
        min-height: 3.2rem;
        padding: .78rem;
    }

    .service-option.compact {
        min-height: 5.4rem;
    }

    .checkline {
        padding: .75rem;
        border: 1px solid var(--line);
        border-radius: var(--radius);
        background: var(--surface-strong);
    }

    .step-actions {
        margin: 0 -.75rem;
        padding: .85rem .75rem calc(.85rem + env(safe-area-inset-bottom));
        background: linear-gradient(180deg, transparent, var(--paper) 26%);
    }

    .step-actions .button {
        flex: 1;
        min-height: 3rem;
    }

    .step-actions .button[hidden] {
        display: none !important;
    }
}

@media (max-width: 900px) {
    :root {
        --mobile-drawer-width: min(86vw, 22rem);
    }

    .admin-mobile-bar,
    .admin-menu-toggle,
    .admin-menu-close {
        display: none !important;
    }

    .admin-mobile-shell {
        position: fixed;
        top: .78rem;
        left: .78rem;
        right: .78rem;
        z-index: 90;
        min-height: 3.35rem;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: .75rem;
        border: 1px solid rgba(217, 224, 231, .88);
        border-radius: var(--radius);
        background: rgba(255, 255, 255, .9);
        padding: .38rem .46rem;
        box-shadow: 0 18px 38px rgba(17, 24, 32, .14);
        backdrop-filter: blur(18px);
        transition: opacity .2s ease, transform .24s cubic-bezier(.2, .8, .2, 1);
    }

    body.admin-menu-open .admin-mobile-shell {
        opacity: 0;
        pointer-events: none;
        transform: translateY(-.8rem) scale(.98);
    }

    .mobile-menu-button {
        min-height: 2.58rem;
        display: inline-flex;
        align-items: center;
        gap: .58rem;
        border: 1px solid rgba(17, 24, 32, .08);
        border-radius: var(--radius);
        background: #111820;
        color: #fff;
        padding: .48rem .78rem .48rem .58rem;
        box-shadow: 0 10px 22px rgba(17, 24, 32, .22);
        cursor: pointer;
        font-weight: 900;
        transition: transform .18s ease, box-shadow .18s ease, background-color .18s ease;
    }

    .mobile-menu-button:hover {
        transform: translateY(-1px);
        background: #172332;
        box-shadow: 0 14px 30px rgba(17, 24, 32, .25);
    }

    .mobile-menu-button-icon,
    .mobile-menu-close-icon {
        position: relative;
        width: 1.45rem;
        height: 1.45rem;
        display: inline-grid;
        place-items: center;
        border-radius: 6px;
        background: rgba(255, 255, 255, .1);
    }

    .mobile-menu-button-icon span,
    .mobile-menu-close-icon span {
        position: absolute;
        width: .98rem;
        height: 2px;
        border-radius: 999px;
        background: currentColor;
        transition: transform .24s cubic-bezier(.2, .8, .2, 1), width .18s ease, opacity .16s ease;
    }

    .mobile-menu-button-icon span:nth-child(1) {
        transform: translateY(-.34rem);
    }

    .mobile-menu-button-icon span:nth-child(2) {
        width: .78rem;
    }

    .mobile-menu-button-icon span:nth-child(3) {
        width: .56rem;
        transform: translate(.21rem, .34rem);
    }

    .admin-mobile-shell-title {
        min-width: 0;
        overflow: hidden;
        color: var(--ink);
        font-weight: 900;
        text-align: right;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .admin-menu-overlay {
        position: fixed;
        inset: 0;
        z-index: 70;
        display: block;
        background: rgba(17, 24, 32, .5);
        opacity: 0;
        pointer-events: none;
        backdrop-filter: blur(4px);
        transition: opacity .26s ease;
    }

    body.admin-menu-open .admin-menu-overlay {
        opacity: 1;
        pointer-events: auto;
    }

    .admin-sidebar {
        position: fixed;
        top: 0;
        bottom: 0;
        left: 0;
        z-index: 80;
        width: var(--mobile-drawer-width);
        min-height: 100dvh;
        display: grid;
        grid-template-rows: auto auto 1fr auto;
        gap: .95rem;
        overflow-y: auto;
        padding: 1rem;
        border-right: 1px solid rgba(255, 255, 255, .12);
        border-radius: 0 var(--radius) var(--radius) 0;
        background:
            linear-gradient(180deg, #0f1720, #141f29 70%, #101820);
        box-shadow: 22px 0 58px rgba(17, 24, 32, .32);
        transform: translateX(calc(-100% - 1.25rem));
        transition: transform .32s cubic-bezier(.2, .8, .2, 1);
    }

    body.admin-menu-open .admin-sidebar {
        transform: translateX(0);
    }

    .admin-sidebar-head {
        min-height: 3.4rem;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: .8rem;
        padding-bottom: .85rem;
        border-bottom: 1px solid rgba(255,255,255,.1);
    }

    .admin-sidebar-head .brand-admin {
        min-width: 0;
    }

    .admin-sidebar-head .brand-admin img {
        width: 8.15rem;
        padding: .34rem .45rem;
    }

    .mobile-menu-close {
        width: 2.72rem;
        height: 2.72rem;
        flex: 0 0 auto;
        display: inline-grid;
        place-items: center;
        border: 1px solid rgba(255,255,255,.16);
        border-radius: var(--radius);
        background: rgba(255,255,255,.08);
        color: #fff;
        cursor: pointer;
        transition: transform .18s ease, background-color .18s ease, border-color .18s ease;
    }

    .mobile-menu-close:hover {
        transform: translateY(-1px);
        border-color: rgba(255,255,255,.26);
        background: rgba(255,255,255,.13);
    }

    .mobile-menu-close-icon span:nth-child(1) {
        transform: rotate(45deg);
    }

    .mobile-menu-close-icon span:nth-child(2) {
        transform: rotate(-45deg);
    }

    .admin-sidebar-label {
        display: block;
        margin: 0;
    }

    .admin-sidebar nav {
        display: grid;
        gap: .55rem;
        margin: 0;
        padding: 0;
        overflow: visible;
    }

    .admin-sidebar nav a {
        min-height: 3rem;
        display: flex;
        align-items: center;
        justify-content: space-between;
        border: 1px solid rgba(255,255,255,.08);
        border-radius: var(--radius);
        background: rgba(255,255,255,.065);
        padding: .82rem .9rem;
        color: #e8f1fb;
        transform: translateX(-.65rem);
        opacity: 0;
        transition: opacity .24s ease, transform .24s ease, border-color .18s ease, background-color .18s ease;
    }

    body.admin-menu-open .admin-sidebar nav a {
        opacity: 1;
        transform: translateX(0);
    }

    body.admin-menu-open .admin-sidebar nav a:nth-child(1) { transition-delay: .04s; }
    body.admin-menu-open .admin-sidebar nav a:nth-child(2) { transition-delay: .07s; }
    body.admin-menu-open .admin-sidebar nav a:nth-child(3) { transition-delay: .1s; }
    body.admin-menu-open .admin-sidebar nav a:nth-child(4) { transition-delay: .13s; }
    body.admin-menu-open .admin-sidebar nav a:nth-child(5) { transition-delay: .16s; }
    body.admin-menu-open .admin-sidebar nav a:nth-child(6) { transition-delay: .19s; }

    .admin-sidebar nav a::after {
        content: "";
        width: .42rem;
        height: .42rem;
        border-top: 2px solid currentColor;
        border-right: 2px solid currentColor;
        opacity: .55;
        transform: rotate(45deg);
    }

    .admin-sidebar nav a.active,
    .admin-sidebar nav a:hover {
        border-color: rgba(57, 217, 143, .34);
        background: rgba(255,255,255,.1);
        color: #fff;
        box-shadow: inset 3px 0 0 var(--green);
    }

    .admin-sidebar-footer {
        display: grid;
        border-top: 1px solid rgba(255,255,255,.1);
        padding-top: .85rem;
    }
}

@media (max-width: 640px) {
    :root {
        --mobile-drawer-width: min(88vw, 21rem);
    }

    .dashboard-context-strip {
        grid-template-columns: 1fr;
    }

    .admin-mobile-shell {
        top: .58rem;
        left: .58rem;
        right: .58rem;
        min-height: 3.18rem;
    }

    .mobile-menu-button {
        min-height: 2.44rem;
        padding-inline: .54rem .7rem;
    }

    .admin-mobile-shell-title {
        font-size: .94rem;
    }

    .admin-sidebar {
        padding: .9rem;
    }

    .admin-sidebar-head .brand-admin img {
        width: 7.2rem;
    }

    .mobile-menu-close {
        width: 2.55rem;
        height: 2.55rem;
    }
}

.legal-shell {
    width: min(920px, calc(100vw - 32px));
    margin: 40px auto 72px;
}

.legal-head {
    margin-bottom: 20px;
}

.legal-panel {
    display: grid;
    gap: 22px;
}

.legal-panel h2 {
    margin: 0 0 10px;
}

.legal-panel p {
    margin: 0;
}

.legal-warning {
    border: 1px solid var(--line);
    border-radius: 8px;
    padding: 14px 16px;
    background: color-mix(in srgb, var(--surface-strong), transparent 14%);
    color: var(--muted);
}

.legal-list {
    margin: 10px 0 0;
    padding-left: 18px;
    display: grid;
    gap: 8px;
}

.legal-admin-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.contact-shell {
    width: min(1100px, calc(100vw - 32px));
    margin: 40px auto 72px;
    display: grid;
    gap: 22px;
}

.contact-hero,
.contact-card {
    border-radius: 24px;
}

.contact-hero {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) auto;
    gap: 22px;
    align-items: end;
    padding: 30px;
    background:
        radial-gradient(circle at top right, color-mix(in srgb, var(--green), transparent 86%), transparent 32%),
        linear-gradient(180deg, color-mix(in srgb, var(--surface-strong), transparent 6%), color-mix(in srgb, var(--surface), transparent 2%));
}

.contact-copy h1 {
    max-width: 11ch;
    margin-bottom: 14px;
}

.contact-copy .lead {
    max-width: 42rem;
    margin-bottom: 0;
}

.contact-actions,
.contact-inline-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.contact-actions {
    justify-content: flex-end;
    align-self: center;
}

.contact-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 22px;
}

.contact-grid-secondary {
    grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr);
}

.contact-card {
    display: grid;
    gap: 16px;
    padding: 28px;
}

.contact-card h2 {
    margin-bottom: 0;
}

.contact-card p {
    color: var(--muted);
    line-height: 1.7;
}

.contact-card-emphasis {
    background:
        radial-gradient(circle at top right, color-mix(in srgb, var(--blue), transparent 88%), transparent 28%),
        linear-gradient(180deg, color-mix(in srgb, var(--surface-strong), transparent 2%), color-mix(in srgb, var(--surface), transparent 4%));
}

.contact-points {
    margin: 0;
    padding-left: 1.1rem;
    display: grid;
    gap: 10px;
    color: var(--ink);
}

.contact-points li::marker {
    color: var(--green);
}

.contact-details {
    margin: 0;
    display: grid;
    gap: 18px;
}

.contact-details div {
    display: grid;
    gap: 6px;
}

.contact-details dt {
    color: var(--muted);
    font-size: .82rem;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.contact-details dd {
    margin: 0;
    color: var(--ink);
    line-height: 1.7;
    font-weight: 700;
}

.contact-details a {
    color: var(--blue);
}

.contact-details a:hover {
    color: var(--green);
}

.legal-editor {
    min-width: 0;
}

.legal-content-input {
    min-height: 560px;
    font: 14px/1.6 Consolas, "Courier New", monospace;
}

@media (max-width: 1100px) {
    .legal-admin-grid {
        grid-template-columns: 1fr;
    }

    .contact-hero,
    .contact-grid,
    .contact-grid-secondary {
        grid-template-columns: 1fr;
    }

    .contact-actions {
        justify-content: flex-start;
    }
}


/* Integrated visual and dark-mode overrides - formerly boulli-premium.css */

/* ==================================================== */
/* 1. PREMIUM LIGHT MODE (Glass, airy, refined)         */
/* ==================================================== */
:root,
:root[data-theme="light"] {
    --ink: #0a0e14 !important;
    --paper: #f4f6f9 !important;
    --paper-strong: rgba(255, 255, 255, 0.75) !important;
    --surface: rgba(255, 255, 255, 0.85) !important;
    --surface-strong: rgba(255, 255, 255, 0.95) !important;
    --line: rgba(0, 0, 0, 0.08) !important;
    --muted: #6b7280 !important;
    --blue: #2563eb !important;
    --green: #10b981 !important;
    --gold: #d97706 !important;
    --violet: #8b5cf6 !important;
    --violet-soft: rgba(139, 92, 246, 0.1) !important;
    --dark: #ffffff !important;
    --dark-soft: #f9fafb !important;
    --warn: #ef4444 !important;
    --focus: rgba(139, 92, 246, 0.2) !important;
    --radius: 12px !important;
    --shadow: 0 16px 40px rgba(0, 0, 0, 0.06) !important;
    --shadow-soft: 0 8px 24px rgba(0, 0, 0, 0.04) !important;
    color-scheme: light !important;
}

/* ==================================================== */
/* 2. PREMIUM DARK MODE (Deep space, neon glow)         */
/* ==================================================== */
:root[data-theme="dark"] {
    --ink: #edf4ff !important;
    --paper: #06090d !important;
    --paper-strong: rgba(11, 16, 23, 0.96) !important;
    --surface: rgba(15, 21, 31, 0.92) !important;
    --surface-strong: rgba(22, 30, 44, 0.98) !important;
    --line: rgba(255, 255, 255, 0.08) !important;
    --muted: #8c9ba8 !important;
    --blue: #5b96ff !important;
    --green: #29e88a !important;
    --gold: #f2c75c !important;
    --violet: #9d70ff !important;
    --violet-soft: rgba(157, 112, 255, 0.15) !important;
    --dark: #000000 !important;
    --dark-soft: #080b0f !important;
    --warn: #ff6b4a !important;
    --focus: rgba(157, 112, 255, 0.3) !important;
    --shadow: 0 24px 64px rgba(0, 0, 0, 0.4) !important;
    --shadow-soft: 0 12px 32px rgba(0, 0, 0, 0.25) !important;
    color-scheme: dark !important;
}

/* ==================================================== */
/* 3. GLOBAL BACKGROUNDS & CORE LAYOUT                  */
/* ==================================================== */
body {
    background-color: var(--paper) !important;
    color: var(--ink) !important;
}

body.admin-page {
    background: var(--paper) !important;
}

/* Dark mode specific backgrounds */
:root[data-theme="dark"] body.admin-page {
    background: #06080b !important;
    background-image:
        radial-gradient(circle at 60% -20%, rgba(157, 112, 255, 0.12), transparent 50%),
        repeating-linear-gradient(135deg, rgba(255, 255, 255, 0.015) 0 1px, transparent 1px 32px) !important;
    background-attachment: fixed !important;
}

:root[data-theme="light"] body.admin-page {
    background: #f8fafc !important;
    background-image:
        radial-gradient(circle at 60% -20%, rgba(139, 92, 246, 0.05), transparent 50%),
        repeating-linear-gradient(135deg, rgba(0, 0, 0, 0.015) 0 1px, transparent 1px 32px) !important;
    background-attachment: fixed !important;
}

/* ==================================================== */
/* 4. GLASSMORPHISM STRUCTURES & PANELS                 */
/* ==================================================== */
/* Apply glass universally to all block elements to override #fff and dark spots */
.admin-sidebar,
.admin-topbar,
.page-heading,
.customer-command-card,
.metric-row article,
.panel,
.project-panel,
.record,
.table-row,
.task-row,
.comment-list article,
.signal-panel,
.finance-tab,
.finance-workbench,
.finance-summary-strip,
.finance-row,
.finance-setup-grid>div,
.step-nav button,
.toolbar,
.checkout-panel,
.audit-signature-image {
    background: var(--surface) !important;
    backdrop-filter: blur(16px) !important;
    -webkit-backdrop-filter: blur(16px) !important;
    border: 1px solid var(--line) !important;
    color: var(--ink) !important;
    border-radius: var(--radius) !important;
    transition: border-color 0.3s ease, box-shadow 0.3s ease, transform 0.3s ease, background 0.3s ease !important;
}

/* For elements requiring higher contrast / inner borders */
.admin-sidebar,
.admin-topbar,
.panel,
.project-panel,
.page-heading {
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.02), var(--shadow-soft) !important;
}

/* Dark mode specific inner shadows for ultra premium feel */
:root[data-theme="dark"] .admin-sidebar,
:root[data-theme="dark"] .admin-topbar,
:root[data-theme="dark"] .panel,
:root[data-theme="dark"] .customer-command-card,
:root[data-theme="dark"] .page-heading {
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.03), var(--shadow-soft) !important;
}

/* Specific Sidebar Enhancements */
.admin-sidebar {
    border-right: none !important;
    margin: 1.5rem 0 1.5rem 1.5rem !important;
    height: calc(100vh - 3rem) !important;
    min-height: auto !important;
    top: 1.5rem !important;
    position: sticky !important;
    padding-bottom: 2rem !important;
}

.admin-sidebar:hover {
    border-color: rgba(139, 92, 246, 0.3) !important;
}

.brand-admin {
    transform: scale(0.95);
    transform-origin: left center;
}

.brand-admin img {
    background: transparent !important;
}

:root[data-theme="dark"] .brand-admin img {
    filter: invert(1) brightness(2) !important;
}

:root[data-theme="light"] .brand-admin img {
    filter: invert(0) !important;
}

.admin-sidebar nav a,
.link-button {
    border-radius: 8px !important;
    transition: background 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease !important;
    color: var(--ink) !important;
}

.admin-sidebar nav a:hover,
.link-button:hover {
    background: var(--surface-strong) !important;
    transform: translateX(4px);
}

.admin-sidebar nav a.active {
    background: linear-gradient(90deg, var(--violet-soft), transparent) !important;
    box-shadow: inset 3px 0 0 var(--violet) !important;
    font-weight: bold !important;
}

.admin-main {
    padding: 1.5rem 2rem 3rem !important;
}

.admin-topbar {
    margin-bottom: 2rem !important;
}

.page-heading::before {
    background: linear-gradient(90deg, var(--violet), var(--blue), var(--green)) !important;
}

/* Hover States for Interactive Cards */
.metric-row article:hover,
.record:hover,
.table-row:hover,
.task-row:hover,
.finance-row:hover,
.finance-tab:hover {
    transform: translateY(-2px) !important;
    border-color: rgba(139, 92, 246, 0.4) !important;
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.08), inset 0 0 0 1px rgba(139, 92, 246, 0.1) !important;
    background: var(--surface-strong) !important;
}

:root[data-theme="dark"] .metric-row article:hover,
:root[data-theme="dark"] .record:hover,
:root[data-theme="dark"] .table-row:hover,
:root[data-theme="dark"] .task-row:hover,
:root[data-theme="dark"] .finance-row:hover,
:root[data-theme="dark"] .finance-tab:hover {
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.3), inset 0 0 0 1px rgba(157, 112, 255, 0.1) !important;
}

/* Finance Tabs Adjustments */
.finance-tab.active,
.step-nav button.is-active,
.step-nav button.is-complete {
    background: var(--surface-strong) !important;
    border-bottom: 3px solid var(--violet) !important;
    color: var(--ink) !important;
}

.finance-summary-strip {
    border-top: 1px solid var(--line) !important;
    background: var(--surface-strong) !important;
}

/* ==================================================== */
/* 5. INPUTS, BUTTONS & FORMS                           */
/* ==================================================== */
.button,
.link-button,
.theme-toggle,
input,
select,
textarea {
    background: var(--paper-strong) !important;
    border: 1px solid var(--line) !important;
    color: var(--ink) !important;
    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
    border-radius: 8px !important;
}

.button,
.link-button,
.theme-toggle {
    font-weight: 700 !important;
}

.button:hover,
.link-button:hover,
.theme-toggle:hover {
    background: var(--surface-strong) !important;
    border-color: var(--violet) !important;
}

/* Focus and Active States */
input:focus,
select:focus,
textarea:focus {
    border-color: var(--violet) !important;
    box-shadow: 0 0 0 4px var(--focus) !important;
    background: var(--surface-strong) !important;
}

:root[data-theme="dark"] input,
:root[data-theme="dark"] select,
:root[data-theme="dark"] textarea,
:root[data-theme="dark"] .button,
:root[data-theme="dark"] .link-button,
:root[data-theme="dark"] .theme-toggle {
    background: rgba(7, 11, 17, 0.96) !important;
    border-color: rgba(255, 255, 255, 0.12) !important;
    color: var(--ink) !important;
}

:root[data-theme="dark"] input::placeholder,
:root[data-theme="dark"] textarea::placeholder {
    color: rgba(237, 244, 255, 0.48) !important;
}

:root[data-theme="dark"] select option {
    background: #0b1017 !important;
    color: var(--ink) !important;
}

:root[data-theme="dark"] input:-webkit-autofill,
:root[data-theme="dark"] textarea:-webkit-autofill,
:root[data-theme="dark"] select:-webkit-autofill {
    -webkit-text-fill-color: var(--ink) !important;
    box-shadow: 0 0 0 1000px #0b1017 inset !important;
    caret-color: var(--ink) !important;
}

/* Colored Buttons */
.button.primary {
    background: linear-gradient(135deg, var(--violet), var(--blue)) !important;
    border: none !important;
    color: #ffffff !important;
    box-shadow: 0 4px 14px var(--violet-soft) !important;
}

.button.primary:hover {
    background: linear-gradient(135deg, var(--blue), var(--violet)) !important;
    transform: translateY(-2px) scale(1.02) !important;
}

.button.success {
    background: linear-gradient(135deg, var(--green), #2db579) !important;
    border: none !important;
    color: #ffffff !important;
}

/* ==================================================== */
/* 6. TYPOGRAPHY & OVERRIDES FIXES                      */
/* ==================================================== */
strong,
h1,
h2,
h3,
h4,
h5,
h6,
span {
    color: var(--ink);
}

/* Force specific elements to respect var(--ink) */
.metric-row article strong,
.record-header strong,
.finance-row strong,
.finance-kicker,
.muted {
    color: var(--ink) !important;
}

.muted,
.finance-kicker {
    opacity: 0.7;
}

table {
    color: var(--ink) !important;
}

th,
td {
    border-color: var(--line) !important;
}

/* Disable ugly backgrounds for inner items */
.finance-main,
.finance-actions,
.status-pill {
    background: transparent !important;
}

.status-pill {
    background: var(--surface) !important;
    border: 1px solid var(--line) !important;
}

.status-pill.is-paid {
    background: rgba(16, 185, 129, 0.1) !important;
    color: var(--green) !important;
    border-color: rgba(16, 185, 129, 0.3) !important;
}

.status-pill.is-overdue {
    background: rgba(239, 68, 68, 0.1) !important;
    color: var(--warn) !important;
    border-color: rgba(239, 68, 68, 0.3) !important;
}

:root[data-theme="dark"] .admin-mobile-shell,
:root[data-theme="dark"] .table-head,
:root[data-theme="dark"] .customer-command-card,
:root[data-theme="dark"] .customer-summary-row article,
:root[data-theme="dark"] .customer-focus-panel,
:root[data-theme="dark"] .customer-focus-item,
:root[data-theme="dark"] .customer-quicknav,
:root[data-theme="dark"] .workflow-primary-card,
:root[data-theme="dark"] .workflow-rail,
:root[data-theme="dark"] .workflow-rail-step,
:root[data-theme="dark"] .workflow-secondary-details,
:root[data-theme="dark"] .soft,
:root[data-theme="dark"] .chip-row span,
:root[data-theme="dark"] .task-admin-row,
:root[data-theme="dark"] .accepted-start-panel,
:root[data-theme="dark"] .start-checklist span,
:root[data-theme="dark"] .material-note-grid article,
:root[data-theme="dark"] .material-need-list span,
:root[data-theme="dark"] .material-check-grid,
:root[data-theme="dark"] .review-note,
:root[data-theme="dark"] .review-resource-list a,
:root[data-theme="dark"] .review-resource-list div,
:root[data-theme="dark"] .review-feedback-item,
:root[data-theme="dark"] .review-feedback-history article,
:root[data-theme="dark"] .finance-tab.active,
:root[data-theme="dark"] .finance-summary-strip span,
:root[data-theme="dark"] .legal-warning,
:root[data-theme="dark"] .choice,
:root[data-theme="dark"] .service-option,
:root[data-theme="dark"] .checkline,
:root[data-theme="dark"] .hero-pills span,
:root[data-theme="dark"] .progress-shell,
:root[data-theme="dark"] .step-nav {
    background: var(--surface-strong) !important;
    border-color: var(--line) !important;
    color: var(--ink) !important;
}

:root[data-theme="dark"] .admin-topbar,
:root[data-theme="dark"] .page-heading,
:root[data-theme="dark"] .metric-row article,
:root[data-theme="dark"] .panel,
:root[data-theme="dark"] .project-panel,
:root[data-theme="dark"] .record,
:root[data-theme="dark"] .table-row,
:root[data-theme="dark"] .task-row,
:root[data-theme="dark"] .comment-list article,
:root[data-theme="dark"] .finance-workbench,
:root[data-theme="dark"] .finance-summary-strip,
:root[data-theme="dark"] .finance-row,
:root[data-theme="dark"] .finance-setup-grid>div,
:root[data-theme="dark"] .toolbar,
:root[data-theme="dark"] .audit-signature-image {
    background: var(--surface) !important;
}

:root[data-theme="dark"] .finance-tab.active {
    background:
        linear-gradient(135deg, rgba(91, 150, 255, 0.16), rgba(157, 112, 255, 0.1)),
        var(--surface-strong) !important;
}

:root[data-theme="dark"] .notice {
    background: rgba(41, 232, 138, 0.12) !important;
    border-color: rgba(41, 232, 138, 0.28) !important;
    color: #bff7da !important;
}

:root[data-theme="dark"] .signing-document iframe,
:root[data-theme="dark"] .signature-canvas,
:root[data-theme="dark"] .audit-signature-image {
    background: #0b1017 !important;
}

/* Animations */
@keyframes premium-fade {
    0% {
        opacity: 0;
        transform: translateY(10px);
    }

    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

.admin-main>* {
    animation: premium-fade 0.4s ease backwards;
}

.admin-main>*:nth-child(1) {
    animation-delay: 0.1s;
}

.admin-main>*:nth-child(2) {
    animation-delay: 0.15s;
}

.admin-main>*:nth-child(3) {
    animation-delay: 0.2s;
}

.admin-main>*:nth-child(4) {
    animation-delay: 0.25s;
}

.analytics-panel {
    display: grid;
    gap: 1rem;
    margin-bottom: 1rem;
}

.analytics-card-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: .75rem;
}

.analytics-kpi,
.analytics-chart {
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--surface-strong);
}

.analytics-kpi {
    min-height: 8rem;
    display: grid;
    align-content: space-between;
    gap: .65rem;
    padding: .92rem;
}

.analytics-kpi span,
.analytics-chart h3 {
    color: var(--blue);
    font-size: .78rem;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.analytics-kpi strong {
    color: var(--ink);
    font-size: clamp(1.45rem, 2vw, 2rem);
    line-height: 1;
}

.analytics-kpi small {
    color: var(--muted);
    line-height: 1.35;
}

.funnel-strip {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: .55rem;
}

.funnel-stage {
    min-width: 0;
    min-height: 8.3rem;
    display: grid;
    align-content: space-between;
    gap: .45rem;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--surface-strong);
    padding: .78rem;
}

.funnel-stage span,
.duration-strip span,
.source-chart-row span {
    color: var(--muted);
    font-size: .76rem;
    font-weight: 900;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.funnel-stage strong {
    color: var(--ink);
    font-size: 1.45rem;
    line-height: 1;
}

.funnel-stage i {
    display: block;
    height: .52rem;
    min-width: .18rem;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--blue), var(--green));
    transform: scaleX(0);
    transform-origin: left center;
    opacity: 0;
    animation: chart-grow .72s cubic-bezier(.18, .85, .24, 1) var(--chart-delay, 0ms) both;
    will-change: transform, opacity;
}

.funnel-stage small {
    color: var(--muted);
    line-height: 1.35;
}

.duration-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .55rem;
}

.duration-strip article {
    min-height: 4.8rem;
    display: grid;
    align-content: center;
    gap: .35rem;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: color-mix(in srgb, var(--surface-strong), transparent 8%);
    padding: .75rem;
}

.duration-strip strong {
    color: var(--ink);
    font-size: 1.15rem;
}

.analytics-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(280px, .82fr) minmax(240px, .62fr);
    gap: .85rem;
    align-items: stretch;
}

.analytics-grid-primary {
    grid-template-columns: 1fr;
}

.analytics-grid-secondary {
    margin-top: .85rem;
}

.analytics-details {
    border: 1px solid var(--line);
    border-radius: 8px;
    background: color-mix(in srgb, var(--surface-strong), transparent 8%);
    overflow: hidden;
}

.analytics-details summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .85rem;
    min-height: 3.4rem;
    padding: .8rem .95rem;
    cursor: pointer;
    list-style: none;
}

.analytics-details summary::-webkit-details-marker {
    display: none;
}

.analytics-details summary::after {
    content: "+";
    width: 1.55rem;
    height: 1.55rem;
    display: inline-grid;
    place-items: center;
    border: 1px solid var(--line);
    border-radius: 8px;
    color: var(--blue);
    font-weight: 900;
}

.analytics-details[open] summary::after {
    content: "-";
}

.analytics-details summary span {
    color: var(--ink);
    font-weight: 900;
}

.analytics-details summary small {
    color: var(--muted);
    font-weight: 700;
    line-height: 1.35;
}

.analytics-details .duration-strip,
.analytics-details .analytics-grid-secondary {
    padding: 0 .95rem .95rem;
}

.analytics-chart {
    min-width: 0;
    display: grid;
    gap: .9rem;
    padding: 1rem;
    overflow: hidden;
}

.analytics-chart-wide {
    min-height: 22rem;
}

.analytics-chart-head {
    min-height: 3.3rem;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: .75rem;
}

.analytics-chart h3,
.analytics-chart p {
    margin: 0;
}

.chart-legend {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: .45rem;
    color: var(--muted);
    font-size: .78rem;
    font-weight: 900;
}

.chart-legend span {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
}

.chart-legend span::before {
    content: "";
    width: .62rem;
    height: .62rem;
    border-radius: 3px;
    background: var(--blue);
}

.chart-legend .is-accepted::before {
    background: var(--green);
}

.monthly-chart {
    min-height: 14rem;
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: .7rem;
    align-items: end;
}

.monthly-column {
    min-width: 0;
    display: grid;
    gap: .45rem;
    text-align: center;
}

.monthly-bars {
    height: 12rem;
    display: flex;
    align-items: end;
    justify-content: center;
    gap: .28rem;
    padding: .55rem .35rem;
    border: 1px solid color-mix(in srgb, var(--line), transparent 18%);
    border-radius: 8px;
    background:
        linear-gradient(180deg, transparent 0 24%, color-mix(in srgb, var(--line), transparent 72%) 24% 25%, transparent 25% 49%, color-mix(in srgb, var(--line), transparent 72%) 49% 50%, transparent 50% 74%, color-mix(in srgb, var(--line), transparent 72%) 74% 75%, transparent 75%),
        color-mix(in srgb, var(--surface), transparent 22%);
}

.monthly-bar {
    width: min(34%, 1.2rem);
    min-height: 0;
    border-radius: 6px 6px 2px 2px;
    background: linear-gradient(180deg, var(--blue), color-mix(in srgb, var(--blue), #000 18%));
    box-shadow: 0 8px 18px color-mix(in srgb, var(--blue), transparent 78%);
    transform: scaleY(0);
    transform-origin: bottom center;
    opacity: 0;
    animation: chart-rise .76s cubic-bezier(.18, .85, .24, 1) var(--chart-delay, 0ms) both;
    will-change: transform, opacity;
}

.monthly-bar.is-accepted {
    background: linear-gradient(180deg, var(--green), color-mix(in srgb, var(--green), #000 20%));
    box-shadow: 0 8px 18px color-mix(in srgb, var(--green), transparent 78%);
}

.monthly-column strong {
    color: var(--ink);
    font-size: .86rem;
}

.monthly-column small {
    color: var(--muted);
    font-size: .76rem;
    white-space: nowrap;
}

.status-chart,
.source-chart {
    display: grid;
    gap: .7rem;
}

.status-chart-row,
.source-chart-row {
    display: grid;
    gap: .35rem;
}

.status-chart-row div,
.source-chart-row div {
    display: flex;
    justify-content: space-between;
    gap: .8rem;
    color: var(--muted);
    font-size: .86rem;
    font-weight: 800;
}

.status-chart-row strong,
.source-chart-row strong {
    color: var(--ink);
}

.status-chart-row i,
.source-chart-row i {
    display: block;
    height: .72rem;
    min-width: .18rem;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--violet), var(--blue), var(--green));
    transform: scaleX(0);
    transform-origin: left center;
    opacity: 0;
    animation: chart-grow .68s cubic-bezier(.18, .85, .24, 1) var(--chart-delay, 0ms) both;
    will-change: transform, opacity;
}

.source-chart-row small {
    color: var(--muted);
    font-size: .78rem;
}

.priority-chart {
    min-height: 14rem;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .75rem;
    align-items: end;
}

.priority-column {
    display: grid;
    gap: .4rem;
    justify-items: center;
    text-align: center;
}

.priority-track {
    width: 100%;
    max-width: 4.8rem;
    height: 11rem;
    display: flex;
    align-items: end;
    padding: .38rem;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: color-mix(in srgb, var(--surface), transparent 18%);
}

.priority-track span {
    display: block;
    width: 100%;
    border-radius: 6px;
    background: var(--green);
    transform: scaleY(0);
    transform-origin: bottom center;
    opacity: 0;
    animation: chart-rise .72s cubic-bezier(.18, .85, .24, 1) var(--chart-delay, 0ms) both;
    will-change: transform, opacity;
}

.priority-column.is-high .priority-track span {
    background: var(--warn);
}

.priority-column.is-normal .priority-track span {
    background: var(--blue);
}

.priority-column strong {
    color: var(--ink);
    font-size: 1.25rem;
}

.priority-column small {
    color: var(--muted);
    font-weight: 800;
}

@keyframes chart-grow {
    from {
        opacity: 0;
        transform: scaleX(0);
    }

    to {
        opacity: 1;
        transform: scaleX(1);
    }
}

@keyframes chart-rise {
    from {
        opacity: 0;
        transform: scaleY(0);
    }

    to {
        opacity: 1;
        transform: scaleY(1);
    }
}

@media (prefers-reduced-motion: reduce) {
    .funnel-stage i,
    .monthly-bar,
    .status-chart-row i,
    .source-chart-row i,
    .priority-track span {
        animation: none !important;
        opacity: 1 !important;
        transform: none !important;
    }
}

@media (max-width: 1180px) {
    .metric-row-focus {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .analytics-card-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .analytics-grid {
        grid-template-columns: 1fr;
    }

    .funnel-strip {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

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

    .analytics-chart-wide {
        min-height: auto;
    }
}

@media (max-width: 720px) {
    .metric-row-focus {
        grid-template-columns: 1fr;
    }

    .dashboard-context-strip {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .analytics-card-grid {
        grid-template-columns: 1fr;
    }

    .funnel-strip,
    .duration-strip {
        grid-template-columns: 1fr;
    }

    .analytics-chart-head {
        display: grid;
    }

    .analytics-details summary {
        display: grid;
    }

    .chart-legend {
        justify-content: flex-start;
    }

    .monthly-chart {
        gap: .45rem;
        overflow-x: auto;
        overscroll-behavior-x: contain;
        padding-bottom: .25rem;
        scroll-snap-type: x proximity;
        grid-template-columns: repeat(6, minmax(4.5rem, 1fr));
    }

    .monthly-bars {
        height: 9.5rem;
        padding-inline: .22rem;
    }

    .monthly-column {
        scroll-snap-align: start;
    }

    .monthly-column small {
        font-size: .68rem;
    }
}

@media (max-width: 1180px) {
    .customer-focus-list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .customer-project-panel .project-top {
        grid-template-columns: 1fr;
    }

    .customer-project-panel .inline-form {
        justify-self: stretch;
        width: 100%;
    }

    .customer-project-settings {
        justify-self: stretch;
        width: 100%;
    }
}

@media (max-width: 900px) {
    body.admin-page {
        display: block !important;
        min-height: 100dvh !important;
        overflow-x: hidden !important;
    }

    .admin-sidebar {
        position: fixed !important;
        top: 0 !important;
        bottom: 0 !important;
        left: 0 !important;
        z-index: 80 !important;
        width: var(--admin-mobile-menu-width) !important;
        height: 100dvh !important;
        min-height: 100dvh !important;
        margin: 0 !important;
        transform: translateX(calc(-100% - 1rem)) !important;
    }

    body.admin-menu-open .admin-sidebar {
        transform: translateX(0) !important;
    }

    .admin-main {
        padding: 5.1rem .9rem 1rem !important;
    }

    .admin-topbar {
        display: none !important;
    }

    .customer-command-center,
    .customer-overview-grid {
        grid-template-columns: 1fr !important;
    }

    .customer-command-center > .button {
        display: none !important;
    }

    .customer-command-card {
        min-height: 7rem;
    }
}

@media (max-width: 640px) {
    .admin-main {
        padding: 4.65rem .72rem .9rem !important;
    }

    .customer-command-actions,
    .customer-command-actions .button {
        width: 100%;
    }

    .customer-status-strip div {
        flex: 1 1 calc(50% - .55rem);
        justify-content: space-between;
    }

    .customer-focus-list {
        grid-template-columns: 1fr !important;
    }

    .customer-quicknav,
    .customer-project-nav {
        margin-inline: -.15rem;
    }

    .customer-edit-panel summary {
        min-height: 3rem;
    }

    .customer-timeline-item {
        grid-template-columns: 1fr;
    }

    .customer-timeline-item time {
        grid-row: auto;
        grid-column: 1;
    }
}

.portal-web-shell {
    width: min(1240px, calc(100% - 2rem));
    margin: 0 auto;
    padding: 1.6rem 0 3rem;
}

.portal-web-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(19rem, .42fr);
    gap: 1rem;
    align-items: stretch;
    margin-bottom: 1rem;
}

.portal-web-hero-main,
.portal-web-sidecard,
.portal-web-panel,
.portal-web-project-card,
.portal-web-nav-item,
.portal-web-action-card,
.portal-web-journey-step,
.portal-web-support-card,
.portal-web-meeting-card,
.portal-web-timeline-item {
    border: 1px solid color-mix(in srgb, var(--line), transparent 6%);
    border-radius: 26px;
    background: color-mix(in srgb, var(--paper-strong), transparent 2%);
    box-shadow: var(--shadow-soft);
}

.portal-web-hero-main {
    position: relative;
    overflow: hidden;
    padding: 1.5rem;
    background:
        radial-gradient(circle at top left, rgba(33, 95, 189, .11), transparent 20rem),
        linear-gradient(180deg, rgba(255, 255, 255, .98), rgba(246, 248, 251, .98));
}

.portal-web-hero-main::after {
    content: "";
    position: absolute;
    inset: auto -8% -28% auto;
    width: 16rem;
    height: 16rem;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(17, 24, 32, .08), transparent 66%);
    pointer-events: none;
}

.portal-web-hero-main h1 {
    max-width: 11ch;
    margin: .15rem 0 .65rem;
    font-size: clamp(2.45rem, 5vw, 4rem);
    text-wrap: balance;
}

.portal-web-metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .8rem;
    margin-top: 1.2rem;
    position: relative;
    z-index: 1;
}

.portal-web-metric-card {
    display: grid;
    gap: .32rem;
    padding: .95rem 1rem;
    border: 1px solid rgba(17, 24, 32, .08);
    border-radius: 20px;
    background: rgba(255, 255, 255, .68);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
}

.portal-web-metric-card span,
.portal-web-sidecard > span,
.portal-web-sidecard article span,
.portal-web-project-head span,
.portal-web-project-callout span,
.portal-web-project-meta span,
.portal-web-nav-item span,
.portal-web-action-card span,
.portal-web-journey-step span,
.portal-web-support-card span,
.portal-web-meeting-card span,
.portal-web-timeline-item span,
.portal-web-tag-row span {
    color: var(--blue);
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.portal-web-metric-card strong {
    font-size: 2rem;
    line-height: .96;
    color: var(--ink);
}

.portal-web-metric-card small,
.portal-web-sidecard small,
.portal-web-sidecard article small,
.portal-web-project-callout small,
.portal-web-action-card small,
.portal-web-support-card small,
.portal-web-meeting-card small,
.portal-web-timeline-item small {
    color: var(--muted);
    line-height: 1.55;
}

.portal-web-sidecard {
    display: grid;
    gap: .9rem;
    align-content: start;
    padding: 1.2rem;
    background:
        linear-gradient(180deg, rgba(17, 24, 32, .97), rgba(26, 33, 43, .98));
    color: #eef4fb;
}

.portal-web-sidecard strong,
.portal-web-sidecard article strong {
    color: #fff;
    line-height: 1.35;
}

.portal-web-sidecard > span,
.portal-web-sidecard article span {
    color: #9dc2ff;
}

.portal-web-sidecard small,
.portal-web-sidecard article small {
    color: rgba(238, 244, 251, .74);
}

.portal-web-sidecard-stack {
    display: grid;
    gap: .75rem;
}

.portal-web-sidecard-stack article {
    display: grid;
    gap: .24rem;
    padding: .92rem;
    border: 1px solid rgba(255, 255, 255, .08);
    border-radius: 18px;
    background: rgba(255, 255, 255, .04);
}

.portal-web-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(20rem, .44fr);
    gap: 1rem;
    align-items: start;
}

.portal-web-main,
.portal-web-sidebar {
    display: grid;
    gap: 1rem;
}

.portal-web-panel {
    padding: 1.15rem;
}

.portal-web-project-list,
.portal-web-nav-list,
.portal-web-action-list,
.portal-web-support-list,
.portal-web-meeting-list,
.portal-web-timeline {
    display: grid;
    gap: .85rem;
}

.portal-web-project-card,
.portal-web-support-card {
    display: grid;
    gap: .9rem;
    padding: 1rem;
}

.portal-web-project-card-empty p {
    color: var(--muted);
}

.portal-web-project-head {
    display: flex;
    justify-content: space-between;
    align-items: start;
    gap: .8rem;
}

.portal-web-project-head h3 {
    margin: .2rem 0 0;
    font-size: 1.45rem;
    line-height: 1.08;
}

.portal-web-project-button {
    min-width: fit-content;
}

.portal-web-project-callout {
    display: grid;
    gap: .32rem;
    padding: .95rem 1rem;
    border: 1px solid color-mix(in srgb, var(--blue), transparent 78%);
    border-radius: 20px;
    background: color-mix(in srgb, var(--blue), transparent 95%);
}

.portal-web-project-callout strong,
.portal-web-project-meta strong,
.portal-web-nav-item strong,
.portal-web-action-card strong,
.portal-web-journey-step strong,
.portal-web-support-card strong,
.portal-web-meeting-card strong,
.portal-web-timeline-item strong {
    color: var(--ink);
}

.portal-web-project-meta {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .7rem;
}

.portal-web-project-meta article {
    display: grid;
    gap: .2rem;
    padding: .82rem .88rem;
    border: 1px solid color-mix(in srgb, var(--line), transparent 10%);
    border-radius: 18px;
    background: color-mix(in srgb, var(--surface-strong), transparent 4%);
}

.portal-web-nav-item,
.portal-web-action-card {
    display: grid;
    gap: .28rem;
    padding: .95rem 1rem;
    color: inherit;
    text-decoration: none;
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease, background-color .18s ease;
}

.portal-web-nav-item:hover,
.portal-web-action-card:hover {
    transform: translateY(-1px);
    box-shadow: 0 14px 28px rgba(17, 24, 32, .09);
}

.portal-web-nav-item.is-current {
    border-color: color-mix(in srgb, var(--blue), transparent 62%);
    background: color-mix(in srgb, var(--blue), transparent 95%);
}

.portal-web-action-card.is-current,
.portal-web-action-card.is-open,
.portal-web-action-card.is-waiting {
    border-color: color-mix(in srgb, var(--blue), transparent 66%);
}

.portal-web-action-card.is-done {
    border-color: color-mix(in srgb, var(--green), transparent 62%);
    background: color-mix(in srgb, var(--green), transparent 95%);
}

.portal-web-journey {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(8.8rem, 1fr));
    gap: .75rem;
}

.portal-web-journey-step {
    display: grid;
    gap: .2rem;
    padding: .92rem;
}

.portal-web-journey-step.is-complete {
    border-color: color-mix(in srgb, var(--green), transparent 58%);
    background: color-mix(in srgb, var(--green), transparent 95%);
}

.portal-web-journey-step.is-current,
.portal-web-journey-step.is-waiting {
    border-color: color-mix(in srgb, var(--blue), transparent 64%);
    background: color-mix(in srgb, var(--blue), transparent 95%);
}

.portal-web-support-form {
    margin-top: .65rem;
}

.portal-web-support-card-head {
    display: flex;
    justify-content: space-between;
    gap: .8rem;
    align-items: start;
}

.portal-web-support-card-head > div {
    display: grid;
    gap: .2rem;
}

.portal-web-support-card.is-open {
    border-color: color-mix(in srgb, var(--blue), transparent 68%);
}

.portal-web-support-card.is-done {
    border-color: color-mix(in srgb, var(--green), transparent 62%);
    background: color-mix(in srgb, var(--green), transparent 96%);
}

.portal-web-meeting-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: .8rem;
    align-items: center;
    padding: .95rem 1rem;
}

.portal-web-timeline-item {
    position: relative;
    display: grid;
    gap: .24rem;
    padding: 1rem 1rem 1rem 1.2rem;
}

.portal-web-timeline-item::before {
    content: "";
    position: absolute;
    inset: 1rem auto 1rem .8rem;
    width: 4px;
    border-radius: 999px;
    background: linear-gradient(180deg, var(--blue), var(--green));
}

.portal-web-timeline-item time {
    color: var(--muted);
    font-size: .82rem;
    font-weight: 700;
}

.portal-web-tag-row {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    margin-top: .95rem;
    position: relative;
    z-index: 1;
}

.portal-web-tag-row span {
    padding: .48rem .68rem;
    border: 1px solid color-mix(in srgb, var(--line), transparent 10%);
    border-radius: 999px;
    background: rgba(255, 255, 255, .72);
    color: var(--ink);
    letter-spacing: .02em;
    text-transform: none;
}

:root[data-theme="dark"] .portal-web-hero-main {
    background:
        radial-gradient(circle at top left, rgba(118, 183, 255, .12), transparent 20rem),
        linear-gradient(180deg, rgba(24, 27, 22, .98), rgba(20, 23, 18, .98));
}

:root[data-theme="dark"] .portal-web-metric-card,
:root[data-theme="dark"] .portal-web-tag-row span {
    background: rgba(255, 255, 255, .03);
}

:root[data-theme="dark"] .portal-web-sidecard {
    background:
        linear-gradient(180deg, rgba(10, 13, 10, .98), rgba(17, 21, 17, .98));
}

:root[data-theme="dark"] .portal-web-panel,
:root[data-theme="dark"] .portal-web-project-card,
:root[data-theme="dark"] .portal-web-nav-item,
:root[data-theme="dark"] .portal-web-action-card,
:root[data-theme="dark"] .portal-web-journey-step,
:root[data-theme="dark"] .portal-web-support-card,
:root[data-theme="dark"] .portal-web-meeting-card,
:root[data-theme="dark"] .portal-web-timeline-item {
    background: color-mix(in srgb, var(--paper-strong), transparent 1%);
}

:root[data-theme="dark"] .portal-web-project-callout,
:root[data-theme="dark"] .portal-web-nav-item.is-current,
:root[data-theme="dark"] .portal-web-action-card.is-done,
:root[data-theme="dark"] .portal-web-journey-step.is-complete,
:root[data-theme="dark"] .portal-web-journey-step.is-current,
:root[data-theme="dark"] .portal-web-journey-step.is-waiting,
:root[data-theme="dark"] .portal-web-support-card.is-done {
    background: color-mix(in srgb, var(--blue), transparent 92%);
}

@media (max-width: 980px) {
    .portal-web-hero,
    .portal-web-grid {
        grid-template-columns: 1fr;
    }

    .portal-web-metrics,
    .portal-web-project-meta {
        grid-template-columns: 1fr;
    }

    .portal-web-project-head,
    .portal-web-support-card-head,
    .portal-web-meeting-card {
        grid-template-columns: 1fr;
        display: grid;
    }

    .portal-web-project-button {
        width: 100%;
    }
}

@media (max-width: 640px) {
    .portal-web-shell {
        width: min(100% - 1rem, 1240px);
        padding: 1rem 0 2.2rem;
    }

    .portal-web-hero-main,
    .portal-web-sidecard,
    .portal-web-panel,
    .portal-web-project-card,
    .portal-web-nav-item,
    .portal-web-action-card,
    .portal-web-journey-step,
    .portal-web-support-card,
    .portal-web-meeting-card,
    .portal-web-timeline-item {
        border-radius: 22px;
    }

    .portal-web-hero-main,
    .portal-web-sidecard,
    .portal-web-panel,
    .portal-web-project-card,
    .portal-web-support-card {
        padding: 1rem;
    }

    .portal-web-hero-main h1 {
        font-size: clamp(2.2rem, 10vw, 3.1rem);
    }

    .portal-web-metric-card strong {
        font-size: 1.72rem;
    }

    .portal-web-journey {
        grid-template-columns: 1fr 1fr;
    }
}

.intake-hero-enterprise {
    grid-template-columns: minmax(0, 1fr) minmax(300px, .45fr);
    align-items: stretch;
    padding-top: 3.6rem;
}

.intake-hero-enterprise .intake-copy {
    display: grid;
    align-content: end;
    gap: .95rem;
    max-width: 850px;
}

.intake-hero-enterprise h1 {
    max-width: 900px;
    letter-spacing: 0;
}

.intake-hero-enterprise .lead {
    max-width: 760px;
}

.executive-panel {
    border-left: 0;
    border-top: 3px solid color-mix(in srgb, var(--gold), var(--blue) 35%);
    background:
        linear-gradient(145deg, rgba(255, 255, 255, .96), rgba(244, 247, 250, .9)),
        var(--surface-strong);
}

:root[data-theme="dark"] .executive-panel {
    background:
        linear-gradient(145deg, rgba(31, 36, 31, .95), rgba(18, 21, 18, .88)),
        var(--surface-strong);
}

.intake-form-enterprise {
    display: grid;
    grid-template-columns: 300px minmax(0, 1fr);
    align-items: start;
    gap: 1.25rem;
    margin-bottom: 2rem;
}

.intake-rail {
    position: sticky;
    top: 1rem;
    display: grid;
    gap: .9rem;
}

.intake-rail .progress-shell,
.intake-rail .step-nav,
.rail-note {
    box-shadow: var(--shadow-soft);
}

.intake-form-enterprise .step-nav {
    position: static;
    grid-template-columns: 1fr;
    gap: .35rem;
    margin: 0;
    padding: .55rem;
    backdrop-filter: blur(18px);
}

.intake-form-enterprise .step-nav button {
    justify-content: flex-start;
    text-align: left;
    min-height: 2.8rem;
    padding: 0 .85rem;
}

.intake-form-enterprise .step-nav button.is-active {
    background:
        linear-gradient(135deg, var(--dark), color-mix(in srgb, var(--dark), var(--blue) 16%));
    color: #fff;
}

.rail-note {
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
    padding: 1rem;
}

.rail-note span {
    display: block;
    color: var(--gold);
    font-size: .78rem;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.rail-note p {
    margin: .45rem 0 0;
    color: var(--muted);
    line-height: 1.5;
}

.intake-panels {
    min-width: 0;
}

.intake-form-enterprise .form-section {
    grid-template-columns: minmax(220px, .34fr) minmax(0, 1fr);
    padding: 1.45rem;
    border-color: color-mix(in srgb, var(--line), var(--dark) 8%);
    background:
        linear-gradient(180deg, color-mix(in srgb, var(--surface-strong), transparent 2%), var(--surface)),
        var(--surface-strong);
}

.intake-form-enterprise .form-section > div:first-child {
    border-right: 1px solid var(--line);
    padding-right: 1.2rem;
}

.intake-form-enterprise .form-section > div:first-child h2 {
    margin-bottom: .55rem;
}

.intake-form-enterprise .form-section > div:first-child p:last-child {
    color: var(--muted);
    line-height: 1.55;
}

.intake-form-enterprise input,
.intake-form-enterprise select,
.intake-form-enterprise textarea {
    min-height: 3rem;
    background: color-mix(in srgb, var(--surface-strong), var(--paper-strong) 70%);
}

.intake-form-enterprise textarea {
    min-height: 7rem;
}

.conditional-field.is-hidden-conditional {
    display: none;
}

.dense-choice-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.compact-choice-grid {
    grid-template-columns: 1fr;
}

.reference-grid {
    display: grid;
    grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
    gap: 1rem;
}

.scope-matrix,
.service-category-grid {
    display: grid;
    gap: 1rem;
}

.scope-group,
.service-category {
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: color-mix(in srgb, var(--surface-strong), transparent 4%);
    padding: 1rem;
}

.scope-group h3,
.service-category h4 {
    margin: 0 0 .8rem;
    font-size: .9rem;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--muted);
}

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

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

.budget-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.package-choice {
    position: relative;
}

.package-choice .choice-copy em {
    font-style: normal;
    color: var(--gold);
    font-weight: 900;
}

.choice-copy {
    min-width: 0;
}

.budget-choice {
    min-height: 4rem;
}

.budget-choice span {
    line-height: 1.25;
}

.intake-form-enterprise .choice,
.intake-form-enterprise .service-option {
    border-radius: 8px;
}

.intake-form-enterprise .choice:has(input:checked),
.intake-form-enterprise .service-option:has(input:checked) {
    border-color: color-mix(in srgb, var(--gold), var(--blue) 26%);
    background:
        linear-gradient(145deg, rgba(183, 134, 44, .11), rgba(33, 95, 189, .07)),
        var(--surface-strong);
}

.intake-form-enterprise .step-actions {
    padding-right: 0;
}

@media (max-width: 1120px) {
    .dense-choice-grid,
    .budget-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .package-grid,
    .service-category .service-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 900px) {
    .intake-hero-enterprise,
    .intake-form-enterprise {
        grid-template-columns: 1fr;
    }

    .intake-rail {
        position: static;
    }

    .intake-form-enterprise .step-nav {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .intake-form-enterprise .step-nav button {
        justify-content: center;
        text-align: center;
        padding: 0 .55rem;
    }

    .intake-form-enterprise .form-section {
        grid-template-columns: 1fr;
    }

    .intake-form-enterprise .form-section > div:first-child {
        border-right: 0;
        border-bottom: 1px solid var(--line);
        padding: 0 0 1rem;
    }

    .reference-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 640px) {
    .intake-hero-enterprise {
        padding-top: 1.8rem;
    }

    .intake-form-enterprise .step-nav,
    .dense-choice-grid,
    .budget-grid,
    .field-grid {
        grid-template-columns: 1fr;
    }

    .intake-form-enterprise .form-section,
    .scope-group,
    .service-category {
        padding: 1rem;
    }

    .intake-form-enterprise .step-actions {
        justify-content: stretch;
    }

    .intake-form-enterprise .step-actions .button {
        flex: 1;
    }
}


