/*
Theme Name: Signal — 100K Solutions
Theme URI: https://100ksolutionsllc.com
Author: LucraOne
Description: Bespoke theme for 100K Solutions LLC, built from the approved "Signal" design direction — dark ground, Archivo Black display type, violet-to-magenta gradient accents. Includes the four program modules, the bonus framework block, the four-step process and the two-checkbox 10DLC SMS opt-in form with consent-record storage.
Version: 1.7.1
Requires at least: 6.5
Tested up to: 7.1
Requires PHP: 8.1
License: Proprietary — commissioned work for 100K Solutions LLC
Text Domain: signal100k
Tags: one-page, custom-colors, custom-logo, custom-menu, accessibility-ready
*/

/* =========================================================================
   1. Design system — ported verbatim from _CLIENT_REVIEW/01-DESIGNS/signal.html
   The design-direction switcher was stripped; it was marked "remove this block
   for the client-facing build" in the source.
   ========================================================================= */

:root{
  --paper:#0D0518;
  --card:#160A28;
  --band-a:#130722;
  --band-b:#0D0518;
  --field:#0D0518;
  --ink:#E9E2F2;
  --head:#FFFFFF;
  --muted:#9C8FB5;
  --line:#2C1A45;
  --line-2:#3D2660;
  /* Borders of interactive controls, which WCAG 1.4.11 holds to 3:1 against
     every adjacent surface. --line/--line-2 stay as they are for decorative
     band edges and card outlines, which the requirement does not cover. */
  --control-line:#7A6E96;
  --rule:#3D2660;
  --track:#241338;
  --accent:#C77DFF;
  --accent-2:#E0AAFF;
  --focus:rgba(199,125,255,.2);
  --fill:linear-gradient(100deg,#7C3AED,#C026D3 55%,#F0ABFC);
  --emgrad:linear-gradient(100deg,#A855F7,#E879F9 55%,#F5D0FE);
  --emclip:text;
  --emfill:transparent;
  --emstyle:normal;
  --up:#34D399;
  --up-wash:rgba(52,211,153,.14);
  --note-bg:#1C0E30;
  --note-line:#3D2660;
  --btn-bg:linear-gradient(100deg,#9560F0,#D946EF 55%,#F0ABFC);
  --btn-fg:#12021C;
  --btn-shadow:0 4px 22px rgba(192,38,211,.34);
  --btn-shadow-h:0 10px 38px rgba(192,38,211,.5);
  --btn-ghost-bg:transparent;
  --nav-bg:rgba(13,5,24,.86);
  --hero-bg:transparent;
  --card-shadow:0 18px 48px rgba(0,0,0,.55);
  --card-shadow-sm:0 2px 14px rgba(0,0,0,.28);
  --img-shadow:0 26px 70px rgba(124,58,237,.3);
  --foot-bg:#080210;
  --foot-fg:#9C8FB5;
  --foot-dim:#9C8FB5;
  --foot-line:rgba(255,255,255,.1);
  --foot-hi:#E0AAFF;
  --foot-logo:none;
  --sw-bg:#080210;
  --sw-fg:#9C8FB5;
  --sw-line:rgba(255,255,255,.2);
  --sw-on:#C77DFF;
  --sw-on-fg:#12021C;
  --display:'Archivo Black',ui-sans-serif,system-ui,Arial,sans-serif;
  --body:'Figtree',ui-sans-serif,system-ui,-apple-system,sans-serif;
  --mono:'IBM Plex Mono',ui-monospace,Menlo,monospace;
  --dw:400;
  --dw3:400;
  --dls:-.03em;
  --dls3:-.018em;
  --h1:clamp(34px,5.2vw,60px);
  --h1lh:1.0;
  --h2:clamp(29px,4.2vw,48px);
  --r-btn:10px;
  --r-card:18px;
  --r-sm:14px;
  --r-img:20px;
  --card-gap:16px;
  --hero-pt:clamp(40px,6vw,76px);
  --hero-pb:clamp(52px,7vw,96px);
  --hero-cols:minmax(0,1fr) minmax(0,.92fr);
  --gut:clamp(18px,5vw,56px);
  --maxw:1220px;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--body);
  font-size:17px;line-height:1.66;-webkit-font-smoothing:antialiased;overflow-x:hidden}

/* THE FIX: width/height attributes on <img> would otherwise lock the rendered
   height and stretch the photograph. height:auto restores the true aspect. */
img{max-width:100%;height:auto;display:block}

a{color:inherit}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:3px}
.wrap{max-width:var(--maxw);margin-inline:auto;padding-inline:var(--gut)}
.num{font-variant-numeric:tabular-nums}

/* ---- type ---- */
.eyebrow{font-family:var(--mono);font-size:11.5px;font-weight:500;letter-spacing:.17em;
  text-transform:uppercase;color:var(--accent);margin:0 0 16px}
.eyebrow.q{color:var(--muted)}
h1{font-family:var(--display);font-weight:var(--dw);font-size:var(--h1);line-height:var(--h1lh);
  letter-spacing:var(--dls);color:var(--head);text-wrap:balance;margin:0 0 20px}
h1 em{font-style:var(--emstyle);color:var(--accent);background:var(--emgrad);
  -webkit-background-clip:var(--emclip);background-clip:var(--emclip);
  -webkit-text-fill-color:var(--emfill)}
h2.sec{font-family:var(--display);font-weight:var(--dw);font-size:var(--h2);line-height:1.06;
  letter-spacing:var(--dls);color:var(--head);text-wrap:balance;margin:0 0 18px}
h2.sec.sub{font-size:clamp(24px,3.2vw,34px);margin-bottom:0}
h3{font-family:var(--display);font-weight:var(--dw3);color:var(--head);margin:0}
.lede{font-size:clamp(16.5px,1.8vw,18.5px);color:var(--muted);max-width:60ch;margin:0}

/* ---- nav ---- */
.nav{position:sticky;top:0;z-index:60;background:var(--nav-bg);backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line)}
.nav .wrap{display:flex;align-items:center;gap:20px;padding-block:13px}
.nav .brand{flex:none;line-height:0}
.nav .brand img{height:38px;width:auto}
.nav ul{display:flex;gap:24px;list-style:none;margin:0 0 0 auto;padding:0}
.nav a.link{font-size:14.5px;font-weight:500;color:var(--muted);text-decoration:none;transition:color .16s;
  display:inline-block;padding-block:4px}
