/* ============================================================
   Comera Defence & Ordnance Group — styles
   Design system: dark tactical ground, amber accent, teal for
   Citizen SAFE, paper for light bands. Archivo display / IBM
   Plex Sans body / IBM Plex Mono technical labels.
   ============================================================ */

:root{
  --ground:#13171b;
  --ground-2:#1a2128;
  --ground-3:#222b33;
  --paper:#ece5d7;
  --paper-2:#e3dbca;
  --amber:#d8973a;
  --amber-soft:#e6b063;
  --amber-ink:#8a5c1a;      /* amber for light backgrounds (AA on paper) */
  --teal:#3f928a;
  --teal-soft:#5aa8a0;
  --teal-ink:#26665f;       /* teal for light backgrounds (AA on paper) */
  --red:#c13b33;
  --red-soft:#d6584f;
  --bone:#d8d2c5;
  --bone-dim:#9aa0a3;
  --ink:#161b20;
  --ink-dim:#54585a;
  --line:rgba(216,210,197,.16);
  --line-ink:rgba(22,27,32,.16);
  --maxw:1240px;
  --gutter:32px;
  --disp:'Archivo',"Arial Narrow",sans-serif;
  --body:'IBM Plex Sans',system-ui,sans-serif;
  --mono:'IBM Plex Mono',ui-monospace,monospace;
}
@media (min-width:1600px){ :root{ --maxw:1400px; } }

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  background:var(--ground);
  color:var(--bone);
  font-family:var(--body);
  font-size:17px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
::selection{background:var(--amber);color:var(--ground)}

/* ---------- accessibility ---------- */
.skip-link{
  position:absolute;left:-9999px;top:0;z-index:100;
  background:var(--amber);color:var(--ground);
  font-family:var(--mono);font-size:13px;letter-spacing:.06em;
  padding:12px 20px;border-radius:0 0 3px 0;
}
.skip-link:focus{left:0}
:focus-visible{outline:2px solid var(--amber);outline-offset:3px;border-radius:2px}
.sec.light :focus-visible,.citizen :focus-visible{outline-color:var(--amber-ink)}
.visually-hidden{
  position:absolute!important;width:1px;height:1px;overflow:hidden;
  clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;
}

/* ---------- utility type ---------- */
.mono{font-family:var(--mono);letter-spacing:.04em}
.r{font-size:.46em;vertical-align:.62em;font-family:var(--body);font-weight:600;margin-left:.04em}
.label{
  font-family:var(--mono);font-size:11.5px;letter-spacing:.22em;text-transform:uppercase;
  color:var(--amber);display:inline-flex;align-items:center;gap:.6em;
}
.label::before{content:"";width:22px;height:1px;background:var(--amber);display:inline-block}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 var(--gutter)}
h1,h2,h3{font-family:var(--disp);font-weight:800;line-height:.98;letter-spacing:-.015em}
.display{font-family:var(--disp);font-weight:900;text-transform:uppercase;letter-spacing:-.02em;line-height:.92}

/* ---------- crosshair fiducials ---------- */
.fid{position:absolute;width:14px;height:14px;pointer-events:none;opacity:.5}
.fid::before,.fid::after{content:"";position:absolute;background:var(--amber)}
.fid::before{left:50%;top:0;width:1px;height:100%;transform:translateX(-.5px)}
.fid::after{top:50%;left:0;height:1px;width:100%;transform:translateY(-.5px)}
.fid.tl{top:14px;left:14px}.fid.tr{top:14px;right:14px}
.fid.bl{bottom:14px;left:14px}.fid.br{bottom:14px;right:14px}
.fid.dim40{opacity:.4}.fid.dim30{opacity:.3}.fid.dim25{opacity:.25}

