/* site.css — shared styles for the Centinela marketing site */
:root{
  --bg:#070d16; --bg2:#0A1422; --surface:#0F1E30; --surface2:#13263c;
  --border:rgba(255,255,255,.08);
  --brand:#1A5FD4; --bright:#2E8BFF; --ink:#e8eefc; --sub:#90a6cc; --dim:#5f7cab;
  --red:#E53935; --amber:#F59E0B; --ok:#27AE60; --pur:#A855F7; --vio:#FF6B3D;
  --accent:#2E8BFF;
  --maxw:1180px;
}
*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{ margin:0; background:var(--bg); color:var(--ink); font-family:"Barlow",sans-serif; -webkit-font-smoothing:antialiased; overflow-x:hidden; }
a{ color:inherit; text-decoration:none; }
::selection{ background:rgba(46,139,255,.4); }
::-webkit-scrollbar{ width:11px; } ::-webkit-scrollbar-thumb{ background:rgba(255,255,255,.1); border-radius:8px; border:3px solid transparent; background-clip:padding-box; }
.mono{ font-family:"JetBrains Mono",monospace; font-variant-numeric:tabular-nums; }
.head{ font-family:"Barlow Condensed",sans-serif; }
.wrap{ max-width:var(--maxw); margin:0 auto; padding:0 24px; }

/* ambient grid backdrop */
.gridbg{ position:fixed; inset:0; z-index:0; pointer-events:none;
  background-image:
    radial-gradient(1100px 700px at 78% -6%, rgba(26,95,212,.18), transparent 60%),
    radial-gradient(900px 600px at -6% 50%, rgba(26,95,212,.1), transparent 55%),
    linear-gradient(rgba(255,255,255,.018) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.018) 1px, transparent 1px);
  background-size:100% 100%,100% 100%,52px 52px,52px 52px; }

/* nav */
.nav{ position:fixed; top:0; left:0; right:0; z-index:50; height:68px; display:flex; align-items:center;
  border-bottom:1px solid transparent; transition:.3s; }
