/* ============================================================
   CAIOS × Steep — editorial redesign mockup
   Serif analytics on warm paper. Light theme.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Source+Serif+4:ital,opsz,wght@0,8..60,400;1,8..60,400&family=Inter:wght@400,430,450,480,500&display=swap');

:root{
  /* Colors */
  --ink:#17191c;
  --paper:#ffffff;
  --mist:#f2f2f3;
  --fog:#fafafb;
  --slate:#777b86;
  --ash:#979799;
  --smoke:#a3a6af;
  --peach:#fbe1d1;
  --sienna:#5d2a1a;
  --hairline:#ececec;

  /* Type */
  --serif:'Source Serif 4', 'GT Sectra', 'Tiempos Headline', ui-serif, Georgia, serif;
  --sans:'Inter', 'Sohne', ui-sans-serif, system-ui, -apple-system, sans-serif;

  /* Layout */
  --max:1200px;
  --gap:80px;

  /* Radius */
  --r-card:24px;
  --r-elev:20px;
  --r-img:12px;
  --r-input:16px;
  --r-sm:16px;

  /* Shadow */
  --shadow-art:0 0 0 1px rgba(4,23,43,.05), 0 20px 25px -5px rgba(0,0,0,.10), 0 8px 10px -6px rgba(0,0,0,.10);
  --shadow-pop:oklab(0 0 0 / .05) 0 0 0 1px, rgba(0,0,0,.08) 0 4px 24px 0;
}

*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
html,body{overflow-x:hidden;max-width:100%}
body{
  font-family:var(--sans);
  color:var(--ink);
  background:var(--paper);
  font-size:17px;
  line-height:1.5;
  font-weight:400;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}

.container{max-width:var(--max);margin:0 auto;padding:0 32px}