/* ---------- header ---------- */
header{
  position:fixed;top:0;left:0;right:0;z-index:60;
  background:rgba(19,23,27,.72);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
  transition:background .3s;
}
header.scrolled{background:rgba(19,23,27,.92)}
.bar{display:flex;align-items:center;justify-content:space-between;height:64px}
.brand{display:flex;align-items:center}
/* official kit lockup (img/cdog-logo-on-dark.svg) — sized by height, ratio intrinsic */
.brand img{height:30px;width:auto;display:block}
nav.main{display:flex;align-items:center;gap:28px}
nav.main a{
  font-family:var(--mono);font-size:12px;letter-spacing:.08em;color:var(--bone-dim);
  text-transform:uppercase;transition:color .2s;padding:12px 0;
}
nav.main a:hover{color:var(--bone)}
nav.main a.cta{color:var(--ground);background:var(--amber);padding:11px 16px;border-radius:2px;font-weight:600;letter-spacing:.06em}
nav.main a.cta:hover{background:var(--amber-soft)}
.menu-btn{
  display:none;background:none;border:1px solid var(--line);color:var(--bone);
  min-width:64px;height:44px;border-radius:2px;cursor:pointer;font-family:var(--mono);font-size:11px;
}

/* ---------- hero ---------- */
.hero{position:relative;padding:148px 0 88px;overflow:hidden}
.hero-grid{
  position:absolute;inset:0;z-index:0;opacity:.5;
  background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);
  background-size:54px 54px;
  -webkit-mask-image:radial-gradient(120% 90% at 70% 18%,#000 30%,transparent 78%);
          mask-image:radial-gradient(120% 90% at 70% 18%,#000 30%,transparent 78%);
}
.hero-glow{
  position:absolute;z-index:0;width:760px;height:760px;border-radius:50%;right:-180px;top:-260px;
  background:radial-gradient(circle,rgba(216,151,58,.16),transparent 62%);filter:blur(8px);
}
.hero-inner{position:relative;z-index:2}
.hero-coords{
  display:flex;gap:26px;flex-wrap:wrap;font-family:var(--mono);font-size:11px;
  letter-spacing:.12em;color:var(--bone-dim);margin-bottom:30px;
}
.hero-coords b{color:var(--amber);font-weight:500}
.hero h1{font-size:clamp(46px,8.4vw,128px);text-transform:uppercase;font-weight:900;letter-spacing:-.025em;color:var(--bone);max-width:14ch}
.hero h1 .hl{color:var(--amber);display:inline-block}
.hero-sub{margin-top:30px;max-width:62ch;font-size:clamp(17px,2vw,20px);color:var(--bone);opacity:.86;line-height:1.55}
.hero-sub b{color:var(--bone);font-weight:600}
.hero-actions{display:flex;gap:16px;flex-wrap:wrap;margin-top:40px}

/* ---------- buttons ---------- */
.btn{
  font-family:var(--mono);font-size:13px;letter-spacing:.06em;text-transform:uppercase;
  padding:15px 26px;border-radius:2px;cursor:pointer;border:1px solid transparent;
  display:inline-flex;align-items:center;gap:10px;transition:all .22s;font-weight:500;
  /* explicit — <button> elements otherwise show the UA's ButtonFace behind ghost variants */
  background:transparent;
}
.btn-primary{background:var(--amber);color:var(--ground);font-weight:600}
.btn-primary:hover{background:var(--amber-soft);transform:translateY(-2px)}
.btn-ghost{border-color:var(--line);color:var(--bone)}
.btn-ghost:hover{border-color:var(--amber);color:var(--amber)}
.btn-teal{background:var(--teal);color:#0c1113;font-weight:600}
.btn-teal:hover{background:var(--teal-soft)}
.btn .arw{transition:transform .22s}
.btn:hover .arw{transform:translateX(4px)}
.btn[disabled]{opacity:.55;cursor:wait;transform:none}

/* ---------- render-safe semaphore ---------- */
.semaphore{
  margin-top:62px;border:1px solid var(--line);border-radius:3px;
  background:linear-gradient(180deg,rgba(26,33,40,.6),rgba(19,23,27,.3));
  padding:26px 30px 30px;position:relative;max-width:760px;
}
.sem-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:24px}
.sem-head .t{font-family:var(--mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--bone-dim)}
.sem-head .ref{font-family:var(--mono);font-size:11px;color:var(--bone-dim)}
.sem-track{position:relative;height:3px;background:var(--ground-3);border-radius:2px;margin:0 8px 26px}
.sem-fill{
  position:absolute;left:0;top:0;bottom:0;width:0;border-radius:2px;
  background:linear-gradient(90deg,var(--red),var(--amber) 52%,var(--teal));
  animation:fill 2.6s cubic-bezier(.6,0,.2,1) .4s forwards;
}
@keyframes fill{to{width:100%}}
.sem-states{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.st{opacity:.32;transition:opacity .5s}
.st .dot{width:11px;height:11px;border-radius:50%;background:currentColor;margin-bottom:12px}
.st .k{font-family:var(--disp);font-weight:800;font-size:19px;text-transform:uppercase;color:var(--bone);display:block}
.st .d{font-family:var(--mono);font-size:11px;color:var(--bone-dim);margin-top:5px;display:block}
.st.s1{color:var(--red)}.st.s2{color:var(--amber)}.st.s3{color:var(--teal)}
.st.lit{opacity:1}
.st.lit .dot{box-shadow:0 0 16px 0 currentColor}

/* ---------- sections ---------- */
.sec{padding:104px 0;position:relative}
.sec-head{margin-bottom:54px;max-width:840px}
.sec-head h2{font-size:clamp(32px,4.6vw,58px);color:var(--bone);text-transform:uppercase;margin-top:18px}
.sec-head p{margin-top:22px;color:var(--bone);opacity:.8;max-width:64ch;font-size:18px}

/* ---------- divisions ---------- */
.grid-div{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.divcard{
  background:var(--ground);padding:38px 34px 32px;position:relative;min-height:384px;
  display:flex;flex-direction:column;transition:background .3s;overflow:hidden;
}
.divcard:hover{background:var(--ground-2)}
.divcard .scan{
  position:absolute;left:0;right:0;top:0;height:2px;
  background:linear-gradient(90deg,transparent,var(--amber),transparent);
  transform:translateY(-3px);opacity:0;transition:.4s;
}
.divcard:hover .scan{opacity:1;transform:translateY(0)}
.divcard .idx{font-family:var(--mono);font-size:11px;letter-spacing:.16em;color:var(--bone-dim)}
.divcard .nm{font-family:var(--disp);font-weight:800;font-size:27px;text-transform:uppercase;margin-top:14px;color:var(--bone);letter-spacing:-.01em}
.divcard .role{font-family:var(--mono);font-size:12px;letter-spacing:.05em;color:var(--amber);margin-top:8px;text-transform:uppercase;display:block}
.divcard .desc{margin-top:20px;color:var(--bone);opacity:.78;font-size:15.5px;line-height:1.6}
.divcard ul{list-style:none;margin-top:20px;display:flex;flex-direction:column;gap:9px}
.divcard li{font-family:var(--mono);font-size:12px;color:var(--bone-dim);letter-spacing:.01em;display:flex;gap:10px;align-items:flex-start}
.divcard li::before{content:"";width:5px;height:5px;background:var(--amber);margin-top:6px;flex:none;transform:rotate(45deg)}
.divcard .foot{margin-top:auto;padding-top:24px;display:flex;justify-content:space-between;align-items:center;gap:12px}
.divcard .foot a{
  font-family:var(--mono);font-size:12px;letter-spacing:.05em;color:var(--bone);text-transform:uppercase;
  display:inline-flex;gap:8px;align-items:center;transition:gap .2s,color .2s;padding:10px 0;
}
.divcard .foot a:hover{color:var(--amber);gap:13px}
.divcard .tag{font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;color:var(--bone-dim);text-transform:uppercase;text-align:right}

/* ---------- stats strip (light band) ---------- */
.stats{
  display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line-ink);
  border-top:1px solid var(--line-ink);border-bottom:1px solid var(--line-ink);
}
.stat{background:var(--paper);padding:34px 26px}
.stat .n{font-family:var(--disp);font-weight:900;font-size:clamp(32px,4.2vw,52px);color:var(--ink);line-height:1;letter-spacing:-.02em}
.stat .n em{color:var(--amber-ink);font-style:normal}
.stat .l{font-family:var(--mono);font-size:11.5px;letter-spacing:.06em;color:var(--ink-dim);margin-top:12px;text-transform:uppercase;line-height:1.5}

/* ---------- SAFHEE ---------- */
.safhee{background:var(--ground-2);position:relative;overflow:hidden}
.safhee .hatch{
  position:absolute;inset:0;opacity:.5;
  background:repeating-linear-gradient(135deg,transparent,transparent 13px,rgba(216,151,58,.04) 13px,rgba(216,151,58,.04) 14px);
}
.safhee .wrap{position:relative;z-index:2}
.safhee-top{display:grid;grid-template-columns:1.1fr .9fr;gap:60px;align-items:end}
.safhee-top h2{font-size:clamp(40px,6.4vw,90px);color:var(--bone);text-transform:uppercase;line-height:.9;margin-top:20px}
.safhee-top h2 em{color:var(--amber);font-style:normal}
.safhee .lead{color:var(--bone);opacity:.85;font-size:18px;line-height:1.6}
.safhee .lead b{color:var(--amber-soft);font-weight:600}
.tmbar{display:flex;flex-wrap:wrap;margin-top:28px;border:1px solid var(--line);border-radius:3px;overflow:hidden}
.tmbar span{
  font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--bone-dim);
  padding:13px 20px;border-right:1px solid var(--line);flex:1;white-space:nowrap;text-align:center;
}
.tmbar span:last-child{border-right:none}
.tmbar span b{color:var(--amber);font-weight:500}
.saf-stats{display:flex;gap:40px;flex-wrap:wrap;margin-top:30px}
.saf-stats .s b{font-family:var(--disp);font-weight:900;font-size:30px;color:var(--bone);display:block;line-height:1}
.saf-stats .s span{font-family:var(--mono);font-size:11px;letter-spacing:.05em;color:var(--bone-dim);text-transform:uppercase}

.tiers-head{margin-top:56px}
.tiers-head p{margin-top:18px;color:var(--bone);opacity:.78;max-width:64ch;font-size:17px}
.tiers{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);margin-top:34px;border:1px solid var(--line)}
.tier{background:var(--ground-2);padding:30px 28px;position:relative}
.tier .pre{font-family:var(--mono);font-size:11px;letter-spacing:.14em;color:var(--amber);text-transform:uppercase}
.tier .nm{font-family:var(--disp);font-weight:900;font-size:34px;text-transform:uppercase;margin-top:8px;line-height:1}
.tier.t-safe .nm{color:var(--teal-soft)}
.tier.t-save .nm{color:var(--amber-soft)}
.tier.t-heat .nm{color:var(--red-soft)}
.tier .env{font-family:var(--mono);font-size:11px;letter-spacing:.06em;color:var(--bone);opacity:.7;text-transform:uppercase;margin-top:10px}
.sev{display:flex;gap:6px;margin-top:16px}
.sev i{flex:1;height:4px;background:rgba(216,210,197,.1);border-radius:2px}
.sev.l1 i:nth-child(1){background:var(--teal)}
.sev.l2 i:nth-child(1),.sev.l2 i:nth-child(2){background:var(--amber)}
.sev.l3 i{background:var(--red)}
.tier .d{margin-top:18px;font-size:14px;color:var(--bone);opacity:.76;line-height:1.6}

