:root{
  --dark:#0b1622;
  --text:#f8fafc;
  --muted:#cbd5e1;
  --accent:#ff6b1a;
  --glass:rgba(255,255,255,.08);
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;font-family:Arial, Helvetica, sans-serif;background:#08111b;color:var(--text);overflow-x:hidden}
.screen{position:relative;min-height:100vh;overflow:hidden;padding:clamp(32px,5vw,88px);isolation:isolate}
.bg{position:absolute;inset:-3%;z-index:-5;background:url('assets/robot-bg.png') center/cover no-repeat;transform:scale(1.04);animation:camera 18s ease-in-out infinite}
.shade{position:absolute;inset:0;z-index:-4;background:linear-gradient(90deg,rgba(5,12,20,.92) 0%,rgba(8,17,27,.78) 38%,rgba(8,17,27,.25) 70%,rgba(8,17,27,.55) 100%)}
.grid{position:absolute;inset:0;z-index:-3;background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:72px 72px;mask-image:radial-gradient(circle at 70% 40%,#000 0,transparent 58%);animation:gridMove 12s linear infinite}
.scan{position:absolute;inset:0;z-index:-2;background:linear-gradient(180deg,transparent,rgba(255,107,26,.08),transparent);height:40%;animation:scan 7s ease-in-out infinite;opacity:.55}
.content{position:relative;z-index:2;max-width:760px;padding-top:clamp(30px,8vh,90px)}
.custom-font{font-family:Arial Black, Impact, Arial, sans-serif;text-transform:uppercase;letter-spacing:.12em;font-weight:900;font-stretch:condensed;text-shadow:0 0 22px rgba(255,255,255,.12)}
.eyebrow{font-size:clamp(16px,1.5vw,26px);color:var(--muted);margin:0 0 22px}
.title{font-size:clamp(56px,8.8vw,150px);line-height:.88;margin:0;color:#fff;filter:drop-shadow(0 8px 22px rgba(0,0,0,.35))}
.title::first-letter{color:var(--accent)}
.line{width:min(520px,70vw);height:3px;background:rgba(255,255,255,.16);margin:34px 0 34px;position:relative;overflow:hidden}.line span{position:absolute;inset:0;width:34%;background:var(--accent);animation:lineRun 2.8s ease-in-out infinite}
.lead,.sublead{font-size:clamp(18px,1.6vw,27px);line-height:1.55;color:#eef2f7;margin:0 0 8px;max-width:660px}.sublead{color:var(--muted)}
.cards{position:absolute;left:clamp(24px,5vw,88px);right:clamp(24px,5vw,88px);bottom:clamp(24px,4vw,64px);display:grid;grid-template-columns:repeat(3,1fr);gap:18px;z-index:3}.card{border:1px solid rgba(255,255,255,.18);background:linear-gradient(180deg,rgba(255,255,255,.13),rgba(255,255,255,.05));backdrop-filter:blur(12px);border-radius:24px;padding:24px;box-shadow:0 18px 50px rgba(0,0,0,.22);transform:translateY(18px);opacity:0;animation:rise .8s ease forwards}.card:nth-child(2){animation-delay:.15s}.card:nth-child(3){animation-delay:.3s}.icon{color:var(--accent);font-size:42px;margin-bottom:14px}.card h2{font-size:clamp(16px,1.2vw,22px);margin:0 0 12px}.card p{margin:0;color:#d7dee8;line-height:1.55;font-size:15px}
.hud{position:absolute;border:1px solid rgba(255,255,255,.22);z-index:1;opacity:.5}.hud::after{content:"";position:absolute;width:8px;height:8px;border-radius:50%;background:var(--accent);box-shadow:0 0 20px var(--accent)}.hud-a{right:7%;top:10%;width:280px;height:120px;border-left:0;border-bottom:0}.hud-a::after{right:-4px;top:-4px}.hud-b{left:6%;bottom:12%;width:320px;height:130px;border-right:0;border-top:0}.hud-b::after{left:-4px;bottom:-4px}.spark{position:absolute;width:5px;height:5px;border-radius:50%;background:var(--accent);box-shadow:0 0 24px 8px rgba(255,107,26,.35);animation:spark 3s ease-in-out infinite}.s1{right:32%;top:39%}.s2{right:18%;bottom:31%;animation-delay:.8s}.s3{left:35%;top:58%;animation-delay:1.5s}
@keyframes camera{0%,100%{transform:scale(1.04) translate3d(0,0,0)}50%{transform:scale(1.085) translate3d(-18px,-8px,0)}}
@keyframes gridMove{to{background-position:72px 72px}}
@keyframes scan{0%,100%{transform:translateY(-45%)}50%{transform:translateY(190%)}}
@keyframes lineRun{0%,100%{transform:translateX(-110%)}50%{transform:translateX(240%)}}
@keyframes rise{to{opacity:1;transform:translateY(0)}}
@keyframes spark{0%,100%{opacity:.15;transform:scale(.6)}50%{opacity:1;transform:scale(1.4)}}
@media (max-width:900px){.screen{padding-bottom:30px}.content{padding-top:20px}.cards{position:relative;left:auto;right:auto;bottom:auto;margin-top:70px;grid-template-columns:1fr}.shade{background:rgba(5,12,20,.78)}.bg{background-position:65% center}.lead,.sublead{font-size:18px}.hud{display:none}}