.nav a.link:hover{color:var(--head)}
.navtoggle{display:none}

/* ---- buttons ---- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;font-family:var(--body);
  font-size:15px;font-weight:600;line-height:1;padding:14px 22px;border-radius:var(--r-btn);
  text-decoration:none;border:1px solid transparent;cursor:pointer;
  transition:transform .15s,box-shadow .2s,background .18s,border-color .18s,color .18s}
.btn-primary{background:var(--btn-bg);color:var(--btn-fg);box-shadow:var(--btn-shadow)}
.btn-primary:hover{transform:translateY(-1px);box-shadow:var(--btn-shadow-h)}
.btn-ghost{border-color:var(--line-2);color:var(--head);background:var(--btn-ghost-bg)}
.btn-ghost:hover{border-color:var(--accent);color:var(--accent)}
.btn svg{width:15px;height:15px;flex:none}
.btn-block{width:100%;padding-block:16px}

/* ---- hero ---- */
.hero{padding-block:var(--hero-pt) var(--hero-pb);position:relative;overflow:hidden;background:var(--hero-bg)}
.hero .wrap{display:grid;grid-template-columns:var(--hero-cols);gap:clamp(30px,5vw,64px);align-items:center;position:relative}
.hero .sub{font-size:clamp(16.5px,1.9vw,19px);color:var(--muted);max-width:48ch;margin:0 0 28px}
.hero-cta{display:flex;gap:11px;flex-wrap:wrap;margin-bottom:28px}
.bureaus{display:flex;gap:8px 15px;flex-wrap:wrap;align-items:center;font-family:var(--mono);
  font-size:12px;letter-spacing:.06em;color:var(--muted);padding-top:20px;border-top:1px solid var(--line)}
.bureaus b{color:var(--head);font-weight:600;white-space:nowrap}
/* The business bureau names are about twice the width of the consumer ones
   this line used to carry, so the group has to be allowed to wrap. Each
   name still holds together — only the gaps between them break. */
.bureaus .bl{display:inline-flex;flex-wrap:wrap;gap:0 7px}

/* framed portrait — aspect-ratio guarantees no distortion even before the image loads */
.shot{position:relative;margin:0}
.shot img{width:100%;aspect-ratio:1100/1375;object-fit:cover;border-radius:var(--r-img);box-shadow:var(--img-shadow)}
.heroband{margin:clamp(34px,5vw,56px) 0 0;max-width:100%}
.heroband img{width:100%;aspect-ratio:1700/956;object-fit:cover}
.delta-card{position:absolute;left:-16px;bottom:24px;background:var(--card);border:1px solid var(--line);
  border-radius:var(--r-sm);padding:15px 17px;box-shadow:var(--card-shadow);min-width:206px;color:var(--accent)}
.delta-card .k{font-family:var(--mono);font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--muted);margin-bottom:6px}
/* The chip is white-space:nowrap and the value row is far wider than the
   score figure it replaced, so it has to be allowed to wrap — under 520px the
   card is static and constrained to the viewport. */
.delta-card .v{display:flex;align-items:baseline;gap:9px;flex-wrap:wrap}
.delta-card .v strong{font-family:var(--display);font-weight:var(--dw);font-size:32px;line-height:1;color:var(--head);letter-spacing:var(--dls)}
/* The not-typical line rides on the card because the FTC substantiation
   standard wants the disclosure next to the figure, not in the footer. It
   overrides the panel treatment .disclose carries elsewhere — a bordered box
   inside a 206px card would read as a second card. */
