/* ============================================================
   QUICKINSIGHT — WHITE GROUND / BLACK SYSTEM
   Shared stylesheet for all pages. Tokens only — no raw hex
   inside components. See the design system doc for rules.
   ============================================================ */

:root{
  color-scheme: light;

  /* Ground — strictly neutral, no warmth */
  --white:#FFFFFF;
  --paper:#F3F3F3;
  --paper-2:#E8E8E9;

  /* Black & ink */
  --black:#000000;   /* buttons, blocks, icon wells */
  --ink:#111111;     /* headings + primary copy */
  --ink-2:#5C5C60;
  --ink-3:#8C8C92;
  --line:#E2E2E4;
  --line-2:#C9C9CD;

  /* Accent — data emphasis only */
  --blue:#1B4DFF;
  --blue-deep:#0B33C4;
  --blue-tint:rgba(27,77,255,.08);
  --blue-line:rgba(27,77,255,.28);

  /* Semantic — data only */
  --pos:#0F7A3D;
  --neg:#C0342B;

  /* Type — one family, two cuts */
  --sans:-apple-system,"SF Pro Display",system-ui,"Segoe UI Variable Display",
         "Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --mono:ui-monospace,"SF Mono","IBM Plex Mono",Menlo,Consolas,monospace;

  /* Space */
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:24px;
  --s6:32px; --s7:48px; --s8:64px; --s9:96px; --s10:136px;
  --r-sm:6px; --r:10px; --r-lg:14px; --r-pill:999px;
  --max:1220px;
}

