/* ============================================================
   OCTASEC — shared design system
   Black + red · offensive-security · serif hook + IBM Plex
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Newsreader:ital,opsz,wght@0,6..72,400..800;1,6..72,400..800&family=IBM+Plex+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;1,400&family=IBM+Plex+Mono:wght@400;500;600&display=swap');

:root{
  --bg:#08090A; --bg2:#0d0f13; --panel:#101319; --panel2:#14181f;
  --line:rgba(255,255,255,.09); --line2:rgba(255,255,255,.17); --line3:rgba(255,255,255,.28);
  --red:#E34732; --red-hot:#FF5340; --red-deep:#B5281A; --red-dim:rgba(227,71,50,.13);
  --ink:#F4F2EE; --ink-dim:#C6C7CB; --mut:#85878F; --mut2:#5C5E66;
  --ok:#54d18c; --warn:#ffb02e;
  --serif:'Newsreader',Georgia,'Times New Roman',serif;
  --sans:'IBM Plex Sans',system-ui,-apple-system,sans-serif;
  --mono:'IBM Plex Mono','SF Mono',Menlo,monospace;
  --maxw:1280px; --pad:clamp(20px,5vw,64px);
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0; background:var(--bg); color:var(--ink); font-family:var(--sans);
  font-size:16px; line-height:1.6; font-weight:400; -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
a{color:inherit; text-decoration:none;}
img{max-width:100%; display:block;}
::selection{background:var(--red); color:#fff;}
body.noscroll{overflow:hidden;}

/* faint global texture */
body::before{
  content:""; position:fixed; inset:0; z-index:0; pointer-events:none; opacity:.45;
  background-image:radial-gradient(rgba(255,255,255,.035) 1px, transparent 1px);
  background-size:3px 3px;
}

/* ---------- layout helpers ---------- */
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 var(--pad);}
.section{position:relative; z-index:1; padding:clamp(72px,11vw,148px) 0;}
.section--tight{padding:clamp(54px,7vw,88px) 0;}
.divider{height:1px; background:var(--line); border:0; margin:0;}

/* ---------- type ---------- */
.serif{font-family:var(--serif);}
.mono{font-family:var(--mono);}
.kicker{
  font-family:var(--mono); font-size:12px; letter-spacing:.24em; text-transform:uppercase;
  color:var(--red); display:inline-flex; align-items:center; gap:10px; font-weight:500;
}
.kicker::before{content:""; width:22px; height:1px; background:var(--red); display:inline-block;}
.kicker--plain::before{display:none;}
h1,h2,h3,h4{font-family:var(--serif); font-weight:700; line-height:1; margin:0; letter-spacing:-.02em;}
.h-display{font-size:clamp(46px,7vw,84px); line-height:.96; letter-spacing:-.025em;}
.h-section{font-size:clamp(34px,4.6vw,58px); line-height:1; letter-spacing:-.025em;}
.h-display em,.h-section em,.h-display .rd,.h-section .rd{font-style:italic; color:var(--red);}
em.rd{font-style:italic; color:var(--red);}
.lead{font-size:clamp(17px,1.4vw,19px); line-height:1.62; color:var(--ink-dim); font-weight:300;}
.muted{color:var(--mut);}

/* section header pattern: mono index + serif title */
.shead{display:flex; flex-direction:column; gap:20px; margin-bottom:clamp(40px,5vw,68px);}
.shead .idx{font-family:var(--mono); font-size:12.5px; letter-spacing:.2em; color:var(--mut); text-transform:uppercase;}
.shead .lead{max-width:620px;}

/* ---------- buttons ---------- */
.btn{font-family:var(--sans); font-size:14.5px; font-weight:500; cursor:pointer; border:none;
  display:inline-flex; align-items:center; gap:10px; transition:.22s ease; border-radius:3px; line-height:1;
  padding:15px 24px; letter-spacing:.005em;}