.delta-card .disclose{margin-top:9px;background:none;border:0;border-radius:0;padding:0;
  font-family:var(--mono);font-size:10.5px;line-height:1.45;letter-spacing:.04em;color:var(--muted)}
.chip{display:inline-flex;align-items:center;gap:3px;font-family:var(--mono);font-size:12.5px;font-weight:600;
  color:var(--up);background:var(--up-wash);border-radius:20px;padding:3px 9px;white-space:nowrap}

/* ---- sections ---- */
section{padding-block:clamp(52px,7vw,92px)}
.band-a{background:var(--band-a);border-block:1px solid var(--line)}
.band-b{background:var(--band-b)}

/* ---- services ---- */
/* Four modules, not three. auto-fit on a 262px floor only resolved to four
   tracks above a ~1208px viewport, so every laptop width got three cards and
   a lone fourth on row two. Explicit tracks — 4, then 2, then 1 — so the row
   is always full. */
.cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--card-gap);margin-top:38px}
@media (max-width:1180px){.cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.cards{grid-template-columns:1fr}}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r-card);
  padding:clamp(22px,2.8vw,30px);display:flex;flex-direction:column;gap:10px;box-shadow:var(--card-shadow-sm)}
.card .ix{font-family:var(--mono);font-size:11px;letter-spacing:.15em;color:var(--accent-2);text-transform:uppercase}
.card h3{font-size:21px;letter-spacing:var(--dls3)}
.card p{margin:0;color:var(--muted);font-size:15.5px;line-height:1.62}

/* ---- process ---- */
.steps{margin-top:40px;display:grid;gap:var(--card-gap)}
.step{background:var(--card);border:1px solid var(--line);border-radius:var(--r-card);
  display:grid;grid-template-columns:62px minmax(0,1fr) minmax(0,1fr);gap:clamp(14px,2.6vw,30px);
  padding:clamp(20px,2.6vw,28px);align-items:start;box-shadow:var(--card-shadow-sm)}
.step .n{font-family:var(--display);font-weight:var(--dw);font-size:29px;line-height:1;color:var(--accent);letter-spacing:var(--dls)}
.step h3{font-size:19px;margin-bottom:6px;letter-spacing:var(--dls3)}
.step p{margin:0;color:var(--muted);font-size:15.5px}
.step .out{border-left:2px solid var(--rule);padding-left:15px;font-size:14px;line-height:1.58;color:var(--ink)}
.step .out b{display:block;font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--muted);font-weight:500;margin-bottom:4px}

/* ---- section backgrounds ---- */
/* Driven by inc/backgrounds.php. Two states: a designed gradient wash, which
   is what every surface renders today, and a photograph, which is what they
   render once art exists. Both paint behind the content on the same element,
   so swapping one for the other changes no layout.

   isolation:isolate rather than a z-index arms race — it gives the section its
   own stacking context, so the -1 layer below sits behind this section's
   content and nothing else on the page. */
.hasbg{position:relative;isolation:isolate}
.hasbg > *{position:relative}

/* Photograph. ::before carries the art, ::after the shade that keeps body copy
   at 4.5:1 over it. Two layers rather than one so --bg-shade can be tuned per
   surface without regenerating a gradient string. */
.hasbg-img::before{content:"";position:absolute;inset:0;z-index:-2;
  background-image:var(--bg-img);background-size:cover;
  background-position:var(--bg-focus,50% 50%);background-repeat:no-repeat}
.hasbg-img::after{content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(180deg,
    rgba(13,5,24,calc(var(--bg-shade,.84) * .92)),
    rgba(13,5,24,var(--bg-shade,.84)))}

/* Wash. The hero already does this with two offset radial gradients; these are
   the same idea at lower amplitude, because a page head is not the first
   screen and should not compete with it. Two variants: every page head takes
   -a and the CTA takes -b, so no page shows the same wash at both ends. */
.hasbg-wash-a::before,
.hasbg-wash-b::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none}
.hasbg-wash-a::before{background:
  radial-gradient(60% 120% at 12% 0%,rgba(168,85,247,.16),transparent 62%),
  radial-gradient(48% 110% at 92% 100%,rgba(192,38,211,.12),transparent 66%)}
.hasbg-wash-b::before{background:
  radial-gradient(54% 120% at 88% 0%,rgba(192,38,211,.14),transparent 64%),
  radial-gradient(52% 110% at 6% 92%,rgba(124,58,237,.13),transparent 66%)}

/* A wash is decorative and a photograph is not: art carries contrast the
   shade is tuned against, so it stays. The washes go. */
@media (prefers-contrast:more){
  .hasbg-wash-a::before,.hasbg-wash-b::before{display:none}
}

/* ---- results ---- */
/* The three-bureau score ledger that used to live here is gone, and so are its
   styles: .ledger, .rescard, .bur, .bar and .scale rendered personal FICO
   movement, which came down with the positioning pivot on 2026-09-23 and is
   not coming back. See inc/results.php. What is left styles two documented
   approvals, the images behind them and the client videos. */