*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{
  margin:0; background:var(--white); color:var(--ink);
  font-family:var(--sans); font-size:1.125rem; line-height:1.6;
  -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
a{color:inherit; text-decoration:none;}
p{margin:0;}
img{max-width:100%; height:auto; display:block;}
:focus-visible{outline:2px solid var(--blue); outline-offset:3px;}

.skip{position:absolute; left:-9999px; top:0; background:var(--black); color:#fff;
      padding:12px 20px; z-index:100;}
.skip:focus{left:0;}

/* ============ PRIMITIVES ============ */
.wrap{max-width:var(--max); margin-inline:auto; padding-inline:clamp(20px,5vw,40px);}
.sec{padding-block:var(--s10);}
.sec-sm{padding-block:var(--s9);}
section[id]{scroll-margin-top:84px;}
.stack{display:flex; flex-direction:column;}
.g2{gap:var(--s2);} .g3{gap:var(--s3);} .g4{gap:var(--s4);} .g5{gap:var(--s5);}
.g6{gap:var(--s6);} .g7{gap:var(--s7);} .g8{gap:var(--s8);} .g9{gap:var(--s9);}

h1,h2,h3,h4{margin:0; font-weight:500; letter-spacing:-.035em; line-height:1.0;
            text-wrap:balance; color:var(--ink);}
.h1{font-size:clamp(2.75rem,6vw,4.75rem);}
.h2{font-size:clamp(2rem,4vw,3.25rem);}
.h3{font-size:1.1875rem; font-weight:600; letter-spacing:-.02em; line-height:1.25;}
.h4{font-size:1rem; font-weight:600; letter-spacing:-.015em;}

.lede{font-size:1.1875rem; line-height:1.58; color:var(--ink-2); max-width:56ch;}
.small{font-size:1rem; line-height:1.6; color:var(--ink-2);}
.tiny{font-size:.875rem; line-height:1.55; color:var(--ink-3);}
.label{font-family:var(--mono); font-size:.6875rem; letter-spacing:.14em;
       text-transform:uppercase; color:var(--ink-3);}
.eyebrow{display:inline-flex; align-items:center; gap:var(--s2); font-family:var(--mono);
         font-size:.6875rem; letter-spacing:.14em; text-transform:uppercase;
         color:var(--ink); font-weight:500;}
.eyebrow::before{content:""; width:22px; height:1px; background:var(--ink);}
.sec-head{display:flex; flex-direction:column; gap:var(--s5); max-width:660px;}
.prose{max-width:68ch; display:flex; flex-direction:column; gap:var(--s5);}
.prose p{font-size:1.0625rem; line-height:1.7; color:var(--ink-2);}
.prose h2{font-size:1.75rem; margin-top:var(--s5);}
.prose h3{font-size:1.1875rem; margin-top:var(--s4);}
.prose ul{margin:0; padding-left:1.2em; display:flex; flex-direction:column;
          gap:var(--s2); color:var(--ink-2); font-size:1.0625rem; line-height:1.7;}

/* ============ BREADCRUMB ============ */
.crumb{display:flex; flex-wrap:wrap; align-items:center; gap:var(--s2);
       font-family:var(--mono); font-size:.6875rem; letter-spacing:.14em;
       text-transform:uppercase; color:var(--ink-3); padding-top:var(--s8);}
.crumb a:hover{color:var(--ink);}
.crumb span[aria-current]{color:var(--ink);}
.crumb .sep{color:var(--line-2);}

/* ============ BUTTONS ============ */
.btn{display:inline-flex; align-items:center; justify-content:center; gap:var(--s2);
     font-size:1rem; font-weight:500; letter-spacing:-.01em; padding:16px 28px;
     border-radius:var(--r-pill); border:1px solid var(--black);
     background:var(--black); color:var(--white); cursor:pointer;
     transition:background .2s ease, color .2s ease, border-color .2s ease;}
.btn:hover{background:var(--white); color:var(--black);}
.btn-ghost{background:transparent; color:var(--ink); border-color:var(--line-2);}
.btn-ghost:hover{background:var(--black); color:var(--white); border-color:var(--black);}
.btn .arw{transition:transform .2s ease;}
.btn:hover .arw{transform:translateX(4px);}

/* ============ NAV ============ */
.nav{position:sticky; top:0; z-index:60; background:rgba(255,255,255,.86);
     backdrop-filter:blur(14px) saturate(160%);
     -webkit-backdrop-filter:blur(14px) saturate(160%);
     border-bottom:1px solid var(--line);}
.nav-in{display:flex; align-items:center; justify-content:space-between;
        gap:var(--s6); height:72px;}
.logo{display:flex; align-items:center; gap:11px;}
.logo-mark{width:28px; height:28px; border-radius:7px; background:var(--black);
           display:grid; place-items:center; flex-shrink:0;}
.logo-mark svg{width:15px; height:15px;}
.logo-txt{display:flex; flex-direction:column; line-height:1;}
.logo-txt b{font-size:1.0625rem; font-weight:600; letter-spacing:-.03em;}
.logo-txt span{font-family:var(--mono); font-size:.5rem; letter-spacing:.18em;
               text-transform:uppercase; color:var(--ink-3); margin-top:4px;}
.nav-links{display:flex; align-items:center; gap:var(--s7);}
.nav-links a{font-size:.9375rem; color:var(--ink-2); font-weight:450;
             transition:color .18s ease;}
.nav-links a:hover, .nav-links a[aria-current]{color:var(--ink);}
.nav-cta{font-size:.875rem; font-weight:500; padding:11px 20px;
         border-radius:var(--r-pill); border:1px solid var(--black);
         background:var(--black); color:var(--white); white-space:nowrap;
         transition:background .2s ease, color .2s ease;}
.nav-cta:hover{background:var(--white); color:var(--black);}

/* ============ HERO ============ */
.hero{padding-block:var(--s9) var(--s9);}
.hero-home{padding-block:var(--s10) var(--s9);}
.hero-in{display:grid; grid-template-columns:minmax(0,1.02fr) minmax(0,1fr);
         gap:var(--s8); align-items:center;}
.pill{display:inline-flex; align-items:center; gap:10px; align-self:flex-start;
      padding:6px 16px 6px 6px; border-radius:var(--r-pill);
      border:1px solid var(--line); background:var(--white);
      font-size:.875rem; color:var(--ink-2);}
.faces{display:flex;}
.face{width:24px; height:24px; border-radius:50%; border:2px solid var(--white);
      display:grid; place-items:center; font-size:.5rem; font-weight:700;
      color:var(--white); margin-right:-9px;}
.face:nth-child(1){background:#1B4DFF;}
.face:nth-child(2){background:#111111;}
.face:nth-child(3){background:#6B6B72;}
.face:last-child{margin-right:3px;}
.hero-actions{display:flex; flex-wrap:wrap; gap:var(--s3); align-items:center;}
.play{display:inline-flex; align-items:center; gap:11px; font-size:1rem;
      font-weight:450; color:var(--ink-2); padding:16px 20px;
      transition:color .18s ease;}
.play:hover{color:var(--ink);}
.play i{width:32px; height:32px; border-radius:50%; border:1px solid var(--line-2);
        display:grid; place-items:center; font-style:normal; font-size:.5625rem;
        padding-left:2px; transition:background .18s ease, border-color .18s ease,
        color .18s ease;}
.play:hover i{background:var(--black); border-color:var(--black); color:var(--white);}

/* ============ DASHBOARD PANEL ============ */
.panel{border:1px solid var(--line); border-radius:var(--r-lg); background:var(--white);
       box-shadow:0 1px 2px rgba(0,0,0,.04), 0 24px 48px -32px rgba(0,0,0,.28);
       overflow:hidden;}
.panel-bar{display:flex; align-items:center; gap:var(--s3); padding:13px var(--s5);
           border-bottom:1px solid var(--line); background:var(--paper);}
.dots{display:flex; gap:6px;}
.dots i{width:9px; height:9px; border-radius:50%; background:var(--line-2);}
.panel-title{font-family:var(--mono); font-size:.6875rem; letter-spacing:.1em;
             text-transform:uppercase; color:var(--ink-3);}
.panel-body{padding:var(--s6) var(--s5) var(--s5);}
.kpi{display:flex; align-items:flex-start; justify-content:space-between;
     gap:var(--s4); margin-bottom:var(--s5);}
.kpi-val{font-size:3rem; font-weight:500; letter-spacing:-.045em; line-height:1;
         margin-top:10px; font-variant-numeric:tabular-nums;}
.chip{display:inline-flex; align-items:center; gap:5px; padding:5px 11px;
      border-radius:var(--r-pill); font-size:.75rem; font-weight:600;
      background:rgba(15,122,61,.08); color:var(--pos);
      border:1px solid rgba(15,122,61,.22);}
.chart{width:100%; height:auto; display:block; margin-bottom:var(--s5);}
.panel-rows{display:flex; flex-direction:column; gap:1px; background:var(--line);
            border:1px solid var(--line); border-radius:var(--r); overflow:hidden;}
.prow{display:flex; align-items:center; justify-content:space-between; gap:var(--s4);
      padding:14px var(--s4); background:var(--white); font-size:.9375rem;}
.prow span:first-child{color:var(--ink-2);}
.prow span:last-child{font-family:var(--mono); font-variant-numeric:tabular-nums;
                      color:var(--ink); font-weight:600;}

/* ============ STATS ============ */
.stats{display:grid; grid-template-columns:repeat(3,minmax(0,1fr));
       border-top:1px solid var(--ink); border-bottom:1px solid var(--line);}
.stats-4{grid-template-columns:repeat(4,minmax(0,1fr));}
.stat{padding:var(--s8) var(--s6) var(--s8) 0; display:flex;
      flex-direction:column; gap:var(--s3);}
.stat + .stat{border-left:1px solid var(--line); padding-left:var(--s6);}
.stat b{font-size:clamp(2.25rem,4vw,3.25rem); font-weight:500; letter-spacing:-.045em;
        line-height:1; font-variant-numeric:tabular-nums;}

/* ============ CARDS ============ */
.cards{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--s4);}
.cards-2{grid-template-columns:repeat(2,minmax(0,1fr));}
.card{border:1px solid var(--line); border-radius:var(--r-lg); background:var(--white);
      padding:var(--s7) var(--s6); display:flex; flex-direction:column; gap:var(--s3);
      transition:border-color .22s ease, background .22s ease;}
.card:hover{border-color:var(--ink); background:var(--paper);}
.card.span2{grid-column:span 2;}
.icon{width:42px; height:42px; border-radius:10px; display:grid; place-items:center;
      background:var(--black); margin-bottom:var(--s3); flex-shrink:0;}
.icon svg{width:19px; height:19px; stroke:var(--white); fill:none; stroke-width:1.6;
          stroke-linecap:round; stroke-linejoin:round;}
.steps{display:flex; flex-wrap:wrap; gap:var(--s2); margin-top:var(--s3);}
.tag{display:inline-flex; align-items:center; gap:8px; padding:8px 15px;
     border-radius:var(--r-pill); border:1px solid var(--line);
     background:var(--paper); font-size:.875rem; color:var(--ink-2);}
.tag b{font-family:var(--mono); font-size:.6875rem; color:var(--blue); font-weight:600;}
.roas{margin-top:auto; padding-top:var(--s5); font-size:2.5rem; font-weight:500;
      letter-spacing:-.045em; line-height:1; color:var(--blue);
      font-variant-numeric:tabular-nums;}
.ticks{list-style:none; margin:0; padding:0; display:flex; flex-direction:column;
       gap:var(--s3);}
.ticks li{display:grid; grid-template-columns:18px 1fr; gap:var(--s3);
          font-size:.9375rem; line-height:1.5; color:var(--ink-2);}
.ticks li::before{content:"→"; font-family:var(--mono); font-size:.8125rem;
                  color:var(--blue); line-height:1.6;}

/* ============ BLACK BLOCK ============ */
.block-black{background:var(--black); color:var(--white); padding-block:var(--s10);}
.block-black h1,.block-black h2,.block-black h3,.block-black h4{color:var(--white);}
.block-black .lede{color:rgba(255,255,255,.66);}
.block-black .small{color:rgba(255,255,255,.62);}
.block-black .tiny{color:rgba(255,255,255,.5);}
.block-black .eyebrow{color:var(--white);}
.block-black .eyebrow::before{background:var(--white);}
.block-black .card{background:transparent; border-color:rgba(255,255,255,.16);}
.block-black .card:hover{background:rgba(255,255,255,.05);
                         border-color:rgba(255,255,255,.4);}
.block-black .icon{background:var(--white);}
.block-black .icon svg{stroke:var(--black);}
.block-black .btn{background:var(--white); border-color:var(--white); color:var(--black);}
.block-black .btn:hover{background:transparent; color:var(--white);}
.block-black .ticks li{color:rgba(255,255,255,.62);}
.block-black .ticks li::before{color:var(--white);}

/* ============ PIPELINE ============ */
.pipe{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:var(--s5);}
.phase{display:flex; flex-direction:column; gap:var(--s3);
       border-top:1px solid rgba(255,255,255,.22); padding-top:var(--s5);}
.phase-n{font-family:var(--mono); font-size:.6875rem; letter-spacing:.14em;
         text-transform:uppercase; color:rgba(255,255,255,.55);}
.phase-light{border-top-color:var(--line);}
.phase-light .phase-n{color:var(--ink-3);}

/* ============ TABLE ============ */
.table-scroll{overflow-x:auto; border:1px solid var(--line); border-radius:var(--r-lg);}
table{border-collapse:collapse; width:100%; min-width:620px; background:var(--white);}
th,td{text-align:left; padding:var(--s5); border-bottom:1px solid var(--line);
      font-size:1rem; vertical-align:middle;}
thead th{font-family:var(--mono); font-size:.6875rem; letter-spacing:.14em;
         text-transform:uppercase; color:var(--ink-3); font-weight:400;
         background:var(--paper);}
thead th:last-child{color:var(--white); background:var(--black);
                    border-left:1px solid var(--black);}
tbody th{font-weight:600; color:var(--ink);}
tbody td{color:var(--ink-2);}
tbody td:last-child{color:var(--ink); font-weight:600; background:var(--blue-tint);
                    border-left:1px solid var(--blue-line);}
tbody tr:last-child th, tbody tr:last-child td{border-bottom:0;}

/* ============ PROOF / METERS ============ */
.proof{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--s7);}
.proof-card{border-top:1px solid var(--ink); padding-top:var(--s6);
            display:flex; flex-direction:column; gap:var(--s4);}
.proof-val{font-size:clamp(3.25rem,6vw,5rem); font-weight:500; letter-spacing:-.05em;
           line-height:1; font-variant-numeric:tabular-nums;}
.meter{display:flex; flex-direction:column; gap:var(--s5); margin-top:var(--s3);}
.meter-row{display:flex; flex-direction:column; gap:9px;}
.meter-head{display:flex; justify-content:space-between; align-items:baseline;
            gap:var(--s4);}
.meter-head .v{font-family:var(--mono); font-size:.9375rem; font-weight:600;
               font-variant-numeric:tabular-nums; color:var(--ink);}
.track{height:6px; background:var(--paper-2); overflow:hidden;}
.fill{height:100%; background:var(--line-2);
      transition:width .9s cubic-bezier(.2,.7,.3,1);}
.fill.is-black{background:var(--black);}

/* ============ PRICING ============ */
.plans{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--s4);
       align-items:start;}
.plan{border:1px solid var(--line); border-radius:var(--r-lg); padding:var(--s7) var(--s6);
      display:flex; flex-direction:column; gap:var(--s5); background:var(--white);}
.plan.featured{background:var(--black); border-color:var(--black); color:var(--white);}
.plan.featured h3,.plan.featured .price{color:var(--white);}
.plan.featured .small,.plan.featured .ticks li{color:rgba(255,255,255,.66);}
.plan.featured .ticks li::before{color:var(--white);}
.plan.featured .btn{background:var(--white); border-color:var(--white); color:var(--black);}
.plan.featured .btn:hover{background:transparent; color:var(--white);}
.plan.featured .label{color:rgba(255,255,255,.6);}
.price{font-size:2.75rem; font-weight:500; letter-spacing:-.045em; line-height:1;
       font-variant-numeric:tabular-nums;}
.price small{font-size:.9375rem; font-weight:400; color:var(--ink-3);
             letter-spacing:0; margin-left:6px;}
.plan.featured .price small{color:rgba(255,255,255,.6);}
.plan .btn{margin-top:auto;}

/* ============ FORM ============ */
.form{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--s5);
      border:1px solid var(--line); border-radius:var(--r-lg); padding:var(--s7) var(--s6);}
