/* ===================================================================
   DECIPHER — "THE OPERATIONS DESK" design system  (v1.0, Oct 2026)
   Approved direction: v2.1 mockup.

   VOLUME TIERS — set one class on <body>:
     .vol-full  homepage            (ticker, decode, stamps, notes, rotations)
     .vol-std   service/product/industry pages  (no rotations, 1 stamp max)
     .vol-lite  SEO/guide/city/legal pages      (no stamps, no handwriting,
                                                 no ticker, flat cards)
   Components check the tier via these classes; content markup stays same.
   =================================================================== */

:root{
  --paper:   #f8f6f0;
  --paper-2: #f0ede3;
  --card:    #fffdf7;
  --ink:     #101726;
  --ink-2:   #1a2338;
  --text:    #283044;
  --muted:   #626c80;
  --line:    #ddd7c7;
  --line-d:  rgba(248,246,240,.14);
  --blue:    #1c55c9;
  --proof:   #e14e1d;
  --hilite:  #ffe27a;
  --ok:      #177a4f;
  --okd:     #4ade80;

  --disp:  'Archivo', 'Arial Narrow', Arial, sans-serif;
  --serif: 'Newsreader', Georgia, serif;
  --mono:  'IBM Plex Mono', 'Courier New', monospace;
  --hand:  'Kalam', 'Comic Sans MS', cursive;

  --wrap: 1220px;
  --bw: 1.5px;
  --os: 5px;
  --osc: rgba(16,23,38,.13);
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:var(--disp);font-size:16px;line-height:1.65;color:var(--text);
  background:var(--paper);
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
}
body.vol-full,body.vol-std{
  background:
    repeating-linear-gradient(0deg, transparent 0 35px, rgba(16,23,38,.022) 35px 36px),
    var(--paper);
}
img{max-width:100%;display:block}
a{color:var(--blue);text-decoration:none}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid var(--proof);outline-offset:3px}
::selection{background:var(--hilite);color:var(--ink)}
mark{background:none;padding:0;color:inherit}
.wrap{max-width:var(--wrap);margin:0 auto;padding-inline:26px}

/* ---------- type ---------- */
h1,h2{font-family:var(--disp);font-stretch:110%;font-weight:700;color:var(--ink);line-height:1.02;letter-spacing:-.01em;text-transform:uppercase;text-wrap:balance}
h1{font-size:clamp(2.7rem,6.6vw,5.4rem);font-weight:800}
h2{font-size:clamp(1.8rem,3.4vw,2.7rem)}
h2 em,h1 em{font-family:var(--serif);font-style:italic;font-weight:500;text-transform:none;letter-spacing:0;font-size:1.05em}
h3{font-family:var(--disp);font-weight:700;font-size:1.16rem;color:var(--ink);line-height:1.3}
/* long-form pages: smaller display scale */
.vol-lite h1{font-size:clamp(2.2rem,4.6vw,3.6rem)}
.vol-lite h2{font-size:clamp(1.5rem,2.6vw,2.1rem)}
.lead{font-size:1.05rem;color:var(--muted);max-width:62ch;line-height:1.78}
.mono{font-family:var(--mono)}
.hand{font-family:var(--hand);color:var(--proof);font-size:1rem;line-height:1.4;font-weight:400}
.vol-lite .hand,.vol-lite .stamp,.vol-lite .note,.vol-lite .tape::before{display:none}
/* long-form article body (guides, legal, case studies) */
.article{max-width:760px;margin-inline:auto}
.article p,.article li{font-size:1.02rem;line-height:1.8;color:var(--text)}
.article p{margin-bottom:1.2em}
.article h2{margin:2.2em 0 .7em}
.article h3{margin:1.8em 0 .6em}
.article ul,.article ol{padding-left:1.4em;margin-bottom:1.2em}
.article table{border-collapse:collapse;width:100%;margin-block:1.4em;font-size:.92rem}
.article th,.article td{border:1px solid var(--line);padding:10px 14px;text-align:left}
.article th{background:var(--paper-2);font-family:var(--mono);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase}

/* scroll reveal — visible without JS (JS adds .pre before observing) */
.rv.pre{opacity:0;transform:translateY(18px)}
.rv{transition:opacity .65s cubic-bezier(.2,.6,.2,1), transform .65s cubic-bezier(.2,.6,.2,1)}
.rv.in{opacity:1;transform:none}

/* file-code section header */
.sec{padding-block:100px;position:relative}
.vol-lite .sec{padding-block:72px}
.filehead{margin-bottom:56px;position:relative}
.filecode{
  display:inline-flex;align-items:center;gap:12px;
  font-family:var(--mono);font-size:.66rem;font-weight:500;letter-spacing:.22em;
  color:var(--paper);background:var(--ink);padding:7px 15px;margin-bottom:22px;
}
.filecode::before{content:"▙";font-size:.58rem;color:var(--proof)}
.filehead h2{max-width:22ch}
.filehead .lead{margin-top:16px}
.filehead.center{text-align:center}
.filehead.center h2,.filehead.center .lead{margin-inline:auto}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;align-items:center;gap:10px;cursor:pointer;line-height:1.15;
  font-family:var(--mono);font-weight:600;font-size:.8rem;letter-spacing:.07em;text-transform:uppercase;
  padding:15px 28px;border:var(--bw) solid var(--ink);color:var(--ink);background:var(--card);
  box-shadow:var(--os) var(--os) 0 0 var(--osc);transition:transform .16s ease, box-shadow .16s ease, background .16s;
}
.btn:hover{transform:translate(2px,2px);box-shadow:2px 2px 0 0 var(--osc)}
.btn:active{transform:translate(var(--os),var(--os));box-shadow:0 0 0 0 var(--osc)}
.btn-fill{background:var(--ink);color:var(--paper)}
.btn-fill:hover{background:var(--ink-2)}
.btn-paperline{background:transparent;border-color:rgba(248,246,240,.55);color:var(--paper);box-shadow:var(--os) var(--os) 0 0 rgba(248,246,240,.14)}
.btn-paperline:hover{box-shadow:2px 2px 0 0 rgba(248,246,240,.14);border-color:var(--paper)}
.btn-paperfill{background:var(--paper);border-color:var(--paper);color:var(--ink);box-shadow:var(--os) var(--os) 0 0 rgba(248,246,240,.18)}
.btn-paperfill:hover{box-shadow:2px 2px 0 0 rgba(248,246,240,.18)}

.tlink{
  font-family:var(--mono);font-size:.76rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;
  color:var(--blue);display:inline-flex;gap:8px;align-items:center;padding-bottom:2px;
  border-bottom:2px solid transparent;
}
.tlink::after{content:"→";transition:transform .15s}
.tlink:hover{border-color:var(--blue)}
.tlink:hover::after{transform:translateX(5px)}

/* ---------- stamps & tape & notes (vol-full / vol-std only) ---------- */
.stamp{
  position:absolute;font-family:var(--mono);font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  color:var(--proof);border:3px double var(--proof);padding:8px 16px;font-size:.68rem;
  transform:rotate(-6deg);opacity:.75;pointer-events:none;border-radius:3px;mix-blend-mode:multiply;
}
.note{position:absolute;max-width:200px;pointer-events:none;z-index:5}
.tape::before{
  content:"";position:absolute;top:-12px;left:50%;transform:translateX(-50%) rotate(-2deg);
  width:92px;height:25px;background:rgba(236,224,170,.55);border:1px dashed rgba(16,23,38,.1);z-index:3;
}