/* Business vs. personal, on the approval itself. A personal-side approval must
   never be able to read as a business one just because it sits in a table
   headed "approvals" — this badge is the thing that prevents it, so it stays
   legible rather than decorative. */
.scope{display:inline-flex;font-family:var(--mono);font-size:10px;font-weight:600;letter-spacing:.1em;
  text-transform:uppercase;border-radius:20px;padding:2px 8px;margin-left:8px;white-space:nowrap;
  border:1px solid var(--line-2);color:var(--muted)}
.scope-business{color:var(--up);background:var(--up-wash);border-color:transparent}

/* Front-page teaser: the two figures beside one clip. */
.restease{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:clamp(22px,4vw,52px);
  align-items:center;margin-top:34px}
.rstats{display:flex;flex-direction:column;gap:var(--card-gap);min-width:0}
.rstat{background:var(--card);border:1px solid var(--line);border-radius:var(--r-card);
  padding:22px 24px;box-shadow:var(--card-shadow-sm)}
.rstat .k{font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--muted);margin-bottom:7px}
.rstat .v{font-family:var(--display);font-weight:var(--dw);font-size:clamp(30px,4.4vw,46px);line-height:1;
  letter-spacing:var(--dls);color:var(--accent);background:var(--emgrad);
  -webkit-background-clip:var(--emclip);background-clip:var(--emclip);-webkit-text-fill-color:var(--emfill)}
.rstat .v .u{display:inline-flex;font-family:var(--mono);font-size:11.5px;font-weight:600;color:var(--up);
  background:var(--up-wash);border-radius:20px;padding:2px 8px;margin-left:9px;vertical-align:middle;
  -webkit-text-fill-color:var(--up)}

/* ---- client video ---- */
.vwall{margin-top:44px;padding-top:36px;border-top:1px solid var(--line)}
.vgrid{display:flex;flex-wrap:wrap;gap:var(--card-gap)}
.vtest{margin:0;flex:0 1 290px;max-width:320px;min-width:0}
/* The encodes are a true 720x1280 portrait. Declaring the ratio here as well as
   on the element means the poster, the player and the empty box before either
   loads all occupy the same space, so nothing below shifts on load. */
.vtest-player{display:block;width:100%;height:auto;aspect-ratio:720/1280;background:#000;
  border:1px solid var(--line);border-radius:var(--r-card);box-shadow:var(--card-shadow-sm)}
.vtest figcaption{display:flex;align-items:baseline;justify-content:space-between;gap:10px;
  padding:10px 2px 0;font-family:var(--mono);font-size:11px;letter-spacing:.08em;color:var(--muted)}
.vtest figcaption b{color:var(--head);font-weight:600;text-transform:uppercase;letter-spacing:.1em}

.disclose{margin-top:24px;background:var(--note-bg);border:1px solid var(--note-line);border-radius:var(--r-card);
  padding:18px 20px;font-size:14.5px;line-height:1.62;color:var(--ink)}
.disclose b{color:var(--head)}

/* ---- bonus ---- */
/* Subordinate to the four module cards on purpose: a narrower measure and a
   step down in heading size, so it does not read as a fifth module. */
/* Constrain the children, not the .wrap itself — .wrap is margin-inline:auto,
   so capping its width would centre the block and break the left edge every
   other section on the page shares. */
.bonus .sec{font-size:clamp(23px,2.9vw,31px);max-width:20ch}
.bonus .lede{margin-top:14px}
.bonus .disclose{margin-top:20px;max-width:60ch}

/* ---- funding ledger ---- */
.fund{margin-top:44px;padding-top:36px;border-top:1px solid var(--line)}
/* The rule and the gap separate .fund from whatever preceded it. On the
   Results page nothing does — it is the first block in the section — and a
   border-top with no content above it reads as a stray line under the page
   head. */
.wrap > .fund:first-child{margin-top:0;padding-top:0;border-top:0}
.fundhead{display:flex;flex-wrap:wrap;gap:16px 32px;align-items:flex-end;justify-content:space-between;margin-bottom:22px}
.fundhead .eyebrow{margin-bottom:9px}
.fundtotal{text-align:right}
.fundtotal .k{font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:5px}
.fundtotal .v{font-family:var(--display);font-weight:var(--dw);font-size:clamp(30px,4.4vw,46px);line-height:1;
  letter-spacing:var(--dls);color:var(--accent);background:var(--emgrad);
  -webkit-background-clip:var(--emclip);background-clip:var(--emclip);-webkit-text-fill-color:var(--emfill)}
.fundwrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r-card);background:var(--card);-webkit-overflow-scrolling:touch}
table.fundtbl{width:100%;border-collapse:collapse;font-size:15px;min-width:560px}
table.fundtbl th{font-family:var(--mono);font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;
  color:var(--muted);font-weight:500;text-align:left;padding:13px 18px;background:var(--band-a);border-bottom:1px solid var(--line)}