/* ---------- Typography ---------- */
h1,h2,h3{font-family:var(--serif);font-weight:400;color:var(--ink)}
h1{font-size:clamp(44px,6.4vw,90px);line-height:1.08;letter-spacing:-.025em}
h2{font-size:clamp(34px,4.6vw,64px);line-height:1.12;letter-spacing:-.018em}
h3{font-size:clamp(24px,2.4vw,30px);line-height:1.18;letter-spacing:-.012em}
h1 em, h2 em{font-style:italic}
.eyebrow{
  font-family:var(--sans);font-size:14px;font-weight:450;letter-spacing:.02em;
  color:var(--ash);text-transform:none;display:inline-block;margin-bottom:20px;
}
.lede{font-size:20px;line-height:1.45;color:var(--slate);font-weight:400}
.muted{color:var(--slate)}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex;align-items:center;gap:9px;
  font-family:var(--sans);font-size:16px;font-weight:450;
  border-radius:9999px;padding:13px 24px;cursor:pointer;border:1px solid transparent;
  transition:transform .15s ease, background .15s ease, color .15s ease;
  white-space:nowrap;
}
.btn svg{width:18px;height:18px}
.btn-primary{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.btn-primary:hover{transform:translateY(-1px);background:#000}
.btn-ghost{background:transparent;color:var(--ink);border-color:var(--ink)}
.btn-ghost:hover{background:var(--ink);color:var(--paper)}
.btn-lg{font-size:17px;padding:16px 28px}
.btn-sm{font-size:15px;padding:9px 18px}

.arrow-link{
  display:inline-flex;align-items:center;gap:8px;font-size:16px;font-weight:450;color:var(--ink);
}
.arrow-link svg{width:17px;height:17px;transition:transform .15s ease}
.arrow-link:hover{text-decoration:underline;text-underline-offset:4px}
.arrow-link:hover svg{transform:translateX(3px)}

/* ---------- Nav ---------- */
.nav{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.72);backdrop-filter:saturate(180%) blur(14px);}
.nav-inner{display:flex;align-items:center;justify-content:space-between;height:74px}
.brand{display:flex;align-items:center;gap:10px;font-family:var(--sans);font-size:20px;font-weight:500;letter-spacing:-.01em}
.brand img{width:26px;height:26px;border-radius:7px}
.brand b{font-weight:500}
.nav-links{display:flex;align-items:center;gap:30px}
.nav-links a{font-size:16px;font-weight:430;color:var(--ink);padding:2px 0;position:relative}
.nav-links a:hover{color:var(--slate)}
.nav-actions{display:flex;align-items:center;gap:14px}
.nav-toggle{display:none;background:none;border:0;color:var(--ink);cursor:pointer}
.nav-toggle svg{width:26px;height:26px}

/* ---------- Mega menu ---------- */
.nav-item{position:relative}
.nav-trigger{display:inline-flex;align-items:center;gap:5px;font-size:16px;font-weight:430;color:var(--ink);cursor:pointer}
.nav-trigger:hover{color:var(--slate)}
.chev{width:15px;height:15px;transition:transform .2s ease}
.has-mega:hover .chev{transform:rotate(180deg)}
.mega{
  position:absolute;top:100%;left:50%;transform:translateX(-50%) translateY(8px);
  width:min(760px,92vw);opacity:0;visibility:hidden;pointer-events:none;
  transition:opacity .18s ease, transform .18s ease;padding-top:14px;z-index:60;
}
.has-mega:hover .mega,.has-mega:focus-within .mega{opacity:1;visibility:visible;pointer-events:auto;transform:translateX(-50%) translateY(0)}
.mega-inner{background:var(--paper);border:1px solid var(--hairline);border-radius:var(--r-card);box-shadow:var(--shadow-pop);padding:14px}
.mega-head{display:flex;gap:14px;align-items:center;padding:16px;border-radius:16px;background:var(--fog);margin-bottom:8px}
.mega-head img{width:34px;height:34px;border-radius:9px}
.mega-head strong{display:block;font-family:var(--sans);font-size:16px;font-weight:500;color:var(--ink)}
.mega-head span span{display:block;font-size:14px;color:var(--slate);margin-top:2px;font-weight:400}
.mega-grid{display:grid;grid-template-columns:1fr 1fr;gap:4px}
.mega-card{display:flex;gap:13px;align-items:flex-start;padding:14px 16px;border-radius:14px;transition:background .15s ease}
.mega-card:hover{background:var(--mist)}
.mega-card img{width:30px;height:30px;border-radius:8px;flex:none;margin-top:1px}
.mega-card strong{display:block;font-family:var(--sans);font-size:15px;font-weight:500;color:var(--ink)}
.mega-card strong em{font-style:normal;font-weight:400;color:var(--ash);font-size:13px;margin-left:6px}
.mega-card span span{display:block;font-size:13px;color:var(--slate);margin-top:3px;line-height:1.4;font-weight:400}

/* ---------- Sections ---------- */
.section{padding:var(--gap) 0}
.section-fog{background:var(--fog)}
.section-head{max-width:760px;margin-bottom:56px}
.section-head.center{margin-left:auto;margin-right:auto;text-align:center}
.section-head h2{margin-bottom:20px}
.section-head p{font-size:19px;color:var(--slate);line-height:1.5}
.divider{border:0;border-top:1px solid var(--hairline);margin:0}

/* ---------- Hero ---------- */
.hero{padding:72px 0 40px;position:relative;overflow:hidden}
.hero-inner{text-align:center;max-width:900px;margin:0 auto}
.badge{
  display:inline-flex;align-items:center;gap:9px;font-size:14px;font-weight:450;color:var(--slate);
  background:var(--mist);border-radius:9999px;padding:8px 16px;margin-bottom:30px;
}
.badge .dot{width:7px;height:7px;border-radius:9999px;background:var(--sienna);display:inline-block}
.hero h1{margin-bottom:26px}
.hero .lede{max-width:720px;margin:0 auto 34px}
.hero-cta{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-bottom:22px}
.hero-note{font-size:15px;color:var(--ash)}

/* Hero artifact collage */
.hero-stage{position:relative;margin:64px auto 0;max-width:1120px}
.artifact{
  background:var(--paper);border-radius:var(--r-elev);box-shadow:var(--shadow-art);
  overflow:hidden;
}
.artifact-bar{
  display:flex;align-items:center;gap:7px;padding:13px 18px;border-bottom:1px solid var(--hairline);
  background:var(--paper);
}
.artifact-bar i{width:11px;height:11px;border-radius:9999px;background:#e2e2e4;display:block}
.artifact-bar i:nth-child(1){background:#f0c3b3}
.artifact-bar .cap{margin-left:10px;font-size:13px;color:var(--smoke);font-weight:450}
.artifact-shot{display:block;width:100%}
.hero-stage .artifact-shot{max-height:640px;object-fit:cover;object-position:top}

/* ---------- Steep bleed collage ---------- */
.bleed{position:relative;left:50%;right:50%;margin-left:-50vw;margin-right:-50vw;width:100vw;overflow:hidden}
.collage{position:relative;width:100%;max-width:1560px;margin:0 auto}
.c-main,.c-frag{position:absolute;border-radius:14px;box-shadow:var(--shadow-art);display:block}
.c-main{overflow:hidden}
.c-frag{overflow:hidden;z-index:3}

/* staggered entrance for collage layers */
.anim{opacity:0;transform:translate(var(--tx,0),var(--ty,44px)) scale(var(--sc,.98));
  transition:opacity .95s cubic-bezier(.16,.7,.2,1), transform 1.05s cubic-bezier(.16,.7,.2,1);
  transition-delay:var(--d,0s);will-change:transform,opacity}
.anim.in{opacity:1;transform:translate(0,0) scale(1)}
/* gentle scroll drift once revealed — uses the independent `translate` property so it never fights the entrance `transform` */
.par{translate:0 0;transition:translate .55s cubic-bezier(.16,.7,.2,1)}
@media(prefers-reduced-motion:reduce){.anim{transition-duration:.01ms}.par{transition:none}}
/* ---------- Scroll-assembly: cards fall into an empty pane ---------- */
.assembly-wrap{position:relative;height:120vh}          /* short pin: fills in the first stretch, then releases */
.assembly{position:sticky;top:0;height:100vh;display:flex;align-items:center;justify-content:center}
.pane-frame{position:relative;width:100%;max-width:1180px;margin:0 auto;border-radius:16px;overflow:hidden;box-shadow:var(--shadow-art)}
.pane{display:block;width:100%}
.piece{position:absolute;display:block;border-radius:11px;opacity:0;will-change:transform,opacity;
  box-shadow:0 24px 40px -18px rgba(0,0,0,.55)}
.piece.landed{opacity:1;transform:none}
.assembly .collage-chip{position:absolute;opacity:0;will-change:transform,opacity}
.assembly .collage-chip.landed{opacity:1;transform:none}
.assembly-caption{position:absolute;left:0;right:0;bottom:34px;text-align:center;font-size:14px;color:var(--ash);
  opacity:0;transition:opacity .5s ease}
.assembly-caption.show{opacity:1}
@media(max-width:960px){
  .assembly-wrap{height:auto}
  .assembly{position:static;height:auto;padding:0 22px 20px}
  .piece{opacity:1 !important;transform:none !important}
  .assembly .collage-chip{display:none}
}

.collage-chip{
  position:absolute;background:var(--paper);border-radius:16px;box-shadow:var(--shadow-art);
  padding:14px 18px;min-width:150px;z-index:4;
}
.collage-chip .k{font-size:13px;color:var(--slate);font-weight:450}
.collage-chip .v{font-size:26px;font-family:var(--sans);font-weight:500;color:var(--ink);letter-spacing:-.01em;line-height:1.1;margin-top:3px}
.collage-chip .s{font-size:13px;color:var(--slate);margin-top:2px}

.float-chip{
  position:absolute;background:var(--paper);border-radius:16px;box-shadow:var(--shadow-art);
  padding:14px 18px;min-width:150px;
}
.float-chip .k{font-size:13px;color:var(--slate);font-weight:450}
.float-chip .v{font-size:26px;font-family:var(--sans);font-weight:500;color:var(--ink);letter-spacing:-.01em;line-height:1.1;margin-top:3px}
.float-chip .s{font-size:13px;color:var(--slate);margin-top:2px}
.chip-tl{top:92px;left:-34px}
.chip-br{bottom:64px;right:-34px}

/* ---------- Trust strip ---------- */
.trust{border-top:1px solid var(--hairline);border-bottom:1px solid var(--hairline);padding:26px 0}
.trust-inner{display:flex;align-items:center;gap:36px;flex-wrap:wrap;justify-content:center}
.trust-label{font-size:14px;color:var(--ash)}
.trust-items{display:flex;gap:28px;flex-wrap:wrap}
.trust-items span{font-size:15px;color:var(--slate);font-weight:450;display:inline-flex;align-items:center;gap:9px}
.trust-items i{width:5px;height:5px;border-radius:9999px;background:var(--smoke)}

/* ---------- Grids ---------- */
.grid{display:grid;gap:24px}
.grid-3{grid-template-columns:repeat(3,1fr)}
.grid-4{grid-template-columns:repeat(4,1fr)}
.two-col{display:grid;grid-template-columns:1fr 1.05fr;gap:64px;align-items:center}
.two-col.reverse .col-media{order:-1}

/* ---------- Cards ---------- */
.card{background:var(--mist);border-radius:var(--r-card);padding:32px 28px}
.mini-card{background:var(--mist);border-radius:var(--r-card);padding:30px 26px}
.mini-card h4{font-family:var(--sans);font-size:18px;font-weight:500;margin-bottom:10px;display:flex;align-items:center;gap:11px}
.mini-card h4 svg{width:20px;height:20px;stroke:var(--sienna);fill:none;flex:none}
.mini-card p{font-size:16px;color:var(--slate);line-height:1.5}

/* Tool cards */
.tool-card{position:relative;display:flex;flex-direction:column;background:var(--mist);border-radius:var(--r-card);padding:28px 26px;transition:transform .18s ease}
.tool-card:hover{transform:translateY(-3px)}
.tool-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}
.tool-logo{width:34px;height:34px;border-radius:9px}
.tool-badge{font-size:12px;font-weight:450;color:var(--slate);background:var(--paper);border-radius:9999px;padding:4px 11px}
.tool-badge.soon{color:var(--sienna);background:var(--peach)}
.tool-card .role{font-size:14px;color:var(--ash);margin-bottom:6px}
.tool-card h3{font-size:24px;margin-bottom:10px}
.tool-card p{font-size:15px;color:var(--slate);line-height:1.5;flex:1;margin-bottom:18px}
.tool-cta{display:inline-flex;align-items:center;gap:8px;font-size:15px;font-weight:450;color:var(--ink)}
.tool-cta svg{width:16px;height:16px}
.stretch{position:absolute;inset:0}

/* ---------- Command Bridge drawn artifact ---------- */
.bridge{background:var(--paper);border-radius:var(--r-elev);box-shadow:var(--shadow-art);overflow:hidden}
.bridge-head{display:flex;align-items:center;gap:8px;padding:14px 20px;border-bottom:1px solid var(--hairline)}
.bridge-head i{width:10px;height:10px;border-radius:9999px;background:#e2e2e4}
.bridge-head i:first-child{background:#f0c3b3}
.bridge-title{margin-left:8px;font-size:13px;color:var(--smoke);font-weight:450}
.bridge-tiles{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--hairline)}
.bridge-tile{background:var(--paper);padding:20px 22px}
.bridge-tile .k{font-size:13px;color:var(--slate)}
.bridge-tile .v{font-size:30px;font-weight:500;letter-spacing:-.01em;margin:6px 0 3px}
.bridge-tile .s{font-size:13px;color:var(--ash)}
.bridge-feed{padding:16px 22px 20px;display:flex;flex-direction:column;gap:12px;border-top:1px solid var(--hairline)}
.bridge-feed .row{display:flex;align-items:center;gap:12px;font-size:14px;color:var(--slate)}
.bridge-feed .row b{color:var(--ink);font-weight:500}
.pill{font-size:12px;font-weight:450;color:var(--sienna);background:var(--peach);border-radius:9999px;padding:4px 11px;flex:none}

/* ---------- Checklist ---------- */
.checks{list-style:none;display:flex;flex-direction:column;gap:15px;margin-top:26px}
.checks li{display:flex;gap:12px;font-size:17px;color:var(--slate)}
.checks svg{width:19px;height:19px;stroke:var(--sienna);fill:none;flex:none;margin-top:3px}

/* ---------- Tiers ---------- */
.tier{background:var(--mist);border-radius:var(--r-card);padding:34px 30px;display:flex;flex-direction:column}
.tier.featured{background:var(--ink);color:var(--paper)}
.tier.featured .tier-for,.tier.featured li{color:rgba(255,255,255,.72)}
.tier.featured h3{color:var(--paper)}
.tier-tag{font-size:13px;color:var(--ash);margin-bottom:14px}
.tier.featured .tier-tag{color:var(--peach)}
.tier h3{font-size:28px;margin-bottom:12px}
.tier-for{font-size:16px;color:var(--slate);line-height:1.5;margin-bottom:22px;min-height:48px}
.tier ul{list-style:none;display:flex;flex-direction:column;gap:13px;margin-bottom:28px;flex:1}
.tier li{display:flex;gap:11px;font-size:15px;color:var(--slate)}
.tier li svg{width:18px;height:18px;stroke:var(--sienna);fill:none;flex:none;margin-top:2px}
.tier.featured li svg{stroke:var(--peach)}
.tier .btn{align-self:flex-start}
.tier.featured .btn-primary{background:var(--paper);color:var(--ink);border-color:var(--paper)}

/* ---------- Steps ---------- */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;counter-reset:step}
.step{position:relative;padding-top:44px}
.step::before{counter-increment:step;content:"0" counter(step);position:absolute;top:0;left:0;font-family:var(--serif);font-size:34px;color:var(--smoke)}
.step h4{font-family:var(--sans);font-size:18px;font-weight:500;margin-bottom:9px}
.step p{font-size:15px;color:var(--slate);line-height:1.5}

/* ---------- Peach accent card ---------- */
.accent{background:var(--peach);color:var(--sienna);border-radius:var(--r-card);padding:64px 56px;text-align:center}
.accent .eyebrow{color:var(--sienna);opacity:.7}
.accent h2{color:var(--sienna)}
.accent p{font-size:19px;color:var(--sienna);opacity:.85;max-width:620px;margin:20px auto 32px;line-height:1.5}
.accent .btn-primary{background:var(--ink);color:var(--paper);border-color:var(--ink)}

/* ---------- Stat row (peach) ---------- */
.statrow{background:var(--peach);border-radius:var(--r-card);padding:48px 40px;display:grid;grid-template-columns:repeat(4,1fr);gap:28px}
.statrow .stat{text-align:center;color:var(--sienna)}
.statrow .stat .n{font-family:var(--serif);font-size:52px;line-height:1;letter-spacing:-.02em}
.statrow .stat .l{font-size:15px;margin-top:12px;opacity:.85}

/* ---------- Full-bleed media band ---------- */
.media-band{margin-top:44px}
.frame-caption{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:16px;margin-bottom:22px}
.frame-caption .tag{font-size:14px;color:var(--ash)}

/* ---------- Feature list grid ---------- */
.feat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:40px 48px}
.feat h4{font-family:var(--sans);font-size:18px;font-weight:500;margin-bottom:9px}
.feat p{font-size:15px;color:var(--slate);line-height:1.5}

/* ---------- FAQ ---------- */
.faq{max-width:820px;margin:0 auto}
.faq details{border-bottom:1px solid var(--hairline);padding:24px 0}
.faq summary{font-family:var(--sans);font-size:19px;font-weight:480;cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:20px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-size:26px;color:var(--smoke);font-weight:400}
.faq details[open] summary::after{content:"–"}
.faq details p{font-size:16px;color:var(--slate);line-height:1.55;margin-top:14px;max-width:680px}

/* ---------- Pipeline (Armada 4-system) ---------- */
.pipe-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
.pipe{background:var(--mist);border-radius:var(--r-card);padding:30px 28px}
.pipe .step-n{font-size:14px;color:var(--ash);margin-bottom:12px}
.pipe h3{font-size:23px;margin-bottom:10px}
.pipe p{font-size:15px;color:var(--slate);line-height:1.5;margin-bottom:16px}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips span{font-size:13px;color:var(--slate);background:var(--paper);border-radius:9999px;padding:5px 12px}

/* ---------- CTA band ---------- */
.cta-band{padding:var(--gap) 0}

/* ---------- Footer ---------- */
.footer{border-top:1px solid var(--hairline);padding:64px 0 40px;background:var(--fog)}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:40px;margin-bottom:48px}
.footer-about{font-size:15px;color:var(--slate);line-height:1.5;margin-top:16px;max-width:320px}
.footer h5{font-size:14px;font-weight:500;margin-bottom:16px}
.footer ul{list-style:none;display:flex;flex-direction:column;gap:11px}
.footer ul a{font-size:15px;color:var(--slate)}
.footer ul a:hover{color:var(--ink)}
.footer-bottom{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:14px;padding-top:28px;border-top:1px solid var(--hairline);font-size:14px;color:var(--ash)}
.footer-bottom .legal{display:flex;gap:22px}
.footer-bottom .legal a:hover{color:var(--ink)}

