/* ============================================================================
   LawPucho — v3 "The Record"
   ----------------------------------------------------------------------------
   An editorial identity built on paper, ink and one vermilion accent. It loads
   after app.css and theme.css so it can re-map the token layer rather than
   fight individual rules; every component below is written in terms of those
   tokens, so the interior templates that use the old lp-* classes inherit the
   new look without being rewritten.

   Contents
     01 tokens
     02 base + typography
     03 layout primitives (wrap, grid, rules, section heads, noise, mesh)
     04 chrome (topbar, header, nav, mega menu, drawer, search)
     05 buttons, chips, cards
     06 hero
     07 homepage sections
     08 footer
     09 interior template overrides (legacy hex utilities, prose, tables)
     10 motion + reduced motion
   ========================================================================== */

/* ------------------------------------------------------------- 01 tokens -- */
:root{
  /* paper + ink ---------------------------------------------------------- */
  --ink:#0a0a0b;
  --ink-2:#1a1a1d;
  --ink-soft:#3f3f46;
  --ink-mute:#71717a;
  --bg:#f7f5ef;          /* warm paper */
  --bg-2:#f1eee5;
  --bg-3:#e9e5d9;
  --paper:#fbfaf6;
  --line:#e2ded2;
  --line-2:#ece8dd;
  --line-strong:#c9c3b2;

  /* one accent, used sparingly ------------------------------------------- */
  --acc:#d93a1f;
  --acc-2:#e8563c;
  --acc-ink:#a62a14;
  --acc-soft:#fbeeea;
  --acc-line:#f0c9be;
  --ok:#1f7a4d;
  --warn:#b45309;

  /* type ----------------------------------------------------------------- */
  --head:'Inter Tight','Inter',ui-sans-serif,system-ui,-apple-system,sans-serif;
  --body:'Inter',ui-sans-serif,system-ui,-apple-system,sans-serif;
  --mono:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace;

  /* geometry ------------------------------------------------------------- */
  --r-xs:4px; --r-sm:6px; --r-md:10px; --r-lg:14px; --r-xl:20px; --r-full:999px;
  --e1:0 1px 1px rgba(10,10,11,.03),0 2px 6px -2px rgba(10,10,11,.05);
  --e2:0 12px 30px -14px rgba(10,10,11,.22);
  --e3:0 28px 60px -28px rgba(10,10,11,.28);
  --e4:0 40px 90px -40px rgba(166,42,20,.35);

  --t-fast:.14s; --t:.24s; --t-slow:.5s;
  --ease:cubic-bezier(.4,0,.2,1);
  --ease-out:cubic-bezier(.16,1,.3,1);

  --wrap:1240px; --hdr:70px; --gutter:22px;
}