table.fundtbl td{padding:14px 18px;border-bottom:1px solid var(--line);vertical-align:middle}
table.fundtbl tr:last-child td{border-bottom:0}
table.fundtbl td.amt{font-family:var(--display);font-weight:var(--dw3);font-size:18px;color:var(--head);white-space:nowrap}
table.fundtbl td.apr{font-family:var(--mono);font-size:13.5px;color:var(--muted);white-space:nowrap}
table.fundtbl td.lender{color:var(--head);font-weight:600}
table.fundtbl td.prod{color:var(--muted);font-size:14.5px}
.zero{display:inline-flex;font-family:var(--mono);font-size:11.5px;font-weight:600;color:var(--up);
  background:var(--up-wash);border-radius:20px;padding:2px 8px;margin-left:6px}


/* ---- documentary proof wall ---- */
.proofwall{margin-top:44px;padding-top:36px;border-top:1px solid var(--line)}
.pw-head{margin-bottom:24px}
.pwgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--card-gap)}
.shotcard{margin:0;background:var(--card);border:1px solid var(--line);border-radius:var(--r-card);
  overflow:hidden;display:flex;flex-direction:column;box-shadow:var(--card-shadow-sm)}
.shotcard .pane{background:#fff;aspect-ratio:560/760;border-bottom:1px solid var(--line)}
/* contain, never cover — cropping a document to fit a grid would cut the evidence */
.shotcard .pane img{width:100%;height:100%;object-fit:cover;object-position:top center}
/* The rule above says "contain, never cover" and has done since the proof
   wall was built, but it sets cover — survivable at eight-up thumbnails,
   not at two-up, where it cropped the body of the American Express
   approval straight off the card. The pane is already white, so a
   contained document letterboxes into it invisibly. */
.pwgrid-pair .shotcard .pane img{object-fit:contain;object-position:center}
.shotcard figcaption{padding:13px 15px;display:flex;flex-direction:column;gap:3px}
.shotcard figcaption b{font-family:var(--display);font-weight:var(--dw);font-size:21px;
  line-height:1.1;color:var(--head);letter-spacing:var(--dls)}
.shotcard figcaption span{font-family:var(--mono);font-size:11px;letter-spacing:.06em;color:var(--muted);line-height:1.45}
/* Only two documents survive the program-scoped rebuild. The auto-fit grid
   above would stretch them across the full measure at roughly 600px each,
   which is a lot of page for two JPEGs — so the pair is capped and left-aligned
   with everything else in the section. */
.pwgrid-pair{grid-template-columns:repeat(2,minmax(0,1fr));max-width:620px}
.pw-note{margin:18px 0 0;font-family:var(--mono);font-size:11.5px;line-height:1.66;color:var(--muted);max-width:78ch}

/* ---- quotes ---- */
.quotes{display:grid;grid-template-columns:repeat(auto-fit,minmax(244px,1fr));gap:var(--card-gap);margin-top:38px}
.quote{background:var(--card);border:1px solid var(--line);border-radius:var(--r-card);padding:23px;
  display:flex;flex-direction:column;gap:13px;margin:0;box-shadow:var(--card-shadow-sm)}
.quote p{margin:0;font-size:18px;line-height:1.5;color:var(--head);font-weight:500}
.quote footer{font-family:var(--mono);font-size:11.5px;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);margin-top:auto}
.quote .mark{width:22px;height:18px;color:var(--accent-2);flex:none}

/* ---- founder ---- */
.founder{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(26px,5vw,58px);align-items:center}
.fshot{margin:0}
.fshot img{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:var(--r-img);box-shadow:var(--img-shadow)}
.founder blockquote{margin:0 0 18px;font-size:clamp(19px,2.4vw,25px);line-height:1.45;font-weight:500;color:var(--head);text-wrap:pretty}
.founder cite{font-family:var(--mono);font-style:normal;font-size:12px;letter-spacing:.11em;text-transform:uppercase;color:var(--muted)}
/* Short founder bio beneath the attribution. Additive — the mockup had no bio
   because the copy had not been supplied when it was designed. */
.founder .fbio{margin:18px 0 0;font-size:16px;line-height:1.6;color:var(--muted);max-width:52ch;text-wrap:pretty}

/* ---- faq ---- */
.faq{margin-top:32px;border-top:1px solid var(--line)}
details{border-bottom:1px solid var(--line)}
summary{cursor:pointer;list-style:none;padding:20px 44px 20px 0;position:relative;font-size:16.5px;font-weight:600;color:var(--head)}
summary::-webkit-details-marker{display:none}
summary::after{content:"";position:absolute;right:10px;top:50%;width:9px;height:9px;
  border-right:2px solid var(--accent);border-bottom:2px solid var(--accent);
  transform:translateY(-70%) rotate(45deg);transition:transform .2s}