.field{display:flex; flex-direction:column; gap:var(--s2);}
.field.full{grid-column:1 / -1;}
.field label{font-size:.875rem; font-weight:600; color:var(--ink);}
.field .req{color:var(--blue);}
.field input,.field textarea{font-family:var(--sans); font-size:1rem; color:var(--ink);
      padding:14px 16px; border:1px solid var(--line-2); border-radius:var(--r-sm);
      background:var(--white); transition:border-color .18s ease;}
.field input:focus,.field textarea:focus{border-color:var(--black); outline:none;}
.field textarea{min-height:132px; resize:vertical;}
.field input[aria-invalid="true"],.field textarea[aria-invalid="true"]{border-color:var(--neg);}
.field .err{font-size:.875rem; color:var(--neg); font-weight:500;}
.field .btn{align-self:flex-start;}

/* Honeypot — hidden from people, not from bots. Must not use display:none,
   which some bots detect and skip. */
.hp{position:absolute; left:-9999px; top:auto; width:1px; height:1px;
    overflow:hidden;}

.alert{border:1px solid var(--line); border-left:3px solid var(--ink);
       border-radius:var(--r); padding:var(--s5) var(--s5);
       display:flex; flex-direction:column; gap:var(--s2);}
.alert strong{font-size:1rem; font-weight:600; color:var(--ink);}
.alert p{font-size:.9375rem; line-height:1.6; color:var(--ink-2);}
.alert a{text-decoration:underline;}
.alert-bad{border-left-color:var(--neg); background:rgba(192,52,43,.04);}
.alert-good{border-left-color:var(--pos); background:rgba(15,122,61,.04);}
.contact-grid{display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);
              gap:var(--s8);}
