/*
    CSS file for NOYO
*/


/*  Fonts (self-hosted: Red Hat Display and Red Hat Text, SIL Open Font License, text in assets/fonts/OFL-RedHat.txt)
-------------------------------------------*/

    @font-face {
        font-family: "Red Hat Display";
        font-style: normal;
        font-weight: 300 900;
        font-display: swap;
        src: url("../fonts/RedHatDisplay-latin.woff2") format("woff2");
        unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
    }

    @font-face {
        font-family: "Red Hat Display";
        font-style: normal;
        font-weight: 300 900;
        font-display: swap;
        src: url("../fonts/RedHatDisplay-latin-ext.woff2") format("woff2");
        unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
    }

    @font-face {
        font-family: "Red Hat Text";
        font-style: normal;
        font-weight: 300 700;
        font-display: swap;
        src: url("../fonts/RedHatText-latin.woff2") format("woff2");
        unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
    }

    @font-face {
        font-family: "Red Hat Text";
        font-style: normal;
        font-weight: 300 700;
        font-display: swap;
        src: url("../fonts/RedHatText-latin-ext.woff2") format("woff2");
        unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
    }


/*  Site
-------------------------------------------*/

    :root {
        color-scheme: dark;
        --color-white: #FFFFFF;
        --color-off-white: #F7F7F7;
        --color-pale-lavender: #EEECF3;
        --color-lavender: #DAD7E2;
        --color-dark-lavender: #CBC6D3;
        --color-grey: #8A8A90;
        --color-mute-purple: #5A5663;
        --color-dark-grey: #252525;
        --color-light-charcoal: #2A2832;
        --color-charcoal: #242228;
        --color-black: #1A1A18;
        --color-black-line: rgb(255 255 255 / 0.14);
        --color-purple: #572672;
        --color-indigo: #52389B;
        --color-magenta: #952C5A;
        --color-pink: #E36FA3;
        --color-green: #1F9D6B;
        --color-amber: #F5B400;
        --on-magenta: #FFFFFF;
        --matte: saturate(.84) contrast(.9) brightness(1.04);
        /* roles: the page is dark; white sections reset them below */
        --surface: var(--color-black);
        --surface-raised: var(--color-charcoal);
        --surface-tint: var(--color-light-charcoal);
        --line: var(--color-black-line);
        --ink: var(--color-white);
        --ink-muted: var(--color-dark-lavender);
    }

    /* white sections */
    .on-white, .band-panel, .cta, .ask, .vs, .who, .faq, .get-started, #contact-form {
        --color-magenta: #952C5A;
        --on-magenta: #FFFFFF;
        --surface: var(--color-white);
        --surface-raised: var(--color-off-white);
        --surface-tint: var(--color-pale-lavender);
        --line: var(--color-lavender);
        --ink: var(--color-dark-grey);
        --ink-muted: var(--color-mute-purple);
        color: var(--ink);
    }

    * {
        box-sizing: border-box;
    }

    body {
        margin: 0;
        background: var(--surface);
        color: var(--ink);
        font: 400 18px/1.6 var(--ff-body);
        -webkit-font-smoothing: antialiased;
    }

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

    a {
        color: inherit;
    }

    h1, h2, h3 {
        margin: 0;
        font-weight: 500;
        letter-spacing: -.01em;
    }

    h2 {
        font-size: clamp(30px, 3.4vw, 44px);
    }

    h3 {
        font-size: 20px;
        line-height: 1.3;
    }

    p {
        margin: 0;
    }

    .wrap {
        max-width: var(--max);
        margin: 0 auto;
        padding-left: max(24px, env(safe-area-inset-left, 0px));
        padding-right: max(24px, env(safe-area-inset-right, 0px));
    }

    .lede {
        color: var(--ink-muted);
        max-width: 56ch;
        margin-top: 16px;
    }

    .btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font: 600 17px/1 var(--ff-body);
        text-decoration: none;
        border: 0;
        cursor: pointer;
    }

    .btn-line {
        color: var(--color-white);
        box-shadow: inset 0 0 0 1px var(--color-dark-lavender);
    }

    .btn-line:hover {
        box-shadow: inset 0 0 0 2px var(--color-white);
    }

    .btn-outline {
        color: var(--ink);
        box-shadow: inset 0 0 0 1px var(--ink);
    }

    .btn:focus-visible, a:focus-visible {
        outline: 3px solid var(--color-magenta);
        outline-offset: 3px;
    }

    .concept {
        background: var(--surface-tint);
        color: var(--ink-muted);
        font-size: 13px;
        text-align: center;
        padding: 6px 16px;
    }


    /*
     *  Header
     */
    .top {
        background: var(--surface);
        border-bottom: 1px solid var(--line);
        top: env(safe-area-inset-top, 0px);
        z-index: 10;
    }

        .top .wrap {
            display: flex;
            align-items: center;
        }

    .brand {
        display: flex;
        align-items: center;
        text-decoration: none;
        flex: none;
    }

        .brand svg {
            height: auto;
        }

        .brand img {
            width: auto;
        }

    .nav {
        display: flex;
    }

        .nav a {
            text-decoration: none;
        }

        .nav a:hover {
            text-decoration: underline;
            text-decoration-color: var(--color-magenta);
            text-underline-offset: 6px;
            text-decoration-thickness: 2px;
        }

        .top .right {
            margin-left: auto;
            display: flex;
            align-items: center;
        }

        .top .phone {
            font-size: 16px;
            font-weight: 500;
            text-decoration: none;
            white-space: nowrap;
        }


    /*
     *  Opening
     */
    .open {
        --color-magenta: var(--color-pink);
        --on-magenta: var(--color-black);
        background: var(--color-black);
        color: var(--color-white);
        overflow: hidden;
    }

        .open .grid {
            display: grid;
            grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr);
            align-items: center;
        }

        .open h1 {
            font-size: clamp(40px, 5.2vw, 70px);
        }

        .open .lede {
            color: var(--color-dark-lavender);
        }

        .open .actions {
            display: flex;
            flex-wrap: wrap;
            gap: 12px;
            margin-top: 36px;
        }

        .open .mark {
            max-width: 440px;
            justify-self: end;
            width: 100%;
        }

    .facts {
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        border-top: 1px solid var(--color-black-line);
    }

        .facts div {
            padding: 24px 24px 28px 0;
        }

            .facts div + div {
                padding-left: 24px;
                border-left: 1px solid var(--color-black-line);
            }

        .facts strong {
            display: block;
            color: var(--color-white);
        }

        .facts span {
            font-size: 15px;
            color: var(--color-dark-lavender);
        }

    .f1 {
        width: 100%;
        height: auto;
        display: block;
    }

        .f1 .g {
            fill: var(--color-grey);
        }

        .f1 .o {
            fill: var(--color-magenta);
        }

        .f1 .ph {
            fill: var(--color-light-charcoal);
        }

        .f1 image {
            filter: var(--matte);
        }

        .slide .o {
            animation: slide 900ms cubic-bezier(.2,.7,.2,1) 250ms both;
        }

    @keyframes slide {
        from {
            transform: translateX(120px);
        }

        to {
            transform: none;
        }
    }

    /*
     *  Services
     */
    .svc-head {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        gap: 32px 64px;
        align-items: end;
    }

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

        .svc article {
            background: var(--surface-raised);
            display: grid;
            grid-template-rows: auto 1fr;
        }

            .svc article img {
                width: 100%;
                aspect-ratio: 16 / 9;
                object-fit: cover;
                filter: var(--matte);
                background: var(--surface-tint);
            }

        .svc .body {
            padding: 32px;
            display: flex;
            flex-direction: column;
        }

            .svc .body p {
                color: var(--ink-muted);
                margin-top: 10px;
            }

        .svc ul {
            list-style: none;
            padding: 0;
            margin: 20px 0 28px;
        }

        .svc li {
            border-top: 1px solid var(--line);
            font-size: 17px;
        }

        .svc .more {
            margin-top: auto;
            font-weight: 600;
            text-decoration-color: var(--color-magenta);
            text-underline-offset: 6px;
            text-decoration-thickness: 2px;
        }


    /*
     *  Comparison
     */
    .vs-grid {
        display: grid;
        grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
        gap: 64px;
    }

        .vs table {
            width: 100%;
            border-collapse: collapse;
            font-size: 17px;
        }

        .vs th {
            text-align: left;
            vertical-align: bottom;
            padding: 0 16px 12px 0;
            border-bottom: 2px solid var(--ink);
            font: 700 22px/1.3 var(--ff-heading);
            letter-spacing: -0.01em;
            color: var(--ink);
        }

        .vs td {
            padding: 14px 16px 14px 0;
            border-bottom: 1px solid var(--line);
            vertical-align: top;
            width: 50%;
        }

        .vs td:first-child {
            color: var(--ink-muted);
        }

        .vs td:last-child {
            font-weight: 500;
        }


    /*
     *  Response
     */
    .resp {
        --color-magenta: var(--color-pink);
        --on-magenta: var(--color-black);
        background: var(--color-black);
        color: var(--color-white);
    }

        .resp .lede {
            color: var(--color-dark-lavender);
        }

    .steps {
        list-style: none;
        padding: 0;
        margin: 56px 0 0;
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 0;
        counter-reset: s;
        border-top: 1px solid var(--color-black-line);
    }

        .steps li {
            counter-increment: s;
            padding: 28px 28px 8px 0;
        }

            .steps li + li {
                padding-left: 28px;
                border-left: 1px solid var(--color-black-line);
            }

        .steps li::before {
            content: counter(s);
            display: flex;
            align-items: center;
            justify-content: center;
            width: 40px;
            height: 40px;
            background: var(--color-magenta);
            color: var(--on-magenta);
            font-weight: 600;
            margin-bottom: 20px;
        }

        .steps p {
            color: var(--color-dark-lavender);
            margin-top: 8px;
            font-size: 16px;
        }


    /*
     *  Leadership report
     */
    .lead-grid {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        gap: 64px;
        align-items: center;
    }

    .report {
        background: var(--surface-raised);
        padding: 32px;
    }

        .report .rh {
            display: flex;
            justify-content: space-between;
            gap: 16px;
            align-items: baseline;
            padding-bottom: 16px;
            border-bottom: 2px solid var(--ink);
        }

            .report .rh strong {
                font-weight: 600;
            }

            .report .rh span {
                font-size: 14px;
                color: var(--ink-muted);
            }

        .report dl {
            margin: 0;
        }

        .report .row {
            display: grid;
            grid-template-columns: 14px minmax(0, 1fr) auto;
            gap: 14px;
            align-items: center;
            padding: 14px 0;
            border-bottom: 1px solid var(--line);
            font-size: 16px;
        }

        .report .row:last-child {
            border-bottom: 0;
        }

        .report dt {
            color: var(--ink-muted);
        }

        .report dd {
            margin: 0;
            font-weight: 600;
            font-variant-numeric: tabular-nums;
        }

    .sq {
        width: 12px;
        height: 12px;
    }

    .sq.ok {
        background: var(--color-green);
    }

    .sq.warn {
        background: var(--color-amber);
    }

    .sq.act {
        background: var(--color-magenta);
    }

        .report .foot {
            margin-top: 16px;
            font-size: 13px;
            color: var(--ink-muted);
        }


    /*
     *  People
     */
    .people {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        gap: 64px;
        align-items: center;
    }

        .people .actions {
            margin-top: 28px;
            display: flex;
            gap: 12px;
            flex-wrap: wrap;
        }

    .offices {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 16px;
        margin-top: 32px;
    }

        .offices div {
            border-top: 2px solid var(--ink);
            padding-top: 12px;
        }

        .offices span {
            display: block;
            font-size: 15px;
            color: var(--ink-muted);
        }


    /*
     *  Call to action band
     */
        .cta .wrap {
            grid-template-columns: minmax(0, 1fr) auto;
            gap: 32px;
            align-items: center;
        }

        .cta p {
            margin-top: 10px;
            font-size: 19px;
        }

    footer {
        --color-magenta: var(--color-pink);
        --on-magenta: var(--color-black);
        background: var(--color-black);
        color: var(--color-dark-lavender);
        font-size: 15px;
    }

        footer .cols {
            display: grid;
            grid-template-columns: 1.4fr 1fr 1fr 1fr;
            gap: 32px;
        }

        footer img {
            height: 96px;
            width: auto;
        }

        footer strong {
            color: var(--color-white);
            font-weight: 600;
            display: block;
            margin-bottom: 8px;
        }

        footer ul {
            list-style: none;
            padding: 0;
            margin: 0;
        }

        footer li {
            padding: 3px 0;
        }

        footer .legal {
            margin-top: 48px;
            padding-top: 20px;
            border-top: 1px solid var(--color-black-line);
            font-size: 14px;
        }


    /*
     *  Inner page components
     */
        .nav a[aria-current="page"] {
            text-decoration: underline;
            text-decoration-color: var(--color-magenta);
            text-underline-offset: 6px;
            text-decoration-thickness: 2px;
        }

    .open.inner {
        padding-block: 88px;
        position: relative;
    }

        .open.inner .mark {
            max-width: 380px;
        }


    /*
     *  Sub page hero photo
     */
        .open.inner > .wrap {
            z-index: 1;
            position: relative;
        }

    .open.inner::before {
        content: "";
        inset: 0;
        pointer-events: none;
        z-index: 0;
        background: url("../img/scenes/data-hall-aisle-16x9.webp") center / cover no-repeat;
        -webkit-mask-image: linear-gradient(to right, transparent 20%, #000 62%);
        mask-image: linear-gradient(to right, transparent 20%, #000 62%);
        position: absolute;
    }

    .open.inner:has(.lp-solo)::before {
        -webkit-mask-image: linear-gradient(to right, transparent 74%, #000 96%);
        mask-image: linear-gradient(to right, transparent 74%, #000 96%);
    }

    .tiles {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 24px;
    }

        .tiles article {
            background: var(--surface-raised);
            padding: 32px;
        }

            .tiles article p {
                color: var(--ink-muted);
                margin-top: 10px;
                font-size: 17px;
            }

    .data {
        width: 100%;
        border-collapse: collapse;
        font-size: 17px;
        background: var(--surface-raised);
    }

        .data th, .data td {
            text-align: left;
            padding: 16px 20px;
            border-bottom: 1px solid var(--line);
            vertical-align: top;
        }

            .data thead th {
                --color-magenta: var(--color-pink);
                --on-magenta: var(--color-black);
                background: var(--color-black);
                color: var(--color-white);
                font-weight: 600;
                font-size: 15px;
            }

            .data tbody th {
                font-weight: 600;
                width: 32%;
            }

        .data td {
            color: var(--ink-muted);
        }

            .data tr:last-child th, .data tr:last-child td {
                border-bottom: 0;
            }

    .table-wrap {
        overflow-x: auto;
    }

        .table-wrap .data {
            min-width: 36rem;
        }

    .aside {
        margin-top: 20px;
        font-size: 15px;
        color: var(--ink-muted);
    }

    .steps.light {
        border-top-color: var(--line);
    }

            .steps.light li + li {
                border-left-color: var(--line);
            }

        .steps.light li::before {
            --color-magenta: var(--color-pink);
            --on-magenta: var(--color-black);
            background: var(--color-black);
            color: var(--color-white);
        }

        .steps.light p {
            color: var(--ink-muted);
        }


    /*
     *  Hero opt-in form
     */
    :root {
        --magenta-text: #952C5A;
        --error: #B42318;
        --error-on-black: #FF9B8F;
        --cover-black-80: rgb(26 26 24 / 0.8);
    }

            .open .grid > .hero-form {
                justify-self: end;
                width: 100%;
                max-width: 480px;
            }

    .hero-form {
        background: var(--color-white);
        color: var(--ink);
        padding: 32px;
    }

        .hero-form h2 {
            line-height: 1.2;
        }

        .hero-form .intro {
            color: var(--ink-muted);
            font-size: 16px;
            line-height: 1.5;
            margin: 8px 0 22px;
        }

        .hero-form .foot {
            color: var(--ink-muted);
            font-size: 14px;
            margin-top: 14px;
        }

        .hero-form .gform_fields {
            display: grid;
            grid-template-columns: repeat(12, minmax(0, 1fr));
            gap: 16px 12px;
        }

        .hero-form .gfield {
            grid-column: span 12;
            min-width: 0;
            margin: 0;
            padding: 0;
            border: 0;
        }

        .hero-form .gfield--width-half {
            grid-column: span 6;
        }

        .hero-form .gfield_label {
            display: block;
            font-size: 15px;
            font-weight: 600;
            line-height: 1.3;
            margin-bottom: 6px;
        }

        .hero-form .gfield_required_text_asterisk {
            color: var(--magenta-text);
            margin-left: 3px;
        }

        .hero-form .gfield_required_text_screen_reader, .screen-reader-text {
            width: 1px;
            height: 1px;
            padding: 0;
            margin: -1px;
            overflow: hidden;
            clip: rect(0 0 0 0);
            white-space: nowrap;
            border: 0;
            position: absolute;
        }

        .hero-form .gform_validation_container,
        .hero-form .gform_hidden,
        .hero-form .gfield--type-hidden,
        .hero-form .gfield_visibility_hidden,
        .hero-form .gform_heading {
            display: none;
        }

            .hero-form .ginput_container input, .hero-form .ginput_container select {
                display: block;
                width: 100%;
                min-height: 48px;
                padding: 10px 14px;
                margin: 0;
                font: 400 16px/1.3 var(--ff-body);
                color: var(--ink);
                background: var(--color-off-white);
                border: 1px solid var(--color-grey);
                border-radius: 0;
                -webkit-appearance: none;
                appearance: none;
            }

            .hero-form .ginput_container select {
                padding-right: 40px;
                cursor: pointer;
                background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 12'%3E%3Cpath fill='none' stroke='%231A1A18' stroke-width='2' d='M2 3l6 6 6-6'/%3E%3C/svg%3E");
                background-repeat: no-repeat;
                background-position: right 14px center;
                background-size: 14px 10px;
            }

            .hero-form .ginput_container input:hover, .hero-form .ginput_container select:hover {
                border-color: var(--color-black);
            }

            .hero-form .ginput_container input:focus-visible, .hero-form .ginput_container select:focus-visible {
                outline: 3px solid var(--color-magenta);
                outline-offset: 0;
                border-color: var(--color-black);
                background: var(--color-white);
            }

            .hero-form .gfield_error input, .hero-form .gfield_error select {
                border-color: var(--error);
                border-width: 2px;
            }

        .hero-form .gfield_validation_message {
            color: var(--error);
            font-size: 14px;
            margin-top: 6px;
        }

        .hero-form .gform_footer {
            margin-top: 22px;
        }

        .hero-form .gform_button {
            display: flex;
            align-items: center;
            width: 100%;
            min-height: 54px;
            border: 0;
            border-radius: 0;
            font: 600 17px/1 var(--ff-body);
            cursor: pointer;
        }

        .hero-form .gform_confirmation_message {
            padding: 20px;
            background: var(--color-off-white);
            font-size: 17px;
        }


    /*
     *  Homepage style pass
     */
    .home-open {
        --color-magenta: var(--color-pink);
        --on-magenta: var(--color-black);
        overflow: visible;
        background-color: var(--color-black);
        background-size: 80px 80px;
        background-position: -1px -1px;
        position: relative;
    }

        .facts strong::before {
            content: "";
            width: 10px;
            height: 10px;
            background: var(--color-grey);
            margin-bottom: 16px;
        }

    .pano {
        margin: 72px 0 0;
    }

        .pano figcaption {
            margin-top: 16px;
            padding-left: calc(100% / 24);
            color: var(--color-dark-lavender);
            font-size: 15px;
        }

            .report .rh strong {
                display: flex;
                align-items: center;
                gap: 10px;
            }

            .report .rh svg {
                width: 16px;
                height: auto;
                flex: none;
            }

    .weeks {
        margin-top: 20px;
        padding-top: 16px;
        border-top: 2px solid var(--ink);
    }

        .weeks p {
            font-size: 15px;
            color: var(--ink-muted);
            margin-bottom: 10px;
        }

    .cells {
        display: grid;
        grid-template-columns: repeat(12, minmax(0, 1fr));
        gap: 4px;
    }

        .cells i {
            display: block;
            aspect-ratio: 1;
        }

        .cells .ok {
            background: var(--color-green);
        }

        .cells .warn {
            background: var(--color-amber);
        }


    /*
     *  Closing band frame
     */
    .cta {
        overflow: hidden;
        position: relative;
    }

        .cta .wrap {
            z-index: 1;
            position: relative;
        }

    .cta::after {
        right: -60px;
        top: 50%;
        width: 300px;
        height: 360px;
        transform: translateY(-50%);
        opacity: .14;
        background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 720'%3E%3Cpolygon fill='%231A1A18' points='0 0 0 720 240 720 240 600 120 600 120 120 480 120 480 240 600 240 600 0'/%3E%3C/svg%3E") no-repeat center / contain;
        position: absolute;
    }


    /*
     *  Homepage story
     */
        .concept a {
            color: inherit;
            font-weight: 600;
        }


    /*
     *  Icons
     */
    .ph {
        line-height: 1;
    }

        .btn .ph {
            font-size: 20px;
        }


    /*
     *  Utility bar
     */
    .util {
        --color-magenta: var(--color-pink);
        --on-magenta: var(--color-black);
        background: var(--color-black);
        color: var(--color-dark-lavender);
        font-size: 14px;
        border-bottom: 1px solid var(--color-black-line);
    }

        .util .wrap {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 16px;
            min-height: 40px;
        }

        .util nav {
            display: flex;
            gap: 24px;
        }

        .util a {
            display: inline-flex;
            align-items: center;
            gap: 7px;
            color: var(--color-dark-lavender);
            text-decoration: none;
            white-space: nowrap;
        }

        .util a:hover {
            color: var(--color-white);
        }

        .util .ph {
            font-size: 16px;
        }


    /*
     *  Hero
     */
        .open .grid {
            grid-template-columns: minmax(0, 1fr) minmax(320px, 480px);
        }

        .open h1 {
            font-size: clamp(36px, 3.9vw, 54px);
        }


    /*
     *  Facts
     */
        .facts strong::before {
            display: none;
        }

        .facts .ph {
            display: block;
            font-size: 24px;
            color: var(--color-dark-lavender);
            margin-bottom: 14px;
        }


    /*
     *  Shared section rhythm
     */
    .vs, .who, .faq, .get-started {
        background: var(--surface);
    }


    /*
     *  The questions leaders ask
     */
    .asks {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 24px;
    }

    .ask {
        background: var(--surface-raised);
        grid-template-columns: 48px minmax(0, 1fr);
        column-gap: 20px;
        align-items: start;
    }

        .ask .ph {
            grid-row: span 2;
            font-size: 30px;
            color: var(--ink);
            padding-top: 2px;
        }

        .ask h3 {
            line-height: 1.3;
        }

        .ask p {
            color: var(--ink-muted);
        }


    /*
     *  Services
     */
        .svc h3 {
            display: flex;
            align-items: center;
            gap: 12px;
            font-size: 22px;
        }

            .svc h3 .ph {
                font-size: 26px;
            }

        .svc .more {
            display: inline-flex;
            align-items: center;
        }


    /*
     *  Around the clock
     */
    .watch {
        --color-magenta: var(--color-pink);
        --on-magenta: var(--color-black);
        background: var(--color-black);
        color: var(--color-white);
    }

        .watch h2 {
            color: var(--color-white);
        }

        .watch .lede {
            color: var(--color-dark-lavender);
        }

    .clock {
        margin-top: 8px;
    }

    .hours {
        display: grid;
        grid-template-columns: repeat(24, minmax(0, 1fr));
        gap: 4px;
    }

    .hours {
        margin-top: 10px;
        font-size: 13px;
        color: var(--color-dark-lavender);
    }

        .hours span {
            white-space: nowrap;
        }

    .events {
        list-style: none;
        padding: 0;
        margin: 48px 0 0;
        border-top: 1px solid var(--color-black-line);
    }

        .events li {
            display: grid;
            grid-template-columns: 80px 160px minmax(0, 1fr);
            gap: 24px;
            align-items: baseline;
            padding: 18px 0;
            border-bottom: 1px solid var(--color-black-line);
        }

        .events time {
            font-variant-numeric: tabular-nums;
            font-weight: 600;
            font-size: 17px;
        }

        .events .tag {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            font-size: 15px;
            font-weight: 500;
            color: var(--color-dark-lavender);
        }

            .events .tag .ph {
                font-size: 18px;
            }

            .events li.act .tag {
                color: var(--color-magenta);
            }

        .events p {
            color: var(--color-white);
            font-size: 17px;
        }

    .watch-note {
        margin-top: 20px;
        font-size: 14px;
        color: var(--color-dark-lavender);
    }


    /*
     *  Who it's for
     */
    .fit {
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

        .fit > div {
            border-top: 2px solid var(--ink);
            padding-top: 24px;
        }

        .fit .ph {
            display: block;
            font-size: 30px;
            color: var(--ink);
            margin-bottom: 18px;
        }

        .fit p {
            color: var(--ink-muted);
            margin-top: 8px;
            font-size: 17px;
        }


    /*
     *  Their story
     */
    .story-grid {
        display: grid;
        grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
        align-items: center;
    }

    .story-list {
        list-style: none;
        padding: 0;
        margin: 36px 0 0;
    }

        .story-list li {
            display: grid;
            grid-template-columns: 150px minmax(0, 1fr);
            gap: 24px;
            padding: 18px 0;
            border-top: 1px solid var(--line);
        }

        .story-list li:last-child {
            border-bottom: 1px solid var(--line);
        }

        .story-list b {
            font-weight: 600;
        }

        .story-list p {
            color: var(--ink-muted);
        }

        .story .actions {
            display: flex;
            flex-wrap: wrap;
            gap: 12px;
            margin-top: 32px;
        }


    /*
     *  Questions
     */
    .faq-grid {
        display: grid;
        grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
    }

        .faq-list details {
            border-top: 1px solid var(--line);
        }

        .faq-list details:last-child {
            border-bottom: 1px solid var(--line);
        }

        .faq-list summary {
            list-style: none;
            cursor: pointer;
            display: flex;
            justify-content: space-between;
            align-items: center;
            gap: 24px;
            padding: 22px 0;
            font-size: 19px;
            font-weight: 600;
        }

        .faq-list summary::-webkit-details-marker {
            display: none;
        }

            .faq-list summary .ph {
                flex: none;
                font-size: 20px;
                color: var(--ink-muted);
                transition: transform .2s ease;
            }

                .faq-list details[open] summary .ph {
                    transform: rotate(45deg);
                }

        .faq-list summary:focus-visible {
            outline: 3px solid var(--color-magenta);
            outline-offset: 4px;
        }

            .faq-list details p {
                padding: 0 48px 24px 0;
                color: var(--ink-muted);
            }

            .faq-list details :is(ul, ol) {
                margin: 0;
                padding: 0 48px 24px 24px;
                color: var(--ink-muted);
            }

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

        .open h1 {
            font-size: clamp(34px, 3.6vw, 52px);
        }

            .svc article img {
                height: auto;
            }


    /*
     *  Square-grid fields
     */
    :root {
    }

    .home-open {
        background-image: none;
    }

        .home-open > .wrap, .watch > .wrap, .who > .wrap {
            z-index: 1;
            position: relative;
        }

    .home-open::before, .watch::before, .who::before {
        content: "";
        pointer-events: none;
        z-index: 0;
        background-repeat: repeat;
        position: absolute;
    }


    /*
     *  Homepage hero photo
     */
    .home-open::before {
        inset: 0;
        background: url("../img/scenes/data-hall-aisle-16x9.webp") center / cover no-repeat;
        -webkit-mask-image: linear-gradient(to right, transparent 34%, #000 78%);
        mask-image: linear-gradient(to right, transparent 34%, #000 78%);
    }

    .home-open .hero-copy {
        max-width: 44rem;
    }

    .watch {
        overflow: hidden;
        position: relative;
    }

    .watch::before {
        background-image: none;
    }

    .who {
        overflow: hidden;
        position: relative;
    }

    .who::before {
        right: 0;
        bottom: 0;
        width: 40%;
        height: 100%;
        background-image: none;
        background-position: right -1px bottom -1px;
        -webkit-mask-image: linear-gradient(315deg, #000 15%, transparent 65%);
        mask-image: linear-gradient(315deg, #000 15%, transparent 65%);
    }


    /*
     *  Closing band
     */
    .cta::after {
        display: none;
    }

        .cta h2 {
            color: var(--ink);
        }

        .cta .btn-navy {
            --color-magenta: var(--color-pink);
            --on-magenta: var(--color-black);
            background: var(--color-black);
            color: #FFFFFF;
        }

        .cta .btn-navy:hover {
            --color-magenta: var(--color-pink);
            --on-magenta: var(--color-black);
            background: #2A2832;
        }

        .cta .btn:focus-visible {
            outline-color: var(--ink);
        }


    /*
     *  Night track and phases
     */
    .watch-stats {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 0;
        margin: 0;
        border-top: 1px solid var(--color-black-line);
    }

        .watch-stats > div {
            padding: 18px 16px 0 0;
        }

            .watch-stats > div + div {
                padding-left: 16px;
                border-left: 1px solid var(--color-black-line);
            }

        .watch-stats dt {
            font-size: 30px;
            font-weight: 500;
            letter-spacing: -.01em;
            color: var(--color-white);
            font-variant-numeric: tabular-nums;
            white-space: nowrap;
        }

        .watch-stats dd {
            margin: 6px 0 0;
            font-size: 14px;
            line-height: 1.4;
            color: var(--color-dark-lavender);
        }

    .night {
        position: relative;
    }

    .m.act {
        background: var(--color-magenta);
    }

    .m.brief {
        background: #CBC6D3;
    }

    .m.done {
        background: var(--color-green);
    }

    .phase {
        background: rgb(255 255 255 / 0.04);
        padding: 24px 24px 12px;
    }

        .phase header {
            display: flex;
            flex-wrap: wrap;
            align-items: center;
            gap: 6px 12px;
            padding-bottom: 14px;
            border-bottom: 1px solid var(--color-black-line);
        }

            .phase header h3 {
                font-size: 18px;
                color: var(--color-white);
            }

            .phase header span {
                font-size: 14px;
                color: var(--color-dark-lavender);
                margin-left: auto;
                font-variant-numeric: tabular-nums;
            }

        .phase ol {
            list-style: none;
            padding: 0;
            margin: 0;
        }

        .phase li {
            display: grid;
            grid-template-columns: 52px minmax(0, 1fr);
            gap: 2px 14px;
            padding: 14px 0;
            border-bottom: 1px solid var(--color-black-line);
        }

        .phase li:last-child {
            border-bottom: 0;
        }

        .phase time {
            grid-row: span 2;
            font-variant-numeric: tabular-nums;
            font-weight: 600;
            font-size: 15px;
            color: var(--color-white);
            padding-top: 1px;
        }

        .phase .verb {
            display: inline-flex;
            align-items: center;
            gap: 6px;
            font-size: 14px;
            font-weight: 500;
            color: var(--color-dark-lavender);
        }

        .phase.act .verb {
            color: var(--color-magenta);
        }

            .phase .verb .ph {
                font-size: 16px;
            }

        .phase p {
            font-size: 15px;
            line-height: 1.5;
            color: var(--color-white);
            margin-top: 2px;
        }


    /*
     *  Network explainer
     */
    .explainer {
        margin: 32px 0 0;
    }

        .explainer img {
            width: 100%;
            height: auto;
            display: block;
        }

        .explainer figcaption {
            margin-top: 10px;
            font-size: 14px;
            color: var(--ink-muted);
        }


    /*
     *  Homepage opening
     */

    /*
     *  Primary buttons
     */
        .hero-form .gform_button:focus-visible {
            outline: 3px solid var(--color-magenta);
            outline-offset: 3px;
        }


    /*
     *  Outcomes column and rail
     */
    .watch-grid {
        display: grid;
        grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr);
    }

        .watch-side h2 {
            margin-bottom: 0;
        }

            .watch-grid .watch-stats > div {
                grid-template-columns: 150px minmax(0, 1fr);
                gap: 16px;
                align-items: baseline;
                border-top: 1px solid var(--color-black-line);
                border-left: 0;
            }

            .watch-grid .watch-stats dd {
                margin: 0;
            }

        .watch-side .watch-note {
            margin-top: 24px;
        }

    .tl {
        list-style: none;
        margin: 0;
        padding: 0;
        position: relative;
    }

    .tl::before {
        content: "";
        top: 6px;
        bottom: 6px;
        width: 1px;
        background: var(--color-black-line);
        position: absolute;
    }

    .tl-phase {
        margin: 0 0 4px 116px;
        padding-top: 28px;
        font-size: 14px;
        font-weight: 500;
        color: var(--color-dark-lavender);
    }

    .tl-phase:first-child {
        padding-top: 0;
    }

    .tl-ev {
        display: grid;
        grid-template-columns: 64px 44px minmax(0, 1fr);
        gap: 0 8px;
        align-items: start;
        padding: 14px 0;
    }

        .tl-ev time {
            font-variant-numeric: tabular-nums;
            font-weight: 600;
            font-size: 16px;
            color: var(--color-white);
            padding-top: 1px;
        }

        .tl-ev .node {
            --color-magenta: var(--color-pink);
            --on-magenta: var(--color-black);
            justify-self: center;
            width: 12px;
            height: 12px;
            margin-top: 6px;
            z-index: 1;
            background: var(--color-black);
            box-shadow: inset 0 0 0 2px var(--color-dark-lavender);
            position: relative;
        }

        .tl-ev.act .node {
            background: var(--color-magenta);
            box-shadow: none;
        }

        .tl-ev.look .node {
            box-shadow: inset 0 0 0 2px var(--color-magenta);
        }

        .tl-ev.brief .node {
            background: #CBC6D3;
            box-shadow: none;
        }

        .tl-ev.done .node {
            background: var(--color-green);
            box-shadow: none;
        }

        .tl-ev .verb {
            display: inline-flex;
            align-items: center;
            gap: 6px;
            font-size: 14px;
            font-weight: 500;
            color: var(--color-dark-lavender);
        }

        .tl-ev.act .verb, .tl-ev.look .verb {
            color: var(--color-magenta);
        }

            .tl-ev .verb .ph {
                font-size: 16px;
            }

        .tl-ev p {
            margin-top: 4px;
            font-size: 16px;
            line-height: 1.55;
            color: var(--color-white);
        }


    /*
     *  Grid texture placement
     */
    .watch::before {
        top: auto;
        bottom: 0;
        right: 0;
        width: 38%;
        height: 360px;
        -webkit-mask-image: linear-gradient(315deg, #000 15%, transparent 65%);
        mask-image: linear-gradient(315deg, #000 15%, transparent 65%);
        opacity: .5;
    }

    .tl::before {
        left: 93.5px;
    }

    .tl-phase {
        margin-left: 124px;
    }


    /*
     *  Button icon cell
     */
    .btn-primary, .btn-navy {
        align-items: center;
        transition: background-color .15s ease;
    }

        .btn-primary .ph:first-child, .btn-navy .ph:first-child {
            align-items: center;
            justify-content: center;
            flex: none;
            margin-right: 20px;
        }

            .top .btn-primary .ph:first-child {
                margin-right: 16px;
            }

    .btn-primary:hover, .btn-navy:hover {
        background: var(--color-light-charcoal);
    }

    .btn-navy:hover {
        --color-magenta: var(--color-pink);
        --on-magenta: var(--color-black);
    }

            .hero-form .gform_button .ph {
                display: flex;
                align-items: center;
                justify-content: center;
                flex: none;
            }

    .ph-arrow-right::before {
        display: inline-block;
        transition: transform .15s ease;
    }

        .gform_button:hover .ph-arrow-right::before,
        .btn:hover .ph-arrow-right::before,
        .more:hover .ph-arrow-right::before {
            transform: translateX(3px);
        }

    .btn-line, .btn-outline {
        transition: box-shadow .15s ease, background-color .15s ease;
    }

    .btn-line:hover {
        background: rgb(255 255 255 / 0.06);
    }

    .btn-outline:hover {
        background: var(--color-magenta);
        color: var(--on-magenta);
        box-shadow: inset 0 0 0 1px var(--color-magenta);
    }


    /*
     *  Corner textures
     */
    .story, .faq {
        overflow: hidden;
        position: relative;
    }

        .story > .wrap, .faq > .wrap {
            z-index: 1;
            position: relative;
        }

    .story::before, .faq::before {
        content: "";
        pointer-events: none;
        z-index: 0;
        background-image: none;
        background-repeat: repeat;
        position: absolute;
    }

    .story::before {
        top: 0;
        left: 0;
        width: 46%;
        height: 100%;
        opacity: .7;
        -webkit-mask-image: radial-gradient(closest-side at 45% 50%, #000 30%, transparent 100%);
        mask-image: radial-gradient(closest-side at 45% 50%, #000 30%, transparent 100%);
    }

    .faq::before {
        bottom: 0;
        left: 0;
        width: 34%;
        height: 360px;
        opacity: .8;
        -webkit-mask-image: linear-gradient(45deg, #000 10%, transparent 60%);
        mask-image: linear-gradient(45deg, #000 10%, transparent 60%);
    }


    /*
     *  Closing call to action panel
     */
    .cta {
        background: var(--surface-raised);
        color: var(--ink);
    }

    .cta::after {
        content: none;
    }

        .cta .wrap {
            display: block;
        }

    .cta-card {
        --color-magenta: var(--color-pink);
        --on-magenta: var(--color-black);
        overflow: hidden;
        background: var(--color-black);
        color: var(--color-white);
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 28px 48px;
        align-items: center;
        position: relative;
    }

        .cta-card > * {
            z-index: 1;
            position: relative;
        }

    .cta-card::before {
        content: "";
        top: 0;
        right: 0;
        bottom: 0;
        width: 55%;
        z-index: 0;
        pointer-events: none;
        background-image: none;
        background-position: right -1px top -1px;
        opacity: .55;
        -webkit-mask-image: linear-gradient(to left, #000 20%, transparent);
        mask-image: linear-gradient(to left, #000 20%, transparent);
        position: absolute;
    }

            .cta .cta-card h2 {
                color: var(--color-white);
            }

            .cta .cta-card p {
                color: var(--color-dark-lavender);
                margin-top: 10px;
                font-size: 19px;
            }

            .cta .cta-card .btn-navy {
                background: #FFFFFF;
                color: var(--color-black);
            }

            .cta .cta-card .btn-navy:hover {
                background: #EEECF3;
            }

            .cta .cta-card .btn:focus-visible {
                outline-color: var(--color-magenta);
            }


    /*
     *  Type and sizing
     */
    :root {
        --ff-heading: "Red Hat Display", "Segoe UI", system-ui, -apple-system, Arial, sans-serif;
        --ff-body: "Red Hat Text", "Segoe UI", system-ui, -apple-system, Arial, sans-serif;
    }

    body {
        font-family: var(--ff-body);
        font-size: 18px;
    }

    h1,
    h2,
    h3,
    .kick,
    .btn,
    .facts strong,
    .watch-stats dt,
    .hero-form h2,
    .story-list b,
    .faq-list summary,
    .tl-ev time {
        font-family: var(--ff-heading);
    }

    h2 {
        font-size: clamp(34px, 4.4vw, 58px);
        font-weight: 800;
        line-height: 1.02;
        letter-spacing: -0.03em;
    }

    h3 {
        font-weight: 700;
        letter-spacing: -0.01em;
    }

    .lede {
        font-size: 20px;
        line-height: 1.55;
    }


    /*
     *  Hero
     */
        .open h1 {
            font-size: clamp(34px, calc((100vw - 534px) / 11), 78px);
            font-weight: 800;
            line-height: .98;
            letter-spacing: -0.035em;
            max-width: none;
        }

    .h-fixed {
        display: block;
    }

    .h-rot {
        display: block;
        color: var(--color-magenta);
        transition: opacity .28s ease, transform .28s ease;
    }

    .h-rot.is-out {
        opacity: 0;
        transform: translateY(-14px);
    }

        .open .kick {
            font-size: 18px;
            font-weight: 700;
            color: var(--color-magenta);
            letter-spacing: -0.005em;
            margin-bottom: 22px;
        }

        .hero-copy .lede {
            font-size: 22px;
            max-width: 34em;
        }

        .open .grid {
            grid-template-columns: minmax(0, 1fr) minmax(300px, 430px);
            gap: 56px;
        }


    /*
     *  Buttons
     */
    .btn {
        min-height: 54px;
        padding: 0 26px;
        gap: 10px;
        font-family: var(--ff-heading);
        font-weight: 700;
        border-radius: 0;
    }

    .btn-primary, .btn-navy {
        padding: 0 26px;
        gap: 10px;
    }

        .top .btn-primary {
            padding: 0 20px;
        }

        .btn-primary .ph:first-child,
        .btn-navy .ph:first-child,
        .top .btn-primary .ph:first-child,
        .btn-primary .ph,
        .btn-navy .ph {
            align-self: auto;
            display: inline-block;
            width: auto;
            margin: 0;
            background: none;
            color: inherit;
            font-size: 19px;
        }

    .btn-primary, .hero-form .gform_button, .cta .cta-card .btn-primary {
        background: var(--color-magenta);
        color: var(--on-magenta);
    }

    .btn-primary:hover, .hero-form .gform_button:hover, .cta .cta-card .btn-primary:hover {
        background: color-mix(in srgb, var(--color-magenta) 85%, var(--color-black));
    }

        .btn-primary .ph, .hero-form .gform_button .ph {
            color: var(--on-magenta);
        }

        .hero-form .gform_button {
            justify-content: center;
            padding: 0 24px;
            gap: 10px;
            font-family: var(--ff-heading);
            font-weight: 700;
        }

            .hero-form .gform_button .ph {
                align-self: auto;
                width: auto;
                background: none;
                font-size: 19px;
            }

    .btn-navy {
        --color-magenta: var(--color-pink);
        --on-magenta: var(--color-black);
        background: var(--color-black);
        color: #FFFFFF;
    }


    /*
     *  Section headers stack
     */
    .svc-head {
        display: block;
    }


    /*
     *  Lists and cards
     */

    /*
     *  Service rows
     */
        .svc li {
            padding: 10px 16px 10px 41px;
            background: linear-gradient(var(--color-black), var(--color-black)) left center / 0% 100% no-repeat;
            transition: background-size .25s cubic-bezier(.2, .7, .2, 1), color .12s ease-out;
            position: relative;
        }

        .svc li::before {
            content: "";
            left: 20px;
            top: calc(10px + .8em - 3.5px);
            width: 7px;
            height: 7px;
            background: var(--color-magenta);
            position: absolute;
        }

            .svc li .svc-link {
                color: inherit;
                text-decoration: none;
            }

        .svc li:has(.svc-link):hover, .svc li:has(.svc-link):focus-within {
            background-size: 100% 100%;
            color: var(--color-white);
        }

            .svc li:not(:has(.svc-link ~ .svc-link)) .svc-link::after {
                content: "";
                inset: 0;
                position: absolute;
            }

            .svc li:has(.svc-link ~ .svc-link) .svc-link:hover {
                text-decoration: underline;
                text-decoration-color: var(--color-magenta);
                text-decoration-thickness: 2px;
                text-underline-offset: 5px;
            }

    .ask {
        display: block;
        padding: 34px 34px 38px;
    }

        .ask h3 {
            font-size: 23px;
        }

        .ask p {
            margin-top: 10px;
        }

        .facts strong {
            font-weight: 800;
            letter-spacing: -0.02em;
        }

        .fit h3 {
            font-size: 21px;
        }

        .hero-form h2 {
            font-size: 26px;
            font-weight: 800;
            letter-spacing: -0.02em;
        }


    /*
     *  The F1 mark
     */
    .story-grid {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    }

        .story-grid > .mark {
            max-width: 560px;
            width: 100%;
        }


    /*
     *  Night replay
     */
    .tl::after {
        content: "";
        left: 93.5px;
        top: 6px;
        width: 1px;
        height: var(--progress, 0px);
        background: var(--color-magenta);
        transition: height .6s ease;
        z-index: 0;
        position: absolute;
    }

        .tl-ev .node {
            transition: transform .3s ease;
        }


    /*
     *  Deep navy two-column band
     */
    .ai {
        --color-magenta: var(--color-pink);
        --on-magenta: var(--color-black);
        background: var(--color-black);
        color: var(--color-white);
        overflow: hidden;
        position: relative;
    }

        .ai > .wrap {
            z-index: 1;
            position: relative;
        }

    .ai::before {
        content: "";
        top: 0;
        left: 0;
        width: 42%;
        height: 380px;
        pointer-events: none;
        background-image: none;
        opacity: .45;
        -webkit-mask-image: linear-gradient(135deg, #000 10%, transparent 60%);
        mask-image: linear-gradient(135deg, #000 10%, transparent 60%);
        position: absolute;
    }

        .ai h2, .ai h3 {
            color: var(--color-white);
        }

        .ai .lede {
            color: var(--color-dark-lavender);
        }

    .ai-cols {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0;
        margin-top: 8px;
        border-top: 1px solid var(--color-black-line);
    }

    .ai-col {
        padding: 36px 48px 8px 0;
    }

        .ai-col + .ai-col {
            padding-left: 48px;
            border-left: 1px solid var(--color-black-line);
        }

        .ai-col h3 {
            font-size: 26px;
            font-weight: 800;
            letter-spacing: -0.02em;
            display: flex;
            align-items: center;
            gap: 14px;
        }

        .ai-col h3::before {
            content: "";
            width: 12px;
            height: 12px;
            flex: none;
            background: var(--color-magenta);
        }

            .ai-col + .ai-col h3::before {
                background: transparent;
                box-shadow: inset 0 0 0 2px var(--color-magenta);
            }

        .ai-col ul {
            list-style: none;
            padding: 0;
            margin: 24px 0 0;
        }

        .ai-col li {
            padding: 18px 0;
            border-top: 1px solid var(--color-black-line);
        }

            .ai-col li strong {
                display: block;
                font-family: var(--ff-heading);
                font-weight: 700;
                font-size: 19px;
                color: var(--color-white);
            }

            .ai-col li span {
                display: block;
                margin-top: 6px;
                color: var(--color-dark-lavender);
                font-size: 17px;
                line-height: 1.55;
            }


    /*
     *  Header sizing
     */
        .top .wrap {
            min-height: 92px;
        }

    .brand {
        gap: 14px;
    }

        .brand svg {
            width: 38px;
        }

        .brand img {
            height: 30px;
        }

    .nav {
        font-family: var(--ff-heading);
    }

        .nav a {
            padding-block: 10px;
        }

        .top .btn {
            min-height: 52px;
            padding: 0 24px;
        }

            .hero-form .ginput_container input::placeholder {
                color: #6A6574;
                opacity: 1;
            }


    /*
     *  Mid widths
     */
        .nav a, .btn {
            white-space: nowrap;
        }

        .top .wrap {
            gap: 40px;
        }


    /*
     *  Mobile menu
     */
    .top {
        position: sticky;
    }

    .menu-btn {
        display: none;
        align-items: center;
        gap: 8px;
        min-height: 46px;
        padding: 0 16px;
        margin-left: auto;
        background: transparent;
        border: 1px solid var(--line);
        color: var(--ink);
        font: 700 16px/1 var(--ff-heading);
        cursor: pointer;
    }

        .menu-btn .ph {
            font-size: 22px;
        }

    .menu-btn:hover {
        border-color: var(--ink);
    }

    .menu-btn:focus-visible {
        outline: 3px solid var(--color-magenta);
        outline-offset: 2px;
    }

    .mobile-menu {
        border-top: 1px solid var(--line);
        border-bottom: 1px solid var(--line);
    }

        .mobile-menu .wrap {
            display: flex;
            flex-direction: column;
        }

        .mobile-menu a.mm-link {
            display: flex;
            align-items: center;
            justify-content: space-between;
            color: var(--ink);
            text-decoration: none;
        }

        .mobile-menu a.mm-link::after {
            content: "";
            width: 8px;
            height: 8px;
            background: var(--color-magenta);
        }

        .mobile-menu .btn {
            margin-top: 20px;
            justify-content: center;
        }

            .top .mobile-menu .wrap {
                display: flex;
                flex-direction: column;
                align-items: stretch;
                gap: 0;
                min-height: 0;
            }

            .top .mobile-menu .btn {
                display: inline-flex;
                margin-top: 22px;
                min-height: 54px;
                font-size: 17px;
            }


    /*
     *  Hero headline lines
     */
            .open h1 .h-fixed, .open h1 .h-rot {
                white-space: normal;
            }


    /*
     *  Section spacing
     */
    section {
        padding-block: 96px;
    }

    .open {
        padding-block: 72px 0;
    }

    .home-open {
        padding-bottom: 72px;
    }

    .facts {
        margin-top: 64px;
    }

    .sec-head, .svc-head {
        margin-bottom: 40px;
    }

        .svc-head .lede, .sec-head .lede, .watch-side .lede {
            margin-top: 14px;
        }

        .hero-copy .lede {
            margin-top: 20px;
        }

        .hero-copy .actions {
            margin-top: 30px;
        }

    .lines, .fit {
        gap: 32px;
    }

    .story-grid {
        gap: 72px;
    }

    .faq-grid {
        gap: 56px;
    }

    .watch-grid {
        gap: 48px 80px;
    }

    .cta {
        padding-block: 72px;
    }

    .cta-card {
        padding: 48px 48px 52px;
    }

    footer {
        padding-block: 56px 32px;
    }


    /*
     *  Buttons in capitals
     */
    .btn, .hero-form .gform_button, .mobile-menu .btn {
        text-transform: uppercase;
        letter-spacing: 0.04em;
        font-size: 15px;
    }

        .top .btn {
            font-size: 15px;
        }


    /*
     *  Overnight
     */
        .watch.has-player .tl {
            width: 1px;
            height: 1px;
            padding: 0;
            margin: -1px;
            overflow: hidden;
            clip: rect(0 0 0 0);
            white-space: nowrap;
            border: 0;
            position: absolute;
        }

    .watch-grid {
        align-items: center;
    }

        .watch-grid .watch-stats {
            display: grid;
            grid-template-columns: repeat(3, minmax(0, 1fr));
            margin-top: 36px;
            border-top: 1px solid var(--color-black-line);
        }

            .watch-grid .watch-stats > div {
                display: block;
                padding: 18px 16px 0 0;
                border: 0;
            }

                .watch-grid .watch-stats > div + div {
                    padding-left: 16px;
                    border-left: 1px solid var(--color-black-line);
                }

            .watch-grid .watch-stats > div:last-child {
                border-bottom: 0;
            }

            .watch-grid .watch-stats dt {
                font-size: 26px;
            }

            .watch-grid .watch-stats dd {
                margin-top: 6px;
                font-size: 14px;
            }

    .player {
        padding: 32px 40px 28px;
    }

    .player.brief {
        border-top-color: #CBC6D3;
    }

    .player.done {
        border-top-color: var(--color-green);
    }

    .pl-top {
        display: flex;
        justify-content: space-between;
        gap: 16px;
        font-size: 14px;
        color: var(--color-dark-lavender);
    }

    .pl-count {
        font-variant-numeric: tabular-nums;
    }

    .pl-body {
        margin-top: 18px;
        transition: opacity .22s ease, transform .22s ease;
    }

    .pl-body.is-out {
        opacity: 0;
        transform: translateY(6px);
    }

    .pl-time {
        font-family: var(--ff-heading);
        font-weight: 800;
        font-size: clamp(64px, 7vw, 104px);
        line-height: .95;
        letter-spacing: -0.04em;
        color: var(--color-white);
        font-variant-numeric: tabular-nums;
    }

    .pl-step {
        display: flex;
        align-items: center;
        gap: 8px;
        margin-top: 14px;
        font-family: var(--ff-heading);
        font-weight: 700;
        font-size: 20px;
        color: var(--color-magenta);
    }

        .player.brief .pl-step {
            color: #CBC6D3;
        }

        .player.done .pl-step {
            color: #4CC795;
        }

    .pl-text {
        margin-top: 10px;
        font-size: 21px;
        line-height: 1.45;
        color: var(--color-white);
    }

    .pl-foot {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 16px;
        margin-top: 24px;
        padding-top: 18px;
        border-top: 1px solid var(--color-black-line);
    }

    .pl-dots {
        display: flex;
        gap: 8px;
    }

    .pl-dot {
        width: 14px;
        height: 14px;
        padding: 0;
        border: 0;
        cursor: pointer;
        background: transparent;
        box-shadow: inset 0 0 0 2px rgb(255 255 255 / 0.25);
    }

    .pl-dot.is-past {
        background: rgb(255 255 255 / 0.25);
        box-shadow: none;
    }

    .pl-dot.is-on {
        background: var(--color-magenta);
        box-shadow: none;
    }

    .pl-dot.brief.is-on {
        background: #CBC6D3;
    }

    .pl-dot.done.is-on {
        background: var(--color-green);
    }

    .pl-toggle {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        min-height: 44px;
        padding: 0 12px;
        background: transparent;
        border: 1px solid var(--color-black-line);
        color: var(--color-dark-lavender);
        font: 500 14px/1 var(--ff-body);
        cursor: pointer;
    }

    .pl-toggle:hover {
        color: var(--color-white);
        border-color: var(--color-dark-lavender);
    }

    .pl-toggle:focus-visible {
        outline: 3px solid var(--color-magenta);
        outline-offset: 2px;
    }


    /*
     *  Wider layout and hero
     */
    :root {
        --max: 1360px;
    }

        .facts strong {
            font-size: 24px;
            white-space: nowrap;
        }


    /*
     *  Three-column points
     */
    .facts {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

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


    /*
     *  Hero rating and facts
     */
    .rating {
        display: flex;
        align-items: center;
        gap: 14px;
        margin: 0;
        padding-left: 8px;
    }

    .stars {
        display: block;
        width: 110px;
        height: 20px;
        flex: none;
        background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 20'%3E%3Cpolygon fill='rgba(255,255,255,0.22)' points='10 0.6 12.8 6.6 19.4 7.3 14.5 11.8 15.9 18.3 10 15 4.1 18.3 5.5 11.8 0.6 7.3 7.2 6.6'/%3E%3C/svg%3E") repeat-x 0 0 / 22px 20px;
        position: relative;
    }

    .stars-on {
        inset: 0 auto 0 0;
        width: 96%;
        background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 20'%3E%3Cpolygon fill='%23952C5A' points='10 0.6 12.8 6.6 19.4 7.3 14.5 11.8 15.9 18.3 10 15 4.1 18.3 5.5 11.8 0.6 7.3 7.2 6.6'/%3E%3C/svg%3E") repeat-x 0 0 / 22px 20px;
        position: absolute;
    }

    .rating-text {
        font-size: 15px;
        color: var(--color-dark-lavender);
        line-height: 1.3;
    }

        .rating-text b {
            font-family: var(--ff-heading);
            font-size: 22px;
            font-weight: 800;
            color: var(--color-white);
            margin-right: 4px;
            letter-spacing: -0.01em;
        }

        .open .actions {
            align-items: center;
            row-gap: 20px;
            column-gap: 28px;
        }

        .hero-copy .facts {
            margin-top: 56px;
        }

            .hero-copy .facts strong {
                font-size: 21px;
                white-space: normal;
            }

            .hero-copy .facts span {
                font-size: 14px;
            }

            .hero-copy .facts div {
                padding: 20px 16px 4px 0;
            }

                .hero-copy .facts div + div {
                    padding-left: 20px;
                }


    /*
     *  Hero buttons
     */
        .open .btn-line {
            background: var(--color-magenta);
            color: var(--on-magenta);
            box-shadow: none;
        }

        .open .btn-line:hover {
            background: color-mix(in srgb, var(--color-magenta) 85%, var(--color-black));
            box-shadow: none;
        }


    /*
     *  Full-width text
     */
    .sec-head, .svc-head {
        max-width: none;
    }

        .sec-head .lede,
        .svc-head .lede,
        .watch-side .lede,
        .aside,
        .cta p,
        .cta .cta-card p,
        .tl-ev p,
        .pl-text {
            max-width: none;
        }

        .watch-grid > h2 {
            grid-column: 1 / -1;
            margin: 0 0 -8px;
        }

    .pl-body {
        min-height: 0;
    }


    /*
     *  Our story photo
     */
    .story.has-photo {
        --color-magenta: var(--color-pink);
        --on-magenta: var(--color-black);
        isolation: isolate;
        background: var(--color-black);
        color: var(--color-white);
    }

    .story.has-photo::before {
        display: none;
    }

    .story-bg {
        inset: 0 auto 0 0;
        width: 62%;
        height: 100%;
        max-width: none;
        object-fit: cover;
        object-position: 35% 50%;
        z-index: -2;
        position: absolute;
    }

    .story.has-photo::after {
        content: "";
        inset: 0;
        z-index: -1;
        pointer-events: none;
        background: linear-gradient(90deg, rgb(26 26 24 / 0) 0%, rgb(26 26 24 / 0) 38%, rgb(26 26 24 / 0.72) 50%, rgb(26 26 24 / 0.95) 56%, var(--color-black) 62%);
        position: absolute;
    }

        .story.has-photo > .wrap {
            z-index: 1;
        }

        .story.has-photo .story-grid {
            min-height: 620px;
        }

        .story.has-photo h2 {
            color: var(--color-white);
        }

        .story.has-photo .lede {
            color: var(--color-white);
        }

            .story.has-photo .story-list p {
                color: var(--color-dark-lavender);
            }

            .story.has-photo .story-list li, .story.has-photo .story-list li:last-child {
                border-color: var(--color-black-line);
            }

        .story.has-photo .btn-navy {
            background: var(--color-magenta);
            color: var(--on-magenta);
        }

        .story.has-photo .btn-navy:hover {
            background: color-mix(in srgb, var(--color-magenta) 85%, var(--color-black));
        }

        .story.has-photo .btn-outline {
            color: var(--color-white);
            box-shadow: inset 0 0 0 1px var(--color-white);
        }

        .story.has-photo .btn-outline:hover {
            background: rgb(255 255 255 / 0.06);
            box-shadow: inset 0 0 0 2px var(--color-white);
        }


    /*
     *  Story photo placement
     */
    .story-bg {
        filter: saturate(.92) contrast(.96);
    }


    /*
     *  Header nav in capitals
     */
    .nav {
        font-size: 15px;
        font-weight: 700;
        letter-spacing: 0.06em;
        text-transform: uppercase;
        gap: 30px;
    }


    /*
     *  Mobile menu drawer
     */
    .mobile-menu {
        top: 0;
        right: 0;
        bottom: 0;
        left: auto;
        z-index: 60;
        width: min(440px, 88vw);
        display: none;
        flex-direction: column;
        overflow: hidden;
        background: var(--surface);
        border: 0;
        padding: env(safe-area-inset-top, 0px) 0 env(safe-area-inset-bottom, 0px);
        transform: translateX(100%);
        visibility: hidden;
        transition: transform .34s cubic-bezier(.2, .7, .2, 1), visibility 0s linear .34s;
        position: fixed;
    }

    .mobile-menu.is-open {
        transform: none;
        visibility: visible;
        transition: transform .34s cubic-bezier(.2, .7, .2, 1), visibility 0s;
    }

    .mm-scrim {
        display: none;
        inset: 0;
        z-index: 55;
        background: rgb(26 26 24 / 0.5);
        opacity: 0;
        visibility: hidden;
        transition: opacity .3s ease, visibility 0s linear .3s;
        position: fixed;
    }

    .mm-scrim.is-open {
        opacity: 1;
        visibility: visible;
        transition: opacity .3s ease;
    }

    .mm-lock, .mm-lock body {
        overflow: hidden;
    }

    .mm-head {
        z-index: 1;
        display: flex;
        justify-content: flex-end;
        align-items: center;
        min-height: 76px;
        padding: 0 max(20px, env(safe-area-inset-right, 0px)) 0 28px;
        position: relative;
    }

    .mm-close {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        min-height: 44px;
        padding: 0 16px;
        background: transparent;
        border: 1px solid var(--line);
        color: var(--ink);
        font: 700 15px/1 var(--ff-heading);
        letter-spacing: 0.06em;
        text-transform: uppercase;
        cursor: pointer;
    }

        .mm-close .ph {
            font-size: 20px;
        }

    .mm-close:hover {
        border-color: var(--ink);
    }

    .mm-close:focus-visible, .mobile-menu a:focus-visible {
        outline: 3px solid var(--color-magenta);
        outline-offset: 2px;
    }

    .mm-body {
        z-index: 1;
        display: flex;
        flex-direction: column;
        padding: 4px max(24px, env(safe-area-inset-right, 0px)) 0 28px;
        position: relative;
    }

        .mobile-menu a.mm-link {
            padding: 18px 0;
            font: 700 17px/1.2 var(--ff-heading);
            letter-spacing: 0.06em;
            text-transform: uppercase;
        }

            .mobile-menu .mm-body .btn {
                display: inline-flex;
                justify-content: center;
                margin-top: 24px;
                min-height: 54px;
                font-size: 15px;
            }

    .mm-photo {
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 0;
        width: 100%;
        height: 44%;
        max-width: none;
        object-fit: cover;
        object-position: 35% 55%;
        filter: saturate(.92) contrast(.96);
        -webkit-mask-image: linear-gradient(to bottom, transparent 0%, rgb(0 0 0 / 0.55) 35%, #000 75%);
        mask-image: linear-gradient(to bottom, transparent 0%, rgb(0 0 0 / 0.55) 35%, #000 75%);
        position: absolute;
    }


    /*
     *  Flat cards
     */
    :root {
        --color-charcoal: #242228;
    }

    .player, .player.brief, .player.done {
        background: var(--color-charcoal);
        border-top: 0;
    }

        .tiles article {
            border-top: 0;
        }

        .hero-form .gform_confirmation_message {
            border-left: 0;
            border: 1px solid var(--color-green);
        }


    /*
     *  Main menu dropdown panels
     */
    .nav-list {
        display: flex;
        align-items: center;
        gap: inherit;
        list-style: none;
        margin: 0;
        padding: 0;
    }

    .nav-top {
        align-items: center;
        gap: 6px;
        padding: 10px 0;
        background: none;
        border: 0;
        cursor: pointer;
        font: inherit;
        letter-spacing: inherit;
        text-transform: inherit;
        color: var(--ink);
        text-decoration: none;
        white-space: nowrap;
    }

        .nav-top .ph {
            font-size: 13px;
            transition: transform .2s ease;
        }

            .nav-item.is-open > .nav-top .ph {
                transform: rotate(180deg);
            }

        .nav .nav-top:hover, .nav-item.is-open > .nav-top, .nav-item.is-current > .nav-top {
            text-decoration: underline;
            text-decoration-color: var(--color-magenta);
            text-underline-offset: 8px;
            text-decoration-thickness: 2px;
        }

    .nav-top:focus-visible {
        outline: 3px solid var(--color-magenta);
        outline-offset: 4px;
    }

    .mega {
        left: 0;
        right: 0;
        top: 100%;
        z-index: 20;
        background: var(--surface-raised);
        border-top: 1px solid var(--line);
        border-bottom: 1px solid var(--line);
        padding-block: 40px 44px;
        font: 400 16px/1.5 var(--ff-body);
        letter-spacing: 0;
        text-transform: none;
        position: absolute;
    }

    .mega-grid {
        display: grid;
        grid-template-columns: minmax(220px, 300px) minmax(0, 1fr) minmax(240px, 320px);
        gap: 48px;
        align-items: start;
    }

    .mega-kick {
        display: flex;
        align-items: center;
        gap: 10px;
        font: 800 14px/1 var(--ff-heading);
        letter-spacing: 0.08em;
        text-transform: uppercase;
        color: var(--ink);
    }

    .mega-kick::before {
        content: "";
        width: 10px;
        height: 10px;
        background: var(--color-magenta);
        flex: none;
    }

    .mega-lede {
        margin-top: 16px;
        font-size: 17px;
        line-height: 1.5;
        color: var(--ink-muted);
    }

        .nav .mega-over {
            display: inline-flex;
            align-items: center;
            gap: 10px;
            margin-top: 22px;
            padding: 0;
            font: 700 14px/1 var(--ff-heading);
            letter-spacing: 0.06em;
            text-transform: uppercase;
            color: var(--ink);
            text-decoration: none;
        }

        .nav .mega-over:hover {
            text-decoration: underline;
            text-decoration-color: var(--color-magenta);
            text-underline-offset: 6px;
            text-decoration-thickness: 2px;
        }

    .mega-links {
        list-style: none;
        margin: 0;
        padding: 0 0 0 40px;
        border-left: 1px solid var(--line);
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 2px 20px;
    }

            .nav .mega-links a {
                display: flex;
                align-items: center;
                gap: 14px;
                margin: 0 -12px;
                padding: 10px 12px;
                white-space: normal;
                font: 600 16px/1.3 var(--ff-heading);
                letter-spacing: -0.005em;
                color: var(--ink);
                text-decoration: none;
            }

        .mega-links .ph {
            flex: none;
            display: grid;
            place-items: center;
            width: 40px;
            height: 40px;
            background: var(--surface-tint);
            color: var(--ink);
            font-size: 20px;
        }

            .nav .mega-links a:hover {
                background: var(--surface-tint);
            }

                .nav .mega-links a:hover .ph {
                    background: var(--color-magenta);
                }

            .nav .mega-links a:focus-visible, .nav .mega-over:focus-visible, .mega-feature:focus-visible {
                outline: 3px solid var(--color-magenta);
                outline-offset: 2px;
            }

        .nav .mega-feature {
            display: block;
            padding: 0;
            background: var(--surface-tint);
            color: var(--ink);
            text-decoration: none;
            white-space: normal;
        }

        .mega-feature img {
            width: 100%;
            height: auto;
            aspect-ratio: 16 / 9;
            object-fit: cover;
            filter: var(--matte);
        }

    .mf-title {
        display: block;
        padding: 18px 20px 0;
        font: 700 18px/1.25 var(--ff-heading);
        letter-spacing: -0.01em;
    }

    .mf-link {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        padding: 12px 20px 20px;
        font: 700 13px/1 var(--ff-heading);
        letter-spacing: 0.06em;
        text-transform: uppercase;
    }

            .nav .mega-feature:hover .mf-title {
                text-decoration: underline;
                text-decoration-color: var(--color-magenta);
                text-underline-offset: 5px;
                text-decoration-thickness: 2px;
            }

    .mega-offices {
        padding: 24px;
        font-size: 15px;
        line-height: 1.55;
        color: var(--ink-muted);
    }

            .mega-offices p + p {
                margin-top: 14px;
            }

        .mega-offices b {
            color: var(--ink);
            font-family: var(--ff-heading);
            font-weight: 700;
        }

    .mo-name {
        font: 800 13px/1.3 var(--ff-heading);
        letter-spacing: 0.06em;
        text-transform: uppercase;
        color: var(--ink);
    }

        .nav .mo-phone {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            margin-top: 16px;
            padding: 0;
            font: 700 17px/1 var(--ff-heading);
            color: var(--ink);
            text-decoration: none;
        }

    .mega-scrim {
        inset: 0;
        z-index: 9;
        background: rgb(26 26 24 / 0.35);
        opacity: 0;
        visibility: hidden;
        transition: opacity .2s ease, visibility 0s linear .2s;
        position: fixed;
    }

    .mega-scrim.is-open {
        opacity: 1;
        visibility: visible;
        transition: opacity .2s ease;
    }


    /*
     *  Drawer accordions
     */
        .mobile-menu .mm-body {
            overflow-y: auto;
            flex: 1 1 auto;
            padding-bottom: 32vh;
        }

        .mobile-menu .mm-group {
            background: none;
            border: 0;
            border-bottom: 1px solid var(--line);
            cursor: pointer;
            text-align: left;
        }

        .mobile-menu .mm-group::after {
            display: none;
        }

            .mobile-menu .mm-group .ph {
                font-size: 18px;
                color: var(--ink);
            }

        .mobile-menu a.mm-link[data-url]::after {
            content: "";
            width: 8px;
            height: 8px;
            background: var(--color-magenta);
        }

    .mm-sub {
        list-style: none;
        margin: 0;
        padding: 6px 0 14px;
        border-bottom: 1px solid var(--line);
    }

        .mm-sub a {
            display: block;
            padding: 10px 0;
            font: 600 16px/1.3 var(--ff-heading);
            color: var(--ink);
            text-decoration: none;
        }

        .mm-sub a.mm-over {
            font-size: 13px;
            font-weight: 700;
            letter-spacing: 0.06em;
            text-transform: uppercase;
            color: var(--ink-muted);
        }


    /*
     *  Panel wrap
     */
        .top .mega-grid {
            display: grid;
            align-items: start;
            min-height: 0;
            gap: 48px;
            grid-template-columns: minmax(220px, 300px) minmax(0, 1fr) minmax(240px, 320px);
        }

        .mobile-menu .mm-group {
            display: flex;
            align-items: center;
            justify-content: space-between;
            width: 100%;
            padding: 18px 0;
            font: 700 17px/1.2 var(--ff-heading);
            letter-spacing: 0.06em;
            text-transform: uppercase;
            color: var(--ink);
        }

        .mobile-menu .mm-group:focus-visible {
            outline: 3px solid var(--color-magenta);
            outline-offset: 2px;
        }

        .mobile-menu a.mm-link {
            border-bottom: 1px solid var(--line);
        }

    .mm-photo {
        transition: opacity .25s ease;
    }

        .mobile-menu.has-open-group .mm-photo {
            opacity: 0;
        }


    /*
     *  Nav caret underline
     */
    .nav-top {
        display: inline-block;
    }

        .nav-top .ph {
            display: inline-block;
            margin-left: 6px;
            vertical-align: 1px;
        }


    /*
     *  Header call block
     */
        .top .right {
            gap: 10px;
        }

    .top-call {
        display: grid;
        place-items: center;
        flex: none;
        width: 52px;
        height: 52px;
        border: 1px solid var(--line);
        color: var(--ink);
        font-size: 22px;
        text-decoration: none;
    }

    .top-call:hover {
        border-color: var(--ink);
    }

    .top-call:focus-visible {
        outline: 3px solid var(--color-magenta);
        outline-offset: 2px;
    }


    /*
     *  Header spacing with the call block
     */

    /*
     *  Assessment pop-up
     */
    .assess-modal {
        width: min(560px, calc(100vw - 32px));
        max-height: calc(100dvh - 32px);
        padding: 0;
        border: 0;
        background: var(--color-white);
        color: var(--ink);
        overflow: auto;
    }

    .assess-modal::backdrop {
        background: rgb(26 26 24 / 0.6);
    }

    .assess-close {
        z-index: 1;
        display: flex;
        align-items: center;
        gap: 8px;
        border-bottom: 1px solid var(--line);
        border-left: 1px solid var(--line);
        cursor: pointer;
        color: var(--ink);
        font: 700 14px/1 var(--ff-heading);
        letter-spacing: 0.06em;
        text-transform: uppercase;
    }

    .assess-close:focus-visible {
        outline: 3px solid var(--color-magenta);
        outline-offset: -3px;
    }

        .assess-body .hero-form {
            max-width: none;
            width: 100%;
        }

    .assess-open, .assess-open body {
        overflow: hidden;
    }


    /*
     *  Pop-up image side
     */
    .assess-modal {
        width: min(980px, calc(100vw - 32px));
        display: none;
    }

    .assess-modal[open] {
        display: grid;
        grid-template-columns: minmax(0, 400px) minmax(0, 1fr);
    }

    .assess-aside {
        display: flex;
        flex-direction: column;
        color: var(--color-white);
        background-repeat: repeat;
    }

        .assess-aside .rating {
            padding-left: 0;
        }

        .assess-aside .facts {
            margin-top: auto;
            grid-template-columns: 1fr;
            border-top: 1px solid var(--color-black-line);
        }

            .assess-aside .facts div, .assess-aside .facts div + div {
                padding: 14px 0;
                border-left: 0;
            }

                .assess-aside .facts div + div {
                    border-top: 1px solid var(--color-black-line);
                }

            .assess-aside .facts strong {
                font-size: 18px;
                white-space: normal;
            }

            .assess-aside .facts span {
                font-size: 14px;
            }

    .assess-main {
        display: flex;
        flex-direction: column;
        min-width: 0;
        max-height: calc(100dvh - 32px);
        overflow: auto;
    }

        .assess-main .hero-form {
            padding-top: 8px;
        }


    /*
     *  Pop-up layout
     */
    .assess-modal {
        width: min(1040px, calc(100vw - 32px));
    }

    .assess-modal[open] {
        grid-template-columns: minmax(0, 0.8fr) minmax(0, 1fr);
    }

    .assess-aside {
        --color-magenta: var(--color-pink);
        --on-magenta: var(--color-black);
        padding: 0;
        gap: 0;
        background: var(--color-black);
        background-image: none;
        overflow: hidden;
        position: relative;
    }

    .assess-photo {
        inset: 0;
        width: 100%;
        height: 100%;
        max-width: none;
        object-fit: cover;
        filter: var(--matte);
        position: absolute;
    }

    .assess-tel {
        left: 20px;
        right: 20px;
        bottom: 20px;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 10px;
        min-height: 56px;
        background: var(--color-white);
        color: var(--ink);
        text-decoration: none;
        font: 700 19px/1 var(--ff-heading);
        letter-spacing: 0.01em;
        position: absolute;
    }

        .assess-tel .ph {
            font-size: 22px;
            color: var(--color-black);
        }

    .assess-tel:hover {
        background: var(--color-off-white);
    }

    .assess-tel:focus-visible {
        outline: 3px solid var(--color-magenta);
        outline-offset: 2px;
    }

    .assess-main {
        position: relative;
    }

    .assess-close {
        top: 16px;
        right: 16px;
        width: 44px;
        height: 44px;
        min-height: 0;
        margin: 0;
        padding: 0;
        justify-content: center;
        border: 1px solid var(--color-black);
        background: var(--color-white);
        position: absolute;
    }

        .assess-close .ph {
            font-size: 20px;
        }

        .assess-main .hero-form {
            padding: 44px 44px 40px;
        }

            .assess-main .hero-form h2 {
                padding-right: 56px;
            }


    /*
     *  Hero eyebrow wrapping
     */

    /*
     *  Landing-page system
     */

    /*
     *  Skip link
     */
        .skip-link {
            left: -9999px;
            top: 0;
            position: absolute;
        }

        .skip-link:focus {
            --color-magenta: var(--color-pink);
            --on-magenta: var(--color-black);
            left: 50%;
            top: calc(8px + env(safe-area-inset-top, 0px));
            transform: translateX(-50%);
            z-index: 100;
            padding: 12px 20px;
            background: var(--color-black);
            color: var(--color-white);
            font: 700 14px/1 var(--ff-heading);
            letter-spacing: 0.06em;
            text-transform: uppercase;
            text-decoration: none;
        }


    /*
     *  Hero
     */
        .lp .open.inner {
            padding-block: 40px 80px;
        }

            .lp .open .grid {
                align-items: start;
            }

            .lp .open .hero-copy {
                min-width: 0;
            }

            .lp .crumbs ol {
                list-style: none;
                display: flex;
                flex-wrap: wrap;
                align-items: center;
                margin: 0 0 16px;
                padding: 0;
                font-size: 15px;
                color: var(--color-dark-lavender);
            }

            .lp .crumbs li {
                display: inline-flex;
                align-items: center;
                min-height: 44px;
            }

                .lp .crumbs li + li::before {
                    content: "/";
                    margin: 0 10px;
                    opacity: .6;
                }

            .lp .crumbs a {
                display: inline-flex;
                align-items: center;
                min-height: 44px;
                color: var(--color-dark-lavender);
                text-decoration: none;
            }

            .lp .crumbs a:hover {
                color: var(--color-white);
                text-decoration: underline;
                text-decoration-color: var(--color-magenta);
                text-underline-offset: 4px;
                text-decoration-thickness: 2px;
            }

        .lp .crumbs [aria-current] {
            color: var(--color-white);
        }

            .lp .open h1 {
                font-size: clamp(34px, calc((100vw - 534px) / 16), 58px);
                line-height: 1.06;
                min-height: 0;
            }

                .lp .open .hero-copy .lede {
                    margin-top: 22px;
                }

            .lp .open .grid.lp-solo {
                grid-template-columns: minmax(0, 1fr);
            }

                .lp .lp-solo .hero-copy .lede {
                    max-width: 46em;
                }


    /*
     *  Hero photo
     */
    .lp-hero-photo {
        align-self: stretch;
        margin: 0;
        min-height: 320px;
        position: relative;
    }

        .lp-hero-photo img {
            --color-magenta: var(--color-pink);
            --on-magenta: var(--color-black);
            inset: 0;
            width: 100%;
            height: 100%;
            object-fit: cover;
            filter: var(--matte);
            background: var(--color-light-charcoal);
            position: absolute;
        }


    /*
     *  Sections
     */
    .band-panel {
        background: var(--surface);
    }

            .band-panel .tiles article {
                background: var(--surface-raised);
            }

        .lp section.lp-cont {
            padding-top: 0;
        }

        .lp .tiles[data-n="2"] {
            grid-template-columns: repeat(2, minmax(0, 1fr));
        }

        .lp .tiles[data-n="4"] {
            grid-template-columns: repeat(2, minmax(0, 1fr));
        }


    /*
     *  Last card rows
     */
        .lp .tiles[data-n="5"], .lp .tiles[data-n="7"], .lp .tiles[data-n="8"] {
            grid-template-columns: repeat(12, minmax(0, 1fr));
        }

            .lp .tiles[data-n="5"] > *, .lp .tiles[data-n="8"] > *, .lp .tiles[data-n="7"] > :nth-child(n + 5) {
                grid-column: span 4;
            }

            .lp .tiles[data-n="5"] > :nth-child(n + 4), .lp .tiles[data-n="8"] > :nth-child(n + 7) {
                grid-column: span 6;
            }

            .lp .tiles[data-n="7"] > :nth-child(-n + 4) {
                grid-column: span 3;
            }

                    .lp .tiles article h3 + p {
                        margin-top: 10px;
                    }


    /*
     *  Steps
     */
        .lp .steps[data-n="2"] {
            grid-template-columns: repeat(2, minmax(0, 1fr));
        }

        .lp .steps[data-n="3"] {
            grid-template-columns: repeat(3, minmax(0, 1fr));
        }

        .lp .steps[data-n="6"] {
            grid-template-columns: repeat(3, minmax(0, 1fr));
        }


    /*
     *  Five steps
     */
        .lp .steps[data-n="5"] {
            grid-template-columns: repeat(6, minmax(0, 1fr));
        }

            .lp .steps[data-n="5"] li {
                grid-column: span 2;
            }

            .lp .steps[data-n="5"] li:nth-child(n + 4) {
                grid-column: span 3;
            }

            .lp .steps[data-n="5"] li:nth-child(3n + 1), .lp .steps[data-n="6"] li:nth-child(3n + 1) {
                padding-left: 0;
                border-left: 0;
            }

            .lp .steps[data-n="5"] li:nth-child(n + 4), .lp .steps[data-n="6"] li:nth-child(n + 4) {
                border-top: 1px solid var(--color-black-line);
                padding-top: 28px;
                margin-top: 20px;
            }

            .lp .steps.light[data-n="5"] li:nth-child(n + 4), .lp .steps.light[data-n="6"] li:nth-child(n + 4) {
                border-top-color: var(--line);
            }


    /*
     *  Spokes
     */
            .lp .lp-spokes article {
                display: flex;
                flex-direction: column;
                transition: background-color .15s ease;
                position: relative;
            }

            .lp .lp-spokes .lp-icon {
                font-size: 30px;
                color: var(--ink);
                margin-bottom: 18px;
            }

                .lp .lp-spokes h3 a, .lp .lp-spokes .lp-item-title a {
                    color: inherit;
                    text-decoration: none;
                }

                .lp .lp-spokes h3 a::after, .lp .lp-spokes .lp-item-title a::after {
                    content: "";
                    inset: 0;
                    position: absolute;
                }

                .lp .lp-spokes h3 a:focus-visible, .lp .lp-spokes .lp-item-title a:focus-visible {
                    outline: none;
                }

                .lp .lp-spokes h3 a:focus-visible::after, .lp .lp-spokes .lp-item-title a:focus-visible::after {
                    outline: 3px solid var(--color-magenta);
                    outline-offset: 3px;
                }

            .lp .lp-spokes article:hover {
                background: var(--surface-tint);
            }

        .lp .lp-arrow {
            font-size: 20px;
        }

            .lp .lp-spokes .lp-arrow {
                margin-top: auto;
                padding-top: 20px;
                color: var(--ink);
                align-self: flex-start;
            }

                .lp .lp-spokes article:hover .ph-arrow-right::before {
                    transform: translateX(3px);
                }


    /*
     *  Text
     */
    .lp-prose {
        display: grid;
        grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
        column-gap: 56px;
        align-items: start;
    }

        .lp-prose > h2 {
            grid-column: 1;
            grid-row: 1 / span 12;
        }

        .lp-prose > p {
            grid-column: 2;
        }

        .lp-prose p {
            font-size: 19px;
            line-height: 1.65;
            color: var(--ink-muted);
        }

            .lp-prose p + p {
                margin-top: 18px;
            }

        .lp-prose > :is(ul, ol, blockquote, h3, h4) {
            grid-column: 2;
        }

        .lp-prose :is(ul, ol) {
            margin: 18px 0 0;
            padding-left: 24px;
            font-size: 19px;
            line-height: 1.65;
            color: var(--ink-muted);
        }

            .lp-prose li + li {
                margin-top: 8px;
            }

        .lp-prose :is(h3, h4) {
            margin: 28px 0 0;
            font: 700 22px/1.25 var(--ff-heading);
            color: var(--ink);
        }

        .lp-prose blockquote {
            margin: 18px 0 0;
            font: 500 21px/1.5 var(--ff-heading);
            color: var(--ink);
        }


    /*
     *  Offices and Contact page
     */
        .lp .lp-company {
            font: 800 13px/1.3 var(--ff-heading);
            letter-spacing: 0.06em;
            text-transform: uppercase;
            color: var(--ink);
            margin-bottom: 16px;
        }

            .lp .lp-offices address {
                font-style: normal;
                margin-top: 10px;
                color: var(--ink-muted);
                font-size: 17px;
                line-height: 1.5;
            }

                .lp .lp-offices h3 a, .lp .lp-offices .lp-item-title a {
                    color: inherit;
                    text-decoration: none;
                }

                .lp .lp-offices h3 a:hover, .lp .lp-offices .lp-item-title a:hover {
                    text-decoration: underline;
                    text-decoration-color: var(--color-magenta);
                    text-underline-offset: 5px;
                    text-decoration-thickness: 2px;
                }

        .lp .lp-call {
            margin-top: 20px;
        }

        .lp .lp-phone {
            display: inline-flex;
            align-items: center;
            gap: 10px;
            min-height: 44px;
            font: 700 20px/1 var(--ff-heading);
            color: var(--ink);
            text-decoration: none;
        }

            .lp .lp-phone .ph {
                font-size: 22px;
            }

        .lp .lp-phone:hover {
            text-decoration: underline;
            text-decoration-color: var(--color-magenta);
            text-underline-offset: 5px;
            text-decoration-thickness: 2px;
        }

        .lp .lp-contact-grid {
            display: grid;
            grid-template-columns: minmax(0, 1fr) minmax(320px, 480px);
            gap: 64px;
            align-items: start;
        }

            .lp .lp-contact-side .tiles {
                grid-template-columns: 1fr;
            }

            .lp .lp-contact-grid .hero-form {
                max-width: none;
                width: 100%;
            }


    /*
     *  Message field
     */
            .hero-form h2 + .gform_wrapper {
                margin-top: 20px;
            }

            .hero-form .ginput_container textarea {
                display: block;
                width: 100%;
                height: 168px;
                min-height: 140px;
                padding: 10px 14px;
                margin: 0;
                font: 400 16px/1.4 var(--ff-body);
                color: var(--ink);
                background: var(--color-off-white);
                border: 1px solid var(--color-grey);
                border-radius: 0;
                resize: vertical;
                -webkit-appearance: none;
                appearance: none;
            }

            .hero-form .ginput_container textarea:hover {
                border-color: var(--color-black);
            }

            .hero-form .ginput_container textarea:focus-visible {
                outline: 3px solid var(--color-magenta);
                outline-offset: 0;
                border-color: var(--color-black);
                background: var(--color-white);
            }

            .hero-form .gfield_error textarea {
                border-color: var(--error);
                border-width: 2px;
            }


    /*
     *  Related pages and articles
     */
        .lp .lp-links {
            list-style: none;
            margin: 0;
            padding: 0;
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 0 56px;
        }

            .lp .lp-links a {
                display: flex;
                align-items: center;
                gap: 16px;
                min-height: 64px;
                padding: 12px 0;
                border-top: 1px solid var(--line);
                font: 600 18px/1.3 var(--ff-heading);
                color: var(--ink);
                text-decoration: none;
            }

            .lp .lp-links .ph:first-child {
                flex: none;
                font-size: 24px;
                color: var(--ink);
            }

            .lp .lp-links .lp-arrow {
                margin-left: auto;
                flex: none;
            }

                .lp .lp-links a:hover span {
                    text-decoration: underline;
                    text-decoration-color: var(--color-magenta);
                    text-underline-offset: 5px;
                    text-decoration-thickness: 2px;
                }

                .lp .lp-links a:hover .ph-arrow-right::before {
                    transform: translateX(3px);
                }


    /*
     *  Sitemap page
     */
        .lp .lp-map {
            display: grid;
            grid-template-columns: repeat(4, minmax(0, 1fr));
            gap: 48px 40px;
        }

            .lp .lp-map h2 {
                font-size: 22px;
                font-weight: 800;
                letter-spacing: -0.01em;
                line-height: 1.2;
                margin-bottom: 14px;
            }

            .lp .lp-map ul {
                list-style: none;
                margin: 0;
                padding: 0;
            }

                .lp .lp-map li a {
                    display: block;
                    min-height: 44px;
                    padding: 10px 0;
                    border-top: 1px solid var(--line);
                    font: 600 17px/1.3 var(--ff-heading);
                    color: var(--ink);
                    text-decoration: none;
                }

                .lp .lp-map li a:hover {
                    text-decoration: underline;
                    text-decoration-color: var(--color-magenta);
                    text-underline-offset: 5px;
                    text-decoration-thickness: 2px;
                }


    /*
     *  Menu article card
     */
    .mf-kick {
        display: block;
        padding: 16px 20px 0;
        font: 800 12px/1 var(--ff-heading);
        letter-spacing: 0.08em;
        text-transform: uppercase;
        color: var(--ink-muted);
    }

        .mega-article .mf-title {
            padding-top: 8px;
        }


    /*
     *  Card title without a heading
     */
        .lp .lp-item-title {
            margin-top: 0;
            font: 700 20px/1.3 var(--ff-heading);
            letter-spacing: -0.01em;
            color: var(--ink);
        }

            .lp .resp .lp-item-title {
                color: var(--color-white);
            }

            .lp .lp-item-title + p {
                margin-top: 10px;
            }


    /*
     *  Footer
     */
        footer .noyo-name {
            display: block;
            color: var(--color-white);
            font-weight: 600;
        }

        footer .noyo-office {
            padding-bottom: 12px;
        }

        footer address {
            font-style: normal;
            margin-top: 2px;
        }

            footer li a:hover {
                color: var(--color-white);
                text-decoration: underline;
                text-decoration-color: var(--color-magenta);
                text-underline-offset: 4px;
                text-decoration-thickness: 2px;
            }

        footer .legal {
            display: flex;
            flex-wrap: wrap;
            align-items: center;
            justify-content: space-between;
            gap: 12px 32px;
        }

        footer .legal-links {
            display: flex;
            flex-wrap: wrap;
            gap: 4px 24px;
        }

            footer .legal-links li {
                padding: 0;
            }


    /*
     *  Legal links
     */

    /*
     *  Phone footer
     */

    /*
     *  Ebook opt-in band
     */
    .cta-ebook {
        background: var(--color-magenta);
    }

        .cta-ebook .wrap {
            display: block;
        }

    .ebook {
        --color-magenta: var(--color-pink);
        --on-magenta: var(--color-black);
        overflow: hidden;
        background: var(--color-black);
        color: var(--color-white);
        padding: 56px;
        display: grid;
        grid-template-columns: 240px minmax(0, 1fr) minmax(300px, 380px);
        gap: 40px 56px;
        align-items: center;
        position: relative;
    }

    .ebook::before {
        content: "";
        top: 0;
        left: 0;
        bottom: 0;
        width: 62%;
        z-index: 0;
        pointer-events: none;
        background-image: none;
        background-position: left -1px top -1px;
        opacity: .55;
        -webkit-mask-image: linear-gradient(to right, #000 15%, transparent);
        mask-image: linear-gradient(to right, #000 15%, transparent);
        position: absolute;
    }

        .ebook > * {
            z-index: 1;
            position: relative;
        }

    .ebook-cover {
        width: 100%;
        max-width: 254px;
        padding: 0 14px 14px 0;
        justify-self: start;
        position: relative;
    }

        .ebook-cover img {
            --color-magenta: var(--color-pink);
            --on-magenta: var(--color-black);
            display: block;
            width: 100%;
            height: auto;
            background: var(--color-black);
            outline: 1px solid var(--color-black-line);
            outline-offset: -1px;
            position: relative;
        }

    .ebook-stack {
        --color-magenta: var(--color-pink);
        --on-magenta: var(--color-black);
        left: 14px;
        top: 14px;
        right: 0;
        bottom: 0;
        background: var(--color-light-charcoal);
        position: absolute;
    }

    .ebook-eyebrow {
        display: flex;
        align-items: center;
        gap: 10px;
        margin: 0;
        font: 700 14px/1 var(--ff-heading);
        letter-spacing: 0.14em;
        text-transform: uppercase;
        color: var(--color-dark-lavender);
    }

    .ebook-eyebrow::before {
        content: "";
        width: 10px;
        height: 10px;
        background: var(--color-magenta);
        flex: none;
    }

            .cta-ebook .ebook h2 {
                margin: 18px 0 0;
                color: var(--color-white);
                font: 800 clamp(30px, 3.1vw, 44px)/1.08 var(--ff-heading);
                letter-spacing: -0.03em;
            }

        .cta-ebook .ebook-lede {
            margin: 18px 0 0;
            max-width: 46ch;
            font-size: 19px;
            line-height: 1.55;
            color: var(--color-dark-lavender);
        }

    .ebook-form {
        align-self: center;
        padding: 28px 28px 24px;
    }

        .ebook-form .gform_fields {
            gap: 14px 12px;
        }

        .ebook-form .gform_footer {
            margin-top: 18px;
        }

        .ebook-form .gform_confirmation_message {
            padding: 0;
            background: none;
            border: 0;
            outline: 0;
        }

            .ebook-form .gform_confirmation_message h3 {
                font: 800 26px/1.15 var(--ff-heading);
                letter-spacing: -0.02em;
            }

            .ebook-form .gform_confirmation_message p {
                margin: 10px 0 0;
                font-size: 17px;
                line-height: 1.5;
            }

            .ebook-form .gform_confirmation_message .btn {
                margin-top: 20px;
                width: 100%;
            }


    /*
     *  Forms on the back page's blue
     */
    .ebook-form, .open .hero-form {
        --color-magenta: var(--color-pink);
        --on-magenta: var(--color-black);
        background: var(--color-light-charcoal);
        color: var(--color-white);
    }

        .ebook-form .gfield_label, .open .hero-form .gfield_label {
            color: var(--color-white);
        }

        .ebook-form .gfield_required_text_asterisk, .open .hero-form .gfield_required_text_asterisk {
            color: var(--color-magenta);
        }

            .ebook-form .ginput_container input,
            .ebook-form .ginput_container input:hover,
            .open .hero-form .ginput_container input,
            .open .hero-form .ginput_container input:hover,
            .open .hero-form .ginput_container select,
            .open .hero-form .ginput_container select:hover {
                background-color: var(--color-white);
                border-color: transparent;
            }

            .ebook-form .gfield_error input,
            .open .hero-form .gfield_error input,
            .open .hero-form .gfield_error select {
                border-color: var(--error-on-black);
            }

        .ebook-form .gfield_validation_message, .open .hero-form .gfield_validation_message {
            color: var(--error-on-black);
        }

        .ebook-form .foot, .open .hero-form .foot {
            color: var(--color-dark-lavender);
        }

            .ebook-form .gform_confirmation_message h3 {
                color: var(--color-white);
            }

            .ebook-form .gform_confirmation_message p {
                color: var(--color-dark-lavender);
            }

            .open .hero-form h2 {
                color: var(--color-magenta);
            }

            .open .hero-form .intro {
                color: var(--color-white);
                font-weight: 600;
            }

            .open .hero-form .gform_confirmation_message {
                background: none;
                color: var(--color-white);
            }


    /*
     *  Hero form shadow
     */
        .open .hero-form {
            box-shadow: 14px 14px 0 var(--cover-black-80);
        }


    /*
     *  Pop-up photo
     */
    .assess-photo {
        object-position: 46% 50%;
    }


    /*
     *  Service links
     */
    .svc-link {
        color: inherit;
        text-decoration: underline;
        text-decoration-color: var(--color-magenta);
        text-decoration-thickness: 2px;
        text-underline-offset: 5px;
    }

    .svc-link:hover {
        text-decoration-color: currentColor;
    }

    .svc-link:focus-visible {
        outline: 3px solid var(--color-magenta);
        outline-offset: 3px;
    }


    /*
     *  Landing page sources list
     */
    section:has(> .wrap > .lp-sources) {
        padding-block: 40px;
    }

        .lp section.lp-cont:has(> .wrap > .lp-sources) {
            padding-top: 0;
        }

        .lp-sources h2 {
            font-size: 15px;
            font-weight: 800;
            line-height: 1.4;
            letter-spacing: 0.06em;
            text-transform: uppercase;
            color: var(--ink);
        }

        .lp-sources ol {
            margin: 8px 0 0;
            padding-left: 22px;
            display: grid;
            gap: 8px;
            font-size: 15px;
            color: var(--ink-muted);
        }

        .lp-sources a {
            color: var(--ink);
            text-decoration: underline;
            text-decoration-color: var(--line);
            text-underline-offset: 3px;
        }

        .lp-sources a:hover {
            text-decoration-color: var(--color-magenta);
        }


    /*
     *  Company menu offices card
     */
        .nav .mega-offices {
            display: flex;
            flex-direction: column;
            gap: 16px;
            padding: 28px 28px 26px;
            font-size: 15px;
            line-height: 1.55;
            color: var(--ink-muted);
        }

            .nav .mega-offices p {
                margin: 0;
            }

                .nav .mega-offices p + p {
                    margin-top: 0;
                }

            .nav .mega-offices .mo-name {
                padding-bottom: 14px;
                border-bottom: 1px solid var(--line);
            }

            .nav .mega-offices b {
                display: block;
                margin-bottom: 2px;
                font-size: 16px;
            }

            .nav .mega-offices .mo-phone {
                align-self: flex-start;
                margin-top: 4px;
                padding-top: 16px;
                border-top: 1px solid var(--line);
                width: 100%;
            }

            .nav .mega-offices .mo-phone:hover {
                text-decoration: underline;
                text-decoration-color: var(--color-magenta);
                text-decoration-thickness: 2px;
                text-underline-offset: 5px;
            }

                .nav .mega-offices .mo-phone .ph {
                    font-size: 18px;
                    color: var(--ink-muted);
                }

                .nav .mega-offices b + br {
                    display: none;
                }


    /*
     *  Header between 521 and 760px
     */

    /*
     *  Sticky guide bar
     */
    .noyo-sr {
        width: 1px;
        height: 1px;
        padding: 0;
        margin: -1px;
        overflow: hidden;
        clip: rect(0 0 0 0);
        white-space: nowrap;
        border: 0;
        position: absolute;
    }


    /*
     *  Guide bar shadow and layer
     */
    .ebook-bar {
        --color-magenta: var(--color-pink);
        --on-magenta: var(--color-black);
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 38;
        background-color: var(--color-black);
        color: var(--color-white);
        border-top: 1px solid var(--color-black-line);
        padding-bottom: env(safe-area-inset-bottom, 0px);
        transform: translateY(110%);
        visibility: hidden;
        transition: transform .28s cubic-bezier(.2, .7, .2, 1), visibility 0s linear .28s;
        box-shadow: 0 2px 0 0 var(--color-black);
        will-change: transform;
        position: fixed;
    }


    /*
     *  Guide band pattern
     */
    .ebook-bar::before {
        content: "";
        inset: 0 0 env(safe-area-inset-bottom, 0px) 0;
        pointer-events: none;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='80' viewBox='0 0 240 80'%3E%3Crect x='14.5' y='14.5' width='11' height='11' fill='none' stroke='rgba%28255%2C255%2C255%2C0.16%29' stroke-width='1'/%3E%3Crect x='54.5' y='14.5' width='11' height='11' fill='none' stroke='rgba%28255%2C255%2C255%2C0.16%29' stroke-width='1'/%3E%3Crect x='94.5' y='14.5' width='11' height='11' fill='none' stroke='rgba%28255%2C255%2C255%2C0.16%29' stroke-width='1'/%3E%3Crect x='134.0' y='14.0' width='12' height='12' fill='rgba%28138%2C140%2C142%2C0.45%29'/%3E%3Crect x='174.5' y='14.5' width='11' height='11' fill='none' stroke='rgba%28255%2C255%2C255%2C0.16%29' stroke-width='1'/%3E%3Crect x='214.5' y='14.5' width='11' height='11' fill='none' stroke='rgba%28255%2C255%2C255%2C0.16%29' stroke-width='1'/%3E%3Crect x='14.5' y='54.5' width='11' height='11' fill='none' stroke='rgba%28255%2C255%2C255%2C0.16%29' stroke-width='1'/%3E%3Crect x='54.0' y='54.0' width='12' height='12' fill='rgba%28138%2C140%2C142%2C0.45%29'/%3E%3Crect x='94.5' y='54.5' width='11' height='11' fill='none' stroke='rgba%28255%2C255%2C255%2C0.16%29' stroke-width='1'/%3E%3Crect x='134.5' y='54.5' width='11' height='11' fill='none' stroke='rgba%28255%2C255%2C255%2C0.16%29' stroke-width='1'/%3E%3Crect x='174.5' y='54.5' width='11' height='11' fill='none' stroke='rgba%28255%2C255%2C255%2C0.16%29' stroke-width='1'/%3E%3Crect x='214.5' y='54.5' width='11' height='11' fill='none' stroke='rgba%28255%2C255%2C255%2C0.16%29' stroke-width='1'/%3E%3C/svg%3E");
        background-size: 240px 80px;
        -webkit-mask-image: linear-gradient(to left, #000 45%, transparent 65%);
        mask-image: linear-gradient(to left, #000 45%, transparent 65%);
        position: absolute;
    }

        .ebook-bar > * {
            position: relative;
        }

    .ebook-bar.is-on {
        transform: none;
        visibility: visible;
        transition: transform .28s cubic-bezier(.2, .7, .2, 1), visibility 0s;
    }

    .ebook-bar-in {
        display: flex;
        align-items: center;
        gap: 18px;
        min-height: 80px;
        padding-block: 16px;
    }

    .ebook-bar-cover {
        flex: none;
        align-self: flex-end;
        width: 68px;
        height: auto;
        margin-block: -32px -8px;
        box-shadow: 0 6px 16px rgb(0 0 0 / 0.35);
    }

    .ebook-bar-text {
        display: flex;
        flex-direction: column;
        gap: 2px;
        min-width: 0;
        flex: 1 1 auto;
        margin: 0;
    }

    .ebook-bar-kick {
        font: 800 12px/1.2 var(--ff-heading);
        letter-spacing: 0.08em;
        text-transform: uppercase;
        color: var(--color-magenta);
    }

    .ebook-bar-title {
        font: 700 16px/1.3 var(--ff-heading);
        color: var(--color-white);
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .ebook-bar-form {
        display: flex;
        align-items: center;
        gap: 10px;
        flex: none;
        margin: 0;
    }

        .ebook-bar-form input {
            width: 190px;
            height: 48px;
            padding: 0 14px;
            border: 1px solid transparent;
            border-radius: 0;
            background: var(--color-white);
            color: var(--ink);
            font: 400 15px/1 var(--ff-body);
        }

        .ebook-bar-form input:focus-visible {
            outline: 3px solid var(--color-magenta);
            outline-offset: 0;
        }

        .ebook-bar-form .btn {
            min-height: 48px;
            white-space: nowrap;
        }

    .ebook-bar-close {
        display: grid;
        place-items: center;
        flex: none;
        width: 44px;
        height: 44px;
        padding: 0;
        font-size: 20px;
        cursor: pointer;
    }

    .ebook-bar-close:hover {
        border-color: var(--color-white);
    }

    .ebook-bar-close:focus-visible {
        outline: 3px solid var(--color-magenta);
        outline-offset: 2px;
    }

        html.has-ebook-bar footer {
            padding-bottom: calc(96px + env(safe-area-inset-bottom, 0px));
        }


    /*
     *  Guide bar visibility
     */
    html.has-ebook-bar {
        scroll-padding-bottom: calc(96px + env(safe-area-inset-bottom, 0px));
    }


    /*
     *  Guide bar on phones and its sheet
     */
    .ebook-bar-open {
        display: none;
    }

    .ebook-sheet {
        --color-magenta: var(--color-pink);
        --on-magenta: var(--color-black);
        inset: auto 0 0 0;
        width: 100%;
        max-width: 100%;
        margin: 0;
        padding: 24px max(20px, env(safe-area-inset-right, 0px)) calc(24px + env(safe-area-inset-bottom, 0px)) max(20px, env(safe-area-inset-left, 0px));
        border: 0;
        border-top: 1px solid var(--color-black-line);
        background-color: var(--color-black);
        background-image: none;
        color: var(--color-white);
        max-height: 90dvh;
        overflow: auto;
        position: fixed;
    }

    .ebook-sheet::backdrop {
        background: rgb(26 26 24 / 0.6);
    }

    .ebook-sheet-close {
        top: 14px;
        right: max(14px, env(safe-area-inset-right, 0px));
        display: grid;
        place-items: center;
        width: 44px;
        height: 44px;
        padding: 0;
        font-size: 20px;
        cursor: pointer;
        position: absolute;
    }

    .ebook-sheet-close:focus-visible {
        outline: 3px solid var(--color-magenta);
        outline-offset: 2px;
    }

        .ebook-sheet .ebook-bar-kick {
            display: block;
            padding-right: 56px;
        }

    .ebook-sheet-h {
        margin: 10px 56px 0 0;
        font: 800 24px/1.15 var(--ff-heading);
        letter-spacing: -0.02em;
        color: var(--color-white);
    }

    .ebook-sheet-form {
        display: grid;
        gap: 8px;
        margin-top: 18px;
    }

    .ebook-sheet-label {
        font: 600 14px/1.3 var(--ff-body);
        color: var(--color-white);
        margin-top: 6px;
    }

        .ebook-sheet-form input {
            width: 100%;
            height: 50px;
            padding: 0 14px;
            border: 1px solid transparent;
            border-radius: 0;
            background: var(--color-white);
            color: var(--ink);
            font: 400 16px/1 var(--ff-body);
        }

        .ebook-sheet-form input:focus-visible {
            outline: 3px solid var(--color-magenta);
            outline-offset: 0;
        }

        .ebook-sheet-form .btn {
            width: 100%;
            min-height: 52px;
            margin-top: 10px;
            justify-content: center;
        }

    .ebook-sheet-note {
        margin: 12px 0 0;
        font-size: 13px;
        line-height: 1.45;
        color: var(--color-dark-lavender);
    }

    html.sheet-open, html.sheet-open body {
        overflow: hidden;
    }


    /*
     *  Drawer
     */
            .mobile-menu .mm-body .mm-call {
                display: inline-flex;
                align-items: center;
                justify-content: center;
                gap: 10px;
                margin-top: 24px;
                min-height: 54px;
                background: var(--color-white);
                border: 1px solid var(--color-black);
                color: var(--ink);
                font: 700 17px/1 var(--ff-heading);
                text-decoration: none;
            }

                .mobile-menu .mm-body .mm-call .ph {
                    font-size: 20px;
                }

            .mobile-menu .mm-body .mm-call:focus-visible {
                outline: 3px solid var(--color-magenta);
                outline-offset: 2px;
            }

                .mobile-menu .mm-body .mm-call + .btn {
                    margin-top: 10px;
                }


    /*
     *  Close buttons
     */
    .ebook-bar-close, .ebook-sheet-close {
        --color-magenta: var(--color-pink);
        --on-magenta: var(--color-black);
        background: var(--color-light-charcoal);
        border: 1px solid var(--color-light-charcoal);
        color: var(--color-white);
    }

    .ebook-bar-close:hover, .ebook-sheet-close:hover {
        background: color-mix(in srgb, var(--color-light-charcoal) 82%, #FFFFFF);
        border-color: color-mix(in srgb, var(--color-light-charcoal) 82%, #FFFFFF);
    }

            .ebook-bar .btn .ph-download-simple, .ebook-sheet .btn .ph-download-simple {
                font-size: 18px;
                margin-left: 8px;
            }


    /*
     *  Phone polish
     */
    .brand {
        min-height: 44px;
    }

    .svc-link, .lp .lp-offices h3 a, .lp .lp-offices .lp-item-title a {
        padding-block: 10px;
    }

    .pl-dot {
        position: relative;
    }

    .pl-dot::after {
        content: "";
        inset: -15px -5px;
        position: absolute;
    }

        .a-open .crumbs {
            align-items: center;
        }

            .a-open .crumbs a {
                display: inline-flex;
                align-items: center;
                min-height: 44px;
            }


    /*
     *  Service card button
     */
        .svc .more {
            align-self: flex-start;
            justify-content: center;
            gap: 10px;
            min-height: 54px;
            padding: 0 26px;
            font: 700 15px/1 var(--ff-heading);
            letter-spacing: 0.04em;
            text-transform: uppercase;
            white-space: nowrap;
            color: var(--ink);
            text-decoration: none;
            box-shadow: inset 0 0 0 1px var(--ink);
            transition: box-shadow .15s ease, background-color .15s ease;
        }

        .svc .more:hover {
            background: var(--color-magenta);
            color: var(--on-magenta);
            box-shadow: inset 0 0 0 1px var(--color-magenta);
        }

            .svc .more .ph {
                font-size: 20px;
            }


/*  News
-------------------------------------------*/


    /*
     *  Cards
     */
    :where(.home, .blog, .single-post, .category, .tag) .n-grid {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 32px;
    }

    :where(.home, .blog, .single-post, .category, .tag) .n-grid.is-four {
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 24px;
    }

    :where(.home, .blog, .single-post, .category, .tag) .n-card {
        display: flex;
        flex-direction: column;
        background: var(--surface-raised);
        min-width: 0;
        transition: background-color .15s ease;
    }

    :where(.home, .blog, .single-post, .category, .tag) .n-card-img {
        display: block;
        aspect-ratio: 16 / 10;
        overflow: hidden;
        background: var(--surface-tint);
    }

        :where(.home, .blog, .single-post, .category, .tag) .n-card-img img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            filter: var(--matte);
            transition: transform .4s ease;
        }

            :where(.home, .blog, .single-post, .category, .tag) .n-card:hover .n-card-img img,
            :where(.home, .blog, .single-post, .category, .tag) .n-card:focus-within .n-card-img img {
                transform: scale(1.03);
            }

    :where(.home, .blog, .single-post, .category, .tag) .n-card-body {
        display: flex;
        flex-direction: column;
        gap: 10px;
        padding: 24px 24px 26px;
        flex: 1;
    }

    :where(.home, .blog, .single-post, .category, .tag) .n-topic {
        display: flex;
        align-items: center;
        gap: 10px;
        margin: 0;
        font: 700 14px/1.2 var(--ff-heading);
        letter-spacing: .04em;
        text-transform: uppercase;
        color: var(--ink);
    }

    :where(.home, .blog, .single-post, .category, .tag) .n-topic::before {
        content: "";
        width: 10px;
        height: 10px;
        background: var(--color-magenta);
        flex: none;
    }

    :where(.home, .blog, .single-post, .category, .tag) .n-topic.on-navy {
        color: var(--color-white);
    }

    :where(.home, .blog, .single-post, .category, .tag) .n-card-title {
        margin: 0;
        font: 700 22px/1.2 var(--ff-heading);
        letter-spacing: -0.01em;
    }

        :where(.home, .blog, .single-post, .category, .tag) .n-card-title a {
            color: var(--ink);
            text-decoration: none;
        }

        :where(.home, .blog, .single-post, .category, .tag) .n-card-title a::after {
            content: "";
            inset: 0;
            position: absolute;
        }

    :where(.home, .blog, .single-post, .category, .tag) .n-card {
        position: relative;
    }

        :where(.home, .blog, .single-post, .category, .tag) .n-card-title a:focus-visible {
            outline: 3px solid var(--color-magenta);
            outline-offset: 4px;
        }

    :where(.home, .blog, .single-post, .category, .tag) .n-card-text {
        margin: 0;
        color: var(--ink-muted);
        font-size: 17px;
    }

    :where(.home, .blog, .single-post, .category, .tag) .n-meta {
        display: flex;
        flex-wrap: wrap;
        gap: 6px 18px;
        margin: auto 0 0;
        padding-top: 6px;
        font-size: 14px;
        color: var(--ink-muted);
    }

            :where(.home, .blog, .single-post, .category, .tag) .n-meta span + span::before,
            :where(.home, .blog, .single-post, .category, .tag) .n-meta time + span::before {
                content: "";
                display: inline-block;
                width: 4px;
                height: 4px;
                margin: 0 12px 3px 0;
                background: currentColor;
                opacity: .6;
            }

    :where(.home, .blog, .single-post, .category, .tag) .n-meta.on-navy {
        color: var(--color-dark-lavender);
    }


    /*
     *  Card hover
     */
        :where(.home, .blog, .single-post, .category, .tag) .n-card-title a,
        :where(.home, .blog, .single-post, .category, .tag) .n-topic,
        :where(.home, .blog, .single-post, .category, .tag) .n-card-text,
        :where(.home, .blog, .single-post, .category, .tag) .n-meta {
            transition: color .15s ease;
        }

    :where(.home, .blog, .single-post, .category, .tag) .n-card:hover,
    :where(.home, .blog, .single-post, .category, .tag) .n-card:focus-within {
        --color-magenta: var(--color-pink);
        --on-magenta: var(--color-black);
        background: var(--color-black);
    }

            :where(.home, .blog, .single-post, .category, .tag) .n-card:hover .n-card-title a,
            :where(.home, .blog, .single-post, .category, .tag) .n-card:focus-within .n-card-title a {
                color: var(--color-white);
            }

        :where(.home, .blog, .single-post, .category, .tag) .n-card:hover .n-topic,
        :where(.home, .blog, .single-post, .category, .tag) .n-card:focus-within .n-topic,
        :where(.home, .blog, .single-post, .category, .tag) .n-card:hover .n-card-text,
        :where(.home, .blog, .single-post, .category, .tag) .n-card:focus-within .n-card-text,
        :where(.home, .blog, .single-post, .category, .tag) .n-card:hover .n-meta,
        :where(.home, .blog, .single-post, .category, .tag) .n-card:focus-within .n-meta {
            color: var(--color-dark-lavender);
        }


    /*
     *  Lead card on the News page
     */
    :where(.home, .blog, .single-post, .category, .tag) .n-card.is-lead {
        display: grid;
        grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr);
        margin-bottom: 32px;
    }

        :where(.home, .blog, .single-post, .category, .tag) .n-card.is-lead .n-card-img {
            aspect-ratio: auto;
            min-height: 380px;
        }

        :where(.home, .blog, .single-post, .category, .tag) .n-card.is-lead .n-card-body {
            padding: 44px 44px 40px;
            gap: 16px;
            justify-content: center;
        }

        :where(.home, .blog, .single-post, .category, .tag) .n-card.is-lead .n-card-title {
            font-size: clamp(28px, 2.6vw, 38px);
            font-weight: 800;
            letter-spacing: -0.025em;
        }

        :where(.home, .blog, .single-post, .category, .tag) .n-card.is-lead .n-meta {
            margin-top: 8px;
        }


    /*
     *  Lead card hover
     */
    :where(.home, .blog, .single-post, .category, .tag) .n-card.is-lead:hover,
    :where(.home, .blog, .single-post, .category, .tag) .n-card.is-lead:focus-within {
        background: var(--color-charcoal);
    }


    /*
     *  Homepage strip
     */
    :where(.home, .blog, .single-post, .category, .tag) .n-strip {
        padding-block: 112px;
    }

    :where(.home, .blog, .single-post, .category, .tag) .n-strip-head {
        display: flex;
        align-items: end;
        justify-content: space-between;
        gap: 24px 48px;
        flex-wrap: wrap;
        margin-bottom: 48px;
    }

        :where(.home, .blog, .single-post, .category, .tag) .n-strip-head .lede {
            margin-top: 14px;
            max-width: none;
        }

        :where(.home, .blog, .single-post, .category, .tag) .n-strip .n-card-body {
            padding: 20px 20px 22px;
        }

        :where(.home, .blog, .single-post, .category, .tag) .n-strip .n-card-title {
            font-size: 20px;
        }


    /*
     *  Page opening
     */
    :where(.home, .blog, .single-post, .category, .tag) .a-open {
        --color-magenta: var(--color-pink);
        --on-magenta: var(--color-black);
        overflow: hidden;
        background: var(--color-black);
        color: var(--color-white);
        padding-block: 72px 168px;
        position: relative;
    }


    /*
     *  News and article hero
     */
    :where(.home, .blog, .single-post, .category, .tag) .a-open::before {
        content: "";
        inset: 0;
        pointer-events: none;
        background: url("../img/scenes/data-hall-aisle-16x9.webp") center / cover no-repeat;
        -webkit-mask-image: linear-gradient(225deg, #000 12%, transparent 50%);
        mask-image: linear-gradient(225deg, #000 12%, transparent 50%);
        position: absolute;
    }

        :where(.home, .blog, .single-post, .category, .tag) .a-open > .wrap {
            z-index: 1;
            display: flex;
            flex-direction: column;
            gap: 22px;
            position: relative;
        }

        :where(.home, .blog, .single-post, .category, .tag) .a-open h1 {
            margin: 0;
            color: var(--color-white);
            font: 800 clamp(38px, 4.6vw, 66px)/1.02 var(--ff-heading);
            letter-spacing: -0.03em;
        }

        :where(.home, .blog, .single-post, .category, .tag) .a-open .lede {
            color: var(--color-dark-lavender);
            margin: 0;
            max-width: none;
        }

    :where(.home, .blog, .single-post, .category, .tag) .n-open {
        padding-block: 72px 88px;
    }

        :where(.home, .blog, .single-post, .category, .tag) .a-open .crumbs {
            display: flex;
            flex-wrap: wrap;
            gap: 10px;
            font-size: 15px;
            color: var(--color-dark-lavender);
        }

            :where(.home, .blog, .single-post, .category, .tag) .a-open .crumbs a {
                color: var(--color-dark-lavender);
                text-decoration: none;
            }

            :where(.home, .blog, .single-post, .category, .tag) .a-open .crumbs a:hover {
                color: var(--color-white);
                text-decoration: underline;
            }

        :where(.home, .blog, .single-post, .category, .tag) .a-open .crumbs [aria-current] {
            color: var(--color-white);
        }


    /*
     *  Article
     */
    :where(.home, .blog, .single-post, .category, .tag) .a-cover {
        margin-top: -120px;
        z-index: 1;
        position: relative;
    }

        :where(.home, .blog, .single-post, .category, .tag) .a-cover img {
            width: 100%;
            aspect-ratio: 21 / 9;
            object-fit: cover;
            filter: var(--matte);
            background: var(--surface-tint);
        }

    :where(.home, .blog, .single-post, .category, .tag) .a-grid {
        display: grid;
        grid-template-columns: minmax(220px, 280px) minmax(0, 1fr);
        gap: 72px;
        padding-block: 72px 96px;
        align-items: start;
    }

    :where(.home, .blog, .single-post, .category, .tag) .a-rail {
        top: 112px;
        position: sticky;
    }

    :where(.home, .blog, .single-post, .category, .tag) .a-label {
        margin: 0 0 14px;
        font: 700 14px/1.2 var(--ff-heading);
        letter-spacing: .06em;
        text-transform: uppercase;
        color: var(--ink);
    }

        :where(.home, .blog, .single-post, .category, .tag) .a-toc ol {
            list-style: none;
            margin: 0;
            padding: 0;
            border-top: 1px solid var(--line);
        }

        :where(.home, .blog, .single-post, .category, .tag) .a-toc li {
            border-bottom: 1px solid var(--line);
        }

        :where(.home, .blog, .single-post, .category, .tag) .a-toc a {
            display: block;
            padding: 12px 0;
            font-size: 15px;
            line-height: 1.4;
            color: var(--ink-muted);
            text-decoration: none;
        }

        :where(.home, .blog, .single-post, .category, .tag) .a-toc a:hover,
        :where(.home, .blog, .single-post, .category, .tag) .a-toc a.is-on {
            color: var(--ink);
        }

        :where(.home, .blog, .single-post, .category, .tag) .a-toc a.is-on {
            font-weight: 600;
        }

    :where(.home, .blog, .single-post, .category, .tag) .a-body {
        min-width: 0;
        font-size: 19px;
        line-height: 1.7;
    }

        :where(.home, .blog, .single-post, .category, .tag) .a-body p {
            margin: 0 0 20px;
            color: var(--ink-muted);
        }

        :where(.home, .blog, .single-post, .category, .tag) .a-body a {
            color: var(--ink);
            text-decoration: underline;
            text-decoration-color: var(--color-magenta);
            text-decoration-thickness: 2px;
            text-underline-offset: 4px;
        }

        :where(.home, .blog, .single-post, .category, .tag) .a-body a:hover {
            text-decoration-color: var(--ink);
        }


    /*
     *  Plain panels
     */
    :where(.home, .blog, .single-post, .category, .tag) .a-answer {
        background: var(--surface-raised);
        padding: 28px 32px 8px;
        margin-bottom: 24px;
    }

        :where(.home, .blog, .single-post, .category, .tag) .a-answer .a-label,
        :where(.home, .blog, .single-post, .category, .tag) .a-takeaways .a-label,
        :where(.home, .blog, .single-post, .category, .tag) .a-toc .a-label {
            display: flex;
            align-items: center;
            gap: 10px;
        }

        :where(.home, .blog, .single-post, .category, .tag) .a-answer .a-label::before,
        :where(.home, .blog, .single-post, .category, .tag) .a-takeaways .a-label::before,
        :where(.home, .blog, .single-post, .category, .tag) .a-toc .a-label::before {
            content: "";
            width: 10px;
            height: 10px;
            background: var(--color-magenta);
            flex: none;
        }

        :where(.home, .blog, .single-post, .category, .tag) .a-answer p:last-child {
            font-size: 21px;
            line-height: 1.55;
            color: var(--ink);
        }

    :where(.home, .blog, .single-post, .category, .tag) .a-takeaways {
        padding: 28px 32px 12px;
        background: var(--surface-raised);
        margin-bottom: 56px;
    }

        :where(.home, .blog, .single-post, .category, .tag) .a-body ul {
            list-style: none;
            margin: 0 0 24px;
            padding: 0;
        }

            :where(.home, .blog, .single-post, .category, .tag) .a-body ul li {
                padding: 0 0 12px 26px;
                color: var(--ink-muted);
                position: relative;
            }

            :where(.home, .blog, .single-post, .category, .tag) .a-body ul li::before {
                content: "";
                left: 0;
                top: .62em;
                width: 10px;
                height: 10px;
                background: var(--color-magenta);
                position: absolute;
            }


    /*
     *  Article sections
     */
    :where(.home, .blog, .single-post, .category, .tag) .a-sec {
        padding-top: 16px;
        padding-bottom: 0;
        margin-bottom: 40px;
        scroll-margin-top: 100px;
    }

        :where(.home, .blog, .single-post, .category, .tag) .a-sec h2 {
            margin: 0 0 20px;
            font-size: clamp(28px, 2.6vw, 38px);
            line-height: 1.12;
        }

    :where(.home, .blog, .single-post, .category, .tag) .steps-list {
        list-style: none;
        counter-reset: step;
        margin: 8px 0 28px;
        padding: 0;
    }

        :where(.home, .blog, .single-post, .category, .tag) .steps-list li {
            counter-increment: step;
            padding: 14px 0 14px 60px;
            border-top: 1px solid var(--line);
            color: var(--ink-muted);
            position: relative;
        }

        :where(.home, .blog, .single-post, .category, .tag) .steps-list li:last-child {
            border-bottom: 1px solid var(--line);
        }

        :where(.home, .blog, .single-post, .category, .tag) .steps-list li::before {
            content: counter(step);
            left: 0;
            top: 14px;
            width: 36px;
            height: 36px;
            display: grid;
            place-items: center;
            background: var(--color-magenta);
            color: var(--on-magenta);
            font: 800 17px/1 var(--ff-heading);
            position: absolute;
        }

        :where(.home, .blog, .single-post, .category, .tag) .a-body .table-wrap {
            overflow-x: auto;
            margin: 8px 0 32px;
            background: var(--surface-raised);
        }

            :where(.home, .blog, .single-post, .category, .tag) .a-body .table-wrap table {
                width: 100%;
                border-collapse: collapse;
                font-size: 17px;
                line-height: 1.5;
                min-width: 560px;
            }

            :where(.home, .blog, .single-post, .category, .tag) .a-body .table-wrap th {
                --color-magenta: var(--color-pink);
                --on-magenta: var(--color-black);
                text-align: left;
                padding: 16px 20px;
                font: 700 14px/1.3 var(--ff-heading);
                letter-spacing: .05em;
                text-transform: uppercase;
                color: var(--color-white);
                background: var(--color-black);
            }

            :where(.home, .blog, .single-post, .category, .tag) .a-body .table-wrap td {
                padding: 16px 20px;
                border-top: 1px solid var(--line);
                color: var(--ink-muted);
                vertical-align: top;
            }

            :where(.home, .blog, .single-post, .category, .tag) .a-body .table-wrap td:first-child {
                color: var(--ink);
                font-weight: 600;
            }

    :where(.home, .blog, .single-post, .category, .tag) .a-helps {
        --color-magenta: var(--color-pink);
        --on-magenta: var(--color-black);
        overflow: hidden;
        background: var(--color-black);
        color: var(--color-white);
        padding: 40px 44px 44px;
        margin: 16px 0 56px;
        position: relative;
    }

    :where(.home, .blog, .single-post, .category, .tag) .a-helps::after {
        content: "";
        right: -40px;
        bottom: -48px;
        width: 200px;
        height: 240px;
        opacity: .14;
        pointer-events: none;
        background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 720'%3E%3Cpolygon fill='%238A8A90' points='0 0 0 720 240 720 240 600 120 600 120 120 480 120 480 240 600 240 600 0'/%3E%3Cpolygon fill='%23952C5A' points='240 360 360 360 360 480 240 480 240 600 600 600 600 480 480 480 480 240 240 240'/%3E%3C/svg%3E") no-repeat center / contain;
        position: absolute;
    }

        :where(.home, .blog, .single-post, .category, .tag) .a-helps h2 {
            margin: 0 0 16px;
            color: var(--color-white);
            font-size: clamp(26px, 2.4vw, 34px);
        }

        :where(.home, .blog, .single-post, .category, .tag) .a-helps p {
            color: var(--color-dark-lavender);
            z-index: 1;
            position: relative;
        }

        :where(.home, .blog, .single-post, .category, .tag) .a-helps a:not(.btn) {
            color: var(--color-white);
        }

        :where(.home, .blog, .single-post, .category, .tag) .a-helps .btn {
            margin-top: 8px;
            z-index: 1;
            position: relative;
        }

        :where(.home, .blog, .single-post, .category, .tag) .a-body .btn {
            text-decoration: none;
        }

            :where(.home, .blog, .single-post, .category, .tag) .a-faq .faq-list summary {
                font-size: 19px;
            }

                :where(.home, .blog, .single-post, .category, .tag) .a-faq .faq-list details p {
                    padding-right: 0;
                }

    :where(.home, .blog, .single-post, .category, .tag) .a-sources {
        margin-top: 48px;
        padding-top: 24px;
        border-top: 2px solid var(--ink);
    }

        :where(.home, .blog, .single-post, .category, .tag) .a-sources ol {
            margin: 0;
            padding-left: 22px;
            font-size: 15px;
            line-height: 1.55;
            color: var(--ink-muted);
        }

        :where(.home, .blog, .single-post, .category, .tag) .a-sources li {
            padding: 4px 0;
        }

        :where(.home, .blog, .single-post, .category, .tag) .a-sources a {
            color: var(--ink-muted);
            text-decoration-color: var(--line);
        }

    :where(.home, .blog, .single-post, .category, .tag) .n-related {
        padding-block: 0 112px;
    }

        :where(.home, .blog, .single-post, .category, .tag) .n-related h2 {
            margin: 0 0 36px;
        }

    :where(.home, .blog, .single-post, .category, .tag) .n-list {
        padding-block: 0 112px;
        margin-top: -40px;
        z-index: 1;
        position: relative;
    }


    /*
     *  Smaller screens
     */


/*  Chat
-------------------------------------------*/

    .noyo-chat-sr {
        width: 1px;
        height: 1px;
        padding: 0;
        margin: -1px;
        overflow: hidden;
        clip: rect(0 0 0 0);
        white-space: nowrap;
        border: 0;
        position: absolute;
    }


    /*
     *  The button
     */
    .noyo-chat-toggle {
        z-index: 42;
        right: max(16px, env(safe-area-inset-right, 0px));
        bottom: calc(112px + env(safe-area-inset-bottom, 0px));
        display: grid;
        place-items: center;
        width: 56px;
        height: 56px;
        padding: 0;
        border: 2px solid var(--color-black);
        border-radius: 0;
        background: var(--color-magenta);
        color: var(--on-magenta);
        font-size: 28px;
        line-height: 1;
        cursor: pointer;
        position: fixed;
    }

    .noyo-chat-toggle:hover {
        background: color-mix(in srgb, var(--color-magenta) 85%, var(--color-black));
    }

    .noyo-chat-toggle.has-unread::after {
        --color-magenta: var(--color-pink);
        --on-magenta: var(--color-black);
        content: "";
        top: -7px;
        right: -7px;
        width: 14px;
        height: 14px;
        background: var(--color-black);
        border: 2px solid var(--color-white);
        position: absolute;
    }

        html.mm-lock .noyo-chat-toggle {
            display: none;
        }


    /*
     *  The panel
     */
    .noyo-chat-panel {
        z-index: 43;
        right: max(16px, env(safe-area-inset-right, 0px));
        bottom: calc(180px + env(safe-area-inset-bottom, 0px));
        display: flex;
        flex-direction: column;
        width: min(400px, calc(100vw - 32px));
        height: min(600px, calc(100vh - 212px));
        height: min(600px, calc(100dvh - 212px));
        background: var(--color-white);
        color: var(--ink);
        border: 2px solid var(--color-black);
        border-radius: 0;
        font: 400 16px/1.5 var(--ff-body);
        overflow: hidden;
        position: fixed;
    }

    .noyo-chat-panel[hidden] {
        display: none;
    }

    .noyo-chat-head {
        --color-magenta: var(--color-pink);
        --on-magenta: var(--color-black);
        flex: none;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        padding: 8px 8px 8px 20px;
        background: var(--color-black);
        color: var(--color-white);
    }

    .noyo-chat-title {
        margin: 0;
        font: 700 20px/1.2 var(--ff-heading);
        letter-spacing: -0.01em;
    }

    .noyo-chat-close {
        flex: none;
        display: grid;
        place-items: center;
        width: 44px;
        height: 44px;
        padding: 0;
        border: 0;
        border-radius: 0;
        background: transparent;
        color: var(--color-white);
        font-size: 22px;
        cursor: pointer;
    }

    .noyo-chat-close:hover {
        --color-magenta: var(--color-pink);
        --on-magenta: var(--color-black);
        background: var(--color-light-charcoal);
    }


    /*
     *  The conversation
     */
    .noyo-chat-log {
        flex: 1 1 auto;
        min-height: 0;
        overflow-y: auto;
        overscroll-behavior: contain;
        display: flex;
        flex-direction: column;
        gap: 12px;
        padding: 16px;
        background: var(--color-off-white);
    }

    .noyo-chat-msg {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
        max-width: 90%;
    }

        .noyo-chat-msg p {
            padding: 10px 14px;
            border: 1px solid var(--line);
            font-size: 15px;
            line-height: 1.5;
            overflow-wrap: anywhere;
        }

        .noyo-chat-msg.is-ai p {
            background: var(--color-white);
            color: var(--ink);
        }

        .noyo-chat-msg.is-team p {
            background: var(--color-pale-lavender);
            color: var(--ink);
            border-color: var(--color-black);
        }

    .noyo-chat-msg.is-user {
        align-self: flex-end;
        align-items: flex-end;
    }

        .noyo-chat-msg.is-user p {
            --color-magenta: var(--color-pink);
            --on-magenta: var(--color-black);
            background: var(--color-black);
            color: var(--color-white);
            border-color: var(--color-black);
        }

        .noyo-chat-msg.is-error p {
            color: var(--error);
        }

        .noyo-chat-msg a {
            text-decoration: underline;
            text-underline-offset: 3px;
        }

        .noyo-chat-msg .noyo-chat-cta {
            display: inline-flex;
            align-items: center;
            min-height: 44px;
            padding: 0 18px;
            background: var(--color-magenta);
            color: var(--on-magenta);
            font: 700 15px/1 var(--ff-heading);
            text-decoration: none;
        }

        .noyo-chat-msg .noyo-chat-cta:hover {
            background: color-mix(in srgb, var(--color-magenta) 85%, var(--color-black));
        }

    .noyo-chat-who, .noyo-chat-chips-label {
        font: 700 12px/1 var(--ff-heading);
        letter-spacing: 0.06em;
        text-transform: uppercase;
        color: var(--ink-muted);
    }

    .noyo-chat-chips-label {
        margin: 0 0 8px;
    }

        .noyo-chat-chips ul {
            display: flex;
            flex-direction: column;
            align-items: flex-start;
            gap: 8px;
            margin: 0;
            padding: 0;
            list-style: none;
        }

    .noyo-chat-chip {
        min-height: 44px;
        padding: 10px 14px;
        border: 1px solid var(--color-black);
        border-radius: 0;
        background: var(--color-white);
        color: var(--ink);
        font: 600 15px/1.3 var(--ff-body);
        text-align: left;
        cursor: pointer;
    }

    .noyo-chat-chip:hover {
        --color-magenta: var(--color-pink);
        --on-magenta: var(--color-black);
        background: var(--color-black);
        color: var(--color-white);
    }

        .noyo-chat-typing p {
            display: inline-flex;
            gap: 5px;
            padding: 15px 16px;
        }

            .noyo-chat-typing p span:not(.noyo-chat-sr) {
                width: 7px;
                height: 7px;
                background: var(--color-grey);
            }

    @keyframes noyo-chat-dot {
        0%, 80%, 100% {
            opacity: .3;
        }

        40% {
            opacity: 1;
        }
    }

    /*
     *  Start form
     */
    .noyo-chat-start {
        flex: none;
        display: grid;
        gap: 12px;
        max-height: 70%;
        overflow-y: auto;
        padding: 16px;
        background: var(--color-white);
    }

    .noyo-chat-start[hidden], .noyo-chat-form[hidden], .noyo-chat-error[hidden] {
        display: none;
    }

    .noyo-chat-start-prompt {
        color: var(--ink-muted);
        font-size: 15px;
        line-height: 1.4;
    }

    .noyo-chat-field {
        display: grid;
        gap: 4px;
    }

        .noyo-chat-field label {
            font: 600 14px/1.3 var(--ff-body);
        }

        .noyo-chat-field input, .noyo-chat-form textarea {
            display: block;
            width: 100%;
            min-width: 0;
            margin: 0;
            padding: 10px 14px;
            font: 400 16px/1.35 var(--ff-body);
            color: var(--ink);
            background: var(--color-off-white);
            border: 1px solid var(--color-grey);
            border-radius: 0;
            -webkit-appearance: none;
            appearance: none;
        }

        .noyo-chat-field input {
            min-height: 48px;
        }

        .noyo-chat-field input:hover, .noyo-chat-form textarea:hover {
            border-color: var(--color-black);
        }

        .noyo-chat-field input:focus-visible, .noyo-chat-form textarea:focus-visible {
            outline: 3px solid var(--color-magenta);
            outline-offset: 0;
            border-color: var(--color-black);
            background: var(--color-white);
        }

    .noyo-chat-hp {
        left: -9999px;
        width: 1px;
        height: 1px;
        overflow: hidden;
        position: absolute;
    }

    .noyo-chat-go {
        min-height: 52px;
        padding: 0 24px;
        border: 0;
        border-radius: 0;
        background: var(--color-magenta);
        color: var(--on-magenta);
        font: 700 17px/1 var(--ff-heading);
        cursor: pointer;
    }

    .noyo-chat-go:hover {
        background: color-mix(in srgb, var(--color-magenta) 85%, var(--color-black));
    }

    .noyo-chat-go:disabled {
        opacity: .6;
        cursor: default;
    }

    .noyo-chat-error {
        color: var(--error);
        font-size: 14px;
        line-height: 1.4;
    }

    .noyo-chat-consent {
        color: var(--ink-muted);
        font-size: 13px;
        line-height: 1.4;
    }

        .noyo-chat-consent a {
            text-decoration: underline;
            text-underline-offset: 3px;
        }

    .noyo-chat-form {
        flex: none;
        display: flex;
        align-items: stretch;
        gap: 8px;
        padding: 12px 16px;
        background: var(--color-white);
    }

        .noyo-chat-form textarea {
            flex: 1 1 auto;
            min-height: 52px;
            max-height: 120px;
            resize: none;
            field-sizing: content;
        }

    .noyo-chat-send {
        flex: none;
        display: grid;
        place-items: center;
        width: 52px;
        padding: 0;
        border: 0;
        border-radius: 0;
        background: var(--color-magenta);
        color: var(--on-magenta);
        font-size: 22px;
        cursor: pointer;
    }

    .noyo-chat-send:hover {
        background: color-mix(in srgb, var(--color-magenta) 85%, var(--color-black));
    }

    .noyo-chat-note {
        flex: none;
        padding: 0 16px 12px;
        background: var(--color-white);
        color: var(--ink-muted);
        font-size: 12px;
        line-height: 1.4;
    }

        .noyo-chat button:focus-visible, .noyo-chat a:focus-visible {
            outline: 3px solid var(--color-magenta);
            outline-offset: 3px;
        }

        .noyo-chat-panel button:focus-visible, .noyo-chat-panel a:focus-visible {
            outline-offset: 2px;
        }


    /*
     *  Page end
     */
            .has-chat footer .legal {
                margin-bottom: 72px;
            }


    /*
     *  Phones
     */


/*  WordPress
-------------------------------------------*/

        .admin-bar .top {
            top: 32px;
        }


    /*
     *  Hero photo
     */
    .home-open::before, .open.inner::before, .a-open::before {
        background-image: url("../img/scenes/data-hall-aisle-16x9.webp");
    }


/*  Responsive
-------------------------------------------*/

@media (max-width: 480px)
{
    .wrap { padding-left: max(16px, env(safe-area-inset-left, 0px)); padding-right: max(16px, env(safe-area-inset-right, 0px)); }
}

@media (max-width: 1080px)
{
    .nav, .top .phone { display: none; }
}

@media (max-width: 520px)
{
    .top .btn { display: none; }
}

@media (max-width: 900px)
{
    .open .mark { justify-self: start; max-width: 320px; }
    .facts div:nth-child(3) { padding-left: 0; border-left: 0; }
    .facts div:nth-child(n+3) { border-top: 1px solid var(--color-black-line); }
}

@media (prefers-reduced-motion: reduce)
{
    .slide .o { animation: none; }
}

@media (max-width: 860px)
{
    .svc-head, .svc { grid-template-columns: 1fr; }
    .vs-grid { grid-template-columns: 1fr; gap: 32px; }
}

@media (max-width: 900px)
{
    .steps { grid-template-columns: 1fr 1fr; }
    .steps li:nth-child(3) { padding-left: 0; border-left: 0; }
}

@media (max-width: 520px)
{
    .steps { grid-template-columns: 1fr; }
    .steps li + li { padding-left: 0; border-left: 0; border-top: 1px solid var(--color-black-line); }
}

@media (max-width: 860px)
{
    .lead-grid { grid-template-columns: 1fr; gap: 40px; }
    .people { grid-template-columns: 1fr; }
    .people .mark { max-width: 300px; }
}

@media (max-width: 760px)
{
    .cta .wrap { grid-template-columns: 1fr; }
}

@media (max-width: 860px)
{
    footer .cols { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 960px)
{
    .tiles { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 600px)
{
    .tiles { grid-template-columns: 1fr; }
}

@media (max-width: 520px)
{
    .steps.light li + li { border-top-color: var(--line); }
}

@media (max-width: 419px)
{
    .hero-form .gfield--width-half { grid-column: span 12; }
}

@media (max-width: 900px)
{
    .open .grid > .hero-form { justify-self: stretch; max-width: none; }
}

@media (max-width: 480px)
{
    .hero-form { padding: 24px 20px; }
}

@media (max-width: 760px)
{
    .pano { margin-top: 48px; }
    .cta::after { width: 180px; height: 216px; right: -50px; }
}

@media (max-width: 520px)
{
    .facts strong { line-height: 1.25; }
    .facts span { font-size: 14px; }
    .facts div { padding-right: 12px; }
    .facts div + div { padding-left: 12px; }
    .facts div:nth-child(3) { padding-left: 0; }
}

@media (max-width: 720px)
{
    .util .wrap { justify-content: flex-end; }
    .util nav { gap: 18px; }
}

@media (max-width: 420px)
{
    .util nav a:nth-child(2) { display: none; }
}

@media (max-width: 760px)
{
    .asks { grid-template-columns: 1fr; }
    .events li { grid-template-columns: 64px minmax(0, 1fr); gap: 4px 16px; }
    .events p { grid-column: 2; }
    .hours { font-size: 11px; }
}

@media (max-width: 860px)
{
    .story-list li { grid-template-columns: 1fr; gap: 4px; }
    .faq-grid { grid-template-columns: 1fr; }
    .faq-list details p { padding-right: 0; }
}

@media (prefers-reduced-motion: reduce)
{
    .faq-list summary .ph { transition: none; }
}

@media (max-width: 900px)
{
    .home-open::before { -webkit-mask-image: linear-gradient(to bottom, transparent 56%, #000 72%); mask-image: linear-gradient(to bottom, transparent 56%, #000 72%); }
    .open.inner::before { -webkit-mask-image: linear-gradient(to bottom, transparent 52%, #000 70%); mask-image: linear-gradient(to bottom, transparent 52%, #000 70%); }
    .open.inner:has(.lp-hero-photo)::before { -webkit-mask-image: linear-gradient(to bottom, transparent 72%, #000 86%); mask-image: linear-gradient(to bottom, transparent 72%, #000 86%); }
    .open.inner:has(.lp-solo)::before { display: none; }
}

@media (max-width: 1000px)
{
    .phase.act { grid-column: 1 / -1; }
}

@media (max-width: 620px)
{
    .watch-stats dt { font-size: 22px; }
}

@media (max-width: 980px)
{
    .watch-grid { grid-template-columns: 1fr; }
}

@media (max-width: 560px)
{
    .tl-ev { grid-template-columns: 52px 36px minmax(0, 1fr); }
    .watch-grid .watch-stats > div { grid-template-columns: 110px minmax(0, 1fr); }
    .tl::before { left: 77.5px; }
    .tl-phase { margin-left: 104px; }
}

@media (prefers-reduced-motion: reduce)
{
    .ph-arrow-right::before, .btn, .btn-line, .btn-outline { transition: none; }
}

@media (max-width: 760px)
{
    .faq::before { width: 70%; }
    .story::before { width: 100%; height: 60%; }
    .cta-card { grid-template-columns: 1fr; }
    .cta-card::before { width: 100%; opacity: .35; }
}

@media (prefers-reduced-motion: reduce)
{
    .h-rot { transition: none; }
    .svc li { transition: none; }
}

@media (max-width: 860px)
{
    .story-grid { grid-template-columns: 1fr; }
    .story-grid > .mark { max-width: 340px; }
}

@media (max-width: 560px)
{
    .tl::after { left: 77.5px; }
}

@media (prefers-reduced-motion: reduce)
{
    .tl::after, .tl-ev, .tl-phase, .tl-ev .node { transition: none; }
}

@media (max-width: 860px)
{
    .ai-cols { grid-template-columns: 1fr; }
    .ai-col { padding-right: 0; }
    .ai-col + .ai-col { padding-left: 0; border-left: 0; border-top: 1px solid var(--color-black-line); }
}

@media (max-width: 1080px)
{
    .top .wrap { min-height: 76px; }
    .top .mega-grid { min-height: 0; }
    .brand svg { width: 32px; }
    .brand img { height: 26px; }
}

@media (max-width: 900px)
{
    .open h1 { font-size: clamp(40px, 5vw, 72px); }
}

@media (max-width: 1320px)
{
    .top .wrap { gap: 28px; }
}

@media (max-width: 1180px)
{
    .nav { display: none; }
}

@media (max-width: 900px)
{
    .open .grid { grid-template-columns: minmax(0, 1fr); gap: 48px; }
    .open .grid > .hero-form { justify-self: stretch; max-width: none; }
}

@media (max-width: 480px)
{
    .open h1 { font-size: 40px; }
}

@media (max-width: 1180px)
{
    .menu-btn:not([hidden]) { display: inline-flex; }
    .top .right { margin-left: 0; }
}

@media (max-width: 520px)
{
    .top .right { display: none; }
    .menu-btn { min-height: 44px; }
}

@media (max-width: 760px)
{
    section { padding-block: 56px; }
    .open { padding-block: 48px 0; }
    .home-open { padding-bottom: 48px; }
    .facts { margin-top: 44px; }
    .sec-head, .svc-head { margin-bottom: 28px; }
    .open .grid { gap: 36px; }
    .hero-form { padding: 22px 18px; }
    .ebook-form { padding: 28px 28px 24px; }
    .ask { padding: 24px 22px 26px; }
    .svc .body { padding: 24px 20px; }
    .ai-col { padding-top: 24px; }
    .cta { padding-block: 48px; }
    .cta-card { padding: 32px 22px 34px; }
    .story-grid, .faq-grid, .watch-grid { gap: 36px; }
    footer { padding-block: 44px 28px; }
}

@media (max-width: 900px)
{
    .open h1 .h-fixed, .open h1 .h-rot { display: inline; white-space: normal; }
    .open h1 { min-height: 2.95em; }
}

@media (max-width: 760px)
{
    .player { padding: 24px 20px 20px; }
    .pl-text { font-size: 18px; }
    .watch-grid .watch-stats dt { font-size: 20px; }
    .watch-grid .watch-stats > div { padding-right: 10px; }
    .watch-grid .watch-stats > div + div { padding-left: 10px; }
}

@media (prefers-reduced-motion: reduce)
{
    .pl-body { transition: none; }
}

@media (max-width: 900px)
{
    .hero-copy .lede { font-size: 21px; max-width: 56ch; }
}

@media (max-width: 1100px)
{
    .facts strong { font-size: 21px; white-space: normal; }
}

@media (max-width: 900px)
{
    .facts { grid-template-columns: 1fr; }
    .facts div, .facts div + div, .facts div:nth-child(3) { padding: 16px 0; border-left: 0; border-top: 1px solid var(--color-black-line); }
    .hero-copy .facts div { padding: 20px 16px 4px 0; }
    .facts div:first-child { border-top: 0; }
    .fit { grid-template-columns: 1fr; }
}

@media (max-width: 760px)
{
    .rating { padding-left: 0; }
    .hero-copy .facts { margin-top: 40px; }
    .hero-copy .facts div, .hero-copy .facts div + div { padding: 14px 0; }
}

@media (max-width: 860px)
{
    .story.has-photo { padding-top: 0; }
    .story-bg { inset: auto; width: 100%; height: 300px; object-position: 30% 50%; position: relative; }
    .story.has-photo::after { inset: 0 0 auto 0; height: 300px; }
    .story.has-photo .story-grid { min-height: 0; }
    .story-space { display: none; }
    .story.has-photo::after { background: linear-gradient(180deg, rgb(26 26 24 / 0) 0%, rgb(26 26 24 / 0) 55%, var(--color-black) 100%); }
}

@media (max-width: 1320px)
{
    .nav { gap: 22px; font-size: 14px; }
}

@media (max-width: 1180px)
{
    .mobile-menu { display: flex; }
    .mm-scrim { display: block; }
}

@media (max-height: 640px)
{
    .mm-photo { height: 30%; }
}

@media (prefers-reduced-motion: reduce)
{
    .mobile-menu, .mobile-menu.is-open, .mm-scrim, .mm-scrim.is-open { transition: none; }
}

@media (max-width: 1320px)
{
    .mega-grid { grid-template-columns: minmax(200px, 260px) minmax(0, 1fr) minmax(220px, 280px); gap: 36px; }
    .mega-links { padding-left: 32px; }
}

@media (max-width: 1180px)
{
    .mega, .mega-scrim { display: none; }
}

@media (prefers-reduced-motion: reduce)
{
    .nav-top .ph, .mega-scrim { transition: none; }
}

@media (max-width: 1320px)
{
    .top .mega-grid { gap: 36px; grid-template-columns: minmax(200px, 260px) minmax(0, 1fr) minmax(220px, 280px); }
    .top .wrap { gap: 20px; }
    .nav { gap: 18px; }
    .top .right .btn { padding: 0 18px; }
}

@media (max-width: 1250px)
{
    .top .wrap { gap: 16px; }
    .nav { gap: 14px; }
}

@media (prefers-reduced-motion: no-preference)
{
    .assess-modal[open] { animation: assess-in .22s cubic-bezier(.2, .7, .2, 1); }
}

@media (max-width: 760px)
{
    .assess-modal[open] { display: block; }
    .assess-aside { display: none; }
    .assess-main .hero-form { padding: 28px 22px 26px; }
    .assess-aside { display: block; height: 168px; }
    .assess-tel { left: 16px; right: 16px; bottom: 16px; min-height: 48px; font-size: 17px; }
}

@media (max-width: 900px)
{
    .lp .open.inner { padding-block: 24px 56px; }
    .lp .open h1 { font-size: clamp(32px, 8vw, 44px); }
    .lp .open .grid.lp-solo { gap: 0; }
    .lp-hero-photo { min-height: 0; }
    .lp-hero-photo img { height: auto; aspect-ratio: 4 / 3; position: static; }
}

@media (max-width: 1180px)
{
    .lp .tiles[data-n="7"] > :nth-child(n) { grid-column: span 4; }
    .lp .tiles[data-n="7"] > :last-child { grid-column: 1 / -1; }
}

@media (max-width: 960px)
{
    .lp .tiles[data-n="4"], .lp .tiles[data-n="5"], .lp .tiles[data-n="7"], .lp .tiles[data-n="8"] { grid-template-columns: 1fr 1fr; }
    .lp .tiles[data-n] > :nth-child(n) { grid-column: auto; }
    .lp .tiles[data-n="5"] > :last-child, .lp .tiles[data-n="7"] > :last-child { grid-column: 1 / -1; }
}

@media (max-width: 600px)
{
    .lp .tiles[data-n] { grid-template-columns: 1fr; }
    .lp .tiles article { padding: 24px 22px; }
    .lp .table-wrap .data[data-cols="2"], .lp .table-wrap .data[data-cols="3"] { min-width: 0; }
    .lp .data th, .lp .data td { padding: 12px; }
    .lp .data tbody th { width: 36%; }
}

@media (max-width: 900px)
{
    .lp .steps[data-n] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .lp .steps li:nth-child(odd) { padding-left: 0; border-left: 0; }
    .lp .steps li:nth-child(even) { padding-left: 28px; border-left: 1px solid var(--color-black-line); }
    .lp .steps.light li:nth-child(even) { border-left-color: var(--line); }
    .lp .steps li:nth-child(n + 3) { border-top: 1px solid var(--color-black-line); padding-top: 28px; margin-top: 20px; }
    .lp .steps.light li:nth-child(n + 3) { border-top-color: var(--line); }
    .lp .steps[data-n="5"] li, .lp .steps[data-n="5"] li:nth-child(n + 4) { grid-column: auto; }
    .lp .steps[data-n="5"] li:last-child { grid-column: 1 / -1; }
}

@media (max-width: 520px)
{
    .lp .steps[data-n] { grid-template-columns: 1fr; }
    .lp .steps li, .lp .steps li:nth-child(even), .lp .steps li:nth-child(odd) { padding-left: 0; border-left: 0; }
    .lp .steps li + li { border-top: 1px solid var(--color-black-line); padding-top: 28px; margin-top: 20px; }
    .lp .steps.light li + li { border-top-color: var(--line); }
}

@media (prefers-reduced-motion: reduce)
{
    .lp .lp-spokes article { transition: none; }
}

@media (max-width: 860px)
{
    .lp-prose { display: block; }
    .lp-prose h2 { margin-bottom: 20px; }
}

@media (max-width: 900px)
{
    .lp .lp-contact-grid { grid-template-columns: minmax(0, 1fr); gap: 40px; }
    .lp .lp-contact-grid .hero-form { order: -1; }
}

@media (max-width: 760px)
{
    .lp .lp-links { grid-template-columns: 1fr; }
}

@media (max-width: 960px)
{
    .lp .lp-map { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 560px)
{
    .lp .lp-map { grid-template-columns: 1fr; }
}

@media (max-width: 860px)
{
    footer li a { display: inline-block; padding-block: 10px; }
    footer .noyo-office { padding-bottom: 8px; }
    footer .legal-links a { display: inline-flex; align-items: center; min-height: 44px; padding-block: 0; }
}

@media (max-width: 560px)
{
    footer .cols { row-gap: 36px; }
    footer .cols > :first-child, footer .cols > :has(.noyo-office) { grid-column: 1 / -1; }
    footer .cols > :has(.noyo-office) ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 24px; }
    footer .cols > :has(.noyo-office) li:not(.noyo-office) { grid-column: 1 / -1; }
}

@media (max-width: 1100px)
{
    .ebook { grid-template-columns: 200px minmax(0, 1fr); gap: 36px 40px; padding: 44px; align-items: start; }
    .ebook-cover { max-width: 214px; }
    .ebook-form { grid-column: 1 / -1; }
    .ebook-form .gfield { grid-column: span 6; }
}

@media (max-width: 760px)
{
    .ebook { grid-template-columns: minmax(0, 1fr); padding: 32px 22px 28px; gap: 28px; }
    .ebook-form .gfield { grid-column: span 12; }
}

@media (max-width: 480px)
{
    .ebook-form { padding: 24px 20px 20px; }
}

@media (max-width: 760px)
{
    section:has(> .wrap > .lp-sources) { padding-block: 32px; }
    .top .right .btn { display: none; }
}

@media (max-width: 1180px)
{
    .ebook-bar-title { display: none; }
    .ebook-bar-form input { width: 170px; }
}

@media (max-width: 960px)
{
    .ebook-bar-text { display: none; }
    .ebook-bar-in { justify-content: space-between; }
    .ebook-bar-form input { width: 160px; }
}

@media (max-width: 760px)
{
    .ebook-bar { display: none; }
}

@media (prefers-reduced-motion: reduce)
{
    .ebook-bar, .ebook-bar.is-on { transition: none; }
}

@media (max-width: 760px)
{
    .ebook-bar { display: block; }
    .ebook-bar::before { background-size: 192px 64px; }
    .ebook-bar-in { min-height: 64px; gap: 10px; padding-block: 8px; justify-content: flex-start; }
    .ebook-bar-cover { width: 52px; margin-block: -18px -2px; }
    .ebook-bar-text { display: flex; flex: 1 1 auto; }
    .ebook-bar-title, .ebook-bar-form { display: none; }
    .ebook-bar-kick { font-size: 13px; }
    .ebook-bar-open { display: inline-flex; flex: none; min-height: 44px; padding: 0 14px; font-size: 13px; }
    .ebook-bar-close { width: 44px; height: 44px; font-size: 18px; }
}

@media (prefers-reduced-motion: no-preference)
{
    .ebook-sheet[open] { animation: sheet-in .24s cubic-bezier(.2, .7, .2, 1); }
}

@media (max-width: 760px)
{
    .who::before, .a-open::before, .ebook::before { display: none; }
}

@media (prefers-reduced-motion: reduce)
{
    .svc .more { transition: none; }
}

@media (max-width: 1100px)
{
    :where(.home, .blog, .single-post, .category, .tag) .n-grid.is-four { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    :where(.home, .blog, .single-post, .category, .tag) .a-grid { grid-template-columns: minmax(0, 1fr); gap: 32px; }
    :where(.home, .blog, .single-post, .category, .tag) .a-rail { position: static; }
}

@media (max-width: 860px)
{
    :where(.home, .blog, .single-post, .category, .tag) .n-grid { grid-template-columns: minmax(0, 1fr); gap: 24px; }
    :where(.home, .blog, .single-post, .category, .tag) .n-card.is-lead { grid-template-columns: minmax(0, 1fr); }
    :where(.home, .blog, .single-post, .category, .tag) .n-card.is-lead .n-card-img { min-height: 0; aspect-ratio: 16 / 10; }
    :where(.home, .blog, .single-post, .category, .tag) .n-card.is-lead .n-card-body { padding: 28px 24px 30px; }
    :where(.home, .blog, .single-post, .category, .tag) .a-open { padding-block: 48px 120px; }
    :where(.home, .blog, .single-post, .category, .tag) .a-cover { margin-top: -88px; }
    :where(.home, .blog, .single-post, .category, .tag) .a-cover img { aspect-ratio: 16 / 10; }
    :where(.home, .blog, .single-post, .category, .tag) .a-grid { padding-block: 40px 72px; }
    :where(.home, .blog, .single-post, .category, .tag) .a-answer, :where(.home, .blog, .single-post, .category, .tag) .a-takeaways { padding: 22px 20px 4px; }
    :where(.home, .blog, .single-post, .category, .tag) .a-helps { padding: 32px 24px 36px; }
    :where(.home, .blog, .single-post, .category, .tag) .a-body { font-size: 18px; }
    :where(.home, .blog, .single-post, .category, .tag) .n-strip, :where(.home, .blog, .single-post, .category, .tag) .n-related, :where(.home, .blog, .single-post, .category, .tag) .n-list { padding-block: 72px; }
    :where(.home, .blog, .single-post, .category, .tag) .n-list { padding-top: 0; }
}

@media (max-width: 600px)
{
    :where(.home, .blog, .single-post, .category, .tag) .n-grid.is-four { grid-template-columns: minmax(0, 1fr); }
}

@media (prefers-reduced-motion: reduce)
{
    :where(.home, .blog, .single-post, .category, .tag) .n-card-img img, :where(.home, .blog, .single-post, .category, .tag) .n-card, :where(.home, .blog, .single-post, .category, .tag) .n-card-title a, :where(.home, .blog, .single-post, .category, .tag) .n-topic, :where(.home, .blog, .single-post, .category, .tag) .n-card-text, :where(.home, .blog, .single-post, .category, .tag) .n-meta { transition: none; }
}

@media (prefers-reduced-motion: no-preference)
{
    .noyo-chat-toggle { transition: bottom .28s cubic-bezier(.2, .7, .2, 1); }
    .noyo-chat-typing p span:not(.noyo-chat-sr) { animation: noyo-chat-dot 1s infinite ease-in-out; }
    .noyo-chat-typing p span:nth-child(2) { animation-delay: .15s; }
    .noyo-chat-typing p span:nth-child(3) { animation-delay: .3s; }
}

@media (max-width: 760px)
{
    .noyo-chat-toggle { bottom: max(16px, env(safe-area-inset-bottom, 0px)); }
    .has-chat footer .legal { margin-bottom: 0; }
    html.has-cta-rail .noyo-chat-toggle { bottom: calc(88px + env(safe-area-inset-bottom, 0px)); }
    html.has-cta-rail .has-chat footer { padding-bottom: calc(96px + env(safe-area-inset-bottom, 0px)); }
    .noyo-chat-panel { left: 0; right: 0; bottom: 0; width: auto; height: min(88vh, 680px); height: min(88dvh, 680px); padding-bottom: env(safe-area-inset-bottom, 0px); }
    .noyo-chat.is-open .noyo-chat-toggle { display: none; }
}

@media print
{
    .noyo-chat { display: none; }
}

@media screen and (max-width: 782px)
{
    .admin-bar .top { top: 46px; }
}

@media screen and (max-width: 600px)
{
    .admin-bar .top { top: 0; }
}