/* ---------- Forms ---------- */
.form-card{background:var(--mist);border-radius:var(--r-card);padding:40px}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.field{display:flex;flex-direction:column;gap:8px}
.field.full{grid-column:1 / -1}
.field label{font-size:14px;font-weight:450;color:var(--slate)}
.field input,.field select,.field textarea{
  font-family:var(--sans);font-size:16px;color:var(--ink);background:var(--paper);
  border:1px solid var(--hairline);border-radius:var(--r-input);padding:14px 16px;width:100%;
}
.field input::placeholder,.field textarea::placeholder{color:var(--smoke)}
.field textarea{min-height:120px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--ink)}
.form-note{font-size:14px;color:var(--ash);margin-top:16px}

/* ---------- Blog ---------- */
.blog-featured{display:grid;grid-template-columns:1.1fr 1fr;gap:0;background:var(--peach);border-radius:var(--r-card);overflow:hidden;margin-bottom:40px}
.blog-featured .bf-body{padding:48px 44px;display:flex;flex-direction:column;justify-content:center}
.blog-featured .bf-tag{font-size:13px;color:var(--sienna);opacity:.75;margin-bottom:14px}
.blog-featured h3{color:var(--sienna);font-size:34px;line-height:1.15;margin-bottom:16px}
.blog-featured p{color:var(--sienna);opacity:.85;font-size:17px;line-height:1.55}
.blog-featured .bf-meta{margin-top:22px;font-size:14px;color:var(--sienna);opacity:.7}
.blog-featured .bf-side{background:var(--sienna);opacity:.06}
.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.post-card{display:flex;flex-direction:column;background:var(--mist);border-radius:var(--r-card);padding:30px 26px;transition:transform .18s ease}
.post-card:hover{transform:translateY(-3px)}
.post-card .cat{font-size:13px;color:var(--ash);margin-bottom:12px}
.post-card h4{font-family:var(--serif);font-weight:400;font-size:22px;line-height:1.2;margin-bottom:10px}
.post-card p{font-size:15px;color:var(--slate);line-height:1.5;flex:1;margin-bottom:16px}
.post-card .read{font-size:13px;color:var(--ash)}
@media(max-width:960px){
  .form-grid{grid-template-columns:1fr}
  .blog-featured{grid-template-columns:1fr}
  .blog-featured .bf-side{display:none}
  .blog-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:640px){.blog-grid{grid-template-columns:1fr}}