.contact-list{list-style:none; margin:0; padding:0; display:flex;
              flex-direction:column; gap:var(--s5);}
.contact-list li{display:flex; flex-direction:column; gap:var(--s1);
                 border-top:1px solid var(--line); padding-top:var(--s4);}
.contact-list a{font-size:1.0625rem; font-weight:500;}
.contact-list a:hover{color:var(--blue);}

/* ============ ARTICLES ============ */
.posts{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--s4);}
.post{border:1px solid var(--line); border-radius:var(--r-lg); background:var(--white);
      padding:var(--s6); display:flex; flex-direction:column; gap:var(--s4);
      transition:border-color .22s ease, background .22s ease;}
.post:hover{border-color:var(--ink); background:var(--paper);}
.post-meta{display:flex; justify-content:space-between; align-items:center;
           gap:var(--s3); margin-top:auto; padding-top:var(--s4);
           border-top:1px solid var(--line);}

/* ============ ARTICLE ============ */
.byline-row{display:flex; align-items:center; gap:13px; flex-wrap:wrap;
            border-top:1px solid var(--line); padding-top:var(--s5); margin-top:var(--s3);}
.article-body{padding-bottom:var(--s9);}
.article-body .prose{max-width:68ch;}
.prose a{color:var(--blue); text-decoration:underline; text-underline-offset:3px;}
.prose a:hover{color:var(--ink);}
.prose ol{margin:0; padding-left:1.3em; display:flex; flex-direction:column;
          gap:var(--s3); color:var(--ink-2); font-size:1.0625rem; line-height:1.7;}