.frhead{margin-top:64px}
.frhead h3{font-size:clamp(26px,4vw,46px);color:var(--bone);margin-top:18px}
.franchise{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;margin-top:34px}
.fr{border:1px solid var(--line);border-radius:3px;padding:30px 26px;background:rgba(19,23,27,.4)}
.fr .ic{font-family:var(--disp);font-weight:900;font-size:13px;letter-spacing:.18em;color:var(--amber);text-transform:uppercase}
.fr h4{font-family:var(--disp);font-weight:800;font-size:21px;color:var(--bone);margin-top:16px;text-transform:uppercase;letter-spacing:-.01em}
.fr p{margin-top:12px;font-size:14.5px;color:var(--bone);opacity:.76;line-height:1.6}
.partner-cta{
  margin-top:48px;border:1px solid var(--amber);border-radius:3px;padding:42px;
  display:flex;justify-content:space-between;align-items:center;gap:36px;flex-wrap:wrap;
  background:linear-gradient(100deg,rgba(216,151,58,.1),transparent 70%);
}
.partner-cta .t h3{font-size:clamp(26px,3.5vw,40px);color:var(--bone);text-transform:uppercase}
.partner-cta .t p{margin-top:12px;color:var(--bone);opacity:.82;max-width:52ch}

/* ---------- citizen safe (light band) ---------- */
.citizen{background:var(--paper);color:var(--ink);position:relative;overflow:hidden}
.citizen .strip{position:absolute;left:0;top:0;bottom:0;width:6px;background:var(--teal)}
.cit-grid{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center}
.citizen .label{color:var(--teal-ink)}
.citizen .label::before{background:var(--teal-ink)}
.citizen h2{font-size:clamp(36px,5.2vw,66px);color:var(--ink);text-transform:uppercase;margin-top:18px;line-height:.95}
.citizen h2 em{color:var(--teal-ink);font-style:normal}
.citizen .lead{margin-top:24px;font-size:18px;color:var(--ink);opacity:.82;line-height:1.62}
.citizen .lead b{color:var(--teal-ink);font-weight:600}
.cit-list{margin-top:30px;display:grid;grid-template-columns:1fr 1fr;gap:18px 26px}
.cit-list .it{border-top:1px solid var(--line-ink);padding-top:14px}
.cit-list .it b{font-family:var(--disp);font-weight:700;font-size:16px;text-transform:uppercase;color:var(--ink);display:block}
.cit-list .it span{font-family:var(--mono);font-size:12px;color:var(--ink-dim);line-height:1.5;display:block;margin-top:5px}
.cit-panel{background:var(--ground);border-radius:4px;padding:42px 38px;position:relative;color:var(--bone)}
.cit-panel .qhead{font-family:var(--mono);font-size:11px;letter-spacing:.2em;color:var(--teal-soft);text-transform:uppercase}
.cit-panel .big{font-family:var(--disp);font-weight:900;font-size:clamp(30px,4vw,46px);text-transform:uppercase;color:var(--bone);line-height:.95;margin-top:20px}
.cit-panel .big em{color:var(--teal-soft);font-style:normal}
.cit-panel p{margin-top:20px;color:var(--bone);opacity:.8;font-size:15px;line-height:1.6}
.cit-panel .btn{margin-top:28px}