/* --------------------------------------------------- 02 base + type ------- */
html{-webkit-text-size-adjust:100%; scroll-behavior:smooth; scroll-padding-top:96px}
body{
  font-family:var(--body)!important;
  background:var(--bg)!important; color:var(--ink)!important;
  font-size:16px; line-height:1.65;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  font-feature-settings:"ss01" 1,"cv11" 1;
}
h1,h2,h3,h4,h5,h6,.lp-serif{
  font-family:var(--head)!important; color:var(--ink);
  letter-spacing:-.032em; line-height:1.06; font-weight:680;
  text-wrap:balance;
}
h1{font-size:clamp(2.6rem,5.2vw,4.6rem); letter-spacing:-.042em; font-weight:700}
h2{font-size:clamp(1.85rem,3.2vw,2.9rem)}
h3{font-size:clamp(1.15rem,1.5vw,1.35rem); letter-spacing:-.02em; line-height:1.3}
h4{font-size:1.02rem; letter-spacing:-.015em; line-height:1.35}
p{text-wrap:pretty}
.lede{font-size:clamp(1.05rem,1.35vw,1.22rem); line-height:1.6; color:var(--ink-soft); max-width:62ch}
.mono-label{
  font-family:var(--mono); font-size:11.5px; font-weight:500;
  letter-spacing:.16em; text-transform:uppercase; color:var(--ink-mute);
}
.acc-text{color:var(--acc)}
.acc-underline{
  box-shadow:inset 0 -.42em 0 var(--acc-soft);
  background:linear-gradient(transparent 62%,var(--acc-soft) 62%);
}
::selection{background:var(--acc); color:#fff}
a{color:inherit; text-decoration:none}
:focus-visible{outline:2px solid var(--acc); outline-offset:3px; border-radius:2px}
hr{border:0; border-top:1px solid var(--line)}

/* ------------------------------------------------- 03 layout primitives --- */
.lp-wrap{max-width:var(--wrap); margin:0 auto; padding-left:var(--gutter); padding-right:var(--gutter)}
@media(min-width:1024px){ .lp-wrap{padding-left:36px; padding-right:36px} }

/* paper grain: one inline SVG, no network cost */
body::before{
  content:""; position:fixed; inset:0; z-index:0; pointer-events:none; opacity:.5;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.055'/%3E%3C/svg%3E");
  mix-blend-mode:multiply;
}
body > *{position:relative; z-index:1}

.lp-sec{padding:clamp(64px,7vw,104px) 0}
.lp-sec-tight{padding:clamp(40px,4vw,60px) 0}
.lp-sec-alt{background:var(--bg-2); border-top:1px solid var(--line); border-bottom:1px solid var(--line)}

.v3-head{display:flex; align-items:flex-end; justify-content:space-between; gap:28px; margin-bottom:clamp(28px,3.4vw,44px)}
.v3-head-copy{max-width:60ch}
.v3-eyebrow{display:flex; align-items:center; gap:10px; margin-bottom:14px}
.v3-eyebrow .n{font-family:var(--mono); font-size:11px; letter-spacing:.18em; color:var(--acc); font-weight:600}
.v3-eyebrow .r{width:26px; height:1px; background:var(--line-strong)}
.v3-head h2{margin:0}
.v3-head p{margin:14px 0 0; color:var(--ink-soft); font-size:1.02rem; max-width:56ch}
.v3-head-link{
  font-family:var(--mono); font-size:11.5px; letter-spacing:.12em; text-transform:uppercase;
  color:var(--ink); border-bottom:1px solid var(--ink); padding-bottom:4px; white-space:nowrap;
  transition:color var(--t) var(--ease), border-color var(--t) var(--ease);
}
.v3-head-link:hover{color:var(--acc); border-color:var(--acc)}
@media(max-width:700px){ .v3-head{flex-direction:column; align-items:flex-start; gap:18px} }

/* gradient mesh: three soft fields, cheap to paint */
.v3-mesh{position:absolute; inset:0; overflow:hidden; pointer-events:none; z-index:0}
.v3-mesh i{position:absolute; display:block; border-radius:50%; filter:blur(70px); opacity:.5}
.v3-mesh .a{width:520px; height:520px; left:-8%; top:-24%; background:radial-gradient(circle,#f6d3c6 0%,rgba(246,211,198,0) 70%)}
.v3-mesh .b{width:420px; height:420px; right:-6%; top:6%; background:radial-gradient(circle,#dfe3d2 0%,rgba(223,227,210,0) 70%)}
.v3-mesh .c{width:380px; height:380px; left:38%; bottom:-32%; background:radial-gradient(circle,#e7e0f0 0%,rgba(231,224,240,0) 70%)}

/* --------------------------------------------------------- 04 chrome ----- */
.lp-topbar{
  background:var(--ink); color:#a1a1aa; font-size:12px; letter-spacing:.02em;
  border-bottom:1px solid #27272a; animation:none!important; padding:8px 0;
}
.lp-topbar .lp-wrap{display:flex; justify-content:space-between; gap:20px; flex-wrap:wrap}
.lp-tb-items{display:flex; align-items:center; gap:22px; flex-wrap:wrap}
.lp-tb-items b{color:#fafafa; font-weight:600}
.lp-tb-items a{color:#d4d4d8; border-bottom:1px solid transparent}
.lp-tb-items a:hover{color:#fff; border-color:var(--acc)}
.lp-tb-dot{width:5px; height:5px; border-radius:50%; background:var(--acc); display:inline-block}
.lp-gold{color:var(--acc-2)!important}

.lp-hdr{
  position:sticky; top:0; z-index:60; height:var(--hdr);
  background:rgba(247,245,239,.86); backdrop-filter:saturate(180%) blur(14px);
  border-bottom:1px solid var(--line); transition:box-shadow var(--t) var(--ease), background var(--t);
}
.lp-hdr.is-stuck{box-shadow:0 8px 24px -18px rgba(10,10,11,.4); background:rgba(247,245,239,.95)}
.lp-hdr-in{display:flex; align-items:center; gap:18px; height:var(--hdr)}
.lp-brand{display:flex; align-items:center; gap:11px; flex:0 0 auto}
.lp-mark{
  width:34px; height:34px; border-radius:8px; display:grid; place-items:center;
  background:var(--ink); color:#fff; font-size:14px; letter-spacing:0;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.08);
}
.lp-wordmark{font-family:var(--head); font-weight:700; font-size:19px; letter-spacing:-.04em; line-height:1}
.lp-wordmark em{font-style:normal; color:var(--acc)}
.lp-brand-sub{
  display:block; font-family:var(--mono); font-size:9.5px; letter-spacing:.14em;
  text-transform:uppercase; color:var(--ink-mute); margin-top:4px;
}
.lp-nav{display:flex; align-items:center; gap:2px; margin-left:8px}
.lp-navitem{position:relative}
.lp-navlink{
  display:inline-flex; align-items:center; gap:6px; padding:9px 12px;
  font-size:14px; font-weight:500; color:var(--ink-soft); border-radius:6px;
  transition:color var(--t), background var(--t);
}
.lp-navlink:hover{color:var(--ink); background:rgba(10,10,11,.04)}
.lp-caret{font-size:8px; opacity:.5; transition:transform var(--t)}
.lp-navitem:hover .lp-caret{transform:rotate(180deg)}
.lp-mega{
  position:absolute; top:calc(100% + 10px); left:-12px; min-width:720px;
  background:var(--paper); border:1px solid var(--line); border-radius:var(--r-lg);
  box-shadow:var(--e3); padding:20px; opacity:0; visibility:hidden;
  transform:translateY(-6px); transition:all var(--t) var(--ease-out);
}
.lp-navitem:hover .lp-mega, .lp-navitem:focus-within .lp-mega{opacity:1; visibility:visible; transform:none}
.lp-mega-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:22px}
.lp-mega-col h4{
  font-family:var(--mono); font-size:10px; letter-spacing:.16em; text-transform:uppercase;
  color:var(--ink-mute); font-weight:600; margin-bottom:10px;
}
.lp-mega-col a{
  display:flex; align-items:center; gap:9px; padding:7px 8px; margin-left:-8px;
  font-size:13.5px; color:var(--ink-soft); border-radius:6px;
}
.lp-mega-col a:hover{background:var(--bg-2); color:var(--ink)}
.lp-mega-col i{width:14px; font-size:12px; color:var(--acc); opacity:.85}
.lp-mega-foot{display:flex; gap:18px; margin-top:16px; padding-top:14px; border-top:1px solid var(--line-2)}
.lp-mega-foot a{font-family:var(--mono); font-size:11px; letter-spacing:.08em; color:var(--ink-mute)}
.lp-mega-foot a:hover{color:var(--acc)}

.lp-searchbox{flex:1 1 auto; max-width:340px; margin-left:auto}
.lp-cta{
  display:inline-flex; align-items:center; gap:8px; flex:0 0 auto;
  background:var(--ink); color:#fff; font-size:13.5px; font-weight:600;
  padding:10px 16px; border-radius:var(--r-sm);
  transition:transform var(--t) var(--ease-out), background var(--t), box-shadow var(--t);
}
.lp-cta:hover{background:var(--acc); transform:translateY(-1px); box-shadow:0 10px 22px -12px rgba(217,58,31,.6)}
.lp-cta i{font-size:12px}
.lp-burger{display:none; width:38px; height:38px; border-radius:6px; border:1px solid var(--line); background:transparent}
.lp-burger span{display:block; width:16px; height:1.5px; background:var(--ink); margin:3.5px auto; transition:transform var(--t)}

.lp-drawer{position:fixed; inset:0; z-index:90; visibility:hidden; opacity:0; transition:opacity var(--t) var(--ease)}
.lp-drawer::before{content:""; position:absolute; inset:0; background:rgba(10,10,11,.42); backdrop-filter:blur(3px)}
.lp-drawer.is-open{visibility:visible; opacity:1}
.lp-drawer-panel{
  position:absolute; top:0; right:0; bottom:0; width:min(400px,88vw);
  background:var(--paper); border-left:1px solid var(--line);
  display:flex; flex-direction:column; transform:translateX(100%);
  transition:transform var(--t-slow) var(--ease-out);
}
.lp-drawer.is-open .lp-drawer-panel{transform:none}
.lp-drawer-hd{display:flex; align-items:center; justify-content:space-between; padding:16px 18px; border-bottom:1px solid var(--line)}
.lp-drawer-bd{padding:16px 18px; overflow-y:auto; flex:1}
.lp-drawer-sec{
  font-family:var(--mono); font-size:10px; letter-spacing:.16em; text-transform:uppercase;
  color:var(--ink-mute); margin:20px 0 8px;
}
.lp-drawer-bd a{display:flex; align-items:center; gap:11px; padding:11px 8px; font-size:14.5px; border-radius:6px; color:var(--ink-soft)}
.lp-drawer-bd a:hover{background:var(--bg-2); color:var(--ink)}
.lp-drawer-bd i{width:16px; color:var(--acc); font-size:13px}
.lp-drawer-ft{padding:14px 18px; border-top:1px solid var(--line); display:grid; gap:8px}

/* ---------------------------------------------- 05 buttons, chips, cards -- */
.lp-btn{
  display:inline-flex; align-items:center; justify-content:center; gap:9px;
  font-family:var(--body); font-size:14px; font-weight:600; letter-spacing:-.005em;
  padding:12px 20px; border-radius:var(--r-sm); border:1px solid transparent;
  cursor:pointer; transition:all var(--t) var(--ease-out); white-space:nowrap;
}
.lp-btn-primary{background:var(--ink); color:#fff}
.lp-btn-primary:hover{background:var(--acc); transform:translateY(-1px); box-shadow:0 12px 26px -14px rgba(217,58,31,.65)}
.lp-btn-accent{background:var(--acc); color:#fff}
.lp-btn-accent:hover{background:var(--acc-ink); transform:translateY(-1px)}
.lp-btn-ghost{background:transparent; color:var(--ink); border-color:var(--line-strong)}
.lp-btn-ghost:hover{border-color:var(--ink); background:var(--paper)}
.lp-btn-dark{background:var(--ink-2); color:#fff}
.lp-btn-lg{padding:15px 26px; font-size:15px}
.lp-btn-block{width:100%}

.lp-chip{
  display:inline-flex; align-items:center; gap:7px; padding:7px 12px;
  font-size:12.5px; font-weight:500; color:var(--ink-soft);
  background:var(--paper); border:1px solid var(--line); border-radius:var(--r-full);
  transition:all var(--t) var(--ease);
}
.lp-chip:hover{border-color:var(--acc); color:var(--acc-ink); background:var(--acc-soft)}
.lp-chip i{font-size:11px; color:var(--acc)}

.lp-card{
  background:var(--paper); border:1px solid var(--line); border-radius:var(--r-lg);
  padding:22px; transition:transform var(--t) var(--ease-out), box-shadow var(--t), border-color var(--t);
  position:relative; overflow:hidden;
}
.lp-card::after{
  content:""; position:absolute; left:0; top:0; height:2px; width:0; background:var(--acc);
  transition:width var(--t-slow) var(--ease-out);
}
.lp-card:hover{transform:translateY(-3px); box-shadow:var(--e2); border-color:var(--line-strong)}
.lp-card:hover::after{width:100%}

.lp-cat{display:flex; flex-direction:column; gap:10px}
.lp-cat-ic{
  width:38px; height:38px; border-radius:9px; display:grid; place-items:center;
  background:var(--acc-soft); color:var(--acc-ink); font-size:15px;
}

/* ----------------------------------------------------------- 06 hero ----- */
.lp-hero{
  position:relative; overflow:hidden; background:var(--bg);
  border-bottom:1px solid var(--line);
  padding:clamp(56px,7vw,96px) 0 clamp(48px,6vw,80px);
}
.lp-hero-in{position:relative; z-index:2; display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); gap:clamp(32px,5vw,72px); align-items:center}
.lp-hero-copy{max-width:640px}
.lp-hero h1{margin:16px 0 0; color:var(--ink)}
.lp-hero h1 .line{display:block}
.lp-hero h1 em{font-style:normal; color:var(--acc); position:relative; white-space:nowrap}
.lp-hero h1 em::after{
  content:""; position:absolute; left:0; right:0; bottom:.08em; height:.06em;
  background:var(--acc); opacity:.25; transform:scaleX(0); transform-origin:left;
  animation:v3Rule .9s var(--ease-out) .75s forwards;
}
@keyframes v3Rule{to{transform:scaleX(1)}}
.lp-hero-lead{margin:22px 0 0; font-size:clamp(1.02rem,1.25vw,1.15rem); line-height:1.65; color:var(--ink-soft); max-width:56ch}
.lp-hero-tags{display:flex; flex-wrap:wrap; gap:8px; margin-top:26px}
.lp-hero-stats{
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr));
  margin-top:38px; border-top:1px solid var(--line); padding-top:22px; gap:18px;
}
.v3-stat{display:flex; flex-direction:column; gap:4px}
.v3-stat b{font-family:var(--head); font-size:clamp(1.55rem,2.4vw,2.05rem); font-weight:700; letter-spacing:-.04em; line-height:1; font-variant-numeric:tabular-nums}
.v3-stat span{font-family:var(--mono); font-size:10.5px; letter-spacing:.13em; text-transform:uppercase; color:var(--ink-mute)}

/* hero search */
.lp-hero-search{margin-top:30px; max-width:560px}
.lp-hero-search form{display:flex; align-items:center; gap:0; background:var(--paper); border:1px solid var(--line-strong); border-radius:var(--r-md); padding:5px; box-shadow:var(--e1); transition:border-color var(--t), box-shadow var(--t)}
.lp-hero-search form:focus-within{border-color:var(--ink); box-shadow:var(--e2)}
.lp-hero-search input{
  flex:1; border:0; background:transparent; padding:11px 13px; font-family:var(--body);
  font-size:15px; color:var(--ink); outline:none; min-width:0;
}
.lp-hero-search input::placeholder{color:var(--ink-mute)}
.lp-hero-search button{
  border:0; background:var(--ink); color:#fff; border-radius:var(--r-sm);
  padding:11px 18px; font-size:13.5px; font-weight:600; cursor:pointer; white-space:nowrap;
  transition:background var(--t);
}
.lp-hero-search button:hover{background:var(--acc)}

/* hero art: pure SVG, drawn on load */
.v3-hero-art{position:relative; aspect-ratio:1/1; max-width:520px; margin-left:auto; width:100%}
.v3-hero-art svg{width:100%; height:100%; overflow:visible}
.v3-hero-art .ring{fill:none; stroke:var(--line-strong); stroke-width:1}
.v3-hero-art .ring-acc{fill:none; stroke:var(--acc); stroke-width:1.25; stroke-dasharray:4 6; opacity:.55}
.v3-hero-art .beam{stroke:var(--ink); stroke-width:1; opacity:.16}
.v3-hero-art .node{fill:var(--paper); stroke:var(--ink); stroke-width:1.4}
.v3-hero-art .node-acc{fill:var(--acc); stroke:var(--acc)}
.v3-hero-art .glyph{fill:none; stroke:var(--ink); stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round}
.v3-hero-art .lbl{font-family:var(--mono); font-size:8.5px; letter-spacing:.14em; fill:var(--ink-mute); text-transform:uppercase}
.v3-hero-art .sat{fill:var(--acc)}
@media(max-width:900px){
  .lp-hero-in{grid-template-columns:1fr; gap:36px}
  .v3-hero-art{max-width:360px; margin:0 auto; order:-1}
}

/* ---------------------------------------------------- 07 homepage -------- */
.lp-g2{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px}
.lp-g3{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px}
.lp-g4{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px}
@media(max-width:1024px){ .lp-g4{grid-template-columns:repeat(2,minmax(0,1fr))} .lp-g3{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media(max-width:640px){ .lp-g2,.lp-g3,.lp-g4{grid-template-columns:1fr} }

/* topic cards */
.v3-topic{
  display:flex; flex-direction:column; justify-content:space-between; gap:22px;
  min-height:148px; padding:20px 20px 18px;
}
.v3-topic h3{margin:0; font-size:16.5px}
.v3-topic p{margin:6px 0 0; font-size:13px; color:var(--ink-mute); line-height:1.5}
.v3-topic .top{display:flex; align-items:center; justify-content:space-between}
.v3-topic .count{
  font-family:var(--mono); font-size:10.5px; letter-spacing:.1em; color:var(--ink-mute);
  background:var(--bg-2); border:1px solid var(--line); border-radius:var(--r-full); padding:3px 8px;
}
.v3-topic .arrow{
  width:26px; height:26px; border-radius:50%; border:1px solid var(--line); display:grid; place-items:center;
  font-size:10px; color:var(--ink-mute); transition:all var(--t) var(--ease-out);
}
.v3-topic:hover .arrow{background:var(--acc); border-color:var(--acc); color:#fff; transform:rotate(-45deg)}

/* question rows: an editorial index, not a card grid */
.v3-qlist{border-top:1px solid var(--line)}
.v3-qrow{
  display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:18px; align-items:baseline;
  padding:17px 4px; border-bottom:1px solid var(--line); transition:background var(--t), padding var(--t);
}
.v3-qrow:hover{background:var(--paper); padding-left:12px; padding-right:12px}
.v3-qrow .idx{font-family:var(--mono); font-size:11px; color:var(--ink-mute); letter-spacing:.08em; font-variant-numeric:tabular-nums}
.v3-qrow .q{font-size:15.5px; font-weight:500; letter-spacing:-.012em; line-height:1.45; color:var(--ink)}
.v3-qrow:hover .q{color:var(--acc-ink)}
.v3-qrow .meta{font-family:var(--mono); font-size:10.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-mute); white-space:nowrap}
@media(max-width:700px){ .v3-qrow{grid-template-columns:auto 1fr; gap:12px} .v3-qrow .meta{display:none} }

/* numbered process */
.v3-steps{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1px; background:var(--line); border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden}
.v3-step{background:var(--paper); padding:clamp(22px,2.6vw,32px); position:relative}
.v3-step .n{
  font-family:var(--mono); font-size:11px; letter-spacing:.16em; color:var(--acc); font-weight:600;
  display:flex; align-items:center; gap:9px; margin-bottom:18px;
}
.v3-step .n::after{content:""; flex:1; height:1px; background:var(--line)}
.v3-step h3{margin:0 0 8px; font-size:17px}
.v3-step p{margin:0; font-size:13.8px; color:var(--ink-soft); line-height:1.6}
@media(max-width:800px){ .v3-steps{grid-template-columns:1fr} }

/* city rail */
.v3-rail{display:flex; gap:10px; overflow-x:auto; padding-bottom:6px; scrollbar-width:none}
.v3-rail::-webkit-scrollbar{display:none}
.v3-city{
  flex:0 0 auto; display:flex; align-items:center; gap:9px; padding:11px 15px;
  background:var(--paper); border:1px solid var(--line); border-radius:var(--r-full);
  font-size:13.5px; transition:all var(--t) var(--ease);
}
.v3-city:hover{border-color:var(--ink); transform:translateY(-1px)}
.v3-city b{font-family:var(--mono); font-size:10px; color:var(--ink-mute); font-weight:500}

/* CTA band */
.v3-band{
  position:relative; overflow:hidden; background:var(--ink); color:#fafafa;
  border-radius:var(--r-xl); padding:clamp(38px,5vw,64px);
  display:grid; grid-template-columns:minmax(0,1fr) auto; gap:36px; align-items:center;
}
.v3-band::before{
  content:""; position:absolute; inset:0; opacity:.5;
  background:
    radial-gradient(600px 240px at 88% -10%, rgba(217,58,31,.5), transparent 70%),
    radial-gradient(400px 260px at 6% 110%, rgba(217,58,31,.22), transparent 70%);
}
.v3-band > *{position:relative}
.v3-band h2{color:#fff; font-size:clamp(1.7rem,3vw,2.5rem); margin:0}
.v3-band p{color:#c9c9cf; margin:12px 0 0; max-width:48ch; font-size:15px; line-height:1.6}
.v3-band .v3-band-cta{display:flex; gap:10px; flex-wrap:wrap}
.v3-band .lp-btn-primary{background:#fff; color:var(--ink)}
.v3-band .lp-btn-primary:hover{background:var(--acc); color:#fff}
.v3-band .lp-btn-ghost{border-color:rgba(255,255,255,.28); color:#fff}
.v3-band .lp-btn-ghost:hover{background:rgba(255,255,255,.08); border-color:#fff}
@media(max-width:800px){ .v3-band{grid-template-columns:1fr} }

/* marquee (kept, restyled) */
.lp-marquee{overflow:hidden; border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:var(--paper)}
.lp-mq-track{display:flex; gap:44px; padding:13px 0; width:max-content; animation:lpMq 38s linear infinite}
.lp-mq-item{font-family:var(--mono); font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-mute); white-space:nowrap; display:flex; align-items:center; gap:10px}
.lp-mq-item::before{content:""; width:4px; height:4px; background:var(--acc); border-radius:50%}
@keyframes lpMq{to{transform:translateX(-50%)}}

/* ----------------------------------------------------------- 08 footer --- */
.lp-footer{background:var(--ink); color:#a1a1aa; padding:clamp(48px,6vw,72px) 0 0; margin-top:0}
.lp-footer h4{color:#fafafa; font-family:var(--mono); font-size:10.5px; letter-spacing:.16em; text-transform:uppercase; font-weight:600; margin:0 0 14px}
.lp-fcols{display:grid; grid-template-columns:1.35fr repeat(3,1fr); gap:40px}
.lp-flink{display:block; font-size:13.5px; color:#a1a1aa; padding:5px 0; transition:color var(--t)}
.lp-flink:hover{color:#fff}
.lp-footer .lp-brand{color:#fff}
.lp-footer .lp-brand-sub{color:#71717a}
.lp-footer .lp-mark{background:#fff; color:var(--ink)}
.lp-fsoc{display:flex; gap:8px; margin-top:18px}
.lp-fsoc a{
  width:34px; height:34px; border-radius:50%; border:1px solid #27272a; display:grid; place-items:center;
  color:#a1a1aa; font-size:13px; transition:all var(--t);
}
.lp-fsoc a:hover{background:var(--acc); border-color:var(--acc); color:#fff}
.lp-fbot{
  border-top:1px solid #27272a; margin-top:44px; padding:20px 0;
  display:flex; justify-content:space-between; gap:18px; flex-wrap:wrap;
  font-size:12px; color:#71717a;
}
.lp-fbot a{color:#a1a1aa}
.lp-fbot a:hover{color:#fff}
@media(max-width:900px){ .lp-fcols{grid-template-columns:1fr 1fr; gap:28px} }
@media(max-width:560px){ .lp-fcols{grid-template-columns:1fr} }

/* ------------------------------------ 09 interior template overrides ----- */
/* the interior templates carry literal Tailwind hex classes; re-map the tokens
   to the paper/ink palette without touching their markup. Exact-token (~=) so
   tinted variants such as /5 are not painted solid. */
[class~="text-[#0F172A]"]{color:var(--ink)!important}
[class~="bg-[#0F172A]"]{background-color:var(--ink)!important}
[class~="border-[#0F172A]"]{border-color:var(--ink)!important}
[class~="hover:text-[#0F172A]"]:hover{color:var(--ink)!important}
[class~="hover:bg-[#0F172A]"]:hover{background-color:var(--acc-ink)!important}
[class~="text-[#F59E0B]"]{color:var(--acc)!important}
[class~="bg-[#F59E0B]"]{background-color:var(--acc)!important}
[class~="border-[#F59E0B]"]{border-color:var(--acc)!important}
[class~="hover:text-[#F59E0B]"]:hover{color:var(--acc)!important}
[class~="hover:bg-[#F59E0B]"]:hover{background-color:var(--acc)!important}
[class~="hover:border-[#F59E0B]"]:hover{border-color:var(--acc)!important}
[class~="focus:border-[#F59E0B]"]:focus{border-color:var(--acc)!important}
[class~="text-[#1E293B]"]{color:var(--ink-soft)!important}
[class~="from-[#0F172A]"]{background-image:linear-gradient(160deg,#0a0a0b,#1a1a1d 60%,#0a0a0b)!important}
[class~="to-[#1E293B]"]{background-image:linear-gradient(160deg,#0a0a0b,#1a1a1d 60%,#0a0a0b)!important}
[class~="text-[#EF4444]"]{color:var(--acc)!important}

/* long-form interiors */
.prose{max-width:70ch}
.prose h2{margin:2.2em 0 .5em}
.prose h3{margin:1.8em 0 .4em}
.prose p{margin:0 0 1.05em; color:var(--ink-soft); line-height:1.75}
.prose ul,.prose ol{padding-left:1.15em; margin:0 0 1.1em}
.prose li{margin:.4em 0; color:var(--ink-soft)}
.prose blockquote{
  margin:1.6em 0; padding:2px 0 2px 20px; border-left:2px solid var(--acc);
  font-size:1.06em; color:var(--ink);
}
.prose table{width:100%; border-collapse:collapse; margin:1.6em 0; font-size:14px}
.prose th{text-align:left; font-family:var(--mono); font-size:10.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-mute); border-bottom:1px solid var(--ink); padding:10px 12px 10px 0}
.prose td{border-bottom:1px solid var(--line); padding:11px 12px 11px 0; vertical-align:top}
.prose code{font-family:var(--mono); font-size:.88em; background:var(--bg-2); padding:2px 5px; border-radius:3px; border:1px solid var(--line)}

/* cards and panels written with old utility classes */
.bg-white.rounded-2xl, .bg-white.rounded-xl{
  border-color:var(--line)!important; box-shadow:var(--e1)!important; background:var(--paper)!important;
}
.rounded-2xl.border, .rounded-xl.border{border-color:var(--line)!important}

/* ---------------------------------------------- 10 motion + a11y --------- */
[data-v3="fade"]{opacity:0}
.v3-in{opacity:1!important}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important; transition:none!important}
  html{scroll-behavior:auto}
  [data-v3]{opacity:1!important; transform:none!important}
  .v3-hero-art .glyph,.v3-hero-art .ring-acc{stroke-dasharray:none!important; stroke-dashoffset:0!important}
}