.hero{
            --hero-content-top:clamp(118px,14vh,146px);
            --hero-content-bottom:clamp(84px,12vh,128px);
            position:relative;
            height:100vh;
            height:100svh;
            min-height:0;
            padding:0;
            overflow:hidden;
            background:#191216;
        }

        .hero-media{
            position:absolute;
            inset:0;
            z-index:0;
            overflow:hidden;
            background:#191216;
        }

        .hero-video__media{
            position:absolute;
            inset:0;
            display:block;
            width:100%;
            height:100%;
            object-fit:cover;
            object-position:center center;
        }

        .hero-video-overlay{
            position:absolute;
            inset:0;
            z-index:1;
            pointer-events:none;
            background:
                linear-gradient(
                    90deg,
                    rgba(8,6,7,.80) 0%,
                    rgba(8,6,7,.68) 20%,
                    rgba(8,6,7,.50) 38%,
                    rgba(8,6,7,.28) 55%,
                    rgba(8,6,7,.10) 72%,
                    rgba(8,6,7,0) 100%
                ),
                linear-gradient(
                    180deg,
                    rgba(8,6,7,.14) 0%,
                    rgba(8,6,7,.08) 52%,
                    rgba(8,6,7,.18) 100%
                );
        }

        .hero-grid{
            position:relative;
            z-index:2;
            width:min(calc(100% - 64px),var(--max));
            height:100vh;
            height:100svh;
            min-height:0;
            margin:0 auto;
            display:grid;
            grid-template-columns:minmax(0,1fr) minmax(280px,.62fr);
            align-items:stretch;
        }

        .hero-copy{
            position:relative;
            z-index:3;
            min-width:0;
            display:flex;
            flex-direction:column;
            justify-content:center;
            padding:var(--hero-content-top) 60px var(--hero-content-bottom) 16px;
        }

        .hero-copy .eyebrow{
            color:#f1a7b4;
            text-shadow:0 1px 16px rgba(0,0,0,.22);
        }

        .hero-copy .display{
            max-width:650px;
            font-weight:500;
        }

        .hero-copy .display .small-line{
            display:block;
            font-size:.78em;
            color:#fff;
            text-shadow:0 2px 22px rgba(20,10,14,.24);
        }

        .hero-copy .display .accent{
            display:block;
            color:#f2a3b1;
            text-shadow:0 2px 22px rgba(20,10,14,.22);
        }

        @media (min-width:901px){
            .hero-copy .display .accent{
                padding-top:10px;
            }
        }

        .hero-copy .display .hero-studio-word{
            font-size:calc(1em - 2px);
        }

        .hero-copy > p:not(.eyebrow){
            max-width:610px;
            margin:26px 0 0;
            font-size:17px;
            color:rgba(255,255,255,.92);
            text-shadow:0 1px 14px rgba(20,10,14,.24);
        }

        .hero-cta{
            display:flex;
            gap:12px;
            flex-wrap:wrap;
            margin-top:30px;
        }

        .hero .btn--primary{
            background:#e993a3;
            color:#fff;
            box-shadow:0 12px 28px rgba(91,35,49,.22);
        }

        .hero .btn--ghost{
            color:#fff;
            border-color:rgba(255,255,255,.64);
            background:rgba(255,255,255,.10);
            backdrop-filter:blur(8px);
            -webkit-backdrop-filter:blur(8px);
        }

        .hero-points{
            display:flex;
            gap:30px;
            flex-wrap:wrap;
            max-width:680px;
            margin-top:48px;
            padding-top:28px;
            border-top:1px solid rgba(255,255,255,.30);
        }

        .hero-point{
            display:flex;
            align-items:center;
            gap:12px;
            color:rgba(255,255,255,.96);
            font-size:15px;
            line-height:1.3;
            font-weight:600;
            text-shadow:0 1px 14px rgba(20,10,14,.24);
        }

        .hero-point svg{
            width:29px;
            height:29px;
            flex:0 0 29px;
            color:#f2a3b1;
        }

        .hero-socials{
            z-index:9;
        }

        .hero-socials--desktop{
            position:absolute;
            top:50%;
            right:0;
            display:flex;
            flex-direction:column;
            align-items:flex-end;
            gap:8px;
            transform:translateY(-50%);
        }

        .hero-socials--mobile{
            display:none;
        }

       .hero-social-tag{
    display:flex;
    align-items:center;
    gap:10px;
    min-height:44px;
    padding:0 17px 0 14px;
    border:1px solid rgba(255,255,255,.28);
    border-right:0;
    border-radius:16px 0 0 16px;
    background:rgba(28,18,22,.46);
    color:rgba(255,255,255,.96);
    -webkit-backdrop-filter:blur(12px);
    backdrop-filter:blur(12px);
    font-family:var(--sans);
    font-size:13px;
    line-height:1;
    font-weight:500;
    text-decoration:none;
    box-shadow:0 10px 28px rgba(17,8,11,.12);
    transition:
        padding .28s cubic-bezier(.22,1,.36,1),
        background-color .22s ease,
        border-color .22s ease,
        color .22s ease;
}

        .hero-social-tag i{
            width:18px;
            flex:0 0 18px;
            color:#f2a3b1;
            font-size:18px;
            line-height:1;
            text-align:center;
        }

        .hero-social-tag:hover,
        .hero-social-tag:focus-visible{
            padding-right:23px;
            background:rgba(200,111,130,.78);
            border-color:rgba(255,255,255,.42);
            color:#fff;
        }

        .hero-social-tag:hover i,
        .hero-social-tag:focus-visible i{
            color:#fff;
        }

        .hero-curve{
            position:absolute;
            z-index:10;
            left:0;
            right:0;
            bottom:-1px;
            width:100%;
            height:clamp(88px,14vh,150px);
            pointer-events:none;
        }

        .hero-curve svg{
            position:absolute;
            left:0;
            bottom:0;
            width:100%;
            height:100%;
            display:block;
            overflow:visible;
        }

        .hero-curve-shape{fill:#fffaf7}

        .hero-curve-shadow{
            fill:none;
            stroke:rgba(89,52,61,.11);
            stroke-width:18;
            stroke-linecap:round;
            transform:translateY(8px);
            filter:blur(8px);
        }

        .hero-curve-highlight{
            fill:none;
            stroke:rgba(255,255,255,.92);
            stroke-width:2;
            transform:translateY(1px);
        }

        @media (min-width:901px) and (max-height:700px){
            .hero{
                --hero-content-top:96px;
                --hero-content-bottom:74px;
            }

            .hero-copy{
                padding:var(--hero-content-top) 48px var(--hero-content-bottom) 16px;
            }

            .hero-copy .display{
                font-size:clamp(44px,4.7vw,68px);
            }

            .hero-copy > p:not(.eyebrow){
                margin-top:16px;
                font-size:15px;
                line-height:1.55;
            }

            .hero-cta{margin-top:20px}

            .hero-points{
                margin-top:24px;
                padding-top:18px;
                gap:22px;
            }
        }

        @media (max-width:900px){
            .hero{
                height:auto;
                min-height:100svh;
            }

            .hero-video-overlay{
                background:
                    linear-gradient(
                        180deg,
                        rgba(7,5,6,.34) 0%,
                        rgba(7,5,6,.42) 36%,
                        rgba(7,5,6,.48) 68%,
                        rgba(7,5,6,.28) 100%
                    );
            }

            .hero-grid{
                width:100%;
                height:auto;
                min-height:100svh;
                display:block;
            }

            .hero-copy{
                width:100%;
                min-height:100svh;
                padding:126px 32px 118px;
                align-items:center;
                justify-content:center;
                text-align:center;
            }

            .hero-copy .eyebrow{
                width:100%;
                margin:0 0 16px;
                text-align:center;
            }

            .hero-copy .display{
                width:min(100%,680px);
                max-width:none;
                margin:0 auto;
                font-size:clamp(54px,9.5vw,76px);
                line-height:.88;
                text-align:center;
            }

            .hero-copy > p:not(.eyebrow){
                width:min(100%,560px);
                max-width:none;
                margin:22px auto 0;
                font-size:16px;
                line-height:1.65;
                text-align:center;
            }

            .hero-cta{
                width:100%;
                justify-content:center;
                margin-top:26px;
            }

            .hero-points{
                width:min(100%,620px);
                max-width:none;
                display:grid;
                grid-template-columns:repeat(3,minmax(0,1fr));
                gap:16px;
                margin:34px auto 0;
                padding-top:22px;
            }

            .hero-point{
                min-width:0;
                display:grid;
                grid-template-columns:1fr;
                justify-items:center;
                align-content:start;
                gap:8px;
                font-size:13px;
                line-height:1.3;
                text-align:center;
            }

            .hero-point svg{
                width:28px;
                height:28px;
                flex:none;
            }

            .hero-socials--desktop{
                display:none;
            }

            .hero-socials--mobile{
                width:100%;
                display:none;
                justify-content:center;
                gap:10px;
                margin-top:18px;
            }

            .hero-socials--mobile .hero-social-tag{
                min-height:42px;
                padding:0 16px;
                border:1px solid rgba(255,255,255,.30);
                border-radius:999px;
                background:rgba(255,255,255,.10);
                box-shadow:none;
                font-size:12px;
            }

            .hero-socials--mobile .hero-social-tag:hover,
            .hero-socials--mobile .hero-social-tag:focus-visible{
                padding:0 16px;
                background:rgba(200,111,130,.72);
            }

            .hero-curve{height:88px}
        }

        @media (max-width:620px){
            .hero-copy{
                padding:116px 22px 94px;
            }

            .hero-copy .eyebrow{
                font-size:11px;
                line-height:1.4;
                letter-spacing:.16em;
            }

            .hero-copy .display{
                width:100%;
                font-size:clamp(48px,13vw,64px);
                line-height:.88;
            }

            .hero-copy .display .small-line{
                font-size:.68em;
                white-space:nowrap;
            }

            .hero-copy .display .accent{
                white-space:nowrap;
            }

            .hero-copy > p:not(.eyebrow){
                width:min(100%,440px);
                margin-top:22px;
                font-size:15px;
                line-height:1.62;
            }

            .hero-cta{
                gap:10px;
                margin-top:24px;
            }

            .hero-cta .btn{
                min-height:49px;
                padding:13px 19px;
            }

            .hero-points{
                width:min(100%,430px);
                gap:8px;
                margin-top:30px;
                padding-top:20px;
            }

            .hero-point{
                font-size:12px;
                line-height:1.25;
            }

            .hero-point svg{
                width:27px;
                height:27px;
            }

            .hero-socials--mobile{
                margin-top:16px;
                gap:8px;
            }

            .hero-socials--mobile .hero-social-tag{
                min-height:40px;
                padding:0 14px;
                font-size:11px;
            }

            .hero-socials--mobile .hero-social-tag i{
                width:16px;
                flex-basis:16px;
                font-size:16px;
            }

            .hero-socials--mobile .hero-social-tag:hover,
            .hero-socials--mobile .hero-social-tag:focus-visible{
                padding:0 14px;
            }

            .hero-curve{height:68px}

            .hero-curve-shadow{
                stroke-width:12;
                transform:translateY(5px);
                filter:blur(6px);
            }
        }

        @media (max-width:390px){
            .hero-copy{
                padding:110px 18px 90px;
            }

            .hero-copy .display{
                font-size:clamp(45px,13vw,52px);
            }

            .hero-cta{
                width:min(100%,250px);
                display:grid;
                grid-template-columns:1fr;
            }

            .hero-cta .btn{width:100%}

            .hero-points{
                width:min(100%,330px);
                gap:6px;
            }

            .hero-point{font-size:11px}
        }

        @media (prefers-reduced-motion:reduce){
            .hero-social-tag{
                transition:none;
            }

        }
