.brand-hero{position:relative;padding:0;background:#f5f7fc;overflow:clip;overflow-anchor:none;text-align:center}
.notion-main .brand-hero[id]{scroll-margin-top:0}
.hero-scroll-pin{position:relative;height:100svh;min-height:540px;overflow:hidden;isolation:isolate}
.hero-narrative{position:absolute;z-index:2;left:18px;right:18px;top:calc(var(--copy-top,100px) - 24px);transform:translateY(var(--copy-shift,0px));pointer-events:none}
.hero-narrative h1{font-size:clamp(30px,4.3vw,58px);line-height:1.28;letter-spacing:-.055em;font-weight:750}
.hero-first-line{display:block;white-space:nowrap}
.hero-copy-pair{display:flex;justify-content:center;gap:.18em;margin-top:.12em;white-space:nowrap}
.hero-development{opacity:var(--development,0);transform:translateX(var(--pair-shift,0px))}
.hero-operation{color:#2e62e8;opacity:var(--operation,0)}
.hero-followup{margin-top:20px;font-size:clamp(16px,1.8vw,24px);line-height:1.5;color:#68778b;letter-spacing:-.035em}
.hero-followup span{display:block;opacity:var(--line-reveal,0);transform:translateY(calc((1 - var(--line-reveal,0))*12px))}
.hero-followup span:nth-child(2){color:#2e62e8;font-weight:650}
.hero-model.logo-motion{position:absolute;left:var(--model-left,50%);top:var(--model-top,350px);width:var(--model-width,500px);max-width:none;margin:0;opacity:1;transform:translateX(-50%);transform-origin:50% 20%}
.hero-model .psm-tile-label{font-size:15px;letter-spacing:0;line-height:1.1;white-space:normal;max-width:126px;text-align:center}
.hero-model .psm-tile-in{gap:7px}
.hero-model .psm-logo:after{opacity:.5}
@media(min-height:481px) and (prefers-reduced-motion:no-preference){.hero-story-ready .brand-hero:not(.hero-scroll-static){height:420svh}.hero-story-ready .brand-hero:not(.hero-scroll-static) .hero-scroll-pin{position:sticky;top:0;min-height:0}}
@media(max-width:600px){.hero-narrative{left:12px;right:12px}.hero-narrative h1{font-size:clamp(28px,7.7vw,38px)}.hero-followup{font-size:16px;line-height:1.45;margin-top:17px}}
.hero-scroll-static .hero-scroll-pin{height:auto;min-height:0;padding:100px 20px 30px;overflow:hidden}
.hero-scroll-static .hero-narrative{position:relative;inset:auto;transform:none}
.hero-scroll-static .hero-model.logo-motion{position:relative;left:auto;top:auto;width:min(100%,540px);margin:20px auto 0;opacity:1;transform:none}
.hero-scroll-static .hero-development,.hero-scroll-static .hero-operation,.hero-scroll-static .hero-followup span{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.hero-model *{animation-play-state:paused!important;transition:none!important}}

/* PC keeps the copy and complete orbit in separate columns. */
.hero-desktop .hero-narrative{text-align:left}
.hero-desktop .hero-narrative h1{font-size:clamp(36px,3.5vw,64px)}
.hero-desktop .hero-copy-pair{justify-content:flex-start}
.hero-desktop:not(.hero-scroll-static) .hero-narrative{left:var(--copy-left);right:auto;width:var(--copy-width);top:var(--copy-top)}
.hero-desktop.hero-scroll-static .hero-scroll-pin{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);align-items:center;gap:48px;padding:120px max(48px,calc((100vw - 1320px)/2)) 64px;min-height:100svh}
.hero-desktop.hero-scroll-static .hero-narrative{inset:auto;width:auto}
.hero-desktop.hero-scroll-static .hero-model.logo-motion{width:100%;max-width:700px;margin:0}
/* Original symbol, with a fuller extrusion, a polished rim and a separate ground shadow. */
.hero-model .psm-logo{left:-176px;top:-176px;width:352px;height:352px}
.hero-model .psm-layer{width:352px;height:352px;transform-origin:50% 50%}
.hero-model .psm-logo:after{content:none}
.psm-ground-shadow{position:absolute;left:-170px;top:195px;width:340px;height:55px;background:radial-gradient(ellipse,#16306724 0%,#1630670a 45%,transparent 72%);filter:blur(11px);pointer-events:none}