/* ============================================
   LocksmithWins.com — shared styles
   ============================================ */

:root{
  --ink:#101820;
  --ink-2:#161f29;
  --ink-3:#1d2833;
  --chalk:#EAEDEF;
  --chalk-dim:#9aa6ae;
  --brass:#C9A45C;
  --brass-bright:#e0bd75;
  --paper:#F2ECDD;
  --paper-line:#d8d0bc;
  --paper-ink:#2b2a24;
  --paper-dim:#6b675a;
  --win:#3f7d4c;
  --loss:#C05B4D;
  --rule:rgba(201,164,92,.20);
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *{transition:none!important;animation:none!important}
}
body{
  background:var(--ink);
  color:var(--chalk);
  font-family:'Public Sans',system-ui,-apple-system,sans-serif;
  font-size:17px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
a{color:inherit}
a:focus-visible,button:focus-visible{outline:2px solid var(--brass);outline-offset:3px}
.wrap{max-width:1120px;margin:0 auto;padding:0 24px}
.mono{font-family:'IBM Plex Mono',ui-monospace,monospace}
.narrow{max-width:720px}

/* ---------- NAV ---------- */
.nav{border-bottom:1px solid var(--rule);background:var(--ink);position:sticky;top:0;z-index:50}
.nav-inner{display:flex;align-items:center;justify-content:space-between;padding:18px 0;gap:16px;flex-wrap:wrap}
.brand{
  font-family:'Bricolage Grotesque',sans-serif;font-weight:800;font-size:20px;
  letter-spacing:.02em;text-decoration:none;display:flex;align-items:center;gap:10px;
}
.brand .key{
  width:26px;height:26px;border:2px solid var(--brass);border-radius:50%;
  display:inline-flex;align-items:center;justify-content:center;
  color:var(--brass);font-family:'IBM Plex Mono',monospace;font-size:13px;font-weight:600;
}
.brand em{font-style:normal;color:var(--brass)}
.nav-links{display:flex;gap:26px;list-style:none;align-items:center;flex-wrap:wrap}
.nav-links a{
  text-decoration:none;font-size:14px;font-weight:500;color:var(--chalk-dim);
  letter-spacing:.04em;transition:color .15s ease;
}
.nav-links a:hover,.nav-links a[aria-current="page"]{color:var(--chalk)}
.nav-cta{
  background:var(--brass);color:var(--ink)!important;font-weight:600!important;
  padding:9px 18px;border-radius:3px;transition:background .15s ease!important;
}
.nav-cta:hover{background:var(--brass-bright)}

/* ---------- SHARED TYPE ---------- */
.eyebrow{
  font-family:'IBM Plex Mono',monospace;font-size:13px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--brass);margin-bottom:22px;
}
h1{
  font-family:'Bricolage Grotesque',sans-serif;font-weight:800;
  font-size:clamp(38px,6vw,68px);line-height:1.04;letter-spacing:-.015em;max-width:860px;
}
h1 .accent{color:var(--brass)}
h2{
  font-family:'Bricolage Grotesque',sans-serif;font-weight:800;
  font-size:clamp(28px,3.6vw,42px);line-height:1.1;letter-spacing:-.01em;
}
h3{font-family:'Bricolage Grotesque',sans-serif;font-weight:700}
.lede{margin-top:26px;max-width:660px;color:var(--chalk-dim);font-size:18px}

/* ---------- BUTTONS ---------- */
.btn{
  display:inline-block;text-decoration:none;font-weight:600;font-size:15px;
  padding:14px 28px;border-radius:3px;letter-spacing:.02em;
  transition:background .15s ease,border-color .15s ease,color .15s ease;
}
.btn-brass{background:var(--brass);color:var(--ink)}
.btn-brass:hover{background:var(--brass-bright)}
.btn-ghost{border:1px solid rgba(234,237,239,.28);color:var(--chalk)}
.btn-ghost:hover{border-color:var(--brass);color:var(--brass)}
.actions{margin-top:36px;display:flex;gap:14px;flex-wrap:wrap}

/* ---------- SECTIONS ---------- */
.hero{padding:88px 0 56px;border-bottom:1px solid var(--rule)}
.page-head{padding:72px 0 48px;border-bottom:1px solid var(--rule)}
section{border-bottom:1px solid var(--rule)}
.pad{padding:76px 0}
.pad-sm{padding:56px 0}

