/* ============================================================
   CALIDAD SERVICES — Dark / Royal Blue theme system
   ============================================================ */
:root{
  --bg:#060A14;
  --surface:#0A1124;
  --raised:#0E172E;
  --line:rgba(125,155,225,0.14);
  --line-strong:rgba(125,155,225,0.28);
  --blue:#2456E6;
  --blue-hi:#3D6BF0;
  --blue-deep:#16336F;
  --blue-soft:rgba(36,86,230,0.13);
  --volt:#D8F421;
  --ink:#EDF2FC;
  --ink-2:#A9B7DA;
  --ink-3:#67779F;
  --mono:"IBM Plex Mono",ui-monospace,monospace;
  --sans:"Archivo","Helvetica Neue",Helvetica,Arial,sans-serif;
  --max:1240px;
  --rad:6px;
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  background:var(--bg);
  color:var(--ink);
  font-family:var(--sans);
  font-size:17px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
::selection{background:var(--blue);color:#fff;}
img{max-width:100%;display:block;}
a{color:var(--blue-hi);text-decoration:none;}
a:hover{color:#6E92F5;}

h1,h2,h3,h4{font-weight:700;line-height:1.12;letter-spacing:-0.015em;text-wrap:balance;}
h1{font-size:clamp(2.6rem,5.6vw,4.6rem);font-weight:800;}
h2{font-size:clamp(1.9rem,3.4vw,2.8rem);}
h3{font-size:1.3rem;}
p{text-wrap:pretty;}

.container{max-width:var(--max);margin:0 auto;padding:0 28px;}
.section{padding:104px 0;position:relative;}
.section-tight{padding:72px 0;}

/* ---------- eyebrow / mono labels ---------- */
.eyebrow{
  display:flex;align-items:center;gap:10px;
  font-family:var(--mono);font-size:.78rem;font-weight:500;
  letter-spacing:.22em;text-transform:uppercase;color:var(--blue-hi);
  margin-bottom:18px;
}
.eyebrow::before{content:"";width:9px;height:9px;background:var(--blue);clip-path:polygon(0 0,100% 50%,0 100%);}
.lede{color:var(--ink-2);font-size:1.16rem;max-width:680px;margin-top:18px;}

/* ---------- nav ---------- */
.nav{
  position:fixed;top:0;left:0;right:0;z-index:100;
  background:rgba(6,10,20,0.82);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line);
}
.nav-inner{
  max-width:var(--max);margin:0 auto;padding:0 28px;
  display:flex;align-items:center;justify-content:space-between;height:76px;gap:24px;
}
.brand{display:flex;align-items:center;gap:13px;color:var(--ink);}
.brand:hover{color:var(--ink);}
.brand-logo{height:44px;width:auto;border-radius:5px;display:block;}
.brand-mark{
  width:40px;height:40px;border-radius:50%;flex:0 0 auto;
  border:2px solid var(--blue);display:grid;place-items:center;
  font-family:var(--mono);font-weight:700;font-size:.95rem;color:var(--blue-hi);
  background:radial-gradient(circle at 30% 30%,rgba(61,107,240,.35),rgba(6,10,20,.2));
}
.brand-name{display:flex;flex-direction:column;line-height:1.1;}
.brand-name b{font-size:1.12rem;font-weight:800;letter-spacing:.16em;}
.brand-name span{font-family:var(--mono);font-size:.56rem;letter-spacing:.24em;color:var(--ink-3);text-transform:uppercase;margin-top:3px;}
.nav-links{display:flex;align-items:center;gap:30px;list-style:none;}
.nav-links a{color:var(--ink-2);font-size:.95rem;font-weight:500;}
.nav-links a:hover,.nav-links a[aria-current="page"]{color:#fff;}
.nav-links a[aria-current="page"]{box-shadow:0 2px 0 var(--blue);}
.nav-drop{position:relative;}
.nav-drop>a::after{content:" ▾";font-size:.7em;color:var(--ink-3);}
.nav-menu{
  position:absolute;top:100%;left:-16px;padding:10px 0;min-width:300px;
  background:var(--raised);border:1px solid var(--line-strong);border-radius:var(--rad);
  list-style:none;display:none;box-shadow:0 24px 48px rgba(0,0,0,.5);
}
.nav-drop:hover .nav-menu,.nav-drop:focus-within .nav-menu{display:block;}
.nav-menu a{display:block;padding:10px 18px;font-size:.92rem;color:var(--ink-2);}
.nav-menu a:hover{background:var(--blue-soft);color:#fff;}
.nav-menu .mono-tag{font-family:var(--mono);font-size:.66rem;color:var(--ink-3);display:block;letter-spacing:.14em;}
.nav-cta{margin-left:6px;}
.nav-toggle{display:none;background:none;border:1px solid var(--line-strong);color:var(--ink);
  border-radius:var(--rad);font-family:var(--mono);font-size:.8rem;padding:9px 14px;letter-spacing:.12em;cursor:pointer;}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;align-items:center;gap:10px;
  padding:15px 28px;border-radius:var(--rad);
  font-family:var(--mono);font-size:.84rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  border:1px solid transparent;cursor:pointer;transition:all .18s ease;white-space:nowrap;
}
.btn-primary{background:var(--blue);color:#fff;}
.btn-primary:hover{background:var(--blue-hi);color:#fff;transform:translateY(-1px);box-shadow:0 8px 28px rgba(36,86,230,.4);}
.btn-ghost{border-color:var(--line-strong);color:var(--ink);background:rgba(14,23,46,.4);}
.btn-ghost:hover{border-color:var(--blue-hi);color:#fff;}
.btn .arr{font-family:var(--sans);}

/* ---------- hero ---------- */
.hero{
  position:relative;min-height:88vh;display:flex;align-items:flex-end;
  padding:170px 0 90px;overflow:hidden;isolation:isolate;
}
.hero-sub{min-height:62vh;padding:160px 0 70px;}
.hero h1{max-width:16ch;}
.hero-sub h1{max-width:22ch;}
.hero .lede{font-size:1.2rem;max-width:620px;}
.hero-actions{display:flex;gap:16px;margin-top:38px;flex-wrap:wrap;}
.stack-strip{display:flex;flex-wrap:wrap;gap:10px;margin-top:30px;max-width:720px;}
.stack-strip span{font-family:var(--mono);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink);border:1px solid var(--line-strong);border-radius:999px;padding:7px 15px;background:rgba(10,17,36,.55);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);}
@media (max-width:760px){.stack-strip span{font-size:.62rem;padding:6px 12px;}}
.hero-bg{position:absolute;inset:0;z-index:-3;}
.hero-vignette{
  position:absolute;inset:0;z-index:-1;
  background:linear-gradient(180deg,rgba(6,10,20,.55) 0%,rgba(6,10,20,.25) 40%,rgba(6,10,20,.92) 88%,var(--bg) 100%);
}
.grid-overlay{
  position:absolute;inset:0;z-index:-2;opacity:.5;pointer-events:none;
  background-image:
    linear-gradient(rgba(80,120,220,0.07) 1px,transparent 1px),
    linear-gradient(90deg,rgba(80,120,220,0.07) 1px,transparent 1px);
  background-size:56px 56px;
  mask-image:radial-gradient(ellipse 90% 80% at 60% 30%,black 30%,transparent 75%);
  -webkit-mask-image:radial-gradient(ellipse 90% 80% at 60% 30%,black 30%,transparent 75%);
}
/* radar sweep */
.radar{
  position:absolute;z-index:-2;width:760px;height:760px;right:-160px;top:-130px;
  border-radius:50%;pointer-events:none;opacity:.55;
}
.radar::before{
  content:"";position:absolute;inset:0;border-radius:50%;
  background:
    radial-gradient(circle,transparent 54%,rgba(80,120,220,.10) 54.5%,transparent 55.5%),
    radial-gradient(circle,transparent 34%,rgba(80,120,220,.10) 34.5%,transparent 35.5%),
    radial-gradient(circle,transparent 74%,rgba(80,120,220,.10) 74.5%,transparent 75.5%),
    radial-gradient(circle,rgba(36,86,230,.06),transparent 70%);
}
.radar::after{
  content:"";position:absolute;inset:0;border-radius:50%;
  background:conic-gradient(from 0deg,rgba(61,107,240,.5),rgba(61,107,240,.06) 18%,transparent 30%);
  animation:sweep 7s linear infinite;
  mask-image:radial-gradient(circle,black 0 76%,transparent 76%);
  -webkit-mask-image:radial-gradient(circle,black 0 76%,transparent 76%);
}
@keyframes sweep{to{transform:rotate(360deg);}}
/* scanline */
.scanline{
  position:absolute;left:0;right:0;top:0;height:2px;z-index:-1;pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(61,107,240,.65),transparent);
  animation:scan 9s ease-in-out infinite;opacity:.5;
}
@keyframes scan{0%{top:4%;}50%{top:92%;}100%{top:4%;}}
@media (prefers-reduced-motion:reduce){
  .radar::after,.scanline{animation:none;}
  .scanline{display:none;}
}

/* ---------- status chip ---------- */.status{
  display:inline-flex;align-items:center;gap:10px;margin-bottom:26px;
  font-family:var(--mono);font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--ink-2);border:1px solid var(--line-strong);border-radius:999px;padding:8px 16px;
  background:rgba(10,17,36,.6);
}
.status .dot{width:8px;height:8px;border-radius:50%;background:var(--volt);animation:pulse 2s ease infinite;}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(216,244,33,.5);}50%{box-shadow:0 0 0 6px rgba(216,244,33,0);}}

