/* ============================================================
   NETONELABS — program & interior page styles
   ============================================================ */

/* hero */
.prog-hero h1 { font-size:clamp(2.8rem,7vw,5rem); }
.prog-hero .tagline { font-family:var(--f-mono); font-size:clamp(.85rem,1.4vw,1rem); color:var(--accent); letter-spacing:.06em; margin-top:16px; }
.prog-hero .lede { margin-top:22px; }
.prog-hero .meta-chips { display:flex; flex-wrap:wrap; gap:12px; margin-top:32px; }
.prog-hero .hero-ctas { display:flex; flex-wrap:wrap; gap:16px; margin-top:40px; }
.prog-hero .accent-glow { position:absolute; top:-20%; right:-10%; width:60vw; height:60vw; max-width:800px; max-height:800px; border-radius:50%; background:radial-gradient(circle, color-mix(in srgb, var(--accent) 10%, transparent), transparent 65%); pointer-events:none; }
.btn-accent { background:var(--accent); color:var(--dark); }
.btn-accent:hover { box-shadow:0 0 32px color-mix(in srgb, var(--accent) 45%, transparent); transform:translateY(-2px); }

/* mission overview */
.mission-grid { display:grid; grid-template-columns:1.1fr .9fr; gap:64px; align-items:start; }
.mission-grid p { color:var(--ink-2); margin-bottom:18px; }
.mission-side { display:grid; gap:14px; }
.spec-row { display:flex; justify-content:space-between; gap:18px; padding:18px 22px; border:1px solid var(--border); border-radius:8px; background:var(--white); align-items:center; }
.spec-row .k { font-family:var(--f-mono); font-size:.68rem; letter-spacing:.16em; text-transform:uppercase; color:var(--muted); }
.spec-row .v { font-family:var(--f-display); font-weight:600; font-size:1.02rem; text-align:right; }
@media (max-width:860px){ .mission-grid { grid-template-columns:1fr; gap:40px; } }

/* modules */
.mod-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:52px; }
.mod-card { background:var(--white); border:1px solid var(--border); border-radius:10px; padding:28px; position:relative; overflow:hidden; transition:transform .35s var(--ease), box-shadow .35s; }
.mod-card:hover { transform:translateY(-4px); box-shadow:0 18px 40px -18px rgba(15,23,42,.15); }
.mod-card .idx { font-family:var(--f-mono); font-size:.68rem; color:var(--accent-deep); background:var(--accent-tint); border-radius:4px; padding:4px 9px; letter-spacing:.12em; }
.mod-card h3 { font-size:1.08rem; margin:16px 0 8px; }
.mod-card p { font-size:.9rem; color:var(--ink-2); }
@media (max-width:900px){ .mod-grid { grid-template-columns:1fr 1fr; } }
@media (max-width:600px){ .mod-grid { grid-template-columns:1fr; } }

