/* First-screen preview only. Existing brand, cubes, slogan and their motion remain. */

.hx-hero .hero-message{position:absolute;left:36px;top:50%;transform:translateY(-1.3em);width:clamp(260px,32vw,400px);max-width:calc(100% - 44px);font-size:clamp(27px,2.5vw,38px);z-index:2;pointer-events:none}
.hx-hero .hero-message .hero-tagline{position:static;left:auto;top:auto;transform:none;width:100%;max-width:none;margin:0}
.hx-hero .hero-explanation{margin:42px 0 0;font:400 17px/1.55 var(--display);letter-spacing:-.005em;color:#66717d;text-align:left;max-width:400px}
.hero-note-ending{white-space:nowrap}

@media(min-width:1600px){.hx-hero .hero-message{left:48px}}
@media(min-width:768px) and (max-width:1100px){.hx-hero{min-height:950px}}
@media(max-width:767px){.hx-hero{min-height:1040px;height:max(1040px,100svh)}.hx-hero .hero-message{left:22px;top:230px;transform:none;width:calc(100% - 44px);max-width:400px;font-size:27px}.hx-hero .hero-explanation{font-size:16px;line-height:1.5;margin-top:34px;max-width:none}}
@media(max-width:360px){.hx-hero{min-height:1100px;height:max(1100px,100svh)}}

/* Approved headline hierarchy; brand and scene remain in place. */
.hx-hero .hero-message h1.hero-magic{font:400 clamp(27px,2.5vw,38px)/1.18 var(--display);letter-spacing:-.035em;margin:0;color:#424850;max-width:100%;text-wrap:balance;overflow-wrap:normal;white-space:normal}
.hx-hero .hero-message .hero-explanation{margin-top:24px;font-size:16px;line-height:1.5}
@media(max-width:767px){.hx-hero .hero-message h1.hero-magic{font-size:clamp(25px,7vw,30px);line-height:1.2}.hx-hero .hero-message .hero-explanation{font-size:15px;margin-top:20px}}