/* ---------- credibility ---------- */
.cred-rows{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line)}
.credcol{background:var(--ground);padding:38px 34px}
.credcol h3{font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--amber);margin-bottom:24px;font-weight:500}
.credcol .row{display:flex;flex-wrap:wrap;gap:10px;list-style:none}
.chip{font-family:var(--mono);font-size:12px;letter-spacing:.03em;color:var(--bone);border:1px solid var(--line);border-radius:2px;padding:9px 14px}
.proof{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-top:none}
.pf{background:var(--ground);padding:30px}
.pf .k{font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;color:var(--bone-dim);text-transform:uppercase;display:block}
.pf .v{font-family:var(--disp);font-weight:700;font-size:18px;color:var(--bone);margin-top:12px;text-transform:uppercase;line-height:1.15}
.cred-note{margin-top:28px;font-family:var(--mono);font-size:12px;color:var(--bone-dim);letter-spacing:.02em;max-width:74ch;line-height:1.7}

/* ---------- regions ---------- */
.regions{background:var(--ground-2)}
.reg-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.reg{background:var(--ground-2);padding:30px 22px;min-height:166px;display:flex;flex-direction:column;justify-content:space-between}
.reg .co{font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;color:var(--bone-dim);display:block}
.reg .nm{font-family:var(--disp);font-weight:800;font-size:19px;text-transform:uppercase;color:var(--bone);letter-spacing:-.01em;line-height:1.05;margin-top:10px}
.reg .st2{font-family:var(--mono);font-size:11px;letter-spacing:.05em;text-transform:uppercase;margin-top:auto;padding-top:16px}
.reg .st2.live{color:var(--teal-soft)}
.reg .st2.dev{color:var(--amber)}

