/* =====================================================================
   BRIDGEWELL MEDIA — NEO-BRUTALIST / STRUCTURAL-HONEST
   VARIANT v3 — "BRAND TEAL BRUTALIST"
   ---------------------------------------------------------------------
   Re-skin of 02-neo-brutalist.html: layout, structure, all 9 sections,
   copy and accessibility are UNCHANGED. Only the colour palette and the
   typography differ. Palette is in continuity with the company's
   Accessibility Snapshot PDF (cream / brand navy / deep teal / warm sand).
   The brutalist character is intact: hard 2-3px borders, flat colour
   blocks, offset sticker badges, snap hover states.

   PALETTE
   - Cream  #F5EFE3  page / paper background
   - Navy   #0B2239  ink: text + every border
   - Muted  #4A5A6A  secondary text on cream
   - Teal   #0A5C5A  primary accent  (ALWAYS carries white/cream text)
   - Sand   #E9D9B5  secondary accent (ALWAYS carries navy text)

   CONTRAST AUDIT (WCAG 2.2 AA — body >=4.5:1, large/UI >=3:1):
   - Navy #0B2239 on Cream #F5EFE3 ............ 14.08:1  (AAA body)
   - Cream #F5EFE3 on Navy #0B2239 ............ 14.08:1  (AAA inverted)
   - Muted #4A5A6A on Cream #F5EFE3 ............ 6.19:1   (AAA secondary)
   - Teal #0A5C5A on Cream #F5EFE3 ............. 6.81:1   (AAA heading/link/UI)
   - White #FFFFFF on Teal #0A5C5A ............. 7.80:1   (AAA text on teal block)
   - Cream #F5EFE3 on Teal #0A5C5A ............. 6.81:1   (AAA text on teal block)
   - Navy #0B2239 on Sand #E9D9B5 ............. 11.56:1  (AAA text on sand block)
   - Sand #E9D9B5 on Navy #0B2239 ............. 11.56:1  (AAA accent-on-dark)
   - White #FFFFFF on Navy #0B2239 ............ 16.13:1  (AAA text on navy block)
   - Light #D6CDBB on Navy #0B2239 ............ 10.22:1  (AAA secondary on dark)
   CAVEAT / GUARDRAIL: navy-on-teal (2.07:1) and teal-on-navy (2.07:1)
   are NOT used anywhere — teal pairs only with white/cream, sand only
   with navy, which is why teal cannot double as the accent-on-dark
   colour the way the old lime did (sand fills that role instead).
   Colour is NEVER the sole signal: every status uses an icon/label/border too.
   ===================================================================== */

:root{
  --paper:#F5EFE3;       /* cream page background */
  --ink:#0B2239;         /* brand navy foreground */
  --ink-muted:#4A5A6A;   /* secondary text, 6.19:1 on cream */
  --teal:#0A5C5A;        /* primary accent — white/cream text only */
  --sand:#E9D9B5;        /* secondary accent — navy text only */
  --on-dark:#D6CDBB;     /* warm light, secondary text on navy, 10.22:1 */
  --line:#0B2239;        /* border colour = ink */
  --bw:3px;              /* standard border weight */
  --shadow:6px 6px 0 var(--ink);
  --shadow-lg:10px 10px 0 var(--ink);
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{animation-duration:0.001ms !important;animation-iteration-count:1 !important;transition-duration:0.001ms !important;}
}

body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:'Space Mono',ui-monospace,Menlo,Consolas,monospace;
  font-size:18px;
  line-height:1.55;
  font-weight:400;
  -webkit-font-smoothing:antialiased;
  /* subtle structural grid behind everything — purely decorative */
  background-image:
    linear-gradient(to right, rgba(11,34,57,0.05) 1px, transparent 1px);
  background-size:48px 48px;
}

/* ---- skip link ---- */
.skip{
  position:absolute;left:-9999px;top:0;z-index:200;
  background:var(--ink);color:var(--paper);
  padding:.75rem 1.25rem;font-family:'Space Mono',monospace;font-weight:700;
  border:var(--bw) solid var(--ink);
}
.skip:focus{left:1rem;top:1rem;}