.prose li strong,.prose p strong{color:var(--ink); font-weight:600;}
.prose h2{font-size:clamp(1.5rem,2.6vw,2rem); margin-top:var(--s6); line-height:1.1;}
.prose h3{font-size:1.25rem; margin-top:var(--s5); line-height:1.2;}
.prose em{font-style:italic;}
.post h3 a{display:block;}
.post h3 a:hover{color:var(--blue);}

/* ============ TESTIMONIALS ============ */
.quotes{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--s4);}
.quote{border:1px solid var(--line); border-radius:var(--r-lg); background:var(--white);
       padding:var(--s7) var(--s6); display:flex; flex-direction:column; gap:var(--s5);
       transition:border-color .22s ease;}
.quote:hover{border-color:var(--ink);}
blockquote{margin:0; font-size:1.125rem; line-height:1.5; letter-spacing:-.015em;
           color:var(--ink);}
.by{display:flex; align-items:center; gap:13px; margin-top:auto; padding-top:var(--s5);
    border-top:1px solid var(--line);}
.av{width:40px; height:40px; border-radius:50%; display:grid; place-items:center;
    font-size:.75rem; font-weight:700; color:var(--white); flex-shrink:0;}
.by-txt{display:flex; flex-direction:column; line-height:1.35;}
.by-txt b{font-size:.9375rem; font-weight:600;}
.by-txt span{font-size:.875rem; color:var(--ink-3);}