/* ---------- contact ---------- */
.contact{background:var(--ground);border-top:1px solid var(--line)}
.hq{display:flex;flex-wrap:wrap;gap:40px;margin-bottom:46px;font-family:var(--mono);font-size:13px;letter-spacing:.03em;color:var(--bone)}
.hq .b{display:flex;flex-direction:column;gap:6px}
.hq .b .k{font-size:10.5px;letter-spacing:.16em;color:var(--amber);text-transform:uppercase}
.hq a{color:var(--bone);padding:2px 0}
.hq a:hover{color:var(--amber)}
.ct-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line)}
.ct{background:var(--ground);padding:38px 32px;transition:background .3s}
.ct:hover{background:var(--ground-2)}
.ct .k{font-family:var(--mono);font-size:11px;letter-spacing:.16em;color:var(--amber);text-transform:uppercase;display:block}
.ct h3{font-family:var(--disp);font-weight:800;font-size:24px;color:var(--bone);margin-top:14px;text-transform:uppercase}
.ct p{margin-top:14px;color:var(--bone);opacity:.76;font-size:14.5px;line-height:1.6}
.ct button.go{
  margin-top:22px;display:inline-flex;gap:9px;align-items:center;font-family:var(--mono);font-size:12px;
  letter-spacing:.04em;text-transform:uppercase;color:var(--bone);transition:.2s;
  background:none;border:none;cursor:pointer;padding:10px 0;
}
.ct button.go:hover{color:var(--amber);gap:14px}