/* ---- typographic system ---- */
h1,h2,h3,h4{font-family:'Archivo',sans-serif;font-weight:900;line-height:1.02;letter-spacing:-0.02em;margin:0;text-transform:uppercase;}
h1{font-size:clamp(2.8rem,7vw,5.6rem);}
h2{font-size:clamp(2rem,4.2vw,3.4rem);}
h3{font-size:clamp(1.25rem,2vw,1.6rem);}
p{margin:0 0 1rem;}
a{color:var(--teal);text-decoration-thickness:2px;text-underline-offset:3px;}
a:hover{text-decoration-thickness:3px;}

.mono{font-family:'Space Mono',monospace;font-weight:700;text-transform:uppercase;letter-spacing:0.08em;font-size:.78rem;}
.eyebrow{display:inline-block;font-family:'Space Mono',monospace;font-weight:700;text-transform:uppercase;letter-spacing:0.14em;font-size:.78rem;padding:.4rem .7rem;border:var(--bw) solid var(--ink);background:var(--paper);}

/* ---- focus visibility (every interactive element) ---- */
:focus-visible{
  outline:4px solid var(--teal);
  outline-offset:3px;
}
a:focus-visible{outline-offset:2px;}

/* ---- shared layout rails ---- */
.wrap{max-width:1240px;margin:0 auto;padding:0 24px;}
.band{border-bottom:var(--bw) solid var(--ink);}

