/* Preserve the original wider mobile framing before first paint. */
/* A physical CRT collage with live code fitted to the photographed screen. */
.homepage .hero.retro-hero{isolation:isolate;--retro-zoom:1}
.homepage .hero.retro-hero:after{display:none}
.retro-artwork{position:absolute;inset:0;z-index:1;overflow:hidden;pointer-events:none}
.homepage .retro-artwork .hero-art{inset:0;width:100%;height:100%;max-width:none;object-fit:cover;object-position:center;transform:scale(var(--retro-zoom,1))!important;transform-origin:50% 50%;translate:none!important;animation:none;mask-image:none}
.retro-artwork:after{content:'';position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,#101820 0%,#101820f5 20%,#101820a0 42%,#10182008 73%),linear-gradient(0deg,#101820e6,transparent 27%)}
.retro-screen-plane{position:absolute;inset:0;z-index:2;overflow:hidden}
.retro-screen{position:absolute;overflow:hidden;border-radius:7%;padding:6% 7%;color:#21d4ec;background:transparent;box-sizing:border-box;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-weight:500;line-height:1.55;letter-spacing:0;text-shadow:0 0 7px #05bfdf55;opacity:.95}
.retro-screen:after{content:'';position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,transparent 0 3px,#05bfdf08 3px 4px);box-shadow:inset 0 0 20px #00152966}
.retro-code-top{font-size:.7em;color:#8fb5bd;letter-spacing:.16em;border-bottom:1px solid #21d4ec22;padding-bottom:.65em;margin-bottom:1.1em;white-space:nowrap}
.retro-code-top span{color:#ffda00;margin-right:.6em}
.retro-code-line{display:block;min-height:1.55em;white-space:pre;color:#21d4ec}
.retro-code-line:nth-child(3n){color:#ffda00}
.retro-code-line:nth-child(4n){color:#bdd3d4}
.retro-code-line.is-typing:after{content:'▋';display:inline;color:#ffda00;animation:retro-cursor .8s steps(1) infinite}
@keyframes retro-cursor{50%{opacity:0}}
@media(max-width:800px){
 .homepage .hero.retro-hero{display:flex;flex-direction:column;height:100svh;min-height:680px;max-height:none;padding:104px var(--pad) 30px;gap:0}
 .homepage .hero.retro-hero .retro-artwork{position:absolute;inset:0;width:100%;height:100%;margin:0;aspect-ratio:auto;background:#01cbfe;--retro-zoom:.82}
 .homepage .hero.retro-hero .hero-art{inset:auto;width:auto;height:82%;left:73%;top:50%;right:auto;bottom:auto;object-fit:fill;object-position:73% center;transform:translate(-73%,-50%)!important;mask-image:linear-gradient(0deg,transparent,#000 5%,#000 95%,transparent)}
 .homepage .hero.retro-hero .retro-artwork:after{background:linear-gradient(90deg,#101820a3,#10182012),linear-gradient(0deg,#101820 0%,#101820e6 25%,transparent 64%,#10182075 100%)}
 .homepage .hero.retro-hero .hero-top{margin:0;flex:none}
 .homepage .hero.retro-hero h1{margin:24px 0 0;flex:none}
 .homepage .hero.retro-hero .hero-bottom{padding:0;margin-top:auto;display:block;flex:none}
 .homepage .hero.retro-hero .hero-note{position:absolute;inset:auto var(--pad) 200px auto;width:90px;height:74px;margin:0;font-size:7px;transform:rotate(-4deg)}
 .homepage .hero.retro-hero .hero-note strong{font-size:29px}
 .homepage .hero.retro-hero .hero-bottom p{margin-bottom:18px}
 .retro-screen{opacity:.35}
}
@media(prefers-reduced-motion:reduce){.retro-code-line.is-typing:after{animation:none}}