/* ---------- RUN STRIP ---------- */
.strip{background:var(--ink-2);border-bottom:1px solid var(--rule);padding:20px 0}
.strip-inner{display:flex;align-items:baseline;justify-content:space-between;gap:18px;flex-wrap:wrap}
.strip-label{
  font-family:'IBM Plex Mono',monospace;font-size:12px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--chalk-dim);
}
.strip-line{
  font-family:'IBM Plex Mono',monospace;font-size:clamp(15px,2.2vw,19px);
  font-weight:600;color:var(--chalk);
}
.strip-line b{color:var(--brass);font-weight:600}
.strip-line .sep{color:rgba(234,237,239,.25);padding:0 6px}

/* ---------- STATS ---------- */
.stats-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--rule)}
.stat{background:var(--ink);padding:34px 30px}
.stat-num{
  font-family:'Bricolage Grotesque',sans-serif;font-weight:800;
  font-size:clamp(34px,4.4vw,50px);line-height:1;color:var(--chalk);
}
.stat-num span{color:var(--brass)}
.stat-label{
  margin-top:12px;font-family:'IBM Plex Mono',monospace;font-size:13px;
  letter-spacing:.1em;text-transform:uppercase;color:var(--chalk-dim);
}
.note{margin-top:20px;font-size:14px;color:var(--chalk-dim)}

/* ---------- PRINCIPLES ---------- */
.split{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:64px;align-items:start}
.split p{margin-top:22px;color:var(--chalk-dim)}
.split p strong{color:var(--chalk);font-weight:600}
.rules{list-style:none}
.rules li{padding:22px 0;border-bottom:1px solid rgba(201,164,92,.16);display:flex;gap:18px;align-items:baseline}
.rules li:first-child{padding-top:0}
.rules .tick{font-family:'IBM Plex Mono',monospace;color:var(--brass);font-size:14px;flex-shrink:0}
.rules h3{font-size:19px;margin-bottom:6px}
.rules p{margin:0;font-size:15px;color:var(--chalk-dim)}

/* ---------- LEDGER (cream panel) ---------- */
.ledger{
  background:var(--paper);color:var(--paper-ink);border-radius:4px;
  padding:38px 40px 30px;position:relative;
  box-shadow:0 24px 60px rgba(0,0,0,.45), inset 0 0 0 1px rgba(43,42,36,.08);
}
.ledger:before{content:"";position:absolute;top:0;left:40px;right:40px;height:2px;background:var(--brass)}
.ledger-title{
  display:flex;justify-content:space-between;align-items:baseline;gap:16px;flex-wrap:wrap;
  padding-bottom:16px;border-bottom:2px solid var(--paper-ink);margin-bottom:4px;
}
.ledger-title h3{font-weight:800;font-size:21px}
.ledger-title .mono{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--paper-dim)}
.ledger table{width:100%;border-collapse:collapse}
.ledger th{
  font-family:'IBM Plex Mono',monospace;font-size:11px;font-weight:600;
  letter-spacing:.14em;text-transform:uppercase;color:var(--paper-dim);
  text-align:right;padding:14px 8px 10px;border-bottom:1px solid var(--paper-line);
}
.ledger th:first-child{text-align:left}
.ledger td{
  font-family:'IBM Plex Mono',monospace;font-size:15px;text-align:right;
  padding:11px 8px;border-bottom:1px solid var(--paper-line);
}
.ledger td:first-child{text-align:left;font-weight:600}
.ledger .units{color:var(--win);font-weight:600}
.ledger tr.total td{
  border-bottom:none;border-top:2px solid var(--paper-ink);
  font-weight:600;padding-top:14px;font-size:16px;
}
.ledger tr.sub td{background:rgba(43,42,36,.04)}
.ledger-foot{margin-top:14px;font-size:13px;color:var(--paper-dim);font-family:'IBM Plex Mono',monospace}
.ledger + .ledger{margin-top:32px}

/* ---------- PACKAGES ---------- */
.pkg-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.pkg{
  border:1px solid rgba(201,164,92,.25);border-radius:4px;padding:30px 28px;
  display:flex;flex-direction:column;gap:8px;background:var(--ink-2);position:relative;
  transition:border-color .15s ease,transform .15s ease;
}
.pkg:hover{border-color:var(--brass);transform:translateY(-3px)}
.pkg-tag{
  position:absolute;top:-11px;left:24px;background:var(--brass);color:var(--ink);
  font-family:'IBM Plex Mono',monospace;font-size:11px;font-weight:600;
  letter-spacing:.1em;text-transform:uppercase;padding:3px 10px;border-radius:2px;
}
.pkg h3{font-size:22px}
.pkg-price{font-family:'IBM Plex Mono',monospace;font-size:30px;font-weight:600;color:var(--brass)}
.pkg p{font-size:14.5px;color:var(--chalk-dim);flex-grow:1;margin-top:4px}
.pkg .btn{margin-top:18px;text-align:center;padding:12px 0}

