/* Cobrain V2 — one continuous attraction-to-action story */
.wr-cobrain {
    --wr-progress: 0;
    --wr-memory: 0;
    --wr-context: 0;
    --wr-decision: 0;
    --wr-resolution: 0;
    --wr-ink: #111427;
    --wr-muted: #4e5367;
    position: relative;
    isolation: isolate;
    color: var(--wr-ink);
    background: #f5f2ec;
    overflow: clip;
}

/* Dissolve the showcase into Cobrain instead of announcing a new panel. */
.showcase-section {
    border-bottom: 0;
}

.wr-cobrain,
.wr-cobrain * {
    box-sizing: border-box;
}

.wr-cobrain-stage {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 44%) minmax(0, 56%);
    grid-template-rows: auto;
    min-height: 345vh;
    min-height: 345svh;
    background:
        linear-gradient(180deg, #f8fbff 0%, rgba(250, 252, 255, .96) 1.5%, rgba(255, 255, 255, .58) 5%, transparent 11%),
        radial-gradient(ellipse 45% 17% at 78% 5%, rgba(255, 191, 142, .32), transparent 70%),
        radial-gradient(ellipse 52% 24% at 76% 29%, rgba(158, 183, 255, .42), transparent 70%),
        radial-gradient(ellipse 54% 30% at 78% 83%, rgba(113, 76, 255, .19), transparent 73%),
        radial-gradient(ellipse 42% 19% at 72% 100%, rgba(255, 145, 91, .14), transparent 75%),
        linear-gradient(
            180deg,
            #f8fbff 0%,
            #fff 3%,
            #f8f4ec 11%,
            #f1f0ee 18%,
            #dce8f2 29%,
            #aebed4 35%,
            #252b45 41%,
            #0a0d1c 51%,
            #070914 72%,
            #100c18 100%
        );
}