/* ============ FAQ ============ */
.faq{border-top:1px solid var(--ink);}
details{border-bottom:1px solid var(--line);}
summary{list-style:none; cursor:pointer; padding:var(--s6) 0;
        display:flex; justify-content:space-between; align-items:center; gap:var(--s5);
        font-size:1.25rem; font-weight:500; letter-spacing:-.025em; line-height:1.3;
        transition:color .18s ease;}
summary::-webkit-details-marker{display:none;}
summary:hover{color:var(--blue);}
.sig{width:30px; height:30px; border-radius:50%; flex-shrink:0; display:grid;
     place-items:center; border:1px solid var(--line-2); font-size:1rem; line-height:1;
     transition:transform .22s ease, background .22s ease, color .22s ease,
                border-color .22s ease;}
details[open] .sig{transform:rotate(45deg); background:var(--black);
                   border-color:var(--black); color:var(--white);}
.answer{padding-bottom:var(--s6); max-width:68ch;}

/* ============ CTA ============ */
.cta-in{display:flex; flex-direction:column; align-items:center; gap:var(--s5);
        text-align:center;}
.cta-in .lede{text-align:center; max-width:48ch;}

/* ============ FOOTER ============ */
.foot{background:var(--black); color:var(--white); padding-block:var(--s9) var(--s6);}
.foot-grid{display:grid; grid-template-columns:1.7fr repeat(3,1fr);
           gap:var(--s8) var(--s5);}