/* ---- buttons ---- */
.btn{
  display:inline-flex;align-items:center;gap:.55rem;
  font-family:'Space Mono',monospace;font-weight:700;text-transform:uppercase;letter-spacing:0.04em;
  font-size:.95rem;
  padding:.95rem 1.4rem;
  border:var(--bw) solid var(--ink);
  background:var(--teal);color:#FFFFFF;
  text-decoration:none;cursor:pointer;
  box-shadow:var(--shadow);
  transition:transform .12s ease, box-shadow .12s ease;
}
.btn:hover{transform:translate(-3px,-3px);box-shadow:9px 9px 0 var(--ink);text-decoration:none;}
.btn:active{transform:translate(2px,2px);box-shadow:2px 2px 0 var(--ink);}
.btn--blue{background:var(--teal);color:#FFFFFF;}
.btn--ghost{background:var(--paper);color:var(--ink);}
.btn--sun{background:var(--sand);color:var(--ink);}
.btn .arrow{font-size:1.1em;line-height:1;}

/* =====================================================================
   NAV — split asymmetric bar, wordmark boxed left, links + CTA right
   ===================================================================== */
.topbar{
  position:sticky;top:0;z-index:100;
  background:var(--paper);
  border-bottom:var(--bw) solid var(--ink);
}
.topbar__inner{
  display:flex;align-items:stretch;justify-content:space-between;
  max-width:1240px;margin:0 auto;
}
.brand{
  display:flex;align-items:center;gap:.7rem;
  padding:1rem 24px;
  border-right:var(--bw) solid var(--ink);
  background:var(--ink);color:var(--paper);
  text-decoration:none;
}
.brand:hover{text-decoration:none;}
.brand__mark{
  width:30px;height:30px;flex:none;
  background:var(--teal);border:2px solid var(--paper);
  display:grid;place-items:center;
  font-family:'Space Mono',monospace;font-weight:700;color:#FFFFFF;font-size:1rem;
}
.brand__name{font-family:'Archivo',sans-serif;font-weight:900;text-transform:uppercase;letter-spacing:-0.01em;font-size:1.15rem;}
.brand__name span{color:var(--sand);}
.nav{display:flex;align-items:stretch;}
.nav__links{display:flex;align-items:center;gap:0;list-style:none;margin:0;padding:0;}
.nav__links a{
  display:flex;align-items:center;height:100%;
  padding:0 1.1rem;
  color:var(--ink);text-decoration:none;
  font-family:'Space Mono',monospace;font-weight:700;text-transform:uppercase;font-size:.8rem;letter-spacing:0.04em;
}
.nav__links a:hover{background:var(--sand);text-decoration:none;}
.nav__cta{display:flex;align-items:center;padding:.6rem 1rem;border-left:var(--bw) solid var(--ink);}
.nav__cta .btn{box-shadow:none;padding:.7rem 1.1rem;}
.nav__cta .btn:hover{transform:none;box-shadow:4px 4px 0 var(--ink);}
.nav__toggle{display:none;}
@media (max-width:880px){
  .nav__links{display:none;}
  .brand{border-right:none;}
  .nav__cta{border-left:var(--bw) solid var(--ink);}
}

/* =====================================================================
   HERO — asymmetric: big type left col, scan-card right col, ticker under
   ===================================================================== */
.hero{position:relative;overflow:hidden;background:var(--paper);}
.hero__grid{
  display:grid;grid-template-columns:1.35fr 1fr;
}
.hero__main{
  padding:64px 24px 56px;
  border-right:var(--bw) solid var(--ink);
}
.hero__tag{margin-bottom:1.4rem;}
.hero h1{margin-bottom:1.4rem;}
.hero h1 .hl{background:var(--teal);color:#FFFFFF;padding:0 .12em;box-decoration-break:clone;-webkit-box-decoration-break:clone;}
.hero__lead{font-size:1.15rem;max-width:46ch;color:var(--ink-muted);margin-bottom:2rem;}
.hero__cta{display:flex;flex-wrap:wrap;gap:1rem;align-items:center;}
.hero__side{
  padding:0;display:flex;flex-direction:column;
}
.scancard{
  flex:1;padding:36px 28px;background:var(--ink);color:var(--paper);
  display:flex;flex-direction:column;justify-content:center;gap:1rem;
  position:relative;
}
.scancard__label{font-family:'Space Mono',monospace;font-weight:700;text-transform:uppercase;letter-spacing:0.1em;font-size:.72rem;color:var(--sand);}
.scancard__row{
  display:flex;align-items:center;justify-content:space-between;gap:1rem;
  border:2px solid var(--paper);padding:.6rem .8rem;
}
.scancard__row .name{font-family:'Space Mono',monospace;font-size:.82rem;}
.scancard__chip{
  font-family:'Space Mono',monospace;font-weight:700;font-size:.72rem;text-transform:uppercase;
  padding:.15rem .5rem;border:2px solid var(--paper);white-space:nowrap;
}
.chip--fail{background:#FFFFFF;color:var(--ink);border-color:var(--ink);}
.chip--warn{background:var(--sand);color:var(--ink);border-color:var(--ink);}
.chip--pass{background:var(--teal);color:#FFFFFF;border-color:var(--paper);}
.scancard__score{display:flex;align-items:baseline;gap:.6rem;margin-top:.4rem;}
.scancard__score .num{font-family:'Archivo';font-weight:900;font-size:3.4rem;line-height:1;color:var(--sand);}
.scancard__score .of{font-family:'Space Mono';font-size:.8rem;color:var(--paper);}
/* offset sticker badge */
.sticker{
  position:absolute;top:-18px;right:-14px;
  background:var(--sand);color:var(--ink);
  border:var(--bw) solid var(--ink);
  font-family:'Space Mono',monospace;font-weight:700;text-transform:uppercase;
  font-size:.72rem;letter-spacing:0.05em;
  padding:.45rem .7rem;
  transform:rotate(4deg);
  box-shadow:var(--shadow);
  z-index:3;
}
/* hero ticker strip */
.ticker{
  border-top:var(--bw) solid var(--ink);
  background:var(--teal);color:#FFFFFF;
  overflow:hidden;white-space:nowrap;
}
.ticker__track{
  display:inline-block;padding:.7rem 0;
  font-family:'Space Mono',monospace;font-weight:700;text-transform:uppercase;letter-spacing:0.06em;font-size:.82rem;
  animation:marquee 26s linear infinite;
}
.ticker__track span{padding:0 1.4rem;}
.ticker__track .dot{color:var(--sand);}
@keyframes marquee{from{transform:translateX(0);}to{transform:translateX(-50%);}}
@media (prefers-reduced-motion: reduce){
  .ticker__track{animation:none;white-space:normal;display:block;padding:.7rem 24px;}
}
@media (max-width:880px){
  .hero__grid{grid-template-columns:1fr;}
  .hero__main{border-right:none;border-bottom:var(--bw) solid var(--ink);}
}

/* =====================================================================
   VALUES / TRUST STRIP — three hard cells, monospace
   ===================================================================== */
.values{background:var(--ink);color:var(--paper);}
.values__grid{display:grid;grid-template-columns:repeat(3,1fr);}
.values__cell{
  padding:28px 24px;border-right:2px solid var(--paper);
  display:flex;gap:.9rem;align-items:flex-start;
}
.values__cell:last-child{border-right:none;}
.values__no{
  font-family:'Space Mono',monospace;font-weight:700;font-size:1.4rem;color:var(--sand);
  border:2px solid var(--sand);width:2.4rem;height:2.4rem;flex:none;
  display:grid;place-items:center;
}
.values__txt strong{display:block;font-family:'Archivo';font-weight:900;text-transform:uppercase;font-size:1.05rem;margin-bottom:.15rem;}
.values__txt span{font-size:.9rem;color:var(--on-dark);}
@media (max-width:760px){
  .values__grid{grid-template-columns:1fr;}
  .values__cell{border-right:none;border-bottom:2px solid var(--paper);}
  .values__cell:last-child{border-bottom:none;}
}

/* =====================================================================
   LEAD MAGNET — snapshot form, split panel
   ===================================================================== */
.snapshot{background:var(--teal);}
.snapshot__grid{display:grid;grid-template-columns:1.1fr 1fr;}
.snapshot__copy{padding:60px 24px;border-right:var(--bw) solid var(--ink);color:#FFFFFF;}
.snapshot__copy h2{margin-bottom:1.2rem;color:#FFFFFF;}
.snapshot__copy p{max-width:48ch;color:#FFFFFF;}
.snapshot__copy .eyebrow{background:var(--teal);color:#FFFFFF;border-color:#FFFFFF;}
.snapshot__list{list-style:none;margin:1.4rem 0 0;padding:0;display:grid;gap:.7rem;}
.snapshot__list li{display:flex;gap:.7rem;align-items:flex-start;font-size:.98rem;color:#FFFFFF;}
.snapshot__list .tick{font-family:'Space Mono';font-weight:700;background:var(--sand);color:var(--ink);width:1.7rem;height:1.7rem;flex:none;display:grid;place-items:center;}
.snapshot__form{padding:60px 24px;background:var(--paper);display:flex;flex-direction:column;justify-content:center;}
.formbox{border:var(--bw) solid var(--ink);background:var(--paper);padding:28px;box-shadow:var(--shadow-lg);}
.formbox legend{font-family:'Archivo';font-weight:900;text-transform:uppercase;font-size:1.3rem;padding:0;margin-bottom:.4rem;}
.field{margin:1.2rem 0;}
.field label{display:block;font-family:'Space Mono',monospace;font-weight:700;text-transform:uppercase;font-size:.78rem;letter-spacing:0.06em;margin-bottom:.5rem;}
.field input{
  width:100%;font-family:'Space Mono',monospace;font-size:1rem;
  padding:.85rem .9rem;border:var(--bw) solid var(--ink);background:var(--paper);color:var(--ink);
}
.field input::placeholder{color:#6E7B86;}
.field input:focus-visible{outline:4px solid var(--teal);outline-offset:2px;background:#FFFEF8;}
.field .hint{display:block;margin-top:.5rem;font-size:.82rem;color:var(--ink-muted);}
.formbox .btn{width:100%;justify-content:center;margin-top:.4rem;}
.formbox__foot{margin-top:1rem;font-family:'Space Mono';font-size:.74rem;color:var(--ink-muted);text-transform:uppercase;letter-spacing:0.04em;}
@media (max-width:880px){
  .snapshot__grid{grid-template-columns:1fr;}
  .snapshot__copy{border-right:none;border-bottom:var(--bw) solid var(--ink);}
}

/* =====================================================================
   SERVICES — three numbered ledger rows (not a 3-card grid)
   ===================================================================== */
.services{background:var(--paper);}
.section-head{padding:56px 24px 0;}
.section-head .eyebrow{margin-bottom:1rem;}
.section-head h2{max-width:18ch;}
.section-head p{max-width:54ch;color:var(--ink-muted);margin-top:1rem;}
.svc-list{margin-top:40px;border-top:var(--bw) solid var(--ink);}
.svc{
  display:grid;grid-template-columns:120px 1fr 280px;
  border-bottom:var(--bw) solid var(--ink);
  transition:background .12s ease;
}
.svc:hover{background:var(--sand);}
.svc__no{
  padding:32px 24px;border-right:var(--bw) solid var(--ink);
  font-family:'Space Mono',monospace;font-weight:700;font-size:2rem;
}
.svc__body{padding:32px 28px;border-right:var(--bw) solid var(--ink);}
.svc__body h3{margin-bottom:.6rem;}
.svc__body p{color:var(--ink-muted);max-width:52ch;margin:0;}
.svc:hover .svc__body p{color:var(--ink);}
.svc__meta{padding:32px 24px;display:flex;flex-direction:column;gap:.6rem;justify-content:center;}
.svc__meta .price{font-family:'Archivo';font-weight:900;font-size:1.5rem;}
.svc__meta .mono{color:var(--ink-muted);}
.svc:hover .svc__meta .mono{color:var(--ink);}
@media (max-width:880px){
  .svc{grid-template-columns:80px 1fr;}
  .svc__body{border-right:none;}
  .svc__meta{grid-column:1 / -1;border-top:2px dashed var(--ink);}
}

/* =====================================================================
   WHY ACCESSIBILITY — stat blocks, mixed colour cells
   ===================================================================== */
.why{background:var(--ink);color:var(--paper);}
.why__head{padding:56px 24px 0;}
.why__head h2{color:var(--paper);}
.why__head .eyebrow{background:var(--ink);color:var(--sand);border-color:var(--sand);}
.why__grid{display:grid;grid-template-columns:repeat(4,1fr);margin-top:40px;border-top:2px solid var(--paper);}
.why__cell{padding:34px 22px;border-right:2px solid var(--paper);border-bottom:2px solid var(--paper);}
.why__cell:nth-child(4n){border-right:none;}
.why__stat{font-family:'Archivo';font-weight:900;font-size:2.6rem;line-height:1;margin-bottom:.6rem;}
.why__cell:nth-child(1) .why__stat{color:var(--sand);}
.why__cell:nth-child(2) .why__stat{color:var(--on-dark);}
.why__cell:nth-child(3) .why__stat{color:var(--sand);}
.why__cell:nth-child(4) .why__stat{color:var(--on-dark);}
.why__cell h3{font-size:1rem;margin-bottom:.5rem;color:var(--paper);}
.why__cell p{font-size:.92rem;color:var(--on-dark);margin:0;}
@media (max-width:980px){
  .why__grid{grid-template-columns:1fr 1fr;}
  .why__cell:nth-child(4n){border-right:2px solid var(--paper);}
  .why__cell:nth-child(2n){border-right:none;}
}
@media (max-width:560px){
  .why__grid{grid-template-columns:1fr;}
  .why__cell{border-right:none !important;}
}

/* =====================================================================
   HOW IT WORKS — 4 stepped offset blocks
   ===================================================================== */
.how{background:var(--paper);}
.how__steps{
  display:grid;grid-template-columns:repeat(4,1fr);gap:0;
  margin-top:40px;border:var(--bw) solid var(--ink);
}
.step{
  padding:30px 24px;border-right:var(--bw) solid var(--ink);position:relative;background:var(--paper);
}
.step:last-child{border-right:none;}
.step:nth-child(2){background:var(--sand);}
.step:nth-child(3){background:var(--sand);}
.step:nth-child(4){background:var(--teal);color:#FFFFFF;}
.step:nth-child(4) h3,.step:nth-child(4) .step__no{color:#FFFFFF;}
.step:nth-child(4) p{color:#FFFFFF;}
.step__no{
  font-family:'Space Mono',monospace;font-weight:700;font-size:.78rem;letter-spacing:0.1em;
  border-bottom:var(--bw) solid currentColor;padding-bottom:.5rem;margin-bottom:1.1rem;display:block;
}
.step h3{margin-bottom:.6rem;}
.step p{font-size:.92rem;color:var(--ink-muted);margin:0;}
.step:nth-child(2) p,.step:nth-child(3) p{color:var(--ink);}
@media (max-width:880px){
  .how__steps{grid-template-columns:1fr 1fr;}
  .step:nth-child(2){border-right:none;}
  .step:nth-child(1),.step:nth-child(2){border-bottom:var(--bw) solid var(--ink);}
}
@media (max-width:520px){
  .how__steps{grid-template-columns:1fr;}
  .step{border-right:none;border-bottom:var(--bw) solid var(--ink);}
  .step:last-child{border-bottom:none;}
}

/* =====================================================================
   PROOF / BEFORE-AFTER — delta panel + quote
   ===================================================================== */
.proof{background:var(--sand);}
.proof__grid{display:grid;grid-template-columns:1.2fr 1fr;}
.proof__delta{padding:56px 24px;border-right:var(--bw) solid var(--ink);}
.proof__delta h2{margin-bottom:1.6rem;}
.delta{display:flex;align-items:center;gap:1.4rem;flex-wrap:wrap;}
.delta__box{border:var(--bw) solid var(--ink);background:var(--paper);padding:1.4rem 1.6rem;text-align:center;min-width:150px;box-shadow:var(--shadow);}
.delta__box .lab{font-family:'Space Mono';font-weight:700;text-transform:uppercase;font-size:.72rem;letter-spacing:0.08em;display:block;margin-bottom:.5rem;}
.delta__box .big{font-family:'Archivo';font-weight:900;font-size:3.4rem;line-height:1;}
.delta__box--before{background:var(--paper);color:var(--ink);}
.delta__box--after{background:var(--teal);color:#FFFFFF;}
.delta__box--after .lab,.delta__box--after .mono{color:#FFFFFF;}
.delta__arrow{font-family:'Space Mono';font-weight:700;font-size:2rem;}
.delta__caption{margin-top:1.6rem;font-family:'Space Mono';font-size:.82rem;text-transform:uppercase;letter-spacing:0.04em;}
.delta__caption strong{background:var(--ink);color:var(--sand);padding:.1rem .4rem;}
.proof__quote{padding:56px 24px;background:var(--ink);color:var(--paper);display:flex;flex-direction:column;justify-content:center;}
.proof__quote blockquote{margin:0;font-family:'Archivo';font-weight:700;font-size:1.5rem;line-height:1.25;}
.proof__quote blockquote .mark{color:var(--sand);font-size:2.4rem;line-height:0;}
.proof__cite{margin-top:1.6rem;display:flex;align-items:center;gap:.9rem;}
.proof__cite .ava{width:46px;height:46px;background:var(--teal);border:2px solid var(--paper);display:grid;place-items:center;font-family:'Space Mono';font-weight:700;color:#FFFFFF;flex:none;}
.proof__cite .who strong{display:block;font-family:'Space Mono';font-size:.86rem;}
.proof__cite .who span{font-size:.8rem;color:var(--on-dark);}
@media (max-width:880px){
  .proof__grid{grid-template-columns:1fr;}
  .proof__delta{border-right:none;border-bottom:var(--bw) solid var(--ink);}
}

/* =====================================================================
   PRICING TEASER — three priced slabs
   ===================================================================== */
.pricing{background:var(--paper);}
.pricing__grid{display:grid;grid-template-columns:repeat(3,1fr);margin-top:40px;border:var(--bw) solid var(--ink);}
.tier{padding:34px 26px;border-right:var(--bw) solid var(--ink);display:flex;flex-direction:column;gap:1rem;position:relative;}
.tier:last-child{border-right:none;}
.tier--featured{background:var(--ink);color:var(--paper);}
.tier__name{font-family:'Space Mono';font-weight:700;text-transform:uppercase;letter-spacing:0.06em;font-size:.82rem;}
.tier--featured .tier__name{color:var(--sand);}
.tier__price{font-family:'Archivo';font-weight:900;font-size:2.6rem;line-height:1;}
.tier__price .from{font-family:'Space Mono';font-size:.78rem;font-weight:700;display:block;text-transform:uppercase;color:var(--ink-muted);margin-bottom:.3rem;}
.tier--featured .tier__price .from{color:var(--on-dark);}
.tier ul{list-style:none;margin:0;padding:0;display:grid;gap:.6rem;font-size:.92rem;}
.tier li{display:flex;gap:.6rem;align-items:flex-start;}
.tier li::before{content:"+";font-family:'Space Mono';font-weight:700;color:var(--teal);}
.tier--featured li::before{color:var(--sand);}
.tier .btn{margin-top:auto;justify-content:center;}
.tier__flag{position:absolute;top:-16px;left:50%;transform:translateX(-50%) rotate(-3deg);background:var(--teal);border:var(--bw) solid var(--paper);color:#FFFFFF;font-family:'Space Mono';font-weight:700;text-transform:uppercase;font-size:.7rem;padding:.3rem .6rem;box-shadow:3px 3px 0 var(--paper);}
@media (max-width:880px){
  .pricing__grid{grid-template-columns:1fr;}
  .tier{border-right:none;border-bottom:var(--bw) solid var(--ink);}
  .tier:last-child{border-bottom:none;}
  .tier__flag{box-shadow:3px 3px 0 var(--ink);}
}

/* =====================================================================
   FINAL CTA
   ===================================================================== */
.finalcta{background:var(--teal);color:#FFFFFF;border-top:var(--bw) solid var(--ink);}
.finalcta__inner{padding:72px 24px;display:grid;grid-template-columns:1.4fr 1fr;gap:40px;align-items:center;}
.finalcta h2{color:#FFFFFF;margin-bottom:1rem;}
.finalcta p{color:#FFFFFF;max-width:46ch;}
.finalcta__act{display:flex;flex-direction:column;gap:1rem;}
.finalcta .btn{justify-content:center;}
.finalcta .btn--sun{background:var(--sand);color:var(--ink);}
.finalcta__note{font-family:'Space Mono';font-size:.76rem;text-transform:uppercase;letter-spacing:0.05em;color:#FFFFFF;}
@media (max-width:880px){.finalcta__inner{grid-template-columns:1fr;}}

/* =====================================================================
   FOOTER
   ===================================================================== */
footer{background:var(--ink);color:var(--paper);}
.foot__grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:32px;padding:56px 24px 40px;}
.foot__brand .brand__name{color:var(--paper);}
.foot__brand .brand__name span{color:var(--sand);}
.foot__brand p{color:var(--on-dark);font-size:.9rem;max-width:34ch;margin-top:1rem;}
.foot col,.foot__col h4{font-family:'Space Mono';font-weight:700;text-transform:uppercase;font-size:.78rem;letter-spacing:0.08em;color:var(--sand);margin-bottom:1rem;}
.foot__col ul{list-style:none;margin:0;padding:0;display:grid;gap:.6rem;}
.foot__col a{color:var(--paper);text-decoration:none;font-size:.92rem;}
.foot__col a:hover{color:var(--sand);text-decoration:underline;text-decoration-thickness:2px;}
.foot__bar{border-top:2px solid #2A3D4F;padding:20px 24px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:1rem;font-family:'Space Mono';font-size:.76rem;text-transform:uppercase;letter-spacing:0.04em;color:var(--on-dark);}
.foot__bar a{color:var(--sand);}
.a11y-badge{display:inline-flex;align-items:center;gap:.5rem;border:2px solid var(--sand);padding:.3rem .6rem;color:var(--sand);}
@media (max-width:880px){.foot__grid{grid-template-columns:1fr 1fr;}}
@media (max-width:520px){.foot__grid{grid-template-columns:1fr;}}

/* form success message */
.form-msg{margin-top:1rem;padding:.85rem 1rem;border:var(--bw) solid var(--ink);background:var(--sand);color:var(--ink);font-family:'Space Mono';font-weight:700;font-size:.84rem;display:none;}
.form-msg.show{display:flex;gap:.6rem;align-items:flex-start;}
.form-msg .ic{flex:none;}
/* --- article long-form (added by bridgeseo) --- */
.article{padding:3rem 0 1rem;}
.article .wrap{max-width:760px;}
.article__meta{margin:.4rem 0 1.4rem;color:var(--ink-muted);}
.prose{font-family:'Space Mono',monospace;line-height:1.7;font-size:1.02rem;color:var(--ink);}
.prose h2{font-size:1.7rem;margin:2.4rem 0 .8rem;line-height:1.1;}
.prose h3{font-size:1.2rem;margin:1.8rem 0 .6rem;}
.prose p{margin:0 0 1.1rem;}
.prose ul,.prose ol{margin:0 0 1.2rem 1.2rem;padding:0;}
.prose li{margin:0 0 .5rem;}
.prose a{color:var(--teal);font-weight:700;}
.prose strong{font-weight:700;}
.prose code{background:var(--sand);padding:.1rem .35rem;border:2px solid var(--ink);font-size:.92em;}
.related{border-top:3px solid var(--ink);margin-top:2.5rem;padding-top:1.4rem;}
.related h2{font-size:1.1rem;text-transform:uppercase;}
.related ul{list-style:none;margin:.6rem 0 0;padding:0;}
.related li{margin:.4rem 0;}
.related a{color:var(--teal);font-weight:700;}