/* Reference-led split hero. Original MP4 bytes preserved; only baked header y=0..127 is clipped.
   Source 1536x1920, visible 1536x1792. All panels and bottom edge remain visible. */
.hero-frame{box-sizing:border-box;width:100%;max-width:1120px;margin:24px auto 38px;border:1px solid #949494;padding:22px 26px;display:grid;grid-template-columns:minmax(0,1.04fr) minmax(0,.96fr);gap:28px;align-items:center;background:linear-gradient(#60606012 1px,transparent 1px),linear-gradient(90deg,#60606012 1px,transparent 1px),#000000bb;background-size:36px 36px}
.hero-copy{min-width:0;padding:18px 0}.hero-copy h1{font:300 clamp(42px,5.4vw,78px)/1.02 Arial,sans-serif;letter-spacing:-3px;margin:28px 0 8px}.hero-chain{color:#949494;letter-spacing:2px;font-size:12px}.hero-description{font:15px/1.7 Arial,sans-serif;color:#949494;max-width:360px;margin:28px 0}.hero-cta{display:inline-block;background:#6100ff;color:white;padding:15px 22px;font:12px monospace;min-height:44px}.hero-cta:hover{background:#782aff}
.hero-visual{position:relative;margin:0;min-width:0;width:100%;aspect-ratio:6/7;background:#000 url('/assets/fly-hero-full-v4-dfc3f695.jpg') center bottom/100% 107.142857142857% no-repeat;overflow:hidden}
.hero-visual video{position:absolute;left:0;top:-7.142857142857%;display:block;width:100%;height:107.142857142857%;max-height:none;aspect-ratio:auto;object-fit:contain;opacity:0;pointer-events:none}
.hero-visual.film-playing video{opacity:1}
.hero-visual video::-webkit-media-controls,.hero-visual video::-webkit-media-controls-start-playback-button,.hero-visual video::-webkit-media-controls-overlay-play-button{display:none!important;-webkit-appearance:none}
.hero-entry{display:flex;align-items:center;justify-content:center;gap:18px;flex-wrap:wrap;margin:12px auto 28px;font:11px/1.5 monospace;color:#949494}.hero-entry a{display:inline-block;padding:10px;color:#c8d88d}.hero-entry span{font-size:9px}
#colony{scroll-margin-top:20px}.header-right #connection,.header-right #export-run{display:none}
/* The whole split frame, not the film's intrinsic height, owns the first fold.
   Header: 84px; top gutter: 24px; bottom gutter: 16px; vertical frame inset: 46px.
   Keep a readable minimum on unusually short desktops; phones retain natural stacking. */
@media(min-width:701px){
 .hero-frame{height:calc(100svh - 124px);min-height:480px;max-width:max(1120px,calc(160svh - 160px));grid-template-rows:minmax(0,1fr)}
 .hero-visual{width:min(100%,calc((100svh - 170px)*.857142857143));max-height:100%;justify-self:center;min-height:0}
}
@media(max-width:700px){.hero-frame{min-height:calc(100svh - 96px);padding:18px;gap:20px;grid-template-columns:minmax(0,1fr);margin-top:16px}.hero-copy{padding:0}.hero-copy h1{font-size:44px;margin:12px 0 6px;letter-spacing:-2px}.hero-description{margin:14px 0;font-size:14px}.hero-copy .eyebrow{font-size:8px;letter-spacing:1px}.hero-chain{margin:8px 0}.hero-cta{padding:12px 18px}.hero-entry{gap:2px;margin-bottom:18px}.hero-entry span{display:block;text-align:center;width:100%}}