/* ---------- enquiry form ---------- */
.form-panel{
  margin-top:54px;border:1px solid var(--line);border-radius:3px;padding:44px 40px;
  background:linear-gradient(180deg,rgba(26,33,40,.55),rgba(19,23,27,.3));
  position:relative;max-width:820px;
}
.form-panel h3{font-family:var(--disp);font-weight:800;font-size:clamp(22px,3vw,30px);color:var(--bone);text-transform:uppercase}
.form-panel .fp-sub{margin-top:10px;color:var(--bone);opacity:.75;font-size:15px;max-width:56ch}
.f-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:30px}
.f-field{display:flex;flex-direction:column;gap:8px}
.f-field.full{grid-column:1 / -1}
.f-field label{
  font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--bone-dim);
}
.f-field label b{color:var(--amber);font-weight:500}
.f-field input,.f-field select,.f-field textarea{
  background:rgba(19,23,27,.7);border:1px solid var(--line);border-radius:2px;
  color:var(--bone);font-family:var(--body);font-size:16px;padding:13px 14px;
  width:100%;transition:border-color .2s;
}
.f-field select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--bone-dim) 50%),linear-gradient(135deg,var(--bone-dim) 50%,transparent 50%);background-position:calc(100% - 20px) 55%,calc(100% - 15px) 55%;background-size:5px 5px;background-repeat:no-repeat;padding-right:40px}
.f-field textarea{min-height:130px;resize:vertical}
.f-field input:focus,.f-field select:focus,.f-field textarea:focus{outline:2px solid var(--amber);outline-offset:1px;border-color:var(--amber)}
.f-field input::placeholder,.f-field textarea::placeholder{color:rgba(154,160,163,.6)}
/* honeypot — hidden from humans, present for bots */
.f-hp{position:absolute;left:-9999px;top:-9999px;height:1px;width:1px;overflow:hidden}
.f-consent{display:flex;gap:12px;align-items:flex-start;margin-top:24px}
.f-consent input{width:20px;height:20px;margin-top:2px;accent-color:var(--amber);flex:none}
.f-consent label{font-size:13.5px;color:var(--bone-dim);line-height:1.55}
.f-actions{margin-top:28px;display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.f-note{font-family:var(--mono);font-size:11px;color:var(--bone-dim);letter-spacing:.03em}
.f-note a{color:var(--bone);text-decoration:underline;text-underline-offset:3px}
.f-note a:hover{color:var(--amber)}
.f-status{margin-top:18px;font-size:15px;display:none;padding:14px 16px;border-radius:2px;border:1px solid}
.f-status.ok{display:block;color:#8fd0c8;border-color:rgba(63,146,138,.5);background:rgba(63,146,138,.08)}
.f-status.err{display:block;color:#e89a94;border-color:rgba(193,59,51,.5);background:rgba(193,59,51,.08)}

/* ---------- footer ---------- */
footer{background:var(--ground);border-top:1px solid var(--line);padding:64px 0 40px}
.ft-top{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:40px}
.ft-brand .brand img{height:36px}
.ft-brand p{margin-top:20px;color:var(--bone-dim);font-size:13.5px;line-height:1.7;max-width:36ch}
.ft-col h2{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--amber);margin-bottom:18px;font-weight:500}
.ft-col a{display:block;color:var(--bone-dim);font-size:13.5px;padding:6px 0;transition:color .2s}
.ft-col a:hover{color:var(--bone)}
.ft-statutory{
  margin-top:54px;padding-top:26px;border-top:1px solid var(--line);
  font-family:var(--mono);font-size:11px;letter-spacing:.03em;line-height:1.7;color:var(--bone-dim);
}
.ft-bot{
  margin-top:20px;padding-top:0;border-top:none;
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:14px;
  font-family:var(--mono);font-size:11px;letter-spacing:.05em;color:var(--bone-dim);
}
.ft-bot .tm-note{color:var(--bone);opacity:.7}

/* ---------- cookie banner ---------- */
.cookiebar{
  position:fixed;bottom:0;left:0;right:0;z-index:80;
  background:var(--ground-2);border-top:1px solid var(--amber);
  padding:18px 0;display:none;
}
.cookiebar.show{display:block}
.cb-inner{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap}
.cb-inner p{font-size:13.5px;color:var(--bone);opacity:.85;max-width:64ch}
.cb-inner p a{color:var(--amber);text-decoration:underline;text-underline-offset:3px}
.cb-btns{display:flex;gap:10px}
.cb-btns .btn{padding:11px 20px;font-size:12px}

/* ---------- legal document pages ---------- */
body.legal{background:var(--paper);color:var(--ink)}
.doc{max-width:820px;margin:0 auto;padding:72px var(--gutter) 96px}
.doc h1{font-size:clamp(34px,5vw,52px);color:var(--ink);text-transform:uppercase;margin-top:26px}
.doc .meta{font-family:var(--mono);font-size:12px;letter-spacing:.06em;color:var(--ink-dim);margin-top:14px;text-transform:uppercase}
.doc h2{font-size:clamp(21px,2.6vw,27px);color:var(--ink);text-transform:uppercase;margin-top:44px}
.doc p{margin-top:16px;color:var(--ink);opacity:.88;font-size:16px;line-height:1.7}
.doc ul{margin:16px 0 0 22px;display:flex;flex-direction:column;gap:8px}
.doc li{color:var(--ink);opacity:.88;font-size:16px;line-height:1.6}
.doc a{color:var(--amber-ink);text-decoration:underline;text-underline-offset:3px}
.doc a:hover{color:var(--ink)}
.doc .back-link{
  font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;
  color:var(--ink);text-decoration:none;display:inline-block;padding:10px 0;
}
.doc .back-link:hover{color:var(--amber-ink)}
.doc .back-link.bottom{margin-top:40px}
.doc .todo{background:rgba(216,151,58,.18);border:1px solid var(--amber-ink);border-radius:2px;padding:2px 6px;font-family:var(--mono);font-size:.85em}
.table-wrap{overflow-x:auto;margin-top:18px}
.doc table{border-collapse:collapse;width:100%;font-size:14.5px}
.doc th,.doc td{border:1px solid var(--line-ink);padding:11px 13px;text-align:left;vertical-align:top;line-height:1.5}
.doc th{font-family:var(--mono);font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink);background:var(--paper-2)}
.doc code{font-family:var(--mono);font-size:.9em}

/* ---------- 404 ---------- */
.nf{min-height:100vh;display:flex;align-items:center;position:relative;overflow:hidden}
.nf .code{font-family:var(--mono);font-size:12px;letter-spacing:.2em;color:var(--amber);text-transform:uppercase}
.nf h1{font-size:clamp(44px,8vw,110px);text-transform:uppercase;color:var(--bone);margin-top:18px}
.nf p{margin-top:22px;color:var(--bone);opacity:.8;max-width:52ch;font-size:17px}
.nf .btn{margin-top:34px}

/* ---------- reveal on scroll ---------- */
.rv{opacity:0;transform:translateY(26px);transition:opacity .7s cubic-bezier(.2,.6,.2,1),transform .7s cubic-bezier(.2,.6,.2,1)}
.rv.in{opacity:1;transform:none}

/* ---------- responsive ---------- */
@media(max-width:1180px){
  .reg-grid{grid-template-columns:repeat(3,1fr)}
  /* 5 tiles in 3 or 2 columns leave a bare grid cell bottom-right — let the
     last tile absorb the remainder of its row */
  .reg:last-child{grid-column:span 2}
}
@media(max-width:980px){
  nav.main{display:none}
  nav.main.open{
    display:flex;position:absolute;top:64px;left:0;right:0;flex-direction:column;
    align-items:flex-start;gap:0;background:var(--ground);border-bottom:1px solid var(--line);padding:8px 24px 20px;
  }
  nav.main.open a{padding:13px 0;width:100%;border-bottom:1px solid var(--line);font-size:13px}
  nav.main.open a.cta{margin-top:14px;width:100%;justify-content:center;border-bottom:none;text-align:center}
  .menu-btn{display:block}
  .safhee-top{grid-template-columns:1fr;gap:30px;align-items:start}
  .cit-grid{grid-template-columns:1fr;gap:40px}
  .ft-top{grid-template-columns:1fr 1fr}
  .tiers{grid-template-columns:1fr}
  .franchise{grid-template-columns:1fr 1fr}
  .proof{grid-template-columns:1fr}
  .ct-grid{grid-template-columns:1fr}
}
@media(max-width:720px){
  .wrap{padding:0 22px}
  .sec{padding:74px 0}
  .grid-div{grid-template-columns:1fr}
  .divcard{min-height:0}
  .stats{grid-template-columns:1fr 1fr}
  .franchise{grid-template-columns:1fr}
  .cit-list{grid-template-columns:1fr}
  .cred-rows{grid-template-columns:1fr}
  .reg-grid{grid-template-columns:1fr 1fr}
  .ft-top{grid-template-columns:1fr}
  .sem-states{grid-template-columns:1fr;gap:14px}
  .partner-cta{padding:30px}
  .hero{padding:120px 0 60px}
  .form-panel{padding:32px 24px}
  .f-grid{grid-template-columns:1fr}
  .tmbar span{white-space:normal;flex-basis:50%}
}
@media(max-width:400px){
  .reg-grid{grid-template-columns:1fr}
  .reg:last-child{grid-column:auto}
  .stats{grid-template-columns:1fr}
}

/* ---------- reduced motion ---------- */
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *{animation:none!important;transition:none!important}
  .rv{opacity:1;transform:none}
  .sem-fill{width:100%}
  .st{opacity:1}
}