details[open] summary::after{transform:translateY(-30%) rotate(-135deg)}
details p{margin:0 0 22px;color:var(--muted);max-width:66ch;font-size:15.5px}

/* ---- contact ---- */
.contact-grid{display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);gap:clamp(28px,5vw,62px);align-items:start}
form{display:grid;gap:15px;background:var(--card);border:1px solid var(--line);
  border-radius:var(--r-card);padding:clamp(20px,3vw,32px);box-shadow:var(--card-shadow-sm)}
.row{display:grid;grid-template-columns:1fr 1fr;gap:15px}
label.fl{display:block;font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:6px}
input[type=text],input[type=email],input[type=tel],textarea{width:100%;background:var(--field);
  border:1px solid var(--control-line);border-radius:var(--r-btn);color:var(--ink);font-family:var(--body);
  font-size:16px;padding:12px 13px;transition:border-color .16s,box-shadow .16s}
/* Scoped to the controls that genuinely replace the ring with a border-colour
   change. Applied to every input it also stripped the ring from the consent
   checkboxes, whose own border rule wins — leaving a 1.33:1 glow as the only
   focus indicator on the two controls the 10DLC campaign is graded on. */
input[type=text]:focus,input[type=email]:focus,input[type=tel]:focus,textarea:focus{
  border-color:var(--accent);box-shadow:0 0 0 3px var(--focus);outline:none}
textarea{resize:vertical;min-height:104px}
.consent{display:grid;gap:13px;padding:18px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--field)}
.consent .eyebrow{margin-bottom:0}
.check{display:grid;grid-template-columns:24px minmax(0,1fr);gap:11px;align-items:start}
.check input[type=checkbox]{appearance:none;-webkit-appearance:none;width:24px;height:24px;margin:0;
  border:1.5px solid var(--control-line);border-radius:4px;background:var(--card);cursor:pointer;
  display:grid;place-content:center;transition:background .14s,border-color .14s}
/* WCAG 2.2 SC 2.5.8 requires a 24x24 target. The associated label is clickable
   too, but the box itself is sized to satisfy it without relying on that. */
.check input[type=checkbox]:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.check input[type=checkbox]::after{content:"";width:9px;height:5px;border-left:2px solid var(--btn-fg);
  border-bottom:2px solid var(--btn-fg);transform:rotate(-45deg) scale(0);transition:transform .14s}
.check input[type=checkbox]:checked{background:var(--accent);border-color:var(--accent)}
.check input[type=checkbox]:checked::after{transform:rotate(-45deg) scale(1)}
.check .ctext{display:contents}
.cbody{font-size:12.5px;line-height:1.56;color:var(--muted)}
.opt{display:block;font-family:var(--mono);font-size:10px;letter-spacing:.13em;text-transform:uppercase;color:var(--accent-2);margin-bottom:3px;font-style:normal}
.consent-links{display:block;margin-top:6px;font-size:12.5px}
.consent-links a{color:var(--accent);text-decoration:underline;text-underline-offset:2px;
  display:inline-block;padding-block:5px}
.facts{display:grid;gap:19px;margin-top:28px}
.fact{border-left:2px solid var(--line-2);padding-left:16px}
.fact dt{font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:4px}
.fact dd{margin:0;font-size:16px;color:var(--head);overflow-wrap:anywhere}
.fact dd a{color:var(--head);text-decoration:none;border-bottom:1px solid var(--line-2);
  display:inline-block;padding-block:3px}
.fact dd a:hover{color:var(--accent);border-color:var(--accent)}

/* ---- footer ---- */
footer.site{background:var(--foot-bg);color:var(--foot-fg);padding-block:44px 34px}
footer.site .ftop{display:flex;gap:24px;flex-wrap:wrap;justify-content:space-between;align-items:flex-start;
  padding-bottom:24px;border-bottom:1px solid var(--foot-line)}
footer.site .ftop img{height:42px;width:auto;filter:var(--foot-logo)}
.flinks{display:flex;gap:8px 22px;flex-wrap:wrap;list-style:none;margin:0;padding:0}
.flinks a{font-family:var(--mono);font-size:12px;color:var(--foot-fg);text-decoration:none;letter-spacing:.05em;
  display:inline-block;padding-block:5px}
.flinks a:hover{color:var(--foot-hi)}
.legal{padding-top:20px;display:grid;gap:11px;max-width:100ch}
.legal p{margin:0;font-family:var(--mono);font-size:11px;line-height:1.72;color:var(--foot-dim)}
.legal p b{color:var(--foot-fg);font-weight:500}
.legal p a{display:inline-block;padding-block:4px}

/* ---- motion ---- */
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}