/* ---------- Legal / prose ---------- */
.legal{max-width:720px;margin:0 auto}
.legal .updated{font-size:15px;color:var(--ash);margin-bottom:28px}
.legal h3{font-family:var(--sans);font-size:20px;font-weight:500;color:var(--ink);margin:36px 0 10px}
.legal p{font-size:17px;color:var(--slate);line-height:1.65;margin-bottom:16px}
.legal a{color:var(--ink);text-decoration:underline;text-underline-offset:3px}

/* ---------- Reveal ---------- */
.reveal{opacity:0;transform:translateY(18px);transition:opacity .6s ease,transform .6s ease}
.reveal.in{opacity:1;transform:none}

/* ---------- Responsive ---------- */
.mobile-menu{display:none}
@media(max-width:960px){
  .nav-links{display:none}
  .nav-actions .btn-ghost{display:none}
  .nav-toggle{display:block}
  .two-col{grid-template-columns:1fr;gap:40px}
  .two-col.reverse .col-media{order:0}
  .grid-4{grid-template-columns:repeat(2,1fr)}
  .grid-3{grid-template-columns:repeat(2,1fr)}
  .steps{grid-template-columns:repeat(2,1fr)}
  .footer-grid{grid-template-columns:1fr 1fr}
  .feat-grid{grid-template-columns:repeat(2,1fr)}
  .statrow{grid-template-columns:repeat(2,1fr);gap:36px}
  .pipe-grid{grid-template-columns:1fr}
  .float-chip{display:none}
  .collage{height:auto !important;padding:0 22px}
  .c-main{position:static !important;width:100% !important;inset:auto !important;margin:0 auto}
  .c-frag,.collage-chip{display:none !important}
  .mobile-menu.open{display:flex;flex-direction:column;gap:4px;padding:16px 32px 28px;border-bottom:1px solid var(--hairline);background:var(--paper)}
  .mobile-menu a{padding:12px 0;font-size:17px;border-bottom:1px solid var(--fog)}
  .mobile-menu a.btn{border-bottom:none;justify-content:center;padding:14px 24px;margin-top:12px}
}
@media(max-width:640px){
  .container{padding:0 22px}
  body{font-size:16px}
  .grid-4,.grid-3,.steps,.feat-grid,.statrow{grid-template-columns:1fr}
  .hero{padding:48px 0 20px}
  .section{padding:56px 0}
  .accent{padding:44px 26px}
  .tier.featured{order:-1}
}