/* ---------- credibility bar ---------- */
.cred{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--surface);}
.cred-inner{
  max-width:var(--max);margin:0 auto;padding:22px 28px;
  display:flex;flex-wrap:wrap;justify-content:center;gap:14px 40px;
}
.cred-item{display:flex;align-items:center;gap:11px;font-family:var(--mono);font-size:.78rem;letter-spacing:.1em;color:var(--ink-2);text-transform:uppercase;}
.cred-item b{color:#fff;}
.cred-item::before{content:"";width:7px;height:7px;background:var(--blue);transform:rotate(45deg);flex:0 0 auto;}

/* ---------- cards ---------- */
.grid{display:grid;gap:22px;}
.grid-2{grid-template-columns:repeat(2,1fr);}
.grid-3{grid-template-columns:repeat(3,1fr);}
.grid-4{grid-template-columns:repeat(4,1fr);}
.card{
  background:var(--surface);border:1px solid var(--line);border-radius:var(--rad);
  padding:34px 30px;position:relative;transition:border-color .2s,transform .2s;
}
a.card{color:var(--ink);display:block;}
.card:hover{border-color:var(--blue);transform:translateY(-3px);}
.card .num{font-family:var(--mono);font-size:.72rem;color:var(--ink-3);letter-spacing:.18em;}
.card h3{margin:14px 0 12px;}
.card p{color:var(--ink-2);font-size:.99rem;}
.card .more{display:inline-block;margin-top:20px;font-family:var(--mono);font-size:.76rem;letter-spacing:.16em;text-transform:uppercase;color:var(--blue-hi);}
.card:hover .more{color:#fff;}
.card-accent{height:3px;width:46px;background:var(--blue);margin-bottom:24px;transition:width .25s;}
.card:hover .card-accent{width:80px;background:var(--blue-hi);}

/* ---------- placeholders (real photos drop in later) ---------- */
.ph{
  position:relative;border:1px dashed var(--line-strong);border-radius:var(--rad);
  background:repeating-linear-gradient(135deg,rgba(80,120,220,.05) 0 14px,rgba(80,120,220,.012) 14px 28px),var(--surface);
  display:grid;place-items:center;overflow:hidden;min-height:220px;
}
.ph::before{
  content:attr(data-label);
  font-family:var(--mono);font-size:.74rem;letter-spacing:.12em;color:var(--ink-3);
  text-transform:uppercase;text-align:center;padding:0 24px;max-width:90%;line-height:1.9;
}
.ph-corner::after{
  content:"";position:absolute;inset:12px;pointer-events:none;
  border:1px solid rgba(125,155,225,.18);
  mask:linear-gradient(black,black) top left/26px 26px no-repeat,
       linear-gradient(black,black) top right/26px 26px no-repeat,
       linear-gradient(black,black) bottom left/26px 26px no-repeat,
       linear-gradient(black,black) bottom right/26px 26px no-repeat;
  -webkit-mask:linear-gradient(black,black) top left/26px 26px no-repeat,
       linear-gradient(black,black) top right/26px 26px no-repeat,
       linear-gradient(black,black) bottom left/26px 26px no-repeat,
       linear-gradient(black,black) bottom right/26px 26px no-repeat;
}
.ph-16x9{aspect-ratio:16/9;}
.ph-4x3{aspect-ratio:4/3;}
.ph-1x1{aspect-ratio:1/1;}
.ph-fill{position:absolute;inset:0;border-radius:0;border:none;min-height:0;}
.ph-fill img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}

/* ---------- logo strip ---------- */
.logos{display:flex;flex-wrap:wrap;justify-content:center;gap:18px 56px;align-items:center;}
.logo-item{
  font-family:var(--mono);font-size:.92rem;letter-spacing:.2em;color:var(--ink-3);
  text-transform:uppercase;white-space:nowrap;transition:color .2s;
}
.logo-item:hover{color:var(--ink-2);}

/* ---------- stats ---------- */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;}
.stat{border-left:2px solid var(--blue);padding-left:22px;}
.stat .val{font-size:clamp(2.2rem,4vw,3.4rem);font-weight:800;letter-spacing:-0.02em;line-height:1;}
.stat .val em{color:var(--blue-hi);font-style:normal;}
.stat .lbl{font-family:var(--mono);font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-3);margin-top:10px;}