.nav.solid{ background:rgba(8,14,22,.82); backdrop-filter:blur(16px); border-color:var(--border); }
.nav .wrap{ display:flex; align-items:center; width:100%; gap:28px; }
.brand{ display:flex; align-items:center; gap:10px; }
.brand .logo-ic{ width:34px; height:34px; border-radius:10px; display:block; box-shadow:0 8px 22px -8px rgba(26,95,212,.7); }
.brand .logo-wm{ height:19px; display:block; }
.brand .ic svg{ width:19px; height:19px; }
.brand b{ font-family:"Barlow Condensed",sans-serif; font-weight:800; letter-spacing:.16em; font-size:19px; }
.navlinks{ display:flex; gap:26px; margin-left:auto; }
.navlinks a{ font-size:14.5px; color:var(--sub); transition:.2s; position:relative; }
.navlinks a:hover{ color:var(--ink); }
.navcta{ display:flex; align-items:center; gap:12px; }
.btn{ font-family:"Barlow Condensed",sans-serif; font-weight:700; text-transform:uppercase; letter-spacing:.06em; font-size:14px; border:none; border-radius:11px; padding:11px 18px; cursor:pointer; display:inline-flex; align-items:center; gap:8px; transition:.2s; }
.btn svg{ width:16px; height:16px; }
.btn.primary{ color:#fff; background:linear-gradient(180deg,var(--bright),var(--brand)); box-shadow:0 10px 26px -10px rgba(26,95,212,.8), inset 0 1px 0 rgba(255,255,255,.3); }
.btn.primary:hover{ filter:brightness(1.1); transform:translateY(-1px); }
.btn.ghost{ color:var(--ink); background:rgba(255,255,255,.05); border:1px solid var(--border); }
.btn.ghost:hover{ background:rgba(255,255,255,.1); }
.btn.lg{ padding:15px 26px; font-size:17px; border-radius:13px; }

/* sections */
section{ position:relative; z-index:1; }
.sec{ padding:96px 0; }
.eyebrow{ font-family:"JetBrains Mono",monospace; font-size:12px; letter-spacing:.24em; text-transform:uppercase; color:var(--bright); display:inline-flex; align-items:center; gap:9px; }
.eyebrow::before{ content:""; width:26px; height:1px; background:var(--bright); }
.h2{ font-family:"Barlow Condensed",sans-serif; font-weight:800; text-transform:uppercase; letter-spacing:.01em; font-size:clamp(34px,5vw,56px); line-height:1.02; margin:16px 0 0; }
.lead{ color:var(--sub); font-size:18px; line-height:1.6; max-width:620px; margin:18px 0 0; }

/* reveal on scroll */
.reveal{ opacity:0; transform:translateY(28px); transition:opacity .7s cubic-bezier(.2,.7,.2,1), transform .7s cubic-bezier(.2,.7,.2,1); }
.reveal.in{ opacity:1; transform:none; }
.reveal.d1{ transition-delay:.08s; } .reveal.d2{ transition-delay:.16s; } .reveal.d3{ transition-delay:.24s; } .reveal.d4{ transition-delay:.32s; }
@media (prefers-reduced-motion: reduce){ .reveal{ opacity:1; transform:none; transition:none; } html{ scroll-behavior:auto; } }

/* cards */
.glass{ background:linear-gradient(180deg, rgba(19,38,60,.6), rgba(15,30,48,.6)); border:1px solid var(--border); backdrop-filter:blur(10px); border-radius:18px; }

/* footer */
footer{ position:relative; z-index:1; border-top:1px solid var(--border); padding:64px 0 40px; margin-top:40px; background:rgba(8,14,22,.6); }
.foot-grid{ display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr; gap:40px; }
.foot-grid h4{ font-family:"JetBrains Mono",monospace; font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:var(--dim); margin:0 0 16px; }
.foot-grid a{ display:block; color:var(--sub); font-size:14px; margin-bottom:11px; transition:.2s; }
.foot-grid a.brand{ display:flex; margin-bottom:16px; }
.foot-grid a:hover{ color:var(--ink); }
.foot-bottom{ display:flex; align-items:center; justify-content:space-between; margin-top:48px; padding-top:24px; border-top:1px solid var(--border); color:var(--dim); font-size:13px; flex-wrap:wrap; gap:12px; }

/* legal pages */
.legal{ position:relative; z-index:1; max-width:820px; margin:0 auto; padding:128px 24px 80px; }
.legal h1{ font-family:"Barlow Condensed",sans-serif; font-weight:800; text-transform:uppercase; letter-spacing:.02em; font-size:clamp(36px,6vw,56px); margin:0 0 8px; }
.legal .updated{ font-family:"JetBrains Mono",monospace; font-size:12px; color:var(--dim); letter-spacing:.06em; margin-bottom:14px; }
.legal .intro{ color:var(--sub); font-size:17px; line-height:1.65; padding:18px 0 6px; border-top:1px solid var(--border); margin-top:18px; }
.legal h2{ font-family:"Barlow Condensed",sans-serif; font-weight:700; text-transform:uppercase; letter-spacing:.03em; font-size:24px; margin:40px 0 12px; color:var(--ink); display:flex; align-items:baseline; gap:11px; }
.legal h2 .n{ font-family:"JetBrains Mono",monospace; font-size:14px; color:var(--bright); }
.legal h3{ font-size:18px; font-weight:700; margin:22px 0 8px; color:#cfe0f5; }
.legal p, .legal li{ color:#aebfd9; font-size:15.5px; line-height:1.7; }
.legal ul{ padding-left:20px; } .legal li{ margin-bottom:7px; }
.legal a.inl{ color:var(--bright); } .legal a.inl:hover{ text-decoration:underline; }
.legal .box{ border-radius:14px; padding:18px 20px; margin:18px 0; }
.legal .box.blue{ background:rgba(26,95,212,.1); border:1px solid rgba(46,139,255,.28); }
.legal .box.amber{ background:rgba(245,158,11,.08); border:1px solid rgba(245,158,11,.28); }
.legal .toc{ position:sticky; }
.backhome{ display:inline-flex; align-items:center; gap:8px; font-family:"JetBrains Mono",monospace; font-size:12px; letter-spacing:.08em; text-transform:uppercase; color:var(--bright); margin-bottom:26px; }
.backhome svg{ width:14px; height:14px; }

@media (max-width:820px){
  .navlinks{ display:none; }
  .foot-grid{ grid-template-columns:1fr 1fr; gap:30px; }
  .sec{ padding:68px 0; }
}