.foot h4{font-size:.9375rem; font-weight:600; color:var(--white);
         margin-bottom:var(--s5);}
.foot ul{list-style:none; margin:0; padding:0; display:flex;
         flex-direction:column; gap:var(--s3);}
.foot a{font-size:.9375rem; color:rgba(255,255,255,.62); transition:color .18s ease;}
.foot a:hover{color:var(--white);}
.foot .logo-txt b{color:#fff;}
.foot .logo-txt span{color:rgba(255,255,255,.5);}
.foot .logo-mark{background:var(--white);}
.foot .small{color:rgba(255,255,255,.62);}
.foot address{font-style:normal;}
.colophon{display:flex; justify-content:space-between; flex-wrap:wrap; gap:var(--s4);
          border-top:1px solid rgba(255,255,255,.16); margin-top:var(--s8);
          padding-top:var(--s5); font-size:.875rem; color:rgba(255,255,255,.5);}
.colophon a{color:rgba(255,255,255,.5);}
.colophon a:hover{color:var(--white);}

/* ============ MOTION ============
   Reveal is scoped to .js with a script-side timeout fallback, so
   content is never invisible if scripting fails. */
.js .rise{opacity:0; transform:translateY(16px);
          transition:opacity .6s ease, transform .6s cubic-bezier(.2,.7,.3,1);}
.js .rise.is-in{opacity:1; transform:none;}
.fill{width:var(--w);}
.js .fill{width:0;}
.js .is-in .fill{width:var(--w);}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition-duration:.001ms !important;
                       animation-duration:.001ms !important;}
  .js .rise{opacity:1; transform:none;}
  .js .fill{width:var(--w);}
}

/* ============ RESPONSIVE ============ */
@media (max-width:1040px){
  .hero-in{grid-template-columns:1fr;}
  .cards, .posts, .plans{grid-template-columns:repeat(2,minmax(0,1fr));}
  .pipe{grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--s7) var(--s5);}
  .quotes{grid-template-columns:1fr;}
  .contact-grid{grid-template-columns:1fr; gap:var(--s7);}
  .nav-links{display:none;}
  .foot-grid{grid-template-columns:1fr 1fr;}
  .stats-4{grid-template-columns:repeat(2,minmax(0,1fr));}
  .stats-4 .stat:nth-child(3){border-left:0;}
}
@media (max-width:720px){
  .sec, .block-black{padding-block:var(--s9);}
  .hero, .hero-home{padding-block:var(--s8) var(--s7);}
  .stats, .stats-4{grid-template-columns:1fr;}
  .stat{padding:var(--s6) 0;}
  .stat + .stat{border-left:0; border-top:1px solid var(--line); padding-left:0;}
  .stats-4 .stat:nth-child(3){border-left:0;}
  .cards, .posts, .plans{grid-template-columns:1fr;}
  .card.span2{grid-column:span 1;}
  .pipe{grid-template-columns:1fr;}
  .proof{grid-template-columns:1fr; gap:var(--s8);}
  .form{grid-template-columns:1fr; padding:var(--s6) var(--s5);}
  .foot-grid{grid-template-columns:1fr;}
  .hero-actions{flex-direction:column; align-items:stretch;}
  .hero-actions .btn{width:100%;}
  .play{justify-content:center;}
  summary{font-size:1.0625rem;}
}