/* ---------- steps ---------- */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;counter-reset:step;}
.step{background:var(--surface);border:1px solid var(--line);border-radius:var(--rad);padding:32px 28px;position:relative;}
.step::before{
  counter-increment:step;content:"0" counter(step);
  font-family:var(--mono);font-size:.8rem;color:var(--blue-hi);letter-spacing:.2em;
  display:block;margin-bottom:16px;
}
.step h3{font-size:1.12rem;margin-bottom:10px;}
.step p{color:var(--ink-2);font-size:.96rem;}

/* ---------- feature/spec list ---------- */
.spec-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;}
.spec{
  display:flex;gap:14px;align-items:flex-start;
  background:var(--surface);border:1px solid var(--line);border-radius:var(--rad);padding:18px 20px;
}
.spec::before{content:"";flex:0 0 auto;width:8px;height:8px;margin-top:9px;background:var(--blue);clip-path:polygon(0 0,100% 50%,0 100%);}
.spec b{display:block;font-size:.99rem;}
.spec span{color:var(--ink-2);font-size:.92rem;}

/* ---------- compare table ---------- */
.compare{width:100%;border-collapse:collapse;border:1px solid var(--line-strong);}
.compare th,.compare td{padding:17px 22px;text-align:left;border-bottom:1px solid var(--line);font-size:.97rem;}
.compare th{font-family:var(--mono);font-size:.76rem;letter-spacing:.16em;text-transform:uppercase;background:var(--raised);}
.compare th:last-child{color:var(--blue-hi);}
.compare td{color:var(--ink-2);}
.compare td:last-child{color:var(--ink);background:rgba(36,86,230,.06);}
.compare tr:last-child td{border-bottom:none;}

/* ---------- warning chip (volt accent, sparing) ---------- */
.chip-volt{
  display:inline-block;
  font-family:var(--mono);font-size:.68rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;
  color:#0A0E14;background:var(--volt);padding:6px 12px;border-radius:2px;line-height:1.8;
}

/* ---------- split layout ---------- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center;}
.split .ph{width:100%;}

/* ---------- CTA band ---------- */
.cta-band{
  position:relative;overflow:hidden;
  border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  background:linear-gradient(120deg,#0B1530 0%,#10204C 55%,#16336F 100%);
  padding:96px 0;text-align:center;
}
.cta-band h2{font-size:clamp(2rem,4vw,3.2rem);max-width:20ch;margin:0 auto;}
.cta-band p{color:var(--ink-2);margin:18px auto 36px;max-width:540px;}

/* ---------- forms ---------- */
.form{display:grid;grid-template-columns:1fr 1fr;gap:18px;}
.form .full{grid-column:1/-1;}
.field label{
  display:block;font-family:var(--mono);font-size:.7rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--ink-3);margin-bottom:8px;
}
.field input,.field select,.field textarea{
  width:100%;background:var(--raised);border:1px solid var(--line-strong);border-radius:var(--rad);
  color:var(--ink);font-family:var(--sans);font-size:.98rem;padding:14px 16px;outline:none;
  transition:border-color .15s;
}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--blue-hi);}
.field textarea{min-height:130px;resize:vertical;}