/* ================= TICKER (vol-full only; markup omitted elsewhere) ===== */
.ticker{
  background:var(--ink);color:var(--paper);overflow:hidden;white-space:nowrap;
  font-family:var(--mono);font-size:.7rem;letter-spacing:.1em;padding-block:10px;
  border-bottom:3px solid var(--proof);
}
.ticker-track{display:inline-flex;animation:tick 56s linear infinite}
.ticker:hover .ticker-track{animation-play-state:paused}
@keyframes tick{to{transform:translateX(-50%)}}
.ticker span{padding-inline:28px}
.ticker .ok{color:var(--okd)}
.ticker .wn{color:#fbbf24}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  .ticker{white-space:normal}
  .rv.pre{opacity:1;transform:none}
  .marq{flex-wrap:wrap;width:auto!important;justify-content:center}
}

/* ================= ANNOUNCEMENT BAR (DPDP readiness campaign; markup in nav.php) ===== */
.announce{
  display:flex;justify-content:center;align-items:center;gap:6px 18px;flex-wrap:wrap;text-align:center;
  background:var(--proof);color:var(--ink);padding:9px 20px;border-bottom:var(--bw) solid var(--ink);
  font-family:var(--mono);font-size:.72rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase;line-height:1.5;
}
.announce b{background:var(--ink);color:var(--paper);padding:3px 10px;font-weight:600;letter-spacing:.08em;white-space:nowrap}
.announce u{text-decoration:underline;text-underline-offset:3px;white-space:nowrap}
.announce:hover u{text-decoration-thickness:2px}
@media(max-width:640px){.announce{font-size:.64rem;padding:8px 12px;gap:4px 10px}}
/* "Featured" tag in menus */
.feat-tag{
  font-family:var(--mono);font-size:.56rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;
  background:var(--proof);color:#fff;padding:2px 6px;vertical-align:2px;white-space:nowrap;
}

/* ================= NAV ================= */
.nav{position:sticky;top:0;z-index:200;background:rgba(248,246,240,.95);backdrop-filter:blur(10px);border-bottom:var(--bw) solid var(--ink)}
.nav-inner{max-width:var(--wrap);margin:0 auto;padding:0 26px;display:flex;align-items:center;gap:24px;height:72px}
.nav-logo img{height:40px;width:auto}
.nav-menu{display:flex;list-style:none;flex:1;justify-content:center}
.nav-item{position:relative}
.nav-link{
  display:flex;align-items:center;gap:6px;padding:26px 12px;
  font-family:var(--mono);font-size:.76rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--ink);
  border-bottom:2px solid transparent;white-space:nowrap;
}
.nav-cta .nav-chat,.nav-cta .btn-nav{white-space:nowrap}
.nav-inner{gap:18px}
.nav-link{padding-inline:10px}
/* mid-size desktops: drop the header chat button (floating "Ask Deci" stays) */
@media(max-width:1260px){.nav-cta .nav-chat{display:none}.nav-link{padding-inline:8px;letter-spacing:.03em}}
.nav-link .car{font-size:.52rem;color:var(--muted);transition:transform .18s}
.nav-item:hover > .nav-link{color:var(--proof);border-bottom-color:var(--proof)}
.nav-item:hover .car{transform:rotate(180deg)}
.mega{
  position:absolute;top:100%;left:50%;transform:translateX(-50%) translateY(6px);
  background:var(--card);border:var(--bw) solid var(--ink);border-top:3px solid var(--proof);
  box-shadow:7px 7px 0 0 var(--osc);padding:28px;opacity:0;visibility:hidden;transition:all .16s;
}
.nav-item:hover .mega,.nav-item:focus-within .mega{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
.mega-cols{display:grid;gap:30px}
.mega h6{
  font-family:var(--mono);font-size:.6rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;
  color:var(--muted);border-bottom:1px solid var(--line);padding-bottom:9px;margin-bottom:11px;
}
.mm{display:block;padding:8px 10px;color:inherit;transition:background .12s}
.mm:hover{background:var(--hilite)}
.mm h5{font-family:var(--disp);font-size:.88rem;font-weight:700;color:var(--ink)}
.mm p{font-size:.74rem;color:var(--muted);line-height:1.45}
.mega-foot{border-top:1px solid var(--line);margin-top:16px;padding-top:14px;text-align:center}
.dd{
  position:absolute;top:100%;left:0;background:var(--card);border:var(--bw) solid var(--ink);border-top:3px solid var(--proof);
  box-shadow:7px 7px 0 0 var(--osc);min-width:270px;padding:10px;opacity:0;visibility:hidden;transition:all .16s;transform:translateY(6px);
}
.nav-item:hover .dd,.nav-item:focus-within .dd{opacity:1;visibility:visible;transform:translateY(0)}
.dd a{display:block;padding:10px 12px;font-size:.88rem;font-weight:600;color:var(--ink)}
.dd a:hover{background:var(--hilite)}
.nav-cta{display:flex;gap:10px;align-items:center}
.nav-chat{
  display:inline-flex;align-items:center;gap:9px;
  font-family:var(--mono);font-size:.7rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase;
  color:var(--ink);padding:11px 15px;border:var(--bw) solid var(--line);background:var(--card);transition:border-color .15s;
}
.nav-chat:hover{border-color:var(--ink)}
.nav-chat .pulse{width:8px;height:8px;border-radius:50%;background:var(--ok);animation:blink 2.2s infinite}
@keyframes blink{50%{opacity:.25}}
.btn-nav{padding:12px 18px;font-size:.7rem;box-shadow:3px 3px 0 0 var(--osc)}
.nav-burger{display:none;background:var(--card);border:var(--bw) solid var(--ink);padding:10px 14px;cursor:pointer;font-family:var(--mono);font-size:.7rem;font-weight:600;color:var(--ink);letter-spacing:.1em}

/* mobile nav */
.mnav{position:fixed;inset:0;z-index:300;display:none}
.mnav.open{display:block}
.mnav-bg{position:absolute;inset:0;background:rgba(16,23,38,.55)}
.mnav-panel{position:absolute;top:0;right:0;bottom:0;width:min(370px,90vw);background:var(--paper);overflow-y:auto;padding:24px;border-left:3px solid var(--ink)}
.mnav-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}
.mnav-head img{height:34px;width:auto}
.mnav-close{background:none;border:var(--bw) solid var(--ink);font-size:1rem;cursor:pointer;color:var(--ink);line-height:1;padding:7px 12px;font-family:var(--mono)}
.mnav details{border-bottom:1px solid var(--line)}
.mnav summary{list-style:none;cursor:pointer;padding:14px 2px;font-family:var(--mono);font-size:.8rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--ink);display:flex;justify-content:space-between}
.mnav summary::-webkit-details-marker{display:none}
.mnav summary::after{content:"+"}
.mnav details[open] summary::after{content:"–"}
.mnav .sub{padding:0 2px 14px 14px;display:flex;flex-direction:column;gap:2px}
.mnav .sub a{padding:6px 0;font-size:.92rem;color:var(--text)}
.mnav .plain{display:block;padding:14px 2px;font-family:var(--mono);font-size:.8rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--ink);border-bottom:1px solid var(--line)}
.mnav-ctas{display:flex;flex-direction:column;gap:14px;margin-top:24px}