.wr-cobrain-aurora {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    opacity: .84;
    background:
        radial-gradient(circle at 72% 13%, rgba(255, 255, 255, .72) 0 1px, transparent 2px),
        radial-gradient(circle at 63% 24%, rgba(255, 255, 255, .5) 0 1px, transparent 2px),
        radial-gradient(circle at 88% 32%, rgba(221, 229, 255, .65) 0 1px, transparent 2px),
        radial-gradient(circle at 91% 62%, rgba(117, 100, 255, .42) 0 1px, transparent 2px),
        radial-gradient(circle at 69% 81%, rgba(244, 176, 122, .36) 0 1px, transparent 2px);
    background-size: 190px 210px, 270px 230px, 320px 280px, 240px 250px, 300px 310px;
    mask-image: linear-gradient(90deg, transparent 0 38%, #000 58% 100%);
}

.wr-cobrain-noise {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 1;
    opacity: .04;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.8'/%3E%3C/svg%3E");
    mix-blend-mode: soft-light;
}

.wr-cobrain-topbar {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    z-index: 8;
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 88px;
    padding: 0 clamp(24px, 5vw, 82px);
    color: rgba(18, 21, 39, .58);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .13em;
    text-transform: uppercase;
}

.wr-cobrain-brand,
.wr-cobrain-scrollcue {
    display: flex;
    align-items: center;
    gap: 12px;
}

.wr-cobrain-brandmark {
    width: 9px;
    height: 9px;
    border: 2px solid #7156ea;
    border-radius:  0;
    box-shadow: 0 0 0 5px rgba(113, 86, 234, .1);
}

.wr-cobrain-scrollcue::after {
    content: "";
    width: 42px;
    height: 1px;
    background: rgba(18, 21, 39, .22);
    transform-origin: left;
    transform: scaleX(calc(.18 + var(--wr-progress) * .82));
}

.wr-cobrain-copy {
    position: relative;
    z-index: 5;
    grid-column: 1;
    grid-row: 1;
    min-width: 0;
}

.wr-cobrain-scene {
    --scene-shift: 0px;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 115vh;
    min-height: 115svh;
    padding: 138px clamp(28px, 4.7vw, 78px) 100px clamp(28px, 6.4vw, 108px);
    transform: translate3d(0, var(--scene-shift), 0);
}

.wr-cobrain-scene > .wr-cobrain-kicker,
.wr-cobrain-scene > .wr-cobrain-title,
.wr-cobrain-scene > .wr-cobrain-description,
.wr-cobrain-scene > .wr-cobrain-cta,
.wr-cobrain-scene > .wr-cobrain-lockup {
    opacity: 0;
    transform: translate3d(0, 28px, 0);
    transition:
        opacity .75s cubic-bezier(.2, .75, .2, 1),
        transform .9s cubic-bezier(.2, .75, .2, 1);
}

.wr-cobrain-scene.is-visible > .wr-cobrain-kicker,
.wr-cobrain-scene.is-visible > .wr-cobrain-title,
.wr-cobrain-scene.is-visible > .wr-cobrain-description,
.wr-cobrain-scene.is-visible > .wr-cobrain-cta,
.wr-cobrain-scene.is-visible > .wr-cobrain-lockup {
    opacity: 1;
    transform: translate3d(0, 0, 0);
}

.wr-cobrain-scene.is-visible > .wr-cobrain-title { transition-delay: .08s; }
.wr-cobrain-scene.is-visible > .wr-cobrain-description { transition-delay: .16s; }
.wr-cobrain-scene.is-visible > .wr-cobrain-cta { transition-delay: .23s; }
.wr-cobrain-scene.is-visible > .wr-cobrain-lockup { transition-delay: .28s; }

.wr-cobrain-kicker {
    display: flex;
    align-items: center;
    gap: 12px;
    width: fit-content;
    margin: 0 0 24px;
    font-size: 12px;
    font-weight: 750;
    line-height: 1;
    letter-spacing: .15em;
    text-transform: uppercase;
}

.wr-cobrain-kicker::before {
    content: "";
    width: 27px;
    height: 1px;
    background: currentColor;
    opacity: .55;
}

.wr-cobrain-title {
    max-width: 690px;
    margin: 0;
    color: inherit;
    font-size: clamp(43.2px, 4.32vw, 70.2px);
    font-weight: 590;
    line-height: .98;
    letter-spacing: -.058em;
    text-wrap: balance;
}

.wr-cobrain-title em {
    display: inline;
    color: inherit;
    font-family: inherit;
    font-style: normal;
    font-weight: inherit;
}

.wr-cobrain-description {
    max-width: 610px;
    margin: 30px 0 0;
    color: var(--wr-muted);
    font-size: clamp(17px, 1.4vw, 21px);
    font-weight: 430;
    line-height: 1.58;
    letter-spacing: -.016em;
}

.wr-cobrain-scene[data-scene="0"] {
    color: #121526;
}

.wr-cobrain-scene[data-scene="0"] .wr-cobrain-kicker {
    color: #674bd6;
}

.wr-cobrain-scene[data-scene="0"] .wr-cobrain-title em {
    background: linear-gradient(110deg, #6b4ee1 3%, #2e4e92 62%, #17213f 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.wr-cobrain-scene[data-scene="1"],
.wr-cobrain-scene[data-scene="2"] {
    color: #f7f7fb;
    text-shadow: 0 2px 30px rgba(0, 0, 0, .18);
}

.wr-cobrain-scene[data-scene="1"] {
    padding-top: 230px;
    padding-bottom: 70px;
}

.wr-cobrain-scene[data-scene="1"] .wr-cobrain-kicker {
    color: #a7c8ff;
}

.wr-cobrain-scene[data-scene="1"] .wr-cobrain-description,
.wr-cobrain-scene[data-scene="2"] .wr-cobrain-description {
    color: rgba(239, 241, 251, .72);
}

.wr-cobrain-scene[data-scene="1"] .wr-cobrain-title em {
    background: linear-gradient(110deg, #b8d7ff, #bfacff 62%, #fff 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.wr-cobrain-scene[data-scene="2"] .wr-cobrain-kicker {
    color: #e6ad84;
}

.wr-cobrain-scene[data-scene="2"] .wr-cobrain-title em {
    background: linear-gradient(110deg, #fff 0%, #f4c5a0 46%, #ba9eff 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.wr-cobrain-cta {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 38px;
}

.wr-cobrain-cta a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 52px;
    padding: 0 22px;
    border-radius:  0;
    font-size: 14px;
    font-weight: 720;
    line-height: 1;
    text-decoration: none;
    transition: transform .2s ease, border-color .2s ease, background .2s ease, box-shadow .2s ease;
}

.wr-cobrain-cta a:hover {
    transform: translateY(-2px);
}

.wr-cobrain-cta a:focus-visible {
    outline: 3px solid rgba(190, 167, 255, .72);
    outline-offset: 4px;
}

.wr-cobrain-cta-primary {
    gap: 11px;
    color: #16101b;
    background: #fff;
    box-shadow: 0 12px 34px rgba(0, 0, 0, .24), inset 0 0 0 1px rgba(255, 255, 255, .75);
}

.wr-cobrain-cta-primary:hover {
    color: #16101b;
    background: #f7e4d7;
    box-shadow: 0 18px 40px rgba(0, 0, 0, .3);
}

.wr-cobrain-cta-secondary {
    color: #fff;
    border: 1px solid rgba(255, 255, 255, .24);
    background: rgba(255, 255, 255, .055);
    backdrop-filter: blur(14px);
}

.wr-cobrain-cta-secondary:hover {
    color: #fff;
    border-color: rgba(255, 255, 255, .44);
    background: rgba(255, 255, 255, .1);
}

.wr-cobrain-lockup {
    margin: 42px 0 0;
    color: #fff;
    font-size: 14px;
    font-weight: 720;
    letter-spacing: -.01em;
}

.wr-cobrain-lockup span {
    color: rgba(245, 240, 249, .56);
    font-weight: 500;
}

/* Persistent visual rail */
.wr-cobrain-presence {
    position: relative;
    z-index: 4;
    grid-column: 2;
    grid-row: 1;
    min-width: 0;
    height: 100%;
}

.wr-cobrain-presence-sticky {
    position: sticky;
    top: 76px;
    height: calc(100vh - 76px);
    height: calc(100svh - 76px);
    min-height: 580px;
    overflow: hidden;
}

.wr-cobrain-presence-sticky::before {
    content: "";
    position: absolute;
    z-index: 0;
    width: min(52vw, 760px);
    aspect-ratio: 1;
    top: 45%;
    left: 52%;
    border: 1px solid rgba(255, 255, 255, calc(.05 + var(--wr-context) * .07));
    border-radius:  0;
    background:
        radial-gradient(circle at 50% 45%,
            rgba(145, 117, 255, calc(var(--wr-context) * .17)) 0,
            rgba(124, 146, 255, calc(var(--wr-context) * .06)) 42%,
            transparent 70%);
    transform: translate(-50%, -50%) scale(calc(.84 + var(--wr-context) * .16));
    transition: border-color .25s linear;
}

.wr-cobrain-portrait {
    position: absolute;
    z-index: 1;
    inset: 4% 0 0 2%;
    overflow: hidden;
    transform:
        translate3d(
            calc(var(--wr-decision) * 7% - var(--wr-resolution) * 3%),
            calc(var(--wr-memory) * -1.5% + var(--wr-resolution) * 2%),
            0
        )
        scale(calc(1 + var(--wr-context) * .025 - var(--wr-resolution) * .035));
    transform-origin: 58% 50%;
    will-change: transform;
}

.wr-cobrain-portrait img {
    position: absolute;
    top: 50%;
    right: -2%;
    width: min(52vw, 760px);
    height: min(91vh, 920px);
    object-fit: cover;
    object-position: 54% 48%;
    border-radius:  0;
    transform: translateY(-50%);
    -webkit-mask-image:
        linear-gradient(to bottom, transparent 0%, #000 7%, #000 86%, transparent 100%),
        linear-gradient(to right, transparent 0%, #000 12%, #000 88%, transparent 100%);
    -webkit-mask-composite: source-in;
    mask-image:
        linear-gradient(to bottom, transparent 0%, #000 7%, #000 86%, transparent 100%),
        linear-gradient(to right, transparent 0%, #000 12%, #000 88%, transparent 100%);
    mask-composite: intersect;
}

.wr-cobrain-portrait-light {
    opacity: calc(1 - var(--wr-context) * .97);
    filter: saturate(.9) contrast(.98) brightness(1.04);
}

.wr-cobrain-portrait-dark {
    opacity: calc(.08 + var(--wr-context) * .92);
    filter: saturate(.76) contrast(1.16) brightness(calc(.54 + var(--wr-resolution) * .16));
    mix-blend-mode: screen;
}

.wr-cobrain-portrait-aura {
    position: absolute;
    z-index: 2;
    top: 36%;
    left: 57%;
    width: min(25vw, 360px);
    aspect-ratio: 1;
    border-radius:  0;
    pointer-events: none;
    background:
        radial-gradient(circle,
            rgba(184, 164, 255, calc(.1 + var(--wr-context) * .34)) 0,
            rgba(106, 151, 255, calc(.05 + var(--wr-context) * .12)) 36%,
            transparent 69%);
    filter: blur(calc(18px + var(--wr-context) * 18px));
    transform: translate(-50%, -50%) scale(calc(.76 + var(--wr-context) * .34 + var(--wr-resolution) * .12));
    mix-blend-mode: screen;
}

.wr-cobrain-portrait-scan {
    position: absolute;
    z-index: 3;
    left: 17%;
    right: 9%;
    top: calc(30% + var(--wr-context) * 30%);
    height: 1px;
    opacity: calc(var(--wr-context) * (1 - var(--wr-resolution)));
    background: linear-gradient(90deg, transparent, rgba(186, 215, 255, .9) 28% 72%, transparent);
    box-shadow: 0 0 18px rgba(127, 173, 255, .65);
    transform: translateY(calc(var(--wr-context) * 90px));
}

.wr-cobrain-memory {
    position: absolute;
    z-index: 5;
    inset: 0;
    pointer-events: none;
}

.wr-memory-fragment {
    position: absolute;
    display: grid;
    gap: 7px;
    max-width: 238px;
    padding: 15px 17px 16px;
    border: 1px solid rgba(255, 255, 255, .4);
    border-radius:  0;
    color: #20243a;
    background: rgba(255, 255, 255, .54);
    box-shadow: 0 18px 52px rgba(38, 48, 79, .14);
    backdrop-filter: blur(18px) saturate(1.2);
    font-size: 13px;
    font-weight: 590;
    line-height: 1.35;
    letter-spacing: -.01em;
    opacity: calc(var(--wr-memory) * (1 - var(--wr-decision)));
    transform:
        translate3d(
            calc((1 - var(--wr-memory)) * var(--fragment-x)),
            calc((1 - var(--wr-memory)) * var(--fragment-y) + var(--wr-decision) * var(--collapse-y)),
            0
        )
        scale(calc(.88 + var(--wr-memory) * .12 - var(--wr-decision) * .06));
    filter: blur(calc((1 - var(--wr-memory)) * 4px));
    will-change: opacity, transform, filter;
}

.wr-memory-fragment small {
    color: #7356d8;
    font-size: 9px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: .14em;
    text-transform: uppercase;
}

.wr-memory-one {
    --fragment-x: -74px;
    --fragment-y: -34px;
    --collapse-y: 94px;
    top: 16%;
    left: 3%;
}

.wr-memory-two {
    --fragment-x: 58px;
    --fragment-y: -62px;
    --collapse-y: 45px;
    top: 27%;
    right: 4%;
}

.wr-memory-three {
    --fragment-x: -50px;
    --fragment-y: 72px;
    --collapse-y: -28px;
    left: 5%;
    bottom: 19%;
}

.wr-memory-four {
    --fragment-x: 82px;
    --fragment-y: 42px;
    --collapse-y: -74px;
    right: 5%;
    bottom: 28%;
}

.wr-cobrain-decision,
.wr-cobrain-resolution {
    position: absolute;
    z-index: 8;
    color: #f8f8fb;
    backdrop-filter: blur(28px) saturate(1.18);
    box-shadow: 0 30px 90px rgba(0, 0, 0, .36);
    will-change: opacity, transform, filter;
}

.wr-cobrain-decision {
    left: 4%;
    bottom: 7.5%;
    width: min(88%, 560px);
    padding: 24px 25px 22px;
    border: 1px solid rgba(188, 203, 255, .24);
    border-radius:  0;
    background: linear-gradient(145deg, rgba(18, 24, 47, .82), rgba(19, 15, 35, .76));
    opacity: var(--wr-decision);
    transform:
        translate3d(0, calc((1 - var(--wr-decision)) * 42px - var(--wr-resolution) * 26px), 0)
        scale(calc(.94 + var(--wr-decision) * .06 - var(--wr-resolution) * .03));
    filter: blur(calc((1 - var(--wr-decision)) * 6px));
}

.wr-cobrain-decision > p:first-child {
    display: flex;
    align-items: center;
    gap: 9px;
    margin: 0 0 16px;
    color: #b9c9ff;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.wr-cobrain-live-dot {
    width: 7px;
    height: 7px;
    border-radius:  0;
    background: #9b84ff;
    box-shadow: 0 0 0 5px rgba(155, 132, 255, .12), 0 0 18px #9b84ff;
}

.wr-cobrain-decision h3 {
    margin: 0;
    color: #fff;
    font-size: clamp(24px, 2.5vw, 38px);
    font-weight: 630;
    line-height: 1.05;
    letter-spacing: -.045em;
}

.wr-cobrain-decision-rule {
    width: 100%;
    height: 1px;
    margin: 18px 0;
    background: linear-gradient(90deg, rgba(172, 192, 255, .46), transparent);
    transform-origin: left;
    transform: scaleX(var(--wr-decision));
}

.wr-cobrain-decision-copy {
    max-width: 470px;
    margin: 0;
    color: rgba(240, 242, 251, .7);
    font-size: 14px;
    line-height: 1.55;
}

.wr-cobrain-decision-evidence {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 18px;
}

.wr-cobrain-decision-evidence span {
    padding: 7px 9px;
    border: 1px solid rgba(255, 255, 255, .09);
    border-radius:  0;
    color: rgba(239, 242, 255, .6);
    background: rgba(255, 255, 255, .035);
    font-size: 9px;
    font-weight: 680;
    letter-spacing: .04em;
}

.wr-cobrain-resolution {
    top: 50%;
    right: clamp(20px, 5%, 70px);
    width: min(88%, 520px);
    padding: 22px;
    border: 1px solid rgba(255, 217, 193, .21);
    border-radius:  0;
    background:
        radial-gradient(circle at 92% 8%, rgba(255, 167, 109, .14), transparent 28%),
        linear-gradient(145deg, rgba(24, 19, 34, .88), rgba(12, 13, 28, .84));
    opacity: var(--wr-resolution);
    transform:
        translate3d(calc((1 - var(--wr-resolution)) * 34px), -50%, 0)
        scale(calc(.94 + var(--wr-resolution) * .06));
    filter: blur(calc((1 - var(--wr-resolution)) * 7px));
}

.wr-cobrain-resolution-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 2px 2px 18px;
    color: rgba(247, 241, 250, .66);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .09em;
    text-transform: uppercase;
}

.wr-cobrain-resolution-head strong {
    display: flex;
    align-items: center;
    gap: 7px;
    color: #f1b994;
    font-size: 9px;
    letter-spacing: .1em;
}

.wr-cobrain-resolution-head strong::before {
    content: "";
    width: 6px;
    height: 6px;
    border-radius:  0;
    background: #f1b994;
    box-shadow: 0 0 12px rgba(241, 185, 148, .8);
}

.wr-cobrain-resolution ol {
    display: grid;
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.wr-cobrain-resolution li {
    display: grid;
    grid-template-columns: 31px minmax(0, 1fr);
    align-items: center;
    gap: 12px;
    min-height: 62px;
    padding: 10px 12px;
    border: 1px solid rgba(255, 255, 255, .075);
    border-radius:  0;
    background: rgba(255, 255, 255, .035);
    opacity: clamp(0, calc(var(--wr-resolution) * 3 - var(--step) * .32 - .2), 1);
    transform: translateX(calc((1 - var(--wr-resolution)) * 16px + var(--step) * 2px));
}

.wr-cobrain-resolution li > i {
    display: grid;
    place-items: center;
    width: 30px;
    height: 30px;
    border: 1px solid rgba(181, 151, 255, .25);
    border-radius:  0;
    color: #d8c9ff;
    background: rgba(129, 93, 233, .12);
    font-size: 10px;
}

.wr-cobrain-resolution li span {
    display: grid;
    gap: 3px;
}

.wr-cobrain-resolution li strong {
    color: #fff;
    font-size: 13px;
    font-weight: 690;
}

.wr-cobrain-resolution li small {
    color: rgba(235, 231, 241, .5);
    font-size: 10px;
    font-weight: 500;
}

.wr-cobrain-resolution-result {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
    margin-top: 13px;
    padding: 17px 4px 2px;
    border-top: 1px solid rgba(255, 255, 255, .09);
}

.wr-cobrain-resolution-result span {
    color: rgba(241, 235, 246, .45);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.wr-cobrain-resolution-result strong {
    color: #f4c5a5;
    font-size: 16px;
    font-weight: 700;
    letter-spacing: -.02em;
}

.wr-cobrain-mobile-visual {
    display: none;
}

/* V1 display furniture is intentionally retired: V2 is one uninterrupted argument. */
.wr-cobrain-nav,
.wr-cobrain-proof,
.wr-cobrain-chapter-visual,
.wr-cobrain-transition,
.wr-cobrain-stage-footer {
    display: none !important;
}

@media (max-width: 1180px) {
    .wr-cobrain-stage {
        grid-template-columns: minmax(0, 47%) minmax(0, 53%);
    }

    .wr-cobrain-scene {
        padding-left: clamp(36px, 5vw, 64px);
        padding-right: clamp(26px, 3.5vw, 46px);
    }

    .wr-cobrain-title {
        font-size: clamp(41.4px, 4.68vw, 57.6px);
    }

    .wr-cobrain-portrait img {
        right: -12%;
        width: min(61vw, 690px);
    }

    .wr-memory-fragment {
        max-width: 200px;
        font-size: 11px;
    }
}

@media (max-width: 860px) {
    .wr-cobrain {
        overflow: hidden;
    }

    .wr-cobrain-stage {
        display: block;
        min-height: 0;
        background:
            linear-gradient(180deg, #f8fbff 0%, rgba(255, 255, 255, .68) 5%, transparent 13%),
            radial-gradient(ellipse 80% 13% at 54% 9%, rgba(255, 184, 137, .3), transparent 70%),
            radial-gradient(ellipse 90% 17% at 50% 80%, rgba(123, 88, 255, .16), transparent 72%),
            linear-gradient(
                180deg,
                #f8fbff 0%,
                #fff 3%,
                #f8f4ec 11%,
                #e7edf2 28%,
                #161b31 39%,
                #080a16 55%,
                #0b0a17 100%
            );
    }

    .wr-cobrain-topbar {
        min-height: 76px;
        padding-inline: clamp(22px, 6vw, 48px);
    }

    .wr-cobrain-scrollcue span {
        display: none;
    }

    .wr-cobrain-scrollcue::after {
        width: 34px;
    }

    .wr-cobrain-copy {
        display: block;
    }

    .wr-cobrain-scene {
        min-height: 0;
        padding: 124px clamp(22px, 7vw, 56px) 88px;
        transform: none;
    }

    .wr-cobrain-scene[data-scene="0"] {
        min-height: 100svh;
    }

    .wr-cobrain-scene[data-scene="1"],
    .wr-cobrain-scene[data-scene="2"] {
        padding-top: 92px;
        padding-bottom: 110px;
    }

    .wr-cobrain-title {
        max-width: 660px;
        font-size: clamp(39.6px, 8.1vw, 61.2px);
    }

    .wr-cobrain-description {
        max-width: 620px;
    }

    .wr-cobrain-presence {
        display: none;
    }

    .wr-cobrain-mobile-visual {
        position: relative;
        display: block;
        width: 100%;
        max-width: 610px;
        height: clamp(420px, 72vw, 580px);
        margin: 48px auto 0;
        overflow: hidden;
        border-radius:  0;
        isolation: isolate;
    }

    .wr-cobrain-mobile-visual::after {
        content: "";
        position: absolute;
        inset: 0;
        z-index: 2;
        pointer-events: none;
        background: linear-gradient(180deg, transparent 48%, rgba(6, 8, 18, .82) 100%);
    }

    .wr-cobrain-mobile-visual img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: 52% 46%;
    }

    .wr-cobrain-mobile-attraction {
        box-shadow: 0 34px 90px rgba(73, 77, 110, .2);
    }

    .wr-cobrain-mobile-attraction::after {
        background: linear-gradient(180deg, transparent 65%, rgba(233, 239, 244, .7) 100%);
    }

    .wr-cobrain-mobile-context,
    .wr-cobrain-mobile-action {
        border: 1px solid rgba(255, 255, 255, .11);
        background: #0d1020;
        box-shadow: 0 34px 90px rgba(0, 0, 0, .34);
    }

    .wr-cobrain-mobile-context img {
        filter: saturate(.75) contrast(1.16) brightness(.66);
    }

    .wr-cobrain-mobile-action img {
        filter: saturate(.72) contrast(1.18) brightness(.55);
    }

    .wr-cobrain-mobile-insight,
    .wr-cobrain-mobile-outcome {
        position: absolute;
        z-index: 3;
        left: 18px;
        right: 18px;
        bottom: 18px;
        border: 1px solid rgba(255, 255, 255, .15);
        border-radius:  0;
        color: #fff;
        background: rgba(15, 17, 34, .74);
        backdrop-filter: blur(18px);
    }

    .wr-cobrain-mobile-insight {
        display: grid;
        gap: 8px;
        padding: 19px;
    }

    .wr-cobrain-mobile-insight span {
        color: #b8caff;
        font-size: 9px;
        font-weight: 800;
        letter-spacing: .12em;
        text-transform: uppercase;
    }

    .wr-cobrain-mobile-insight strong {
        font-size: clamp(19px, 4vw, 28px);
        letter-spacing: -.035em;
    }

    .wr-cobrain-mobile-outcome {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
        padding: 12px;
    }

    .wr-cobrain-mobile-outcome span {
        display: flex;
        align-items: center;
        gap: 8px;
        min-height: 46px;
        padding: 9px;
        border-radius:  0;
        color: rgba(255, 255, 255, .82);
        background: rgba(255, 255, 255, .05);
        font-size: 10px;
        font-weight: 650;
    }

    .wr-cobrain-mobile-outcome i {
        color: #e7b08a;
    }
}

@media (max-width: 560px) {
    .wr-cobrain-topbar {
        min-height: 68px;
        padding-inline: 20px;
        font-size: 9px;
        letter-spacing: .1em;
    }

    .wr-cobrain-brand {
        gap: 9px;
    }

    .wr-cobrain-brandmark {
        width: 7px;
        height: 7px;
        box-shadow: 0 0 0 4px rgba(113, 86, 234, .1);
    }

    .wr-cobrain-scene {
        padding-inline: 20px;
    }

    .wr-cobrain-scene[data-scene="0"] {
        padding-top: 112px;
        padding-bottom: 80px;
    }

    .wr-cobrain-scene[data-scene="1"],
    .wr-cobrain-scene[data-scene="2"] {
        padding-top: 76px;
        padding-bottom: 92px;
    }

    .wr-cobrain-kicker {
        margin-bottom: 18px;
        font-size: 10px;
    }

    .wr-cobrain-title {
        font-size: clamp(36px, 10.8vw, 48.6px);
        line-height: 1;
        letter-spacing: -.055em;
    }

    .wr-cobrain-description {
        margin-top: 23px;
        font-size: 16px;
        line-height: 1.55;
    }

    .wr-cobrain-mobile-visual {
        height: 470px;
        margin-top: 36px;
        border-radius:  0;
    }

    .wr-cobrain-cta {
        align-items: stretch;
        flex-direction: column;
        margin-top: 30px;
    }

    .wr-cobrain-cta a {
        width: 100%;
    }

    .wr-cobrain-lockup {
        margin-top: 30px;
        line-height: 1.5;
    }
}

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

    .wr-cobrain-stage {
        display: block;
        min-height: 0;
    }

    .wr-cobrain-presence {
        display: none;
    }

    .wr-cobrain-scene {
        min-height: 0;
        padding-top: 130px;
        padding-bottom: 110px;
        transform: none !important;
    }

    .wr-cobrain-scene > .wr-cobrain-kicker,
    .wr-cobrain-scene > .wr-cobrain-title,
    .wr-cobrain-scene > .wr-cobrain-description,
    .wr-cobrain-scene > .wr-cobrain-cta,
    .wr-cobrain-scene > .wr-cobrain-lockup {
        opacity: 1 !important;
        transform: none !important;
    }

    .wr-cobrain-mobile-visual {
        display: block;
        position: relative;
        width: min(100%, 640px);
        height: min(580px, 70vw);
        margin: 46px 0 0;
        overflow: hidden;
        border-radius:  0;
    }

    .wr-cobrain-mobile-visual img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
}