/* ======================= RESPONSIVE ======================= */
@media (max-width:1000px){
  .hero .wrap{grid-template-columns:1fr}
  .shot{max-width:440px;margin-inline:auto;width:100%}
  .delta-card{left:auto;right:10px;bottom:12px}
  .founder{grid-template-columns:1fr}
  .fshot{max-width:340px}
  .contact-grid{grid-template-columns:1fr}
  .step{grid-template-columns:52px minmax(0,1fr)}
  .step .out{grid-column:2;margin-top:4px}
  .heroband img{aspect-ratio:3/2;object-position:56% 50%}
}
@media (max-width:760px){
  .nav ul{display:none}
  .nav ul.open{display:flex;position:absolute;top:100%;left:0;right:0;flex-direction:column;gap:0;
    background:var(--card);border-bottom:1px solid var(--line);padding:6px var(--gut) 14px}
  .nav ul.open li{padding-block:10px;border-bottom:1px solid var(--line)}
  .nav ul.open li:last-child{border-bottom:0}
  .navtoggle{display:inline-flex;margin-left:auto;background:var(--card);border:1px solid var(--line-2);
    border-radius:var(--r-btn);color:var(--head);padding:9px 13px;font-family:var(--mono);
    font-size:11.5px;letter-spacing:.11em;cursor:pointer}
  .navcta{display:none}
  .row{grid-template-columns:1fr}
  .fundhead{gap:14px}
  .fundtotal{text-align:left}
  .restease{grid-template-columns:1fr}
  .restease .vtest{max-width:260px}
}
@media (max-width:520px){
  :root{--gut:18px}
  .pwgrid{grid-template-columns:1fr 1fr;gap:12px}
  .pwgrid-pair{max-width:none}
  .vgrid{gap:12px}
  .vtest{flex-basis:calc(50% - 6px)}
  .scope{margin-left:0;margin-top:5px}
  .shotcard figcaption{padding:10px 11px}
  .shotcard figcaption b{font-size:18px}
  .hero-cta{flex-direction:column;align-items:stretch}
  .hero-cta .btn{width:100%}
  .shot{max-width:100%}
  .delta-card{position:static;margin-top:-34px;margin-inline:14px;width:auto;min-width:0}
  .step{grid-template-columns:1fr;gap:12px}
  .step .n{font-size:24px}
  .step .out{grid-column:1;border-left:0;border-top:1px solid var(--line);padding:12px 0 0}
  .quote p{font-size:16.5px}
  .card,.quote,.step,form{padding:19px}
  footer.site .ftop{gap:18px}
}


/* Signal: dark-committed. The whole page is painted explicitly so it holds on any host ground. */
.hero::before{content:"";position:absolute;top:-280px;left:-140px;width:760px;height:760px;border-radius:50%;
  background:radial-gradient(circle,rgba(168,85,247,.22),transparent 64%);pointer-events:none}
.hero::after{content:"";position:absolute;bottom:-300px;right:-160px;width:660px;height:660px;border-radius:50%;
  background:radial-gradient(circle,rgba(192,38,211,.16),transparent 66%);pointer-events:none}