/* ================= HERO ================= */
.hero{border-bottom:var(--bw) solid var(--ink);position:relative;overflow:hidden}
.folio{
  display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;
  font-family:var(--mono);font-size:.64rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);
  border-bottom:1px solid var(--line);padding-block:13px;
}
.hero-main{display:grid;grid-template-columns:1.45fr 1fr;gap:60px;padding-block:74px 0;align-items:start}
.hero h1 .dc{display:inline-block}
.hero-sub{margin-top:28px;display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.hero-sub .pb{
  font-family:var(--mono);font-size:.8rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;
  color:var(--paper);background:var(--proof);padding:9px 18px;transform:rotate(-1deg);display:inline-block;
  box-shadow:4px 4px 0 0 var(--osc);
}
.hero-sub .defn{font-family:var(--mono);font-size:.68rem;letter-spacing:.12em;color:var(--muted)}
.hero .lead{margin-top:26px}
.hero-ctas{display:flex;gap:18px;margin-top:38px;flex-wrap:wrap}
/* interior page hero (vol-std / vol-lite): compact banner */
.page-hero{border-bottom:var(--bw) solid var(--ink);padding-block:64px 56px}
.vol-lite .page-hero{padding-block:48px 40px}
.page-hero .crumbs{font-family:var(--mono);font-size:.64rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:18px}
.page-hero .crumbs a{color:var(--muted)}
.page-hero .crumbs a:hover{color:var(--proof)}
.page-hero h1{max-width:20ch}
.page-hero .lead{margin-top:18px}

/* manifest card */
.manifest{position:relative;margin-top:8px}
.manifest-card{
  background:var(--card);border:var(--bw) solid var(--ink);box-shadow:7px 7px 0 0 var(--osc);
  transform:rotate(.7deg);position:relative;padding:28px 28px 24px;transition:transform .3s ease;
}
.manifest-card:hover{transform:rotate(0deg)}
.vol-std .manifest-card,.vol-lite .manifest-card{transform:none}
.manifest-card h4{
  font-family:var(--mono);font-size:.66rem;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--muted);
  border-bottom:var(--bw) solid var(--ink);padding-bottom:11px;margin-bottom:15px;display:flex;justify-content:space-between;
}
.manifest-card h4 i{font-style:normal;color:var(--ok)}
.mlist{list-style:none;display:flex;flex-direction:column}
.mlist li{
  display:flex;gap:14px;align-items:baseline;padding-block:11px;font-size:.94rem;font-weight:600;color:var(--ink);
  border-bottom:1px dashed var(--line);
}
.mlist li:last-child{border-bottom:none}
.mlist .tick{font-family:var(--hand);color:var(--ok);font-size:1.15rem;font-weight:700;flex:0 0 auto}
.vol-lite .mlist .tick{font-family:var(--mono);font-size:.9rem}
.mlist .mono-id{margin-left:auto;font-family:var(--mono);font-size:.6rem;color:var(--muted);letter-spacing:.1em}
.manifest .stamp{right:-12px;bottom:-16px;transform:rotate(7deg)}
.manifest .hand-note{position:static;display:block;margin-top:30px;max-width:270px;transform:rotate(-1deg)}

