/* Hero: live system board behind the copy */
.hero{position:relative;isolation:isolate}
.board{position:absolute;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none;display:block}
.board.bleed{left:50%;right:auto;width:100vw;transform:translateX(-50%)}

/* "AI system that" is the fixed line; set it larger than the rotating line */
.hero h1 .fixed{font-size:1.3em;line-height:1;letter-spacing:-.06em}
@media(max-width:560px){.hero h1 .fixed{font-size:1.15em}}

/* 01: heading alone, larger */
#problem .section-top{grid-template-columns:1fr}
#problem h2{font-size:clamp(36px,6.2vw,88px);line-height:1.04;letter-spacing:-.05em;max-width:14em;text-wrap:balance}

/* footer: system board behind the mark, then a link bar */
footer{padding:0}
.footer-top{position:relative;isolation:isolate;padding-block:clamp(56px,8vw,96px)}
footer .footer-center{position:relative;padding-block:0}
.footer-bar{border-top:1px solid rgba(24,16,43,.22)}
.footer-bar-inner{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 28px;padding-block:18px;font-family:var(--font-mono);font-size:12px;letter-spacing:.04em}
.footer-nav{display:flex;flex-wrap:wrap;gap:6px 24px}
footer .footer-nav a,footer .footer-top-link,footer .footer-copy{color:var(--on-accent);text-decoration:none;border:0}
footer .footer-nav a:hover,footer .footer-top-link:hover{text-decoration:underline;text-underline-offset:3px}
footer .footer-copy{opacity:.75}
@media(max-width:700px){.footer-bar-inner{flex-direction:column;align-items:center;text-align:center}.footer-nav{justify-content:center}}