/* ---------- footer ---------- */
.footer{border-top:1px solid var(--line);background:#05080F;padding:72px 0 36px;}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:48px;}
.footer h4{font-family:var(--mono);font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-3);margin-bottom:20px;font-weight:500;}
.footer ul{list-style:none;display:grid;gap:11px;}
.footer a{color:var(--ink-2);font-size:.94rem;}
.footer a:hover{color:#fff;}
.footer-meta{color:var(--ink-2);font-size:.94rem;line-height:1.9;}
.footer-lic{font-family:var(--mono);font-size:.76rem;color:var(--ink-3);letter-spacing:.08em;margin-top:16px;line-height:2;}
.footer-bottom{
  border-top:1px solid var(--line);margin-top:56px;padding-top:26px;
  display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;
  font-family:var(--mono);font-size:.72rem;letter-spacing:.1em;color:var(--ink-3);
}

/* ---------- reveal ----------
   Visible is the BASE state; the hidden pre-animation state only applies
   when JS is live (html.js) AND the user allows motion. Print/PDF/no-JS
   contexts always show content. */
@media (prefers-reduced-motion: no-preference){
  html.js [data-reveal]{opacity:0;transform:translateY(26px);transition:opacity .7s ease,transform .7s ease;}
  html.js [data-reveal].is-in{opacity:1;transform:none;}
}

/* ---------- page hero strip (sub pages) ---------- */
.crumbs{font-family:var(--mono);font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-3);margin-bottom:22px;}
.crumbs a{color:var(--ink-3);}
.crumbs a:hover{color:var(--blue-hi);}