/* ---------- STEPS ---------- */
.steps-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:44px;margin-top:48px}
.step h3{font-size:20px;margin-top:14px}
.step p{margin-top:10px;font-size:15px;color:var(--chalk-dim)}
.step .mono{color:var(--brass);font-size:13px;letter-spacing:.12em}

/* ---------- CALLOUT ---------- */
.callout{
  border:1px dashed rgba(201,164,92,.45);border-radius:4px;padding:36px 40px;
  display:flex;justify-content:space-between;align-items:center;gap:28px;flex-wrap:wrap;
}
.callout h2{font-size:clamp(24px,3vw,32px)}
.callout p{margin-top:10px;color:var(--chalk-dim);max-width:520px}

/* ---------- PROSE ---------- */
.prose p{margin-top:20px;color:var(--chalk-dim)}
.prose p:first-child{margin-top:0}
.prose h2{margin-top:48px}
.prose h3{font-size:20px;margin-top:32px}
.prose strong{color:var(--chalk);font-weight:600}
.prose ul{margin-top:18px;padding-left:22px;color:var(--chalk-dim)}
.prose li{margin-bottom:10px}

/* ---------- FAQ ---------- */
.faq{list-style:none;margin-top:8px}
.faq li{padding:24px 0;border-bottom:1px solid rgba(201,164,92,.16)}
.faq h3{font-size:19px;margin-bottom:8px}
.faq p{color:var(--chalk-dim);font-size:15.5px}

/* ---------- FOOTER ---------- */
footer{padding:56px 0 44px}
.foot-inner{display:flex;justify-content:space-between;gap:32px;flex-wrap:wrap;align-items:flex-start}
.foot-brand p{margin-top:12px;font-size:14px;color:var(--chalk-dim);max-width:360px}
.foot-links{display:flex;gap:48px;flex-wrap:wrap}
.foot-col h4{
  font-family:'IBM Plex Mono',monospace;font-size:12px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--chalk-dim);margin-bottom:14px;font-weight:500;
}
.foot-col ul{list-style:none}
.foot-col li{margin-bottom:10px}
.foot-col a{text-decoration:none;font-size:14.5px;color:var(--chalk);transition:color .15s ease}
.foot-col a:hover{color:var(--brass)}
.foot-legal{
  margin-top:44px;padding-top:24px;border-top:1px solid rgba(201,164,92,.16);
  font-size:13px;color:var(--chalk-dim);display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;
}

/* ---------- RESPONSIVE ---------- */
@media (max-width:900px){
  .stats-grid{grid-template-columns:1fr}
  .split{grid-template-columns:1fr;gap:40px}
  .pkg-grid{grid-template-columns:1fr 1fr}
  .steps-grid{grid-template-columns:1fr;gap:32px}
}
@media (max-width:620px){
  body{font-size:16px}
  .pkg-grid{grid-template-columns:1fr}
  .ledger{padding:26px 18px 22px}
  .ledger:before{left:18px;right:18px}
  .ledger td,.ledger th{font-size:12.5px;padding:9px 4px}
  .hero{padding:60px 0 40px}
  .pad{padding:56px 0}
  .callout{padding:28px 24px}
  .nav-links{gap:16px}
}

/* ---------- SIGNUP (free card) ---------- */
.signup{
  background:var(--ink-2);
  border:1px solid rgba(201,164,92,.28);
  border-radius:4px;
  padding:32px 30px;
}
.signup h3{font-size:21px;margin-bottom:20px;color:var(--chalk)}
.signup-note{
  margin-top:18px;font-size:13px;color:var(--chalk-dim);
  font-family:'IBM Plex Mono',monospace;letter-spacing:.02em;
}
/* make the embedded Constant Contact form sit on the dark card */
.signup .ctct-inline-form{color:var(--chalk)}
.signup .ctct-form-wrapper,
.signup .ctct-form-defaults{background:transparent!important;padding:0!important}
.signup .ctct-form-header,
.signup .ctct-form-text,
.signup .ctct-form-label{color:var(--chalk)!important}
.signup input[type=text],
.signup input[type=email]{
  width:100%!important;background:var(--ink)!important;
  border:1px solid rgba(234,237,239,.22)!important;
  color:var(--chalk)!important;border-radius:3px!important;
  padding:12px 14px!important;font-size:16px!important;
}
.signup input[type=text]:focus,
.signup input[type=email]:focus{border-color:var(--brass)!important;outline:none!important}
.signup .ctct-form-button{
  background:var(--brass)!important;color:var(--ink)!important;
  border:none!important;border-radius:3px!important;
  font-weight:600!important;font-size:15px!important;
  padding:14px 28px!important;width:100%!important;cursor:pointer;
}
.signup .ctct-form-button:hover{background:var(--brass-bright)!important}