.heroband{display:none}
h1,h2.sec{text-transform:uppercase}
h1{line-height:.96}
.card,.quote,.step,form{background:linear-gradient(170deg,#1A0C2E,#130722)}
.btn-ghost{border-color:var(--line-2);color:var(--head)}
.btn-ghost:hover{border-color:var(--accent);color:var(--accent);background:rgba(199,125,255,.08)}
.fundtotal .v{filter:drop-shadow(0 0 20px rgba(192,38,211,.4))}
.card:hover,.quote:hover{border-color:var(--line-2)}
.delta-card{background:linear-gradient(170deg,#1F0E36,#160A28)}
summary{font-weight:700}
.navtoggle{background:var(--card);color:var(--head)}

/* =========================================================================
   2. WordPress integration
   Everything below is additive — it exists because WordPress emits markup the
   static mockup never had. No rule above this line was altered.
   ========================================================================= */

/* Sticky nav must clear the admin bar when logged in. */
body.admin-bar .nav{top:32px}
@media screen and (max-width:782px){body.admin-bar .nav{top:46px}}

/* Accessibility: skip link + screen-reader text (core expects these classes). */
.screen-reader-text{border:0;clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;
  padding:0;position:absolute;width:1px;word-wrap:normal!important}
.skip-link{position:absolute;left:-9999px;top:0;z-index:100000}
.skip-link:focus{left:var(--gut);top:8px;width:auto;height:auto;padding:10px 16px;
  background:var(--accent);color:var(--btn-fg);border-radius:var(--r-btn);font-weight:600}

/* Interior pages (Privacy, Terms, posts) — the mockup had no such template. */
.page-head{padding-block:clamp(38px,6vw,72px) 0}
.entry{padding-block:clamp(26px,4vw,44px) clamp(52px,8vw,96px)}
.entry .inner{max-width:74ch}
.entry h2,.entry h3,.entry h4{font-family:var(--display);font-weight:var(--dw3);
  color:var(--head);line-height:1.18;letter-spacing:var(--dls3);margin:1.9em 0 .55em}
.entry h2{font-size:clamp(23px,2.9vw,31px)}
.entry h3{font-size:clamp(19px,2.2vw,23px)}
.entry h4{font-size:17.5px}
.entry p,.entry li{color:var(--ink)}
.entry p{margin:0 0 1.15em}
.entry ul,.entry ol{margin:0 0 1.15em;padding-left:1.35em}
.entry li{margin-bottom:.45em}
.entry a{color:var(--accent-2);text-decoration:underline;text-underline-offset:3px}
.entry a:hover{text-decoration-thickness:2px}
.entry strong,.entry b{color:var(--head)}
.entry blockquote{margin:1.6em 0;padding:16px 20px;border-left:3px solid var(--accent);
  background:var(--note-bg);border-radius:0 var(--r-sm) var(--r-sm) 0}
.entry blockquote p:last-child{margin-bottom:0}
.entry hr{border:0;border-top:1px solid var(--rule);margin:2.2em 0}
.entry code{font-family:var(--mono);font-size:.9em;background:var(--track);
  padding:.15em .42em;border-radius:5px}
.entry pre{font-family:var(--mono);font-size:13.5px;background:var(--card);border:1px solid var(--line);
  border-radius:var(--r-sm);padding:16px;overflow-x:auto;margin:0 0 1.15em}
.entry pre code{background:none;padding:0}
.entry table{width:100%;border-collapse:collapse;margin:0 0 1.35em;font-size:15px}
.entry th,.entry td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--rule)}
.entry th{font-family:var(--mono);font-size:11px;letter-spacing:.11em;text-transform:uppercase;
  color:var(--muted);font-weight:500}
.entry img{border-radius:var(--r-sm)}

/* Core alignment + caption classes. */
.alignleft{float:left;margin:.35em 1.4em 1em 0}
.alignright{float:right;margin:.35em 0 1em 1.4em}
.aligncenter{display:block;margin-inline:auto}
.alignwide,.alignfull{max-width:none}
.wp-caption{max-width:100%}
.wp-caption-text,.entry figcaption{font-family:var(--mono);font-size:11.5px;color:var(--muted);
  margin-top:8px;letter-spacing:.03em}
.entry figure{margin:1.6em 0}

/* Archive / search listing. */
.cardlist{display:grid;gap:var(--card-gap);grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  padding-block:clamp(26px,4vw,44px) clamp(52px,8vw,96px)}
.cardlist .card h3{font-size:19px;margin-bottom:8px;line-height:1.24}
.cardlist .card h3 a{text-decoration:none}
.cardlist .card h3 a:hover{color:var(--accent-2)}
.cardlist .meta{font-family:var(--mono);font-size:11px;letter-spacing:.11em;
  text-transform:uppercase;color:var(--muted);margin:0 0 10px}
.pager{display:flex;gap:10px;flex-wrap:wrap;padding-bottom:clamp(52px,8vw,96px)}
.pager .page-numbers{display:inline-flex;min-width:38px;justify-content:center;
  border:1px solid var(--line-2);border-radius:var(--r-btn);padding:7px 11px;
  text-decoration:none;font-size:14px}
.pager .page-numbers.current{background:var(--accent);border-color:transparent;color:var(--btn-fg)}

/* Form feedback for the consultation form. */
.formnote{border-radius:var(--r-sm);padding:13px 15px;margin:0 0 16px;font-size:15px;
  border:1px solid var(--note-line);background:var(--note-bg)}
.formnote.ok{border-color:var(--up);background:var(--up-wash);color:var(--head)}
.formnote.bad{border-color:#F87171;background:rgba(248,113,113,.12);color:var(--head)}
.field-error{display:block;font-family:var(--mono);font-size:11px;letter-spacing:.04em;
  color:#FCA5A5;margin-top:6px}
input[aria-invalid="true"],textarea[aria-invalid="true"]{border-color:#F87171}
.req{color:var(--accent);margin-left:2px}

/* Multi-page layout — the split from one scrolling document to four pages.
   The mockup had neither of these: it never needed a route onward, because
   every page was the same page. */
/* The page head sits directly on <main> on the three content pages, where the
   next band's 1px border would otherwise land flush against the lede. Inside
   page.php the head is within the band already, so it is left alone. */
main > .page-head,
main > .hasbg > .page-head{padding-bottom:clamp(30px,4.5vw,52px)}
/* .cards carries a 38px top margin meant to clear the section heading. On a
   page whose heading has moved up into the page head there is no heading to
   clear, and the margin stacks onto the section padding as a void. */
.cards:first-child,.steps:first-child{margin-top:0}
.teaser-more{margin-top:30px}
/* .facts is a single column beside the contact form; standing alone on About it
   has the full measure to work with. */
.facts-row{grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:22px 30px}
.cta{text-align:center;padding-block:clamp(56px,8vw,92px)}
.cta .sec{margin-bottom:14px}
.cta .lede{margin-inline:auto}
.cta-act{margin:26px 0 0;display:flex;justify-content:center}
.page-lede{margin-top:16px}