/* ---------- AI detection feed overlay ---------- */
.feed{
  position:relative;border:1px solid var(--line-strong);border-radius:var(--rad);
  overflow:hidden;background:#05080F;aspect-ratio:4/3;
}
.feed img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.feed-scrim{position:absolute;inset:0;background:linear-gradient(180deg,rgba(4,7,14,.35),transparent 22%,transparent 72%,rgba(4,7,14,.75));pointer-events:none;}
/* faint analysis grid */
.feed-grid{
  position:absolute;inset:0;pointer-events:none;opacity:.35;
  background-image:linear-gradient(rgba(80,140,240,.12) 1px,transparent 1px),linear-gradient(90deg,rgba(80,140,240,.12) 1px,transparent 1px);
  background-size:44px 44px;
}
/* AI scan sweep */
.feed-scan{
  position:absolute;left:0;right:0;height:120px;pointer-events:none;
  background:linear-gradient(180deg,transparent,rgba(61,107,240,.16),rgba(61,107,240,.32));
  border-bottom:1.5px solid rgba(120,170,255,.7);
  animation:feedscan 4.2s cubic-bezier(.5,0,.5,1) infinite;
}
@keyframes feedscan{0%{top:-120px;}55%{top:100%;}100%{top:100%;}}
/* HUD chrome */
.feed-hud{position:absolute;inset:0;pointer-events:none;font-family:var(--mono);}
.feed-hud .tl,.feed-hud .tr,.feed-hud .bl,.feed-hud .br{position:absolute;font-size:.62rem;letter-spacing:.14em;color:#B9CCF5;text-shadow:0 1px 3px rgba(0,0,0,.8);}
.feed-hud .tl{top:14px;left:14px;display:flex;align-items:center;gap:8px;}
.feed-hud .tr{top:14px;right:14px;text-align:right;}
.feed-hud .bl{bottom:14px;left:14px;}
.feed-hud .br{bottom:14px;right:14px;text-align:right;color:var(--ink-3);}
.feed-hud .rec{display:inline-flex;align-items:center;gap:6px;color:#fff;}
.feed-hud .rec::before{content:"";width:8px;height:8px;border-radius:50%;background:#FF3B49;animation:pulse 1.4s ease infinite;box-shadow:0 0 8px #FF3B49;}
.feed-hud .live{color:var(--volt);}
/* corner brackets on whole feed */
.feed::after{
  content:"";position:absolute;inset:10px;pointer-events:none;z-index:3;
  border:1px solid rgba(150,180,255,.35);
  -webkit-mask:linear-gradient(#000,#000) top left/22px 22px no-repeat,linear-gradient(#000,#000) top right/22px 22px no-repeat,linear-gradient(#000,#000) bottom left/22px 22px no-repeat,linear-gradient(#000,#000) bottom right/22px 22px no-repeat;
  mask:linear-gradient(#000,#000) top left/22px 22px no-repeat,linear-gradient(#000,#000) top right/22px 22px no-repeat,linear-gradient(#000,#000) bottom left/22px 22px no-repeat,linear-gradient(#000,#000) bottom right/22px 22px no-repeat;
}
/* detection boxes */
.det{position:absolute;pointer-events:none;z-index:2;border:1.5px solid var(--volt);box-shadow:0 0 0 1px rgba(0,0,0,.4),0 0 14px rgba(216,244,33,.25);}
.det.blue{border-color:#4D8BFF;box-shadow:0 0 0 1px rgba(0,0,0,.4),0 0 14px rgba(77,139,255,.3);}
.det .det-lbl{
  position:absolute;top:-1px;left:-1px;transform:translateY(-100%);
  font-family:var(--mono);font-size:.6rem;font-weight:600;letter-spacing:.08em;white-space:nowrap;
  background:var(--volt);color:#0A0E14;padding:2px 7px;
}
.det.blue .det-lbl{background:#4D8BFF;color:#04070E;}
/* box corner ticks */
.det span.c{position:absolute;width:9px;height:9px;border:2px solid #fff;}
.det span.c.tl{top:-2px;left:-2px;border-right:0;border-bottom:0;}
.det span.c.tr{top:-2px;right:-2px;border-left:0;border-bottom:0;}
.det span.c.bl{bottom:-2px;left:-2px;border-right:0;border-top:0;}
.det span.c.br{bottom:-2px;right:-2px;border-left:0;border-top:0;}
@media (prefers-reduced-motion:reduce){.feed-scan{animation:none;top:40%;opacity:.4;}}

/* photo card thumb (solutions) */
.card-photo{position:relative;overflow:hidden;border-radius:4px;margin-bottom:22px;aspect-ratio:16/10;border:1px solid var(--line);}
.card-photo img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease;}
.card:hover .card-photo img{transform:scale(1.05);}
.card-photo .tint{position:absolute;inset:0;background:linear-gradient(180deg,rgba(6,10,20,.1),rgba(6,10,20,.55));}
.card-photo.split2{display:grid;grid-template-columns:1fr 1fr;gap:3px;background:var(--line);}
.card-photo .ph{position:absolute;inset:0;border-radius:0;min-height:0;}

/* event log under AI feed */
.event-log{margin-top:14px;display:grid;gap:8px;}
.event{display:flex;gap:12px;align-items:center;font-family:var(--mono);font-size:.7rem;letter-spacing:.08em;color:var(--ink-2);border:1px solid var(--line);border-radius:4px;padding:9px 14px;background:rgba(10,17,36,.6);}
.event .sev{width:8px;height:8px;border-radius:50%;flex:0 0 auto;}
.event .t{color:var(--ink-3);}

/* reporting dashboard */
.dash{background:var(--surface);border:1px solid var(--line-strong);border-radius:var(--rad);padding:38px;display:grid;grid-template-columns:auto 1fr auto;gap:48px;align-items:center;}
.dash-donut{display:grid;place-items:center;}
.dash-legend{display:grid;gap:13px;min-width:0;}
.leg{display:flex;align-items:center;gap:12px;font-size:.95rem;color:var(--ink-2);}
.leg .sw{width:12px;height:12px;border-radius:3px;flex:0 0 auto;}
.leg b{color:var(--ink);margin-left:auto;font-family:var(--mono);font-size:.88rem;padding-left:18px;}
.dash-kpis{display:grid;gap:26px;}
@media (max-width:1020px){.dash{grid-template-columns:1fr;gap:36px;justify-items:start;}.dash-donut{justify-self:center;}}

/* CTA band background image */
.cta-band .cta-bg{position:absolute;inset:0;}
.cta-band .cta-bg img{width:100%;height:100%;object-fit:cover;opacity:.16;}

/* ---------- smart-building animated overlay ---------- */
.smart{position:relative;overflow:hidden;}
.smart>img{display:block;width:100%;height:100%;object-fit:cover;}
.smart .s-scrim{position:absolute;inset:0;background:linear-gradient(180deg,rgba(6,10,20,.05),rgba(6,10,20,.5));pointer-events:none;}
.smart .s-scan{position:absolute;left:0;right:0;height:70px;pointer-events:none;
  background:linear-gradient(180deg,transparent,rgba(61,107,240,.14),rgba(120,170,255,.28));
  border-bottom:1.5px solid rgba(150,190,255,.55);animation:ssweep 5s cubic-bezier(.5,0,.5,1) infinite;}
@keyframes ssweep{0%{top:-70px;}60%{top:100%;}100%{top:100%;}}
.smart .pin{position:absolute;width:14px;height:14px;transform:translate(-50%,-50%);pointer-events:none;z-index:2;}
.smart .pin::before{content:"";position:absolute;inset:0;border-radius:50%;background:var(--blue-hi);box-shadow:0 0 0 2px rgba(255,255,255,.6),0 0 12px rgba(61,107,240,.8);}
.smart .pin::after{content:"";position:absolute;inset:0;border-radius:50%;border:1.5px solid var(--blue-hi);animation:ping 2.4s ease-out infinite;}
.smart .pin.volt::before{background:var(--volt);box-shadow:0 0 0 2px rgba(0,0,0,.35),0 0 12px rgba(216,244,33,.7);}
.smart .pin.volt::after{border-color:var(--volt);}
.smart .pin .tip{position:absolute;left:18px;top:50%;transform:translateY(-50%);white-space:nowrap;
  font-family:var(--mono);font-size:.56rem;letter-spacing:.14em;text-transform:uppercase;color:#EAF1FF;
  background:rgba(8,14,30,.82);border:1px solid rgba(120,160,240,.4);border-radius:3px;padding:3px 7px;
  opacity:0;transition:opacity .25s;}
.smart:hover .pin .tip{opacity:1;}
.smart .pin.d2::after{animation-delay:.6s;}
.smart .pin.d3::after{animation-delay:1.2s;}
.smart .pin.d4::after{animation-delay:1.8s;}
@keyframes ping{0%{transform:scale(1);opacity:.9;}80%,100%{transform:scale(3.4);opacity:0;}}
.smart .s-hud{position:absolute;left:12px;bottom:11px;font-family:var(--mono);font-size:.58rem;letter-spacing:.16em;
  text-transform:uppercase;color:#B9CCF5;text-shadow:0 1px 3px rgba(0,0,0,.8);display:flex;align-items:center;gap:7px;pointer-events:none;z-index:2;}
.smart .s-hud::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--volt);animation:pulse 2s ease infinite;}
@media (prefers-reduced-motion:reduce){.smart .s-scan{animation:none;top:42%;}.smart .pin::after{animation:none;opacity:0;}}

/* innovators band */
.inv{position:relative;overflow:hidden;background:#070C1A;border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.inv-tags{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px;}
.inv-tag{font-family:var(--mono);font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ink);border:1px solid var(--line-strong);border-radius:999px;padding:9px 18px;background:rgba(10,17,36,.5);}
.inv-tag b{color:var(--blue-hi);}
.inv-tags.sm{gap:8px;}
.inv-tags.sm .inv-tag{font-size:.62rem;letter-spacing:.12em;padding:6px 13px;color:var(--ink-2);}
.inv-tags.sm .inv-tag b{color:var(--blue-hi);}

/* reporting screenshot frame */
.shot{border:1px solid var(--line-strong);border-radius:8px;overflow:hidden;background:#fff;box-shadow:0 24px 64px rgba(0,0,0,.45);}
.shot img{width:100%;display:block;}
.shot-bar{display:flex;align-items:center;gap:7px;background:#0E172E;border-bottom:1px solid var(--line-strong);padding:11px 16px;font-family:var(--mono);font-size:.64rem;letter-spacing:.18em;color:var(--ink-3);}
.shot-bar span{width:10px;height:10px;border-radius:50%;background:var(--line-strong);}
.shot-bar span:first-child{background:#FF5F57;}
.shot-bar span:nth-child(2){background:#FEBC2E;}
.shot-bar span:nth-child(3){background:#28C840;}
.shot-bar span:nth-child(3){margin-right:10px;}

/* ---------- interactive smart building ---------- */
.sb{display:grid;grid-template-columns:1.45fr 1fr;gap:30px;margin-top:50px;align-items:stretch;}
.sb-stage{position:relative;overflow:hidden;border:1px solid var(--line-strong);border-radius:var(--rad);background:#05080F;min-height:100%;}
.sb-stage>img{width:100%;height:100%;object-fit:cover;display:block;}
.sb-scrim{position:absolute;inset:0;background:linear-gradient(180deg,rgba(6,10,20,.2),rgba(6,10,20,.55));pointer-events:none;}
.sb-pin{position:absolute;transform:translate(-50%,-50%);width:17px;height:17px;padding:0;border:0;border-radius:50%;background:transparent;cursor:pointer;z-index:3;}
.sb-pin::before{content:"";position:absolute;inset:0;border-radius:50%;background:var(--blue-hi);box-shadow:0 0 0 2px rgba(255,255,255,.7),0 0 14px rgba(61,107,240,.9);transition:background .2s,transform .2s;}
.sb-pin::after{content:"";position:absolute;inset:0;border-radius:50%;border:1.5px solid var(--blue-hi);animation:ping 2.6s ease-out infinite;}
.sb-pin:nth-of-type(2n)::after{animation-delay:.5s;}
.sb-pin:nth-of-type(3n)::after{animation-delay:1.1s;}
.sb-pin:hover::before{transform:scale(1.25);}
.sb-pin.is-on::before{background:var(--volt);box-shadow:0 0 0 2px rgba(4,7,14,.55),0 0 16px rgba(216,244,33,.9);transform:scale(1.3);}
.sb-pin.is-on::after{border-color:var(--volt);}
.sb-pin:focus-visible{outline:2px solid #fff;outline-offset:6px;}
.sb-lbl{position:absolute;left:24px;top:50%;transform:translateY(-50%);white-space:nowrap;font-family:var(--mono);font-size:.58rem;letter-spacing:.14em;text-transform:uppercase;color:#EAF1FF;background:rgba(8,14,30,.88);border:1px solid rgba(120,160,240,.45);border-radius:3px;padding:4px 8px;pointer-events:none;}
.sb-pin.edge-r .sb-lbl{left:auto;right:24px;}
.sb-pin.is-on .sb-lbl{background:var(--volt);color:#04070E;border-color:var(--volt);font-weight:600;}
.sb-panel{position:relative;background:var(--surface);border:1px solid var(--line-strong);border-radius:var(--rad);padding:32px 30px;display:flex;flex-direction:column;}
.sb-detail{display:none;}
.sb-detail.is-on{display:block;animation:sbin .32s ease both;}
@keyframes sbin{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:none;}}
.sb-tag{display:inline-block;font-family:var(--mono);font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;color:var(--blue-hi);border:1px solid var(--line-strong);border-radius:999px;padding:5px 12px;margin-bottom:16px;}
.sb-detail h3{font-size:1.32rem;margin-bottom:12px;}
.sb-detail p{color:var(--ink-2);font-size:1rem;}
.sb-cta{margin-top:auto;align-self:flex-start;}
@media (max-width:1020px){.sb{grid-template-columns:1fr;}.sb-stage{aspect-ratio:16/10;}.sb-cta{margin-top:26px;}}
@media (max-width:620px){.sb-lbl{display:none;}}

/* ---------- responsive ---------- */
@media (max-width:1020px){
  .grid-4{grid-template-columns:repeat(2,1fr);}
  .grid-3{grid-template-columns:repeat(2,1fr);}
  .stats{grid-template-columns:repeat(2,1fr);gap:36px 22px;}
  .steps{grid-template-columns:1fr;}
  .split{grid-template-columns:1fr;gap:36px;}
  .footer-grid{grid-template-columns:1fr 1fr;}
}
@media (max-width:760px){
  body{font-size:16px;}
  .section{padding:72px 0;}
  .grid-2,.grid-3,.grid-4{grid-template-columns:1fr;}
  .spec-grid{grid-template-columns:1fr;}
  .form{grid-template-columns:1fr;}
  .nav-links{
    position:fixed;top:76px;left:0;right:0;flex-direction:column;align-items:flex-start;
    background:var(--surface);border-bottom:1px solid var(--line-strong);
    padding:20px 28px 28px;gap:18px;display:none;
  }
  .nav-links.open{display:flex;}
  .nav-menu{position:static;display:block;border:none;box-shadow:none;background:transparent;padding:8px 0 0 14px;min-width:0;}
  .nav-toggle{display:block;}
  .hero{padding:140px 0 64px;min-height:0;}
  .radar{width:480px;height:480px;right:-200px;}
  .footer-grid{grid-template-columns:1fr;gap:36px;}
}

/* ---------- AI detection reel ---------- */
.reel-wrap{margin-top:72px;}
.reel-head{display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;gap:10px;margin-bottom:24px;}
.reel-sub{font-family:var(--mono);font-size:.7rem;letter-spacing:.16em;color:var(--ink-3);text-transform:uppercase;}
.reel{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(0,1fr);gap:22px;align-items:stretch;}
.reel-stage{position:relative;aspect-ratio:16/9;border:1px solid var(--line-strong);border-radius:var(--rad);overflow:hidden;background:#05080F;}
.reel-stage::after{content:"";position:absolute;inset:10px;pointer-events:none;z-index:5;border:1px solid rgba(150,180,255,.35);-webkit-mask:linear-gradient(#000,#000) top left/22px 22px no-repeat,linear-gradient(#000,#000) top right/22px 22px no-repeat,linear-gradient(#000,#000) bottom left/22px 22px no-repeat,linear-gradient(#000,#000) bottom right/22px 22px no-repeat;mask:linear-gradient(#000,#000) top left/22px 22px no-repeat,linear-gradient(#000,#000) top right/22px 22px no-repeat,linear-gradient(#000,#000) bottom left/22px 22px no-repeat,linear-gradient(#000,#000) bottom right/22px 22px no-repeat;}
.reel-scene{position:absolute;inset:0;opacity:0;transition:opacity .6s ease;}
.reel-scene.is-on{opacity:1;}
.reel-scene .ph-fill img{width:100%;height:100%;object-fit:cover;}
.reel-stage .feed-grid,.reel-stage .feed-scan,.reel-stage .feed-hud{z-index:4;}
.det.alert{border-color:#FF3B49;box-shadow:0 0 0 1px rgba(0,0,0,.4),0 0 18px rgba(255,59,73,.45);}
.det.alert .det-lbl{background:#FF3B49;color:#fff;}
.det.volt{border-color:var(--volt);}
.det .det-lbl.lbl-r{left:auto;right:-1px;}
.reel-scene.is-on .det{animation:lockon .55s cubic-bezier(.2,.8,.2,1) both;}
.reel-scene.is-on .det.alert{animation:lockon .55s cubic-bezier(.2,.8,.2,1) both,alertpulse 1.2s ease-in-out .6s infinite;}
@keyframes lockon{from{transform:scale(1.25);}to{transform:scale(1);}}
@keyframes alertpulse{0%,100%{box-shadow:0 0 0 1px rgba(0,0,0,.4),0 0 10px rgba(255,59,73,.3);}50%{box-shadow:0 0 0 1px rgba(0,0,0,.4),0 0 26px rgba(255,59,73,.8);}}
.reel-alert{position:absolute;left:14px;right:14px;bottom:14px;z-index:4;font-family:var(--mono);font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink);background:rgba(6,10,20,.85);border:1px solid rgba(255,59,73,.55);border-left:3px solid #FF3B49;border-radius:3px;padding:9px 12px;}
.reel-alert b{color:#FF6B75;}
.reel-line{position:absolute;inset:0;width:100%;height:100%;z-index:2;pointer-events:none;}
.reel-line line{stroke:#4D8BFF;stroke-width:.6;stroke-dasharray:2 1.4;vector-effect:non-scaling-stroke;stroke-width:2.5;animation:dash 1.2s linear infinite;}
@keyframes dash{to{stroke-dashoffset:-6.8;}}
.reel-line-lbl{position:absolute;left:7%;top:66%;z-index:3;font-family:var(--mono);font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;color:#04070E;background:#4D8BFF;padding:2px 7px;}
.reel-tabs{display:grid;gap:10px;align-content:start;}
.reel-tab{position:relative;overflow:hidden;display:flex;align-items:center;gap:14px;text-align:left;width:100%;cursor:pointer;background:var(--surface);border:1px solid var(--line);border-radius:var(--rad);padding:15px 18px;color:var(--ink-2);font-family:var(--sans);transition:border-color .2s,background .2s;}
.reel-tab:hover{border-color:var(--line-strong);}
.reel-tab.is-on{border-color:var(--blue);background:var(--blue-soft);color:var(--ink);}
.rt-dot{width:9px;height:9px;border-radius:50%;flex:0 0 auto;}
.rt-txt{display:grid;gap:2px;min-width:0;}
.rt-txt b{font-size:1rem;color:var(--ink);font-weight:700;}
.rt-txt span{font-size:.86rem;color:var(--ink-3);}
.rt-bar{position:absolute;left:0;bottom:0;height:2px;width:0;background:var(--blue-hi);}
.reel-tab.is-on .rt-bar{animation:rtfill 4.5s linear forwards;}
.reel.paused .reel-tab.is-on .rt-bar{animation-play-state:paused;}
@keyframes rtfill{to{width:100%;}}
@media (max-width:1020px){.reel{grid-template-columns:1fr;}.reel-tabs{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));}}
@media (max-width:560px){.reel-alert{font-size:.6rem;}.det .det-lbl{font-size:.52rem;}}
@media (prefers-reduced-motion:reduce){.reel-scene.is-on .det,.reel-scene.is-on .det.alert{animation:none;}.reel-line line{animation:none;}.reel-tab.is-on .rt-bar{animation:none;width:100%;}}
.reel-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.reel-line-lbl{left:63%;top:51%;}
.det .det-lbl.lbl-in{top:0;left:0;transform:none;}
.det .det-lbl.lbl-b{top:auto;bottom:-1px;transform:translateY(100%);}
.det.blue{z-index:1;}
.det .det-lbl.lbl-b.lbl-r{left:auto;right:-1px;}
.hero-kicker{display:inline-flex;align-items:center;gap:12px;font-size:clamp(1.1rem,1.8vw,1.4rem);font-weight:600;color:#fff;letter-spacing:-.01em;margin-bottom:12px;text-shadow:0 2px 14px rgba(0,0,0,.7);}.hero-kicker::before{content:"";width:28px;height:3px;background:var(--blue-hi);border-radius:2px;}

/* mobile surveillance platforms + configs */
.plat{display:flex;flex-direction:column;}
.plat-photo{position:relative;overflow:hidden;border-radius:4px;border:1px solid var(--line);aspect-ratio:4/3;margin-bottom:24px;background:#05080F;}
.plat-photo img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease;}
.plat:hover .plat-photo img{transform:scale(1.04);}
.plat-list{list-style:none;display:grid;gap:10px;margin-top:20px;}
.plat-list li{position:relative;padding-left:22px;color:var(--ink-2);font-size:.95rem;}
.plat-list li::before{content:"";position:absolute;left:0;top:9px;width:8px;height:8px;background:var(--blue);clip-path:polygon(0 0,100% 50%,0 100%);}
.cfg-wrap{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:56px;align-items:start;}
.cfg-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:36px;}
.cfg{background:var(--raised);border:1px solid var(--line);border-radius:var(--rad);padding:18px 20px;display:grid;gap:6px;}
.cfg b{font-size:1rem;color:var(--ink);}
.cfg span{font-size:.92rem;color:var(--ink-2);}
.cfg-photos{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.cfg-ph{position:relative;overflow:hidden;border-radius:var(--rad);border:1px solid var(--line-strong);aspect-ratio:3/5;background:#05080F;}
.cfg-ph img{width:100%;height:100%;object-fit:cover;}
.cfg-tag{position:absolute;left:10px;right:10px;bottom:10px;font-family:var(--mono);font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink);background:rgba(6,10,20,.85);border:1px solid var(--line-strong);border-radius:3px;padding:6px 9px;}
@media (max-width:1020px){.cfg-wrap{grid-template-columns:1fr;}.cfg-ph{aspect-ratio:3/4;}}
@media (max-width:560px){.cfg-grid{grid-template-columns:1fr;}}

.founders{position:relative;margin:0;border-radius:var(--rad);overflow:hidden;border:1px solid var(--line-strong);aspect-ratio:4/5;background:#05080F;}
.founders img{width:100%;height:100%;object-fit:cover;object-position:center 18%;}
.founders figcaption{position:absolute;left:14px;right:14px;bottom:14px;display:flex;justify-content:space-between;align-items:baseline;gap:10px;background:rgba(6,10,20,.86);border:1px solid var(--line-strong);border-radius:4px;padding:11px 14px;}
.founders figcaption b{font-size:1rem;color:var(--ink);}
.founders figcaption span{font-family:var(--mono);font-size:.64rem;letter-spacing:.16em;text-transform:uppercase;color:var(--blue-hi);}
.team-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:48px;align-items:end;margin-bottom:40px;}
.team-head .lede{margin-top:0;}
.team-photo{margin:0;border-radius:var(--rad);overflow:hidden;border:1px solid var(--line-strong);aspect-ratio:3/2;}
.team-photo img{width:100%;height:100%;object-fit:cover;}
@media (max-width:1020px){.team-head{grid-template-columns:1fr;gap:16px;}}

.legal{padding-top:150px;}
.legal-wrap{max-width:820px;}
.legal-wrap h1{font-size:clamp(2.2rem,4vw,3.2rem);margin-bottom:28px;}
.legal-wrap h2{font-size:1.4rem;margin:40px 0 10px;}
.legal-wrap h3{font-size:1.05rem;margin:24px 0 6px;color:var(--ink);}
.legal-wrap p{color:var(--ink-2);margin:10px 0;}
.legal-wrap ul{margin:10px 0 10px 20px;display:grid;gap:6px;color:var(--ink-2);}
.legal-wrap b{color:var(--ink);}
.foot-links{display:flex;gap:22px;flex-wrap:wrap;}
.foot-links a{color:var(--ink-3);}
.foot-links a:hover{color:var(--ink);}
.brand-logo{height:58px;width:auto;border-radius:0;}
.footer .brand-logo{height:64px;}
@media (max-width:760px){.brand-logo{height:38px;}}
.hero-lede .hero-run{display:block;color:var(--ink);font-size:1.18em;font-weight:700;letter-spacing:-.005em;margin-bottom:8px;}

.faq-list{display:grid;gap:12px;margin-top:40px;max-width:880px;}
.faq-item{background:var(--surface);border:1px solid var(--line);border-radius:var(--rad);}
.faq-item summary{cursor:pointer;list-style:none;padding:20px 24px;font-weight:700;font-size:1.05rem;color:var(--ink);display:flex;justify-content:space-between;gap:16px;}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-item summary::after{content:"+";color:var(--blue-hi);font-family:var(--mono);font-size:1.2rem;}
.faq-item[open] summary::after{content:"–";}
.faq-item[open]{border-color:var(--blue-deep);}
.faq-item p{padding:0 24px 22px;color:var(--ink-2);margin:0;}
