/* Перший екран головної «Сцена»: зліва вгорі — партнер і короткий опис, праворуч — маніфест і глаз,
   унизу — великий логотип ONOVA. Розмітка: index.html / en/index.html, секція .sh-hero. */
.sh-hero{--sh-g:32px;--sh-ink:#20221f;--sh-mute:#6b6862;position:relative;height:100svh;min-height:680px;overflow:hidden;background:#eeeae4;color:var(--sh-ink);font-family:Onest,system-ui,sans-serif}
.sh-hero .sh-side{position:absolute;left:var(--sh-g);top:118px;max-width:360px}
.sh-hero .sh-k{font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--sh-mute);display:flex;align-items:center;gap:12px;margin:0}
.sh-hero .sh-k::before{content:'';width:7px;height:7px;border-radius:50%;background:#ef8354}
.sh-hero .sh-side p:not(.sh-k){margin:18px 0 0;font-size:14px;line-height:1.6;color:var(--sh-mute)}
.sh-hero .sh-manifest{position:absolute;right:var(--sh-g);top:112px;width:min(600px,44vw);margin:0;z-index:2;font-size:clamp(19px,1.85vw,28px);line-height:1.22;font-weight:500;letter-spacing:-.015em}
.sh-hero .sh-manifest span{color:var(--sh-mute)}
.sh-hero .sh-stage{position:absolute;left:38vw;right:var(--sh-g);top:calc(112px + 8.5em);bottom:110px}
.sh-hero .sh-stage .onova-eye{position:absolute;inset:0;height:100%}
.sh-hero .sh-stage #onova-eye-scene{inset:-8% 0 auto;height:116%}
.sh-hero .sh-stage .scene-controls{top:auto;bottom:-8px;left:50%;transform:translateX(-50%);color:var(--sh-mute)}
.sh-hero .sh-stage .fallback{inset:0}
.sh-hero .sh-giant{position:absolute;left:var(--sh-g);bottom:30px;width:min(54vw,calc((100svh - 200px) * 2.6));margin:0;transform:translateY(calc(var(--sh-p,0) * -14vh));opacity:calc(1 - var(--sh-p,0) * .55)}
.sh-hero .sh-giant svg{width:100%;height:auto;display:block}
.sh-hero .sh-tag{display:block;font-size:clamp(14px,1.25vw,19px);letter-spacing:.02em;margin-top:14px;color:var(--sh-mute);font-weight:500}
.sh-hero .sh-scroll{position:absolute;right:var(--sh-g);bottom:36px;font-size:11px;letter-spacing:.2em;display:flex;gap:14px;align-items:center;color:var(--sh-mute);text-decoration:none;text-transform:uppercase}
.sh-hero .sh-scroll i{width:54px;height:1px;background:#c9c4ba;position:relative;overflow:hidden}
.sh-hero .sh-scroll i::after{content:'';position:absolute;inset:0;background:var(--sh-ink);animation:sh-run 2.2s infinite}
@keyframes sh-run{from{transform:translateX(-100%)}to{transform:translateX(100%)}}
.sh-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
/* поява після заставки (клас ставить studio/intro-letters.js; без JS усе видно одразу) */
html.sh-wait .sh-hero :is(.sh-side,.sh-manifest,.sh-stage,.sh-tag,.sh-scroll){opacity:0;transform:translateY(16px)}
html.sh-wait .sh-hero .sh-giant svg{visibility:hidden}
.sh-hero :is(.sh-side,.sh-manifest,.sh-stage,.sh-tag,.sh-scroll){transition:opacity 1s,transform 1s}
.sh-hero .sh-manifest{transition-delay:.15s}.sh-hero .sh-stage{transition-delay:.3s}.sh-hero .sh-tag,.sh-hero .sh-scroll{transition-delay:.45s}
@media(max-width:900px){
 .sh-hero{--sh-g:20px}
 .sh-hero .sh-side,.sh-hero .sh-scroll{display:none}
 .sh-hero .sh-manifest{left:var(--sh-g);right:var(--sh-g);width:auto;top:100px;font-size:20px}
 .sh-hero .sh-stage{left:0;right:0;top:290px;bottom:auto;height:42vh}
 .sh-hero .sh-giant{width:calc(100% - 2*var(--sh-g));bottom:70px}
}
@media(prefers-reduced-motion:reduce){.sh-hero .sh-giant{transform:none;opacity:1}.sh-hero .sh-scroll i::after{animation:none}}
/* старі правила .welcome-scene (light.css/welcome.css) на телефоні робили секцію flex із висотою за вмістом — перебиваємо */
section.sh-hero.welcome-scene{display:block!important;height:100svh!important;min-height:680px!important;max-height:none!important;padding:0!important;margin:0!important;overflow:hidden!important}
@media(max-width:900px){section.sh-hero.welcome-scene{min-height:640px!important}}