.btn .arr{transition:transform .22s ease;}
.btn:hover .arr{transform:translateX(4px);}
.btn-red{background:var(--red); color:#fff;}
.btn-red:hover{background:var(--red-hot); box-shadow:0 10px 34px -10px rgba(227,71,50,.7);}
.btn-ghost{background:transparent; color:var(--ink); border:1px solid var(--line2);}
.btn-ghost:hover{border-color:var(--ink); background:rgba(255,255,255,.04);}
.btn-lg{padding:18px 30px; font-size:15.5px;}
.link-arrow{font-family:var(--mono); font-size:13px; letter-spacing:.04em; color:var(--ink); display:inline-flex; align-items:center; gap:8px; transition:.2s;}
.link-arrow .arr{transition:transform .2s;}
.link-arrow:hover{color:var(--red);}
.link-arrow:hover .arr{transform:translateX(4px);}

/* ---------- chips ---------- */
.chip{font-family:var(--mono); font-size:11.5px; letter-spacing:.08em; color:var(--mut);
  border:1px solid var(--line); border-radius:2px; padding:7px 11px; transition:.2s; white-space:nowrap;}
.chip:hover{border-color:var(--red); color:var(--ink);}
.chiprow{display:flex; gap:9px; flex-wrap:wrap;}

/* ============================================================
   NAV
   ============================================================ */
.nav{position:fixed; top:0; left:0; right:0; z-index:80; transition:background .3s, border-color .3s, backdrop-filter .3s;
  border-bottom:1px solid transparent;}
.nav.scrolled{background:rgba(8,9,10,.82); backdrop-filter:blur(14px) saturate(140%); border-bottom-color:var(--line);}
.nav-in{max-width:1440px; margin:0 auto; padding:18px var(--pad); display:flex; align-items:center; justify-content:space-between; gap:24px;}
.nav .brand img{height:25px; width:auto;}
.nav-links{display:flex; gap:34px; list-style:none; margin:0; padding:0;}
.nav-links a{font-size:14.5px; color:var(--ink-dim); position:relative; padding:4px 0; transition:color .2s; white-space:nowrap;}
.nav-links a::after{content:""; position:absolute; left:0; bottom:-2px; width:0; height:1.5px; background:var(--red); transition:width .25s;}
.nav-links a:hover, .nav-links a.active{color:#fff;}
.nav-links a.active::after, .nav-links a:hover::after{width:100%;}
.nav-right{display:flex; align-items:center; gap:20px;}
.nav-status{font-family:var(--mono); font-size:11.5px; color:var(--mut); display:inline-flex; align-items:center; gap:8px; letter-spacing:.05em;}
.nav-status .pulse{width:7px; height:7px; border-radius:50%; background:var(--ok); box-shadow:0 0 0 0 rgba(84,209,140,.6); animation:pulse-dot 2.4s infinite;}
@keyframes pulse-dot{0%{box-shadow:0 0 0 0 rgba(84,209,140,.5);}70%{box-shadow:0 0 0 7px rgba(84,209,140,0);}100%{box-shadow:0 0 0 0 rgba(84,209,140,0);}}
.nav-burger{display:none; background:none; border:none; cursor:pointer; width:30px; height:22px; position:relative;}
.nav-burger span{position:absolute; left:0; width:100%; height:2px; background:var(--ink); transition:.3s;}
.nav-burger span:nth-child(1){top:0;} .nav-burger span:nth-child(2){top:10px;} .nav-burger span:nth-child(3){top:20px;}
body.menu-open .nav-burger span:nth-child(1){top:10px; transform:rotate(45deg);}
body.menu-open .nav-burger span:nth-child(2){opacity:0;}
body.menu-open .nav-burger span:nth-child(3){top:10px; transform:rotate(-45deg);}
/* mobile drawer */
.nav-drawer{position:fixed; inset:0; z-index:79; background:var(--bg); padding:96px var(--pad) 40px;
  display:flex; flex-direction:column; gap:6px; transform:translateY(-100%); opacity:0; pointer-events:none; transition:.4s cubic-bezier(.4,0,.2,1);}
body.menu-open .nav-drawer{transform:translateY(0); opacity:1; pointer-events:auto;}
.nav-drawer a{font-family:var(--serif); font-size:34px; font-weight:700; padding:14px 0; border-bottom:1px solid var(--line); color:var(--ink);}
.nav-drawer a:hover{color:var(--red);}
.nav-drawer .btn{margin-top:24px; justify-content:center;}

/* ============================================================
   HERO (Direction A — Breach Console)
   ============================================================ */
.hero{position:relative; padding-top:150px; min-height:100vh; display:flex; flex-direction:column; justify-content:center; overflow:hidden;}
.hero::before,.phero::before{content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  background-image:url(assets/threat-map.png); background-repeat:no-repeat; background-position:right -20px center; background-size:auto 120%;
  opacity:.8; mask-image:linear-gradient(to left,#000 22%,transparent 78%); -webkit-mask-image:linear-gradient(to left,#000 22%,transparent 78%);}
@media (max-width:880px){.hero::before,.phero::before{background-size:auto 80%; background-position:right -40px top 40px; opacity:.5;}}
.hero-glow{position:absolute; width:680px; height:680px; right:-160px; top:90px; z-index:0;
  background:radial-gradient(circle, rgba(227,71,50,.20), transparent 64%); filter:blur(30px); pointer-events:none;}
.hero-grid-bg{position:absolute; inset:0; z-index:0; pointer-events:none;
  background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);
  background-size:64px 64px; mask-image:radial-gradient(circle at 75% 35%, #000 0%, transparent 72%); opacity:.6;}
.hero-in{position:relative; z-index:2; display:grid; grid-template-columns:1.04fr .96fr; gap:clamp(30px,5vw,70px); align-items:center; width:100%;}
.hero-h1{font-size:clamp(48px,6.4vw,86px); line-height:.95; letter-spacing:-.028em; margin:24px 0 0;}
.hero-sub{margin:28px 0 0; max-width:470px;}
.hero-cta{display:flex; gap:14px; margin:36px 0 32px; flex-wrap:wrap;}
.hero-certs{max-width:480px;}
.hero-certs .lbl{font-family:var(--mono); font-size:11px; letter-spacing:.16em; color:var(--mut2); text-transform:uppercase; margin-bottom:12px;}

/* terminal */
.term{width:100%; border:1px solid var(--line2); border-radius:9px; overflow:hidden;
  background:linear-gradient(180deg,#0c0e12,#090a0d); box-shadow:0 50px 110px -50px rgba(0,0,0,.95);}
.term-bar{display:flex; align-items:center; gap:8px; padding:13px 16px; border-bottom:1px solid var(--line); background:rgba(255,255,255,.02);}
.term-bar .d{width:11px; height:11px; border-radius:50%;}
.term-title{margin-left:12px; font-family:var(--mono); font-size:12px; color:var(--mut);}
.term-body{padding:22px 22px 26px; font-family:var(--mono); font-size:13.5px; line-height:1.85; min-height:330px;}
.term-body .p{color:var(--red);} .term-body .ok{color:var(--ok);} .term-body .warn{color:var(--warn);}
.term-body .dim{color:var(--mut);} .term-body .w{color:var(--ink);}
.cursor{display:inline-block; color:#fff; animation:blink 1s steps(1) infinite;}
@keyframes blink{50%{opacity:0;}}

/* hero status strip */
.hero-status{position:relative; z-index:2; margin-top:clamp(30px,5vw,56px); border-top:1px solid var(--line); border-bottom:1px solid var(--line);
  display:flex; flex-wrap:wrap; gap:0; }
.hero-status .cell{flex:1 1 200px; padding:20px 26px; border-right:1px solid var(--line); font-family:var(--mono); font-size:12px; color:var(--mut); letter-spacing:.04em;}
.hero-status .cell:last-child{border-right:0;}
.hero-status .cell b{display:block; font-family:var(--sans); font-size:26px; font-weight:600; color:var(--ink); letter-spacing:0; margin-top:7px;}
.hero-status .cell b .rd{color:var(--red);}

/* ============================================================
   MARQUEE (certs / clients)
   ============================================================ */
.marquee{overflow:hidden; border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:22px 0; position:relative; z-index:1; background:var(--bg2);}
.marquee-track{display:flex; gap:54px; width:max-content; animation:marq 38s linear infinite;}
.marquee:hover .marquee-track{animation-play-state:paused;}
.marquee-item{font-family:var(--mono); font-size:14px; letter-spacing:.12em; color:var(--mut); text-transform:uppercase; white-space:nowrap; display:flex; align-items:center; gap:54px;}
.marquee-item::after{content:"//"; color:var(--red); opacity:.55;}
@keyframes marq{to{transform:translateX(-50%);}}

/* ============================================================
   SERVICE CARDS
   ============================================================ */
.svc-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); border:1px solid var(--line);}
.svc-card{background:var(--bg); padding:38px 34px 34px; position:relative; transition:background .3s; min-height:280px; display:flex; flex-direction:column; overflow:hidden;}
.svc-card::after{content:""; position:absolute; left:0; bottom:0; height:2px; width:0; background:var(--red); transition:width .4s ease;}
.svc-card:hover{background:var(--panel);}
.svc-card:hover::after{width:100%;}
.svc-num{font-family:var(--mono); font-size:12px; color:var(--mut2); letter-spacing:.1em;}
.svc-card h3{font-size:25px; line-height:1.08; margin:20px 0 0; letter-spacing:-.01em; transition:color .3s; max-width:90%;}
.svc-card:hover h3{color:var(--red);}
.svc-card p{font-size:14.5px; color:var(--mut); margin:14px 0 0; flex:1;}
.svc-card .svc-go{margin-top:22px; font-family:var(--mono); font-size:12.5px; color:var(--ink-dim); display:inline-flex; align-items:center; gap:9px; letter-spacing:.05em;}
.svc-card .svc-go .arr{transition:transform .25s;}
.svc-card:hover .svc-go{color:var(--red);} .svc-card:hover .svc-go .arr{transform:translateX(5px);}
.svc-card .svc-ic{position:absolute; top:34px; right:30px; opacity:.5; transition:.3s;}
.svc-card:hover .svc-ic{opacity:1; color:var(--red);}

/* ============================================================
   SERVICE ROWS (services.html)
   ============================================================ */
.svc-row{display:grid; grid-template-columns:64px 1fr 140px; gap:30px; align-items:center;
  padding:42px 0; border-top:1px solid var(--line); transition:padding-left .3s, background .3s; position:relative;}
.svc-row:last-of-type{border-bottom:1px solid var(--line);}
.svc-row::before{content:""; position:absolute; left:0; top:0; bottom:0; width:0; background:var(--red); transition:width .3s ease;}
.svc-row:hover{padding-left:24px;}
.svc-row:hover::before{width:3px;}
.svc-row-n{font-family:var(--mono); font-size:14px; color:var(--mut2); letter-spacing:.1em; align-self:start; padding-top:8px;}
.svc-row-main h2{font-size:clamp(26px,3vw,38px); line-height:1.02; letter-spacing:-.02em; transition:color .3s;}
.svc-row:hover .svc-row-main h2{color:var(--red);}
.svc-row-main p{font-size:15.5px; color:var(--ink-dim); margin:14px 0 0; max-width:680px; font-weight:300;}
.svc-row-tags{display:flex; gap:8px; flex-wrap:wrap; margin-top:18px;}
.svc-row-tags span{font-size:11px; letter-spacing:.08em; color:var(--mut); border:1px solid var(--line); padding:5px 9px; border-radius:2px; text-transform:uppercase;}
.svc-row-go{justify-self:end; align-self:start; padding-top:8px;}
@media (max-width:760px){
  .svc-row{grid-template-columns:1fr; gap:14px; padding:32px 0;}
  .svc-row-go{justify-self:start;}
  .svc-row:hover{padding-left:14px;}
}

/* ============================================================
   APPROACH / steps
   ============================================================ */
.steps{display:grid; grid-template-columns:repeat(5,1fr); gap:1px; background:var(--line); border:1px solid var(--line);}
.step{background:var(--bg); padding:32px 26px 38px; position:relative; transition:background .3s;}
.step:hover{background:var(--panel);}
.step .st-n{font-family:var(--mono); font-size:13px; color:var(--red); letter-spacing:.1em;}
.step h4{font-family:var(--sans); font-weight:600; font-size:17px; letter-spacing:0; margin:18px 0 10px; line-height:1.2;}
.step p{font-size:13.5px; color:var(--mut); margin:0;}
.step .st-ph{font-family:var(--serif); font-size:54px; font-weight:700; color:rgba(255,255,255,.045); position:absolute; bottom:8px; right:16px; line-height:1;}

/* ============================================================
   FEATURE / split
   ============================================================ */
.split{display:grid; grid-template-columns:1fr 1fr; gap:clamp(34px,6vw,90px); align-items:center;}
.feat-list{list-style:none; margin:30px 0 0; padding:0; display:flex; flex-direction:column; gap:0;}
.feat-list li{padding:22px 0; border-top:1px solid var(--line); display:grid; grid-template-columns:38px 1fr; gap:18px; align-items:start;}
.feat-list li:last-child{border-bottom:1px solid var(--line);}
.feat-list .fn{font-family:var(--mono); font-size:13px; color:var(--red);}
.feat-list h4{font-family:var(--sans); font-weight:600; font-size:18px; letter-spacing:0; margin:0 0 6px;}
.feat-list p{margin:0; font-size:14.5px; color:var(--mut);}

/* big bordered panel (terminal-ish) */
.panel-box{border:1px solid var(--line2); border-radius:9px; background:linear-gradient(180deg,#0c0e12,#090a0d); overflow:hidden;}
.figcap{padding:14px 20px; border-top:1px solid var(--line); font-family:var(--mono); font-size:12px; color:var(--mut); display:flex; justify-content:space-between; gap:14px; letter-spacing:.03em;}

/* ============================================================
   DETAIL PAGE — coverage grid + deliverables
   ============================================================ */
.cover-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:1px; background:var(--line); border:1px solid var(--line);}
.cover{background:var(--bg); padding:26px 28px; display:grid; grid-template-columns:26px 1fr; gap:14px; align-items:start; transition:background .3s;}
.cover:hover{background:var(--panel);}
.cover .cv-x{color:var(--red); font-family:var(--mono); font-size:14px; line-height:1.4;}
.cover h4{font-family:var(--sans); font-weight:600; font-size:16px; margin:0 0 5px; letter-spacing:0; line-height:1.25;}
.cover p{margin:0; font-size:13.5px; color:var(--mut);}
@media (max-width:680px){.cover-grid{grid-template-columns:1fr;}}
.deliver{list-style:none; margin:0; padding:0;}
.deliver li{display:grid; grid-template-columns:48px 1fr; gap:18px; padding:22px 0; border-top:1px solid var(--line); align-items:baseline;}
.deliver li:last-child{border-bottom:1px solid var(--line);}
.deliver .dn{font-family:var(--mono); font-size:13px; color:var(--red);}
.deliver h4{font-family:var(--sans); font-weight:600; font-size:18px; letter-spacing:0; margin:0 0 6px;}
.deliver p{margin:0; font-size:14.5px; color:var(--mut);}

/* ============================================================
   VALUES grid (about)
   ============================================================ */
.value-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); border:1px solid var(--line);}
.value{background:var(--bg); padding:36px 32px; transition:background .3s; min-height:240px; display:flex; flex-direction:column;}
.value:hover{background:var(--panel);}
.value .v-n{font-family:var(--mono); font-size:13px; color:var(--red); letter-spacing:.1em;}
.value h3{font-size:24px; line-height:1.06; margin:18px 0 0; letter-spacing:-.01em;}
.value p{font-size:14.5px; color:var(--mut); margin:14px 0 0; flex:1;}
@media (max-width:880px){.value-grid{grid-template-columns:1fr;}}

/* ============================================================
   FORMS (contact)
   ============================================================ */
.form{display:flex; flex-direction:column; gap:22px;}
.form-row{display:grid; grid-template-columns:1fr 1fr; gap:22px;}
.field{display:flex; flex-direction:column; gap:9px;}
.field label{font-family:var(--mono); font-size:11.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--mut);}
.field label .req{color:var(--red);}
.field input,.field select,.field textarea{font-family:var(--sans); font-size:15px; color:var(--ink); background:var(--panel);
  border:1px solid var(--line2); border-radius:4px; padding:14px 16px; transition:border-color .2s, background .2s; width:100%;}
.field textarea{resize:vertical; min-height:140px; line-height:1.55;}
.field select{appearance:none; cursor:pointer;
  background-image:linear-gradient(45deg,transparent 50%,var(--mut) 50%),linear-gradient(135deg,var(--mut) 50%,transparent 50%);
  background-position:calc(100% - 20px) calc(50% - 2px),calc(100% - 14px) calc(50% - 2px); background-size:6px 6px,6px 6px; background-repeat:no-repeat;}
.field input::placeholder,.field textarea::placeholder{color:var(--mut2);}
.field input:focus,.field select:focus,.field textarea:focus{outline:none; border-color:var(--red); background:var(--panel2);}
.field.invalid input,.field.invalid select,.field.invalid textarea{border-color:var(--red); background:rgba(227,71,50,.05);}
.field .err{font-family:var(--mono); font-size:11px; color:var(--red); display:none; letter-spacing:.03em;}
.field.invalid .err{display:block;}
.form-success{display:none; border:1px solid var(--line2); border-radius:9px; overflow:hidden; background:linear-gradient(180deg,#0c0e12,#090a0d);}
.form-success.show{display:block; animation:fadeup .5s ease;}
@keyframes fadeup{from{opacity:0; transform:translateY(12px);}to{opacity:1; transform:none;}}
.form-success .term-body{min-height:auto;}

/* contact info column */
.cinfo{display:flex; flex-direction:column; gap:2px;}
.cinfo-item{padding:24px 0; border-top:1px solid var(--line); display:grid; grid-template-columns:46px 1fr; gap:16px; align-items:start;}
.cinfo-item:last-child{border-bottom:1px solid var(--line);}
.cinfo .ci-n{font-family:var(--mono); font-size:13px; color:var(--red);}
.cinfo h4{font-family:var(--sans); font-weight:600; font-size:17px; margin:0 0 6px; letter-spacing:0;}
.cinfo p{margin:0; font-size:14.5px; color:var(--mut);}
.cinfo a{color:var(--ink-dim);} .cinfo a:hover{color:var(--red);}
@media (max-width:560px){.form-row{grid-template-columns:1fr;}}

/* ============================================================
   STATS band
   ============================================================ */
.stats{display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line); border-top:1px solid var(--line); border-bottom:1px solid var(--line);}
.stat{background:var(--bg); padding:46px 30px; text-align:left;}
.stat .n{font-family:var(--serif); font-weight:700; font-size:clamp(44px,5vw,64px); line-height:1; letter-spacing:-.02em;}
.stat .n .rd{color:var(--red);}
.stat .l{font-family:var(--mono); font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:var(--mut); margin-top:14px;}

/* ============================================================
   CERT WALL
   ============================================================ */
.cert-wall{display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:1px; background:var(--line); border:1px solid var(--line);}
.cert{background:var(--bg); padding:26px 22px; transition:background .3s; min-height:118px; display:flex; flex-direction:column; justify-content:space-between;}
.cert:hover{background:var(--panel);}
.cert .c-code{font-family:var(--mono); font-weight:600; font-size:17px; color:var(--ink); letter-spacing:.02em;}
.cert .c-name{font-size:12px; color:var(--mut); margin-top:8px; line-height:1.35;}
.cert .c-dot{width:6px; height:6px; border-radius:50%; background:var(--red); margin-bottom:14px;}

/* ============================================================
   INSIGHTS
   ============================================================ */
.insight-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:24px;}
.insight{border:1px solid var(--line); padding:30px 28px 26px; transition:.3s; display:flex; flex-direction:column; min-height:230px;}
.insight:hover{border-color:var(--line3); background:var(--panel); transform:translateY(-3px);}
.insight .tag{font-family:var(--mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--red);}
.insight h4{font-family:var(--serif); font-weight:700; font-size:23px; line-height:1.12; margin:18px 0 0; letter-spacing:-.01em; flex:1;}
.insight .meta{font-family:var(--mono); font-size:12px; color:var(--mut); margin-top:22px; display:flex; gap:14px;}

/* ============================================================
   CTA band
   ============================================================ */
.cta-band{position:relative; overflow:hidden; border:1px solid var(--line2); border-radius:12px; background:linear-gradient(135deg,#101319,#0a0b0e); padding:clamp(48px,7vw,92px) var(--pad);}
.cta-band::after{content:""; position:absolute; left:0; right:0; bottom:0; height:62%; z-index:0; pointer-events:none;
  background:url(assets/terrain-ridge.png) no-repeat center bottom; background-size:cover; opacity:.55;
  mask-image:linear-gradient(to top,#000 10%,transparent); -webkit-mask-image:linear-gradient(to top,#000 10%,transparent);}
.cta-band .hero-glow{right:-100px; top:-80px;}
.cta-band-in{position:relative; z-index:2; max-width:760px;}
.cta-band h2{font-size:clamp(36px,5vw,64px); line-height:.98;}
.cta-band .lead{margin:24px 0 36px; max-width:560px;}

/* ============================================================
   FOOTER
   ============================================================ */
.footer{position:relative; z-index:1; border-top:1px solid var(--line); padding:clamp(60px,8vw,96px) 0 36px; background:var(--bg2);}
.footer-top{display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr; gap:40px; padding-bottom:60px;}
.footer-brand img{height:26px; margin-bottom:22px;}
.footer-brand p{font-size:14.5px; color:var(--mut); max-width:300px;}
.footer-col h5{font-family:var(--mono); font-size:11.5px; letter-spacing:.16em; text-transform:uppercase; color:var(--mut2); margin:0 0 20px; font-weight:500;}
.footer-col ul{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:13px;}
.footer-col a{font-size:14.5px; color:var(--ink-dim); transition:color .2s;}
.footer-col a:hover{color:var(--red);}
.footer-bottom{display:flex; justify-content:space-between; align-items:center; padding-top:30px; border-top:1px solid var(--line); flex-wrap:wrap; gap:16px;}
.footer-bottom span{font-family:var(--mono); font-size:12px; color:var(--mut2); letter-spacing:.04em;}

/* ============================================================
   PAGE HERO (interior pages)
   ============================================================ */
.phero{position:relative; padding:170px 0 clamp(50px,7vw,84px); overflow:hidden; border-bottom:1px solid var(--line);}
.phero .hero-grid-bg{mask-image:radial-gradient(circle at 80% 20%, #000 0%, transparent 70%);}
.phero-in{position:relative; z-index:2;}
.phero h1{font-size:clamp(48px,7vw,92px); line-height:.94; letter-spacing:-.03em; margin:22px 0 0; max-width:14ch;}
.phero .lead{margin-top:28px; max-width:560px;}
.breadcrumb{font-family:var(--mono); font-size:12.5px; color:var(--mut); letter-spacing:.06em; display:flex; gap:10px; align-items:center;}
.breadcrumb a:hover{color:var(--red);} .breadcrumb .sep{color:var(--mut2);}

/* ============================================================
   REVEAL animation
   ============================================================ */
[data-reveal]{opacity:0; transform:translateY(26px); transition:opacity .7s cubic-bezier(.2,.7,.3,1), transform .7s cubic-bezier(.2,.7,.3,1);}
[data-reveal].in{opacity:1; transform:none;}
[data-reveal-d="1"]{transition-delay:.08s;} [data-reveal-d="2"]{transition-delay:.16s;}
[data-reveal-d="3"]{transition-delay:.24s;} [data-reveal-d="4"]{transition-delay:.32s;} [data-reveal-d="5"]{transition-delay:.4s;}
@media (prefers-reduced-motion:reduce){
  [data-reveal]{opacity:1 !important; transform:none !important;}
  .marquee-track,.term-body{animation:none !important;}
  *{scroll-behavior:auto !important;}
}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:1080px){
  .svc-grid{grid-template-columns:repeat(2,1fr);}
  .steps{grid-template-columns:repeat(2,1fr);}
  .stats{grid-template-columns:repeat(2,1fr);}
  .insight-grid{grid-template-columns:1fr 1fr;}
  .footer-top{grid-template-columns:1fr 1fr;}
}
@media (max-width:980px){
  .nav-links,.nav-status{display:none;}
  .nav-burger{display:block;}
}
@media (max-width:880px){
  .hero-in{grid-template-columns:1fr; gap:44px;}
  .hero{min-height:auto; padding-top:130px; padding-bottom:40px;}
  .split{grid-template-columns:1fr;}
  .hero-status .cell{flex:1 1 50%;}
}
@media (max-width:620px){
  .svc-grid,.steps,.stats,.insight-grid{grid-template-columns:1fr;}
  .footer-top{grid-template-columns:1fr 1fr;}
  .hero-status .cell{flex:1 1 100%; border-right:0; border-bottom:1px solid var(--line);}
  .term-body{font-size:12.5px;}
}