/* stats band */
.statband{display:grid;grid-template-columns:repeat(4,1fr);border-top:var(--bw) solid var(--ink);margin-top:68px;position:relative}
.stat{padding:32px 26px 36px;border-right:1px solid var(--line);position:relative}
.stat:last-child{border-right:none}
.stat b{
  display:block;font-family:var(--disp);font-stretch:114%;font-weight:800;
  font-size:clamp(2.6rem,4.6vw,4rem);line-height:1;color:var(--ink);font-variant-numeric:tabular-nums;letter-spacing:-.02em;
  margin-bottom:5px;
}
.stat b sup{font-size:.45em;font-weight:700;color:var(--proof);font-stretch:105%}
.stat > span{font-family:var(--mono);font-size:.7rem;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.stat b .count{font:inherit;color:inherit;letter-spacing:inherit}
.statband .note{right:10px;top:-52px}
/* text verdicts instead of numbers (comparison guides) */
.statband.words .stat b{font-size:clamp(1.25rem,2.1vw,1.7rem);font-stretch:105%;line-height:1.15;letter-spacing:-.005em;text-transform:uppercase}

/* ================= LOGO MARQUEE ================= */
.clients{border-bottom:var(--bw) solid var(--ink);background:var(--paper-2);padding-block:38px;overflow:hidden}
.clients .folio-lab{
  font-family:var(--mono);font-size:.64rem;letter-spacing:.22em;text-transform:uppercase;color:var(--muted);
  text-align:center;margin-bottom:26px;
}
.marq{display:flex;width:max-content;animation:marq 46s linear infinite;gap:60px;align-items:center}
.clients:hover .marq{animation-play-state:paused}
@keyframes marq{to{transform:translateX(-50%)}}
.marq img{height:38px;width:auto;filter:grayscale(1) contrast(1.05);opacity:.6;mix-blend-mode:multiply;transition:all .18s}
.marq img:hover{filter:none;opacity:1}

/* ================= GRID CELLS ================= */
.grid{display:grid;gap:1px;border:var(--bw) solid var(--ink);background:var(--line)}
.g2{grid-template-columns:repeat(2,1fr)}
.g3{grid-template-columns:repeat(3,1fr)}
.g4{grid-template-columns:repeat(4,1fr)}
.cell{
  background:var(--card);padding:34px 30px;display:flex;flex-direction:column;gap:13px;color:inherit;position:relative;
  transition:transform .22s cubic-bezier(.2,.6,.2,1), box-shadow .22s, background .15s;
}
a.cell:hover{background:#fff;transform:translate(-3px,-3px);box-shadow:var(--os) var(--os) 0 0 var(--osc);z-index:2}
a.cell:hover h3{text-decoration:underline;text-decoration-color:var(--proof);text-decoration-thickness:3px;text-underline-offset:5px}
.vol-lite a.cell:hover{transform:none;box-shadow:none;background:#fff}
.cell .idx{font-family:var(--mono);font-size:.62rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.cell .idx b{color:var(--proof);font-weight:600}
.cell p{font-size:.93rem;color:var(--muted);line-height:1.7}
.cell .tlink{margin-top:auto;padding-top:10px}

/* ================= EXHIBITS (product showcases) ================= */
.products{border-block:var(--bw) solid var(--ink);background:var(--paper-2)}
.exhibit{
  display:grid;grid-template-columns:5fr 7fr;gap:60px;align-items:center;
  padding-block:72px;border-bottom:2px dashed var(--line);position:relative;
}
.exhibit:last-of-type{border-bottom:none}
.exhibit.flip .ex-copy{order:2}
.exhibit.flip .ex-vis{order:1}
.ex-tab{
  display:inline-block;font-family:var(--mono);font-size:.62rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;
  background:var(--ink);color:var(--paper);padding:7px 14px;margin-bottom:18px;
}
.ex-tab i{font-style:normal;color:var(--proof);margin-right:8px}
.ex-copy h3{font-family:var(--disp);font-stretch:110%;font-weight:800;font-size:clamp(1.9rem,3.2vw,2.7rem);text-transform:uppercase;letter-spacing:-.01em;line-height:1}
.ex-domain{font-family:var(--mono);font-size:.74rem;color:var(--muted);display:block;margin:9px 0 18px}
a.ex-domain:hover,.cell a.idx:hover{color:var(--proof)}
.ex-desc{color:var(--muted);font-size:.96rem;line-height:1.75}
.ex-feats{list-style:none;margin:20px 0 26px;display:flex;flex-direction:column}
.ex-feats li{display:flex;gap:13px;font-size:.9rem;align-items:baseline;padding-block:9px;border-bottom:1px dashed var(--line)}
.ex-feats li:last-child{border-bottom:none}
.ex-feats .tick{font-family:var(--hand);color:var(--ok);font-weight:700;flex:0 0 auto}
.vol-lite .ex-feats .tick{font-family:var(--mono)}

/* ink panels (mini dashboards) */
.panel{
  background:var(--ink);color:var(--paper);font-family:var(--mono);
  border:var(--bw) solid var(--ink);box-shadow:8px 8px 0 0 var(--osc);overflow:hidden;
  transform-style:preserve-3d;will-change:transform;transition:transform .22s ease-out;
}
.vol-full .exhibit:nth-of-type(odd) .panel{transform:rotate(.4deg)}
.vol-full .exhibit:nth-of-type(even) .panel{transform:rotate(-.4deg)}
.panel-top{display:flex;align-items:center;gap:8px;padding:13px 18px;border-bottom:1px solid var(--line-d);font-size:.64rem;color:rgba(248,246,240,.5)}
.panel-top i{width:8px;height:8px;border-radius:50%;background:rgba(248,246,240,.16)}
.panel-top .lbl{margin-left:6px;letter-spacing:.08em}
.prow{display:flex;align-items:center;gap:12px;padding:12px 18px;border-bottom:1px solid rgba(248,246,240,.06);font-size:.74rem}
.prow .nm{flex:1;color:rgba(248,246,240,.9)}
.prow .nm small{display:block;color:rgba(248,246,240,.42);font-size:.64rem;margin-top:3px}
.prow .mt{color:rgba(248,246,240,.4);font-size:.64rem;white-space:nowrap}
.pill{font-size:.58rem;letter-spacing:.1em;text-transform:uppercase;padding:4px 10px;white-space:nowrap;border:1px solid}
.pill.ok{border-color:rgba(74,222,128,.4);color:var(--okd)}
.pill.due{border-color:rgba(251,191,36,.4);color:#fbbf24}
.pbar-wrap{display:flex;align-items:center;gap:14px;padding:16px 18px;font-size:.64rem;color:rgba(248,246,240,.6)}
.pbar{flex:1;height:7px;background:rgba(248,246,240,.12);overflow:hidden}
.pbar>i{display:block;height:100%;width:96%;background:var(--okd)}
.kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(248,246,240,.09)}
.kpi{background:var(--ink);padding:16px 18px}
.kpi b{display:block;font-size:1.28rem;font-weight:600;color:var(--paper);font-variant-numeric:tabular-nums}
.kpi span{font-size:.6rem;letter-spacing:.1em;text-transform:uppercase;color:rgba(248,246,240,.42)}
.kpi .delta{font-size:.62rem;color:var(--okd)}
.srch{display:flex;gap:10px;align-items:center;margin:14px 18px;padding:11px 14px;background:rgba(248,246,240,.06);border:1px solid var(--line-d);font-size:.74rem;color:rgba(248,246,240,.88)}
.srch::before{content:"⌕";color:rgba(248,246,240,.4);font-size:.95rem}
.caseline{display:flex;gap:12px;align-items:center;padding:11px 18px;border-bottom:1px solid rgba(248,246,240,.06);font-size:.7rem}
.cbadge{flex:0 0 auto;font-size:.56rem;font-weight:600;letter-spacing:.06em;padding:4px 8px;border:1px solid}
.cbadge.sc{border-color:rgba(232,199,102,.5);color:#e8c766}
.cbadge.hc{border-color:rgba(125,181,251,.5);color:#7db5fb}
.caseline .cb{flex:1}
.caseline .ct{color:rgba(248,246,240,.9)}
.caseline .cc{color:rgba(248,246,240,.4);font-size:.62rem}
.caseline .rel{color:var(--okd);font-size:.66rem}
.pfoot{padding:12px 18px;font-size:.62rem;color:rgba(248,246,240,.4)}
.notif{display:flex;gap:12px;align-items:center;margin:14px 18px;padding:11px 14px;border:1px dashed rgba(225,78,29,.5);font-size:.7rem}
.notif .nt{color:rgba(248,246,240,.92)}
.notif .ns{color:rgba(248,246,240,.45);font-size:.62rem}
.notif.green{border-color:rgba(74,222,128,.4)}
.seat{flex:0 0 auto;font-size:.58rem;font-weight:600;padding:4px 8px;border:1px solid}
.seat.vip{border-color:rgba(232,199,102,.5);color:#e8c766}
.seat.gen{border-color:rgba(125,181,251,.5);color:#7db5fb}
.products-cta{text-align:center;padding-block:52px 80px}

/* ================= misc blocks ================= */
.why-cell b.big{
  font-family:var(--disp);font-stretch:112%;font-weight:800;font-size:2.3rem;line-height:1;
  color:var(--ink);letter-spacing:-.02em;font-variant-numeric:tabular-nums;
}
.why-cell b.big.or{color:var(--proof)}
.why-cell b.big.gr{color:var(--ok)}

.ind{position:relative;overflow:hidden;display:block;aspect-ratio:4/4.7;background:var(--card)}
.ind img{width:100%;height:100%;object-fit:cover;filter:grayscale(.45) contrast(1.02);transition:all .4s cubic-bezier(.2,.6,.2,1)}
.ind:hover img{filter:none;transform:scale(1.04)}
.ind .lab{
  position:absolute;left:12px;right:12px;bottom:12px;background:var(--paper);
  border:var(--bw) solid var(--ink);padding:12px 15px;font-weight:700;font-size:.9rem;color:var(--ink);
  display:flex;justify-content:space-between;align-items:center;gap:10px;transition:transform .2s, box-shadow .2s;
}
.ind:hover .lab{transform:translate(-2px,-2px);box-shadow:4px 4px 0 0 var(--osc)}
.ind .lab::after{content:"→";font-family:var(--mono);color:var(--proof)}

/* dark sections */
.dark{background:var(--ink);color:rgba(248,246,240,.78)}
.dark h2,.dark h3,.dark h4{color:var(--paper)}
.dark .lead{color:rgba(248,246,240,.55)}
.dark .filecode{background:var(--paper);color:var(--ink)}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line-d);border:1px solid var(--line-d)}
.stp{background:var(--ink);padding:36px 28px;display:flex;flex-direction:column;gap:15px;position:relative}
.stp .n{
  font-family:var(--disp);font-stretch:112%;font-weight:800;font-size:3.2rem;line-height:1;
  color:transparent;-webkit-text-stroke:1.4px rgba(248,246,240,.32);transition:all .4s;
}
.stp:hover .n{color:var(--proof);-webkit-text-stroke:0}
.stp h4{font-family:var(--disp);font-weight:700;font-size:1.12rem;text-transform:uppercase;letter-spacing:.02em}
.stp p{font-size:.88rem;color:rgba(248,246,240,.55);line-height:1.7}
.stp::after{content:"→";position:absolute;right:-9px;top:46px;z-index:2;font-family:var(--mono);color:var(--proof);font-size:1.05rem}
.stp:last-child::after{content:none}

/* work cards */
.proj{background:var(--card);display:block;color:inherit;position:relative}
.proj .ph{overflow:hidden;border-bottom:var(--bw) solid var(--ink)}
.proj img{width:100%;aspect-ratio:3/2;object-fit:cover;filter:grayscale(.3);transition:all .35s cubic-bezier(.2,.6,.2,1)}
.proj:hover img{filter:none;transform:scale(1.03)}
.proj-body{padding:18px 22px 22px}
.proj .idx2{font-family:var(--mono);font-size:.6rem;letter-spacing:.18em;text-transform:uppercase;color:var(--proof);font-weight:600}
.proj h3{font-size:1rem;margin-top:7px}

/* case-study metric strips */
.cs-met{display:flex;gap:0;border:var(--bw) solid var(--ink);margin-top:8px}
.cs-met div{flex:1;padding:11px 10px;border-right:1px solid var(--line);text-align:center}
.cs-met div:last-child{border-right:none}
.cs-met b{display:block;font-family:var(--disp);font-stretch:110%;font-weight:800;font-size:1.28rem;color:var(--ink);font-variant-numeric:tabular-nums}
.cs-met span{font-family:var(--mono);font-size:.54rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}

/* testimonials */
.tst-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:32px}
.tst{
  background:var(--card);border:var(--bw) solid var(--ink);padding:34px 32px 28px;position:relative;
  box-shadow:6px 6px 0 0 var(--osc);display:flex;flex-direction:column;gap:20px;transition:transform .3s ease;
}
.vol-full .tst:nth-child(odd){transform:rotate(-.5deg)}
.vol-full .tst:nth-child(even){transform:rotate(.5deg)}
.tst:hover{transform:rotate(0)}
.tst blockquote{font-family:var(--serif);font-size:1.15rem;line-height:1.58;color:var(--ink);font-style:italic;font-weight:400}
.tst blockquote::before{content:"“";font-size:2.2rem;color:var(--proof);font-family:var(--serif);line-height:0;vertical-align:-.35em;margin-right:5px}
.tst-who{display:flex;gap:14px;align-items:center;margin-top:auto;border-top:1px dashed var(--line);padding-top:16px}
.tst-who img{width:48px;height:48px;border-radius:50%;object-fit:cover;border:var(--bw) solid var(--ink)}
.tst-who b{display:block;font-size:.94rem;color:var(--ink)}
.tst-who span{font-family:var(--mono);font-size:.66rem;color:var(--muted);letter-spacing:.04em}

/* blog */
.blog-head{display:flex;justify-content:space-between;align-items:flex-end;gap:26px;flex-wrap:wrap;margin-bottom:48px}
.blog-note{font-family:var(--mono);font-size:.64rem;color:var(--muted);letter-spacing:.08em;margin-top:28px;text-align:center}
.blog-card-img{width:100%;aspect-ratio:3/2;object-fit:cover;border-bottom:var(--bw) solid var(--ink)}

/* FAQ */
.faq-wrap{max-width:860px;margin-inline:auto;border:var(--bw) solid var(--ink);background:var(--line);display:flex;flex-direction:column;gap:1px}
.faq{background:var(--card)}
.faq summary{
  list-style:none;cursor:pointer;padding:22px 28px;font-weight:700;color:var(--ink);font-size:1rem;
  display:flex;justify-content:space-between;align-items:center;gap:16px;transition:background .12s;
}
.faq summary:hover{background:#fff}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-family:var(--mono);font-size:1.15rem;color:var(--proof);flex:0 0 auto}
.faq[open] summary::after{content:"–"}
.faq .body{padding:0 28px 26px;color:var(--muted);font-size:.94rem;line-height:1.75}

/* awards strip */
.awards .wrap{display:flex;justify-content:space-between;align-items:center;gap:30px;flex-wrap:wrap;padding-block:40px}
.awards h3{font-family:var(--disp);font-size:1.05rem;text-transform:uppercase;letter-spacing:.02em}
.awards p{font-size:.8rem;color:rgba(248,246,240,.5);font-family:var(--mono)}
.award-logos{display:flex;gap:42px;align-items:center;flex-wrap:wrap}
.award{text-align:center}
.award img{height:44px;width:auto;margin-inline:auto;filter:brightness(0) invert(1);opacity:.72}
.award span{display:block;font-family:var(--mono);font-size:.58rem;letter-spacing:.12em;color:rgba(248,246,240,.42);margin-top:8px;text-transform:uppercase}
.award .yrs{width:46px;height:46px;border-radius:50%;border:1px solid var(--line-d);display:flex;align-items:center;justify-content:center;margin-inline:auto;font-family:var(--disp);font-weight:800;color:rgba(248,246,240,.82)}

/* CTA */
.cta{
  border:var(--bw) solid var(--ink);background:var(--ink);color:var(--paper);
  padding:clamp(48px,6vw,84px) clamp(28px,5vw,72px);position:relative;overflow:hidden;
  box-shadow:10px 10px 0 0 var(--osc);
}
.cta::before{
  content:"HANDOFF ▸ HANDOFF ▸ HANDOFF ▸ HANDOFF ▸ HANDOFF ▸ HANDOFF ▸";
  position:absolute;top:16px;left:0;right:0;white-space:nowrap;
  font-family:var(--mono);font-size:.6rem;letter-spacing:.32em;color:rgba(248,246,240,.13);
}
.cta h2{color:var(--paper);max-width:18ch}
.cta p{color:rgba(248,246,240,.6);max-width:62ch;margin-block:20px 34px;line-height:1.75}
.cta .btns{display:flex;gap:20px;flex-wrap:wrap}
.cta .stamp{right:38px;top:44px;color:rgba(248,246,240,.5);border-color:rgba(248,246,240,.5);mix-blend-mode:normal}

/* certs */
.certs{display:flex;justify-content:center;gap:56px;align-items:center;flex-wrap:wrap;padding-block:48px}
.certs img{height:52px;width:auto;opacity:.55;filter:grayscale(1);mix-blend-mode:multiply;transition:all .2s}
.certs img:hover{opacity:.95;filter:none}

/* offices */
.office{background:var(--card);padding:34px 32px;display:flex;flex-direction:column;gap:10px}
.office .where{font-family:var(--mono);font-size:.6rem;letter-spacing:.18em;text-transform:uppercase;font-weight:600;color:var(--blue)}
.office.hq .where{color:var(--proof)}
.office h3{text-transform:uppercase;letter-spacing:.01em;font-size:1.12rem}
.office .addr{font-size:.92rem;color:var(--text)}
.office .notetext{font-size:.85rem;color:var(--muted);line-height:1.68}

/* ================= FOOTER ================= */
footer.dcs-foot{background:var(--ink);color:rgba(248,246,240,.65);font-size:.88rem;border-top:3px solid var(--proof)}
.foot-grid{display:grid;grid-template-columns:3fr 2.5fr 3fr 3fr;gap:46px;padding-block:76px 50px}
.foot-logo img{height:40px;width:auto;margin-bottom:18px}
.foot-desc{font-size:.9rem;color:rgba(248,246,240,.55);max-width:34ch;line-height:1.72}
.foot-social{display:flex;gap:10px;margin-top:24px}
.foot-social a{
  width:38px;height:38px;border:1px solid rgba(248,246,240,.3);
  display:flex;align-items:center;justify-content:center;color:rgba(248,246,240,.75);
  font-family:var(--mono);font-size:.72rem;font-weight:600;transition:all .18s;
}
.foot-social a:hover{border-color:var(--paper);color:var(--ink);background:var(--paper)}
footer.dcs-foot h6{
  font-family:var(--mono);font-size:.6rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;
  color:var(--ink);background:var(--paper);display:inline-block;padding:4px 10px;margin-bottom:15px;
}
footer.dcs-foot h6.gap{margin-top:30px}
.foot-links{list-style:none;display:flex;flex-direction:column;gap:7px}
.foot-links a{color:rgba(248,246,240,.62);font-size:.84rem}
.foot-links a:hover{color:#fff;text-decoration:underline;text-underline-offset:3px}
.foot-links .divider{
  margin-top:12px;padding-top:10px;border-top:1px dashed rgba(248,246,240,.2);
  font-family:var(--mono);font-size:.56rem;letter-spacing:.18em;text-transform:uppercase;
  color:rgba(248,246,240,.38);font-weight:600;
}
.foot-links .hl{color:#f3b04b;font-weight:600}
.foot-links .tagmark{font-family:var(--mono);font-size:.56rem;color:#f3b04b;font-weight:600;letter-spacing:.06em}
.foot-addr{font-size:.84rem;color:rgba(248,246,240,.5);margin-bottom:4px;line-height:1.62}
.foot-bottom{
  border-top:1px solid rgba(248,246,240,.15);padding-block:24px;
  display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;
  font-family:var(--mono);font-size:.66rem;color:rgba(248,246,240,.42);letter-spacing:.04em;
}
.foot-bottom a{color:rgba(248,246,240,.55);margin-left:24px}
.foot-bottom a:first-child{margin-left:0}
.foot-bottom a:hover{color:#fff}

/* ================= CHAT + COOKIE ================= */
.deci{
  position:fixed;right:24px;bottom:24px;z-index:250;
  display:flex;gap:10px;align-items:center;
  background:var(--paper);color:var(--ink);border:var(--bw) solid var(--ink);
  padding:14px 22px;font-family:var(--mono);font-size:.74rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;
  box-shadow:var(--os) var(--os) 0 0 var(--osc);transition:transform .16s, box-shadow .16s;cursor:pointer;
}
.deci:hover{transform:translate(2px,2px);box-shadow:2px 2px 0 0 var(--osc)}
.deci .pulse{width:9px;height:9px;border-radius:50%;background:var(--ok);animation:blink 2.2s infinite}
button.deci{-webkit-appearance:none;appearance:none;line-height:1.15}
.deci .x{display:none}
.deci.active{background:var(--ink);color:var(--paper)}
.deci.active .pulse,.deci.active .txt{display:none}
.deci.active .x{display:inline}
/* Deci chat window (behaviour: main-n.js) */
.chatbot-window{
  position:fixed;right:24px;bottom:92px;z-index:260;width:390px;max-width:calc(100vw - 20px);
  max-height:min(600px,calc(100vh - 116px));display:flex;flex-direction:column;
  background:var(--card);border:var(--bw) solid var(--ink);box-shadow:8px 8px 0 0 var(--osc);
  opacity:0;visibility:hidden;transform:translateY(14px);transition:opacity .2s ease, transform .2s ease, visibility .2s;
}
.chatbot-window.open{opacity:1;visibility:visible;transform:none}
.cb-header{background:var(--ink);color:var(--paper);padding:14px 16px;display:flex;align-items:center;gap:12px;border-bottom:3px solid var(--proof)}
.cb-header-avatar{
  width:36px;height:36px;flex:0 0 auto;display:flex;align-items:center;justify-content:center;
  background:var(--paper);color:var(--ink);font-family:var(--disp);font-stretch:112%;font-weight:800;font-size:1.05rem;
}
.cb-header-info{min-width:0}
.cb-header-info h6{font-family:var(--mono);font-size:.76rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--paper)}
.cb-header-info h6 span{font-weight:400;letter-spacing:.02em;text-transform:none;color:rgba(248,246,240,.6)}
.cb-header-info > span{display:block;font-size:.7rem;color:rgba(248,246,240,.6);line-height:1.4;margin-top:2px}
.cb-close{margin-left:auto;flex:0 0 auto;background:none;border:1px solid rgba(248,246,240,.35);color:var(--paper);font-family:var(--mono);font-size:.8rem;line-height:1;padding:7px 9px;cursor:pointer}
.cb-close:hover{border-color:var(--paper)}
.cb-messages{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:10px;min-height:200px;background:var(--paper)}
.cb-msg{max-width:88%;padding:10px 14px;font-size:.86rem;line-height:1.6;border:1px solid var(--line);overflow-wrap:anywhere}
.cb-msg-bot{align-self:flex-start;background:var(--card);color:var(--text)}
.cb-msg-user{align-self:flex-end;background:var(--ink);border-color:var(--ink);color:var(--paper)}
.cb-msg-bot a{text-decoration:underline;text-underline-offset:2px}
.cb-msg-bot ul,.cb-msg-bot ol{padding-left:1.2em;margin:.4em 0}
.cb-quick-replies{display:flex;flex-wrap:wrap;gap:6px;padding:0 16px 12px;background:var(--paper)}
.cb-quick-replies:empty{display:none}
.cb-quick-btn{
  font-family:var(--mono);font-size:.64rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase;
  background:var(--card);border:var(--bw) solid var(--line);color:var(--ink);padding:6px 10px;cursor:pointer;transition:border-color .15s,background .15s;
}
.cb-quick-btn:hover{border-color:var(--ink);background:#fff}
.cb-input-area{display:flex;gap:8px;padding:12px 14px;border-top:var(--bw) solid var(--ink);background:var(--card)}
.cb-input{flex:1;min-width:0;border:var(--bw) solid var(--line);background:#fff;padding:10px 12px;font-family:var(--disp);font-size:.9rem;color:var(--text);border-radius:0}
.cb-input:focus{outline:none;border-color:var(--ink)}
.cb-send{
  flex:0 0 auto;border:var(--bw) solid var(--ink);background:var(--ink);color:var(--paper);cursor:pointer;
  font-family:var(--mono);font-size:.72rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;padding:0 14px;
}
.cb-send:disabled,.cb-input:disabled{opacity:.55;cursor:default}
.cb-typing{display:flex;gap:5px;padding:12px 14px;align-self:flex-start}
.cb-typing span{width:6px;height:6px;background:var(--muted);animation:cbdot 1.2s infinite}
.cb-typing span:nth-child(2){animation-delay:.2s}
.cb-typing span:nth-child(3){animation-delay:.4s}
@keyframes cbdot{0%,60%,100%{transform:translateY(0);opacity:.5}30%{transform:translateY(-5px);opacity:1}}
@media(max-width:640px){
  .chatbot-window{left:10px;right:10px;width:auto;bottom:84px;max-height:72vh}
  .cb-input{font-size:16px} /* stops iOS zooming into the field */
  .deci.active .x{display:inline}
}
.cookie{
  position:fixed;left:24px;bottom:24px;z-index:250;max-width:390px;
  background:var(--card);border:var(--bw) solid var(--ink);box-shadow:var(--os) var(--os) 0 0 var(--osc);
  padding:16px 18px;font-size:.84rem;color:var(--muted);
  display:flex;gap:14px;align-items:center;
}
.cookie button{flex:0 0 auto;border:var(--bw) solid var(--ink);background:var(--ink);color:var(--paper);padding:9px 14px;font-weight:600;font-size:.7rem;cursor:pointer;font-family:var(--mono);letter-spacing:.06em;text-transform:uppercase}

/* ================= HOMEPAGE · THE AI DESK ================= */
.aid-top{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center;margin-bottom:64px}
.aid-top .hero-ctas{margin-top:30px}
.aid-panel{box-shadow:12px 12px 0 0 rgba(0,0,0,.35);border-color:rgba(248,246,240,.25)}
.aid-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line-d);border:1px solid var(--line-d)}
.aid-card{
  background:var(--ink);padding:30px 26px 28px;display:flex;flex-direction:column;gap:12px;color:inherit;
  transition:background .18s, transform .22s cubic-bezier(.2,.6,.2,1);
}
.aid-card:hover{background:var(--ink-2)}
.aid-code{font-family:var(--mono);font-size:.62rem;font-weight:600;letter-spacing:.18em;color:var(--proof)}
.aid-card h3{color:var(--paper);font-size:1.12rem;line-height:1.3}
.aid-card p{font-size:.88rem;line-height:1.65;color:rgba(248,246,240,.55)}
.aid-go{margin-top:auto;padding-top:8px;font-family:var(--mono);font-size:.7rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:#9db7ee}
.aid-card:hover .aid-go{color:var(--paper)}
.aid-card:hover h3{text-decoration:underline;text-decoration-color:var(--proof);text-decoration-thickness:2px;text-underline-offset:5px}
.aid-strip{
  display:flex;flex-wrap:wrap;align-items:center;gap:10px 26px;margin-top:28px;padding-top:22px;
  border-top:1px dashed var(--line-d);font-family:var(--mono);font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;
}
.aid-strip-lbl{color:rgba(248,246,240,.45)}
.aid-strip a{color:#9db7ee}
.aid-strip a:hover{color:var(--paper)}
@media(max-width:1100px){.aid-top{grid-template-columns:1fr;gap:44px}.aid-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.aid-grid{grid-template-columns:1fr}}

/* ================= HOMEPAGE · DPDP READINESS BAND ================= */
.dpdp-band{padding-block:64px}
.dpdp-card{
  display:grid;grid-template-columns:1fr auto;gap:44px;align-items:center;
  background:var(--card);border:var(--bw) solid var(--ink);border-top:6px solid var(--proof);
  box-shadow:8px 8px 0 0 var(--osc);padding:40px 44px;
}
.dpdp-card .filecode{margin-bottom:18px}
.dpdp-card h2{font-size:clamp(1.5rem,2.7vw,2.2rem);max-width:24ch}
.dpdp-card p{color:var(--muted);margin-top:14px;max-width:62ch;line-height:1.75}
.dpdp-card .hero-ctas{margin-top:26px}
.dpdp-count{
  display:block;text-align:center;border:var(--bw) solid var(--ink);background:var(--paper);
  padding:24px 30px 20px;min-width:220px;color:inherit;transition:transform .16s ease, box-shadow .16s ease;
}
.dpdp-count:hover{transform:translate(-2px,-2px);box-shadow:var(--os) var(--os) 0 0 var(--osc)}
.dpdp-count b{
  display:block;font-family:var(--disp);font-stretch:114%;font-weight:800;line-height:1;
  font-size:clamp(3.2rem,5.4vw,4.6rem);color:var(--proof);font-variant-numeric:tabular-nums;letter-spacing:-.02em;
}
.dpdp-count span{display:block;font-family:var(--mono);font-size:.7rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--ink);margin-top:8px}
.dpdp-count .to{font-size:.58rem;font-weight:500;letter-spacing:.12em;color:var(--muted);margin-top:10px;padding-top:10px;border-top:1px dashed var(--line)}
@media(max-width:900px){
  .dpdp-card{grid-template-columns:1fr;gap:28px;padding:30px 24px}
  .dpdp-count{justify-self:start}
}
@media(max-width:640px){.dpdp-band{padding-block:44px}.dpdp-count{width:100%}}

/* ================= FORMS ================= */
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.form-grid .full{grid-column:1/-1}
.ff label{
  display:block;font-family:var(--mono);font-size:.64rem;font-weight:600;
  letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-bottom:8px;
}
.ff label .req{color:var(--proof)}
.ff input,.ff textarea,.ff select{
  width:100%;background:var(--card);border:var(--bw) solid var(--line);
  padding:13px 15px;font-family:var(--sans, var(--disp));font-size:.95rem;color:var(--text);
  border-radius:0;transition:border-color .15s, box-shadow .15s;
}
.ff input:focus,.ff textarea:focus,.ff select:focus{
  outline:none;border-color:var(--ink);box-shadow:3px 3px 0 0 var(--osc);
}
.ff textarea{min-height:140px;resize:vertical}
.form-alert{
  display:none;border:var(--bw) solid var(--line);padding:14px 18px;
  font-size:.9rem;margin-bottom:18px;background:var(--card);
}
@media(max-width:640px){.form-grid{grid-template-columns:1fr}}

/* ================= RESPONSIVE ================= */
@media(max-width:1100px){
  .nav-menu{display:none}
  .nav-burger{display:block;margin-left:auto}
  .nav-cta{display:none}
  .hero-main{grid-template-columns:1fr!important;gap:48px} /* !important: service pages set columns inline */
  .g4{grid-template-columns:repeat(2,1fr)}
  .g3{grid-template-columns:repeat(2,1fr)}
  .exhibit{grid-template-columns:1fr;gap:40px;padding-block:56px}
  .exhibit.flip .ex-copy{order:1}.exhibit.flip .ex-vis{order:2}
  .steps{grid-template-columns:repeat(2,1fr)}
  .stp::after{content:none}
  .foot-grid{grid-template-columns:1fr 1fr}
  .statband{grid-template-columns:repeat(2,1fr)}
  .stat{border-bottom:1px solid var(--line)}
  .note{display:none}
}
@media(max-width:640px){
  .g2,.g3,.g4,.tst-grid{grid-template-columns:1fr}
  .steps{grid-template-columns:1fr}
  .foot-grid{grid-template-columns:1fr}
  .statband{grid-template-columns:1fr 1fr}
  .sec{padding-block:68px}
  .cookie{left:12px;right:12px;max-width:none}
  .deci span.txt{display:none}
  .cta .stamp{display:none}
  .hero-main{padding-block:48px 0}
}

/* ================= BLOG (blog.php / blog-post.php) =================
   Listing cards, filters, pager, post meta and prose for API-supplied
   post HTML rendered inside .article.post-body. */
.blog-tools{display:flex;flex-wrap:wrap;gap:18px;align-items:center;justify-content:space-between;margin-bottom:34px}
.blog-filters{display:flex;flex-wrap:wrap;gap:8px}
.blog-filter{
  font-family:var(--mono);font-size:.66rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;
  background:var(--card);color:var(--muted);border:var(--bw) solid var(--line);padding:8px 14px;cursor:pointer;
  transition:border-color .15s,color .15s,background .15s;
}
.blog-filter:hover{border-color:var(--ink);color:var(--ink)}
.blog-filter.active{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.blog-search{flex:0 1 320px}
.blog-search input{
  width:100%;background:var(--card);border:var(--bw) solid var(--line);border-radius:0;
  padding:11px 14px;font-family:var(--mono);font-size:.8rem;color:var(--text);
  transition:border-color .15s,box-shadow .15s;
}
.blog-search input:focus{outline:none;border-color:var(--ink);box-shadow:3px 3px 0 0 var(--osc)}
/* grid: hairlines drawn per cell so a short last row stays card-coloured */
.blog-grid{gap:0;background:var(--card);overflow:hidden}
.blog-grid>.cell{border-right:1px solid var(--line);border-bottom:1px solid var(--line);margin:0 -1px -1px 0}
.blog-grid:empty,.blog-grid:has(> .blog-loading[style*="none"]):not(:has(> .cell)){display:none}
.blog-card .blog-thumb{width:calc(100% + 60px);max-width:none;margin:-34px -30px 6px;aspect-ratio:16/9;object-fit:cover;background:var(--paper-2);border-bottom:1px solid var(--line)}
.blog-card .idx time{color:var(--muted)}
.blog-loading{grid-column:1/-1;padding:60px 20px;text-align:center;color:var(--muted);font-family:var(--mono);font-size:.74rem;letter-spacing:.1em;text-transform:uppercase}
.blog-loading .spinner{width:30px;height:30px;border:2px solid var(--line);border-top-color:var(--ink);border-radius:50%;animation:blogspin .8s linear infinite;margin:0 auto 14px}
@keyframes blogspin{to{transform:rotate(360deg)}}
.blog-empty{border:var(--bw) dashed var(--line);background:var(--card);padding:56px 24px;text-align:center;color:var(--muted)}
.blog-empty .idx{display:block;font-family:var(--mono);font-size:.62rem;font-weight:600;letter-spacing:.18em;color:var(--proof);margin-bottom:10px}
.blog-empty h3{margin-bottom:6px}
.blog-pager{text-align:center;margin-top:40px}
.blog-pager .btn{font-family:var(--mono)}

/* single post */
.post-hero h1{max-width:28ch}
.post-hero .filecode a{color:inherit;text-decoration:underline;text-underline-offset:3px}
.post-meta{margin-top:22px;font-family:var(--mono);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.post-meta span+span::before{content:"·";margin:0 10px;opacity:.6}
.post-feat{max-width:960px;margin:0 auto 56px;border:var(--bw) solid var(--ink);box-shadow:var(--os) var(--os) 0 0 var(--osc);background:var(--paper-2)}
.post-feat img{width:100%;height:auto;max-height:520px;object-fit:cover}
.post-body h4{font-family:var(--disp);font-weight:700;font-size:1.02rem;color:var(--ink);margin:1.6em 0 .5em}
.post-body a{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.post-body a:hover{color:var(--proof)}
.post-body strong,.post-body b{color:var(--ink)}
.post-body li{margin-bottom:.4em}
.post-body li>ul,.post-body li>ol{margin:.4em 0}
.post-body hr{border:none;border-top:var(--bw) solid var(--line);margin:2.4em 0}
.post-body blockquote{border-left:3px solid var(--proof);background:var(--paper-2);padding:18px 24px;margin:1.6em 0;font-family:var(--serif);font-style:italic;font-size:1.08rem}
.post-body blockquote p:last-child{margin-bottom:0}
.post-body img{max-width:100%;height:auto;margin:1.4em 0;border:1px solid var(--line)}
.post-body figure{margin:1.6em 0}
.post-body figure img{margin:0}
.post-body figcaption{font-family:var(--mono);font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-top:10px;text-align:center}
.post-body code{font-family:var(--mono);font-size:.88em;background:var(--paper-2);border:1px solid var(--line);padding:1px 5px;color:var(--ink)}
.post-body pre{font-family:var(--mono);background:var(--ink);color:var(--paper);padding:18px 22px;overflow-x:auto;margin:1.4em 0;font-size:.86rem;line-height:1.6;border:var(--bw) solid var(--ink)}
.post-body pre code{background:none;border:0;padding:0;color:inherit;font-size:1em}
.post-body caption{caption-side:top;text-align:left;font-family:var(--mono);font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);padding-bottom:8px}
.post-body iframe,.post-body video{max-width:100%}
.post-back{margin-top:48px}
/* optional CMS extras: audio version, FAQs, tags, author box */
.post-audio{margin-bottom:34px;border:var(--bw) solid var(--ink);background:var(--card);padding:16px 18px}
.post-audio audio{width:100%;display:block;margin-top:10px}
.post-audio .lbl,.post-tags .lbl,.post-author .lbl{font-family:var(--mono);font-size:.62rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.post-faq{margin-top:56px}
.post-faq .faq-wrap{margin-top:20px}
.post-faq .faq .body p:last-child{margin-bottom:0}
.post-tags{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:44px;padding-top:24px;border-top:var(--bw) solid var(--line)}
.post-tags .lbl{margin-right:6px}
.post-tags a{
  font-family:var(--mono);font-size:.66rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;
  color:var(--ink);background:var(--card);border:var(--bw) solid var(--line);padding:6px 11px;transition:border-color .15s,background .15s;
}
.post-tags a:hover{border-color:var(--ink);background:#fff}
.post-author{display:flex;gap:18px;align-items:flex-start;margin-top:32px;border:var(--bw) solid var(--ink);background:var(--card);padding:22px 24px}
.post-author img{width:64px;height:64px;object-fit:cover;border:var(--bw) solid var(--ink);flex:0 0 auto}
.post-author b{display:block;color:var(--ink);font-size:1.02rem;margin-top:4px}
.post-author .role{display:block;font-size:.84rem;color:var(--muted)}
.post-author p{margin:8px 0 0;font-size:.92rem;color:var(--muted);line-height:1.7}
@media(max-width:640px){
  .post-body table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}
  .blog-search{flex-basis:100%}
}