/* Shared Hero-only composition. The logo and Leo remain visible without JS. */
#kj60-page .kj60-hero-visual.kj60-hero-composition { min-height:0; aspect-ratio:1 / 1.09; width:100%; max-width:600px; }
#kj60-page .kj60-hero-composition .kj60-orbit-stage { width:94%; top:0; right:3%; overflow:visible; background:radial-gradient(ellipse at 35% 24%,#234977 0,#142e54 46%,#091d39 100%); }
#kj60-page .kj60-orbit-system { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; }
#kj60-page .kj60-orbit-art { display:block; position:absolute; inset:0; width:100%; height:100%; overflow:visible; pointer-events:none; z-index:1; }
#kj60-page .kj60-orbit-art path { fill:none; stroke:currentColor; stroke-opacity:.32; stroke-width:2; }
#kj60-page .kj60-hero-mark { position:absolute; top:18.6%; left:19.6%; width:68.8%; height:auto; z-index:2; pointer-events:none; }
#kj60-page .kj60-hero-leo { position:absolute; width:70%; left:-29%; top:7%; z-index:4; pointer-events:none; }
#kj60-page .kj60-hero-composition .kj60-motion-toggle { top:4%; right:3%; z-index:5; min-height:36px; padding:5px 10px; background:#faf8f2f5; }
#kj60-page .kj60-hero h1 { font-size:clamp(38px,5vw,68px); }
#kj60-page .kj60-hero-description { font-size:clamp(16px,1.5vw,17px); }
#kj60-page .kj60-hero-composition .kj60-motion-toggle { font-size:14px; }
@media (min-width:801px) and (max-width:1280px) {
 #kj60-page .kj60-hero-composition .kj60-hero-leo { width:56%; left:-4%; top:0; }
}
@media (max-width:800px) {
 #kj60-page .kj60-header { height:auto; padding-block:12px; }
 #kj60-page .kj60-hero { gap:0; padding-top:30px; padding-bottom:35px; }
 #kj60-page .kj60-hero-copy { display:contents; }
 #kj60-page .kj60-hero-values { grid-row:1; }
 #kj60-page .kj60-hero h1 { grid-row:2; }
 #kj60-page .kj60-hero-visual.kj60-hero-composition { grid-row:3; max-width:440px; margin:24px auto 10px; }
 #kj60-page .kj60-hero-description { grid-row:4; }
 #kj60-page .kj60-hero-actions { grid-row:5; }
 #kj60-page .kj60-hero-composition .kj60-orbit-stage { top:7%; }
 #kj60-page .kj60-hero-composition .kj60-hero-leo { left:-2%; top:-5%; width:56%; }
}
@media (max-width:540px) {
 #kj60-page .kj60-hero { padding-top:24px; padding-bottom:28px; }
 #kj60-page .kj60-hero h1 { margin:14px 0; line-height:1.4; }
 #kj60-page .kj60-hero-description { letter-spacing:0; }
 #kj60-page .kj60-hero-actions { margin:20px 0; }
 #kj60-page .kj60-hero-composition .kj60-hero-leo { width:52%; left:-6%; top:3%; }
 #kj60-page .kj60-hero-composition .kj60-motion-toggle { top:1%; right:0; }
 #kj60-page .kj60-hero-values { gap:10px 18px; }
}