/* eligibility (dark) */
.elig { background:var(--dark); color:var(--dark-text); }
.elig-grid { display:grid; grid-template-columns:1fr 1fr; gap:24px; margin-top:52px; }
.elig-card { border:1px solid var(--dark-border-2); border-radius:12px; padding:34px; background:var(--dark-2); }
.elig-card.ok { border-color:color-mix(in srgb, var(--accent) 40%, transparent); }
.elig-card h3 { font-family:var(--f-mono); font-size:.74rem; font-weight:600; letter-spacing:.2em; text-transform:uppercase; margin-bottom:22px; display:flex; align-items:center; gap:10px; }
.elig-card.ok h3 { color:var(--accent); }
.elig-card.no h3 { color:var(--dark-muted); }
.elig-card ul { list-style:none; display:grid; gap:14px; }
.elig-card li { display:flex; gap:12px; align-items:baseline; font-size:.95rem; color:var(--dark-text); }
.elig-card.no li { color:var(--dark-muted); }
.elig-card.ok li::before { content:"✓"; font-family:var(--f-mono); color:var(--accent); font-weight:700; }
.elig-card.no li::before { content:"✕"; font-family:var(--f-mono); color:#FF2D2D; opacity:.7; }
.elig-note { margin-top:28px; font-size:.85rem; color:var(--dark-muted); font-family:var(--f-mono); letter-spacing:.02em; }
@media (max-width:780px){ .elig-grid { grid-template-columns:1fr; } }

/* how it runs */
.run-list { margin-top:48px; border-top:1px solid var(--border); }
.run-row { display:grid; grid-template-columns:64px 240px 1fr; gap:24px; padding:26px 4px; border-bottom:1px solid var(--border); align-items:baseline; }
.run-row .n { font-family:var(--f-mono); font-size:.72rem; color:var(--accent-deep); letter-spacing:.1em; }
.run-row h3 { font-size:1.06rem; }
.run-row p { color:var(--ink-2); font-size:.94rem; }
@media (max-width:760px){ .run-row { grid-template-columns:1fr; gap:6px; } }

/* progression strip */
.next-strip { background:var(--bg-light); border:1px solid var(--border); border-radius:12px; padding:30px 34px; display:flex; flex-wrap:wrap; gap:18px; justify-content:space-between; align-items:center; margin-top:64px; }
.next-strip .t { font-family:var(--f-mono); font-size:.7rem; letter-spacing:.18em; text-transform:uppercase; color:var(--muted); margin-bottom:6px; }
.next-strip h3 { font-size:1.3rem; }

/* generic content page helpers */
.two-col { display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:start; }
@media (max-width:860px){ .two-col { grid-template-columns:1fr; gap:36px; } }
.info-card { border:1px solid var(--border); border-radius:12px; padding:34px; background:var(--white); }
.info-card h3 { font-size:1.15rem; margin-bottom:10px; }
.info-card p { color:var(--ink-2); font-size:.95rem; }

/* ============================================================
   Program signature hero FX (spark / forge / elite / vet)
   ============================================================ */
.fx-hero { min-height:clamp(560px,86vh,900px); display:flex; align-items:center; }
.fx-hero .wrap { width:100%; }
.prog-fx { position:absolute; inset:0; width:100%; height:100%; z-index:1; pointer-events:none; }
.fx-hero .hero-grid-bg { z-index:0; }
.fx-hero .accent-glow { z-index:0; }

/* FORGE — headline struck into shape */
h1.forge { position:relative; display:inline-block; color:var(--dark-text); will-change:filter,transform;
  transition:filter .28s ease, text-shadow .32s ease, color .32s ease; }
h1.forge.lvl0 { filter:grayscale(1) brightness(.4) blur(3px); color:#5a6472; }
h1.forge.lvl1 { filter:grayscale(.65) brightness(.62) blur(1.8px); color:#8a94a2; }
h1.forge.lvl2 { filter:grayscale(.35) brightness(.85) blur(.9px); color:#cfe8a0; text-shadow:0 0 20px rgba(159,239,0,.38); }
h1.forge.lvl3 { filter:grayscale(.12) brightness(1) blur(.3px); color:#eafcc8; text-shadow:0 0 26px rgba(159,239,0,.55); }
h1.forge.done { filter:none; color:var(--dark-text); text-shadow:0 0 22px rgba(159,239,0,.4); animation:forgeSheen 2.6s ease-in-out .1s; }
@keyframes forgeSheen { 0%{text-shadow:0 0 30px rgba(159,239,0,.6);} 100%{text-shadow:0 0 22px rgba(159,239,0,.32);} }
h1.forge.shk { animation:forgeShake .2s ease; }
@keyframes forgeShake { 0%{transform:translate(0,0)} 20%{transform:translate(-4px,1px)} 45%{transform:translate(3px,-2px)} 70%{transform:translate(-2px,1px)} 100%{transform:none} }

/* VET — mission briefing panel */
.vet-brief { position:absolute; z-index:3; right:max(4vw,22px); top:50%; transform:translateY(-50%);
  width:min(340px,40vw); background:rgba(11,9,7,.86); border:1px solid rgba(255,107,0,.28); border-radius:10px;
  overflow:hidden; box-shadow:0 24px 60px -22px rgba(0,0,0,.7), 0 0 40px -14px rgba(255,107,0,.3); backdrop-filter:blur(6px); }
.vet-brief .vb-bar { display:flex; align-items:center; gap:7px; padding:9px 14px; border-bottom:1px solid rgba(255,255,255,.06);
  font-family:var(--f-mono); font-size:.6rem; letter-spacing:.16em; text-transform:uppercase; color:#ff9a52; }
.vet-brief .vb-bar .d { width:8px; height:8px; border-radius:50%; background:#3a2a1a; }
.vet-brief .vb-bar .d:first-child { background:#FF6B00; }
.vb-row { display:flex; justify-content:space-between; gap:14px; padding:9px 15px; font-family:var(--f-mono); font-size:.72rem;
  opacity:0; transform:translateX(8px); transition:opacity .3s, transform .3s; border-bottom:1px solid rgba(255,255,255,.03); }
.vb-row.show { opacity:1; transform:none; }
.vb-row .vk { color:#8a6b52; letter-spacing:.1em; text-transform:uppercase; font-size:.62rem; }
.vb-row .vv { color:#ffd9b8; text-align:right; }
.vb-row.hd .vv { color:#FF6B00; font-weight:600; }
.vb-row.ok .vv { color:#9FEF00; font-weight:600; }
.vet-brief.cleared { border-color:rgba(159,239,0,.4); box-shadow:0 24px 60px -22px rgba(0,0,0,.7), 0 0 40px -14px rgba(159,239,0,.3); transition:border-color .5s, box-shadow .5s; }
@media (max-width:760px){ .vet-brief { position:relative; right:auto; top:auto; transform:none; width:100%; max-width:360px; margin-top:30px; } .fx-hero .wrap { z-index:4; } }
@media (prefers-reduced-motion:reduce){ .vb-row { opacity:1; transform:none; } h1.forge { filter:none!important; color:var(--dark-text)!important; } }

/* FORGE — Red vs Blue lab panels */
.rb-wrap { position:absolute; z-index:3; right:max(4vw,22px); top:50%; transform:translateY(-50%);
  width:min(380px,42vw); display:flex; flex-direction:column; gap:0; }
.rb-panel { background:rgba(9,12,16,.9); border:1px solid var(--dark-border-2); border-radius:9px; overflow:hidden;
  backdrop-filter:blur(6px); box-shadow:0 20px 50px -22px rgba(0,0,0,.7); }
.rb-panel.atk { border-color:rgba(255,45,45,.3); box-shadow:0 20px 50px -22px rgba(0,0,0,.7), 0 0 30px -14px rgba(255,45,45,.4); }
.rb-panel.def { border-color:rgba(159,239,0,.3); box-shadow:0 20px 50px -22px rgba(0,0,0,.7), 0 0 30px -14px rgba(159,239,0,.35); }
.rb-bar { display:flex; align-items:center; gap:8px; padding:8px 13px; border-bottom:1px solid rgba(255,255,255,.06);
  font-family:var(--f-mono); font-size:.58rem; letter-spacing:.14em; text-transform:uppercase; }
.rb-panel.atk .rb-bar { color:#ff6a6a; } .rb-panel.def .rb-bar { color:#b6f34a; }
.rb-bar .d { width:8px; height:8px; border-radius:50%; }
.rb-panel.atk .rb-bar .d { background:#ff2d2d; box-shadow:0 0 8px #ff2d2d; }
.rb-panel.def .rb-bar .d { background:#9FEF00; box-shadow:0 0 8px #9FEF00; }
.rb-body { padding:11px 14px; height:118px; overflow:hidden; font-family:var(--f-mono); font-size:.7rem; line-height:1.68; display:flex; flex-direction:column; justify-content:flex-end; }
.rb-line { white-space:pre-wrap; word-break:break-word; animation:rbIn .3s var(--ease); }
@keyframes rbIn { from{opacity:0; transform:translateY(4px);} to{opacity:1; transform:none;} }
.rb-line.atk { color:#f0d0d0; } .rb-line.def { color:#cfe8a0; } .rb-line.ok { color:#9FEF00; font-weight:600; }
.rb-seam { position:relative; height:26px; display:grid; place-items:center; }
.rb-seam::before { content:""; position:absolute; left:20px; right:20px; top:50%; height:1px;
  background:linear-gradient(90deg, rgba(255,45,45,.5), rgba(159,239,0,.5)); }
.rb-seam span { position:relative; font-family:var(--f-mono); font-size:.58rem; letter-spacing:.18em; text-transform:uppercase;
  color:var(--dark-muted); background:var(--dark); padding:2px 10px; border:1px solid var(--dark-border-2); border-radius:100px; }
@media (max-width:760px){ .rb-wrap { position:relative; right:auto; top:auto; transform:none; width:100%; max-width:380px; margin-top:30px; }
  .fx-hero .wrap { z-index:4; } .rb-body { height:104px; } }
@media (prefers-reduced-motion:reduce){ .rb-line { animation:none; } }

/* ELITE — SOC command center */
.soc-wrap { position:absolute; z-index:3; right:max(3vw,20px); top:50%; transform:translateY(-50%);
  width:min(470px,46vw); display:flex; flex-direction:column; gap:10px; font-family:var(--f-mono); }
.soc-head { display:flex; align-items:center; gap:9px; font-size:.6rem; letter-spacing:.14em; text-transform:uppercase; color:var(--dark-muted); }
.soc-head .led { width:8px; height:8px; border-radius:50%; background:var(--violet); box-shadow:0 0 10px var(--violet); animation:blink 1.6s infinite; }
.soc-status { margin-left:auto; padding:4px 11px; border-radius:100px; font-size:.56rem; letter-spacing:.1em; border:1px solid var(--dark-border-2); color:var(--dark-muted); transition:color .3s,border-color .3s; }
.soc-status.bad { color:#ff5c5c; border-color:rgba(255,45,45,.5); }
.soc-status.warn { color:#ffb84d; border-color:rgba(255,140,0,.45); }
.soc-status.ok { color:#9FEF00; border-color:rgba(159,239,0,.5); }
.soc-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.soc-panel { background:rgba(9,11,18,.9); border:1px solid var(--dark-border-2); border-radius:8px; overflow:hidden; backdrop-filter:blur(6px); box-shadow:0 20px 50px -24px rgba(0,0,0,.7); }
.soc-cap { font-size:.54rem; letter-spacing:.14em; text-transform:uppercase; color:var(--violet); padding:9px 12px 7px; }
.soc-mapcv { width:100%; height:110px; display:block; }
.soc-stages { padding:0 12px 11px; display:grid; gap:5px; }
.soc-stage { display:flex; align-items:center; gap:8px; font-size:.62rem; color:var(--dark-muted); opacity:.38; transition:opacity .35s, color .35s; }
.soc-stage .si { color:var(--dark-muted); font-weight:600; transition:color .35s; }
.soc-stage.hit { opacity:1; color:#ff8a8a; }
.soc-stage.hit .si { color:#ff5c5c; }
.soc-stage.cut { color:#9FEF00; }
.soc-stage.cut .si { color:#7BC400; }
.soc-feedbody { padding:0 12px 11px; height:106px; overflow:hidden; display:flex; flex-direction:column; justify-content:flex-end; gap:3px; }
.soc-fl { font-size:.62rem; color:var(--dark-muted); animation:rbIn .3s var(--ease); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.soc-fl .ft { color:var(--violet); margin-right:8px; }
.soc-fl.warn { color:#ffcf99; } .soc-fl.warn .ft { color:#ffb84d; }
.soc-fl.ok { color:#cfe8a0; } .soc-fl.ok .ft { color:#9FEF00; }
@media (max-width:760px){ .soc-wrap { position:relative; right:auto; top:auto; transform:none; width:100%; max-width:440px; margin-top:30px; } }

/* keep hero text clear of the right-side FX panels on desktop */
@media (min-width:761px){
  .fx-hero .wrap > .crumb,
  .fx-hero .wrap > .tagline,
  .fx-hero .wrap > .lede,
  .fx-hero .wrap > .meta-chips,
  .fx-hero .wrap > .hero-ctas { max-width:min(560px,48%); }
}
