/* ==========================================================
   Templar Protection Services — shared stylesheet
   Palette: Sonoran desert at blue hour, when the shift starts.
   ink/night = sky · amber = sodium vapor light · bone = caliche
   scrub = creosote
   ========================================================== */

:root{
  --ink:#131A2E;
  --night:#212B4A;
  --amber:#E9A13B;
  --bone:#E9E3D5;
  --scrub:#6E7F6B;
  --paper:#F6F3EC;
  --rule:rgba(19,26,46,.16);
  --rule-dark:rgba(233,227,213,.18);
  --display:"Archivo","Helvetica Neue",Arial,sans-serif;
  --text:"Spectral",Georgia,"Times New Roman",serif;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:var(--text);font-size:17px;line-height:1.62;
  -webkit-font-smoothing:antialiased;
}
.wrap{max-width:1180px;margin:0 auto;padding:0 28px}
h1,h2,h3,h4,.dsp{font-family:var(--display);font-weight:700;letter-spacing:-.022em;line-height:1.1;margin:0}
p{margin:0 0 1.1em;max-width:64ch}
a{color:inherit}
strong{font-weight:600}
:focus-visible{outline:2px solid var(--amber);outline-offset:2px}

/* ---------- masthead ---------- */
.mast{position:sticky;top:0;z-index:60;background:rgba(246,243,236,.94);
  backdrop-filter:saturate(140%) blur(8px);border-bottom:1px solid var(--rule)}
.mast-in{display:flex;align-items:center;gap:24px;height:64px}
.mark{font-family:var(--display);font-weight:800;font-size:16.5px;letter-spacing:-.03em;
  text-decoration:none;white-space:nowrap}
.mark span{color:var(--scrub);font-weight:600}
.mast nav{margin-left:auto;display:flex;align-items:center;gap:22px}
.mast nav a:not(.btn){font-family:var(--display);font-weight:500;font-size:14.5px;
  text-decoration:none;color:var(--night);padding:4px 0;border-bottom:1.5px solid transparent}
.mast nav a:not(.btn):hover,.mast nav a:not(.btn):focus-visible{border-bottom-color:var(--amber)}
.mast nav a[aria-current="page"]{border-bottom-color:var(--ink)}
.navtoggle{display:none;margin-left:auto;background:none;border:1px solid var(--rule);
  padding:9px 12px;font-family:var(--display);font-weight:600;font-size:14px;color:var(--ink);cursor:pointer}

.btn{display:inline-block;font-family:var(--display);font-weight:600;font-size:15px;
  padding:11px 20px;text-decoration:none;border:1.5px solid var(--ink);
  background:var(--ink);color:var(--paper);cursor:pointer}
.btn:hover,.btn:focus-visible{background:var(--amber);border-color:var(--amber);color:var(--ink)}
.btn-ghost{background:transparent;color:var(--ink)}
.btn-ghost:hover,.btn-ghost:focus-visible{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.btn-light{background:var(--amber);border-color:var(--amber);color:var(--ink)}
.btn-light:hover,.btn-light:focus-visible{background:var(--bone);border-color:var(--bone)}
.mast .btn{padding:9px 16px;font-size:14px}

/* ---------- page header (inner pages) ---------- */
.phead{padding:64px 0 52px;border-bottom:1px solid var(--rule)}
.phead h1{font-size:clamp(2.2rem,4.4vw,3.4rem);font-weight:800;max-width:19ch}
.phead .lede{font-size:1.14rem;margin-top:22px;max-width:56ch;color:#2C3550}
.kicker{font-family:var(--display);font-weight:600;font-size:13.5px;color:var(--scrub);margin-bottom:14px}

/* ---------- hero (home) ---------- */
.hero{padding:74px 0 68px;border-bottom:1px solid var(--rule)}
.hero-grid{display:grid;grid-template-columns:1.02fr 1fr;gap:60px;align-items:center}
.hero h1{font-size:clamp(2.5rem,5.2vw,4.05rem);font-weight:800}
.hero h1 em{font-style:normal;color:var(--night)}
.lede{font-size:1.16rem;margin-top:26px;max-width:46ch;color:#2C3550}
.hero-cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}
.hero-meta{margin-top:34px;padding-top:18px;border-top:1px solid var(--rule);
  font-family:var(--display);font-size:13.5px;font-weight:500;color:var(--night);
  display:flex;flex-wrap:wrap;gap:8px 26px}
.plan{width:100%;height:auto;display:block}
.plan-frame{background:var(--ink);padding:16px;border:1px solid var(--ink)}
.plan-cap{font-family:var(--display);font-size:12px;font-weight:500;
  color:rgba(233,227,213,.62);padding:10px 4px 2px;margin:0;max-width:none}

/* ---------- divisions ---------- */
.div-split{display:grid;grid-template-columns:1fr 1fr}
.div-cell{padding:64px 44px}
.div-ground{background:var(--bone)}
.div-air{background:var(--ink);color:var(--bone)}
.div-cell h2{font-size:2.1rem;margin-bottom:6px}
.div-role{font-family:var(--display);font-weight:600;font-size:13.5px;color:var(--scrub);margin-bottom:22px}
.div-air .div-role{color:var(--amber)}
.div-air p{color:rgba(233,227,213,.86)}
.div-cell ul{list-style:none;margin:26px 0 0;padding:0;max-width:42ch}
.div-cell li{padding:11px 0;border-top:1px solid var(--rule);font-size:16px}
.div-air li{border-top-color:var(--rule-dark)}
.tag{display:inline-block;font-family:var(--display);font-size:11.5px;font-weight:700;
  background:var(--amber);color:var(--ink);padding:3px 8px;margin-left:9px;vertical-align:2px}

/* ---------- generic section ---------- */
.sec{padding:78px 0;border-bottom:1px solid var(--rule)}
.sec-tight{padding:56px 0}
.sec h2{font-size:2.2rem;margin-bottom:12px}
.sec h3{font-size:1.35rem;margin-bottom:8px}
.sec-intro{max-width:56ch;color:#33405C}
.sec-dark{background:var(--night);color:var(--bone);border-bottom:0}
.sec-dark .sec-intro{color:rgba(233,227,213,.82)}
.sec-dark p{color:rgba(233,227,213,.86)}
.sec-bone{background:var(--bone)}

/* ---------- ledger rows ---------- */
.ledger{margin-top:44px;border-top:2px solid var(--ink)}
.sec-dark .ledger{border-top-color:var(--amber)}
.row{display:grid;grid-template-columns:minmax(200px,.9fr) 2.1fr minmax(150px,.7fr);
  gap:34px;padding:24px 0;border-bottom:1px solid var(--rule);align-items:baseline}
.sec-dark .row{border-bottom-color:var(--rule-dark)}
.row h3{font-size:1.18rem;font-weight:700}
.row p{margin:0;font-size:16px;color:#33405C}
.sec-dark .row p{color:rgba(233,227,213,.78)}
.row .when{font-family:var(--display);font-size:13.5px;font-weight:500;color:var(--scrub)}
.sec-dark .row .when{color:var(--amber)}
.row ul{margin:8px 0 0;padding-left:18px;font-size:15.5px;color:#33405C}
.row li{margin-bottom:4px}

/* ---------- credential grid ---------- */
.creds{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-top:40px;border-top:1px solid var(--rule-dark)}
.sec-bone .creds,.creds-light{border-top-color:var(--rule)}
.cred{padding:24px 24px 24px 0;border-right:1px solid var(--rule-dark)}
.creds-light .cred{border-right-color:var(--rule)}
.cred:last-child{border-right:0}
.cred dt{font-family:var(--display);font-weight:700;font-size:15px;margin-bottom:6px}
.cred dd{margin:0;font-size:14.5px;line-height:1.52;color:rgba(233,227,213,.74)}
.creds-light .cred dd{color:#3A4560}

/* ---------- two-column prose ---------- */
.two{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:start;margin-top:36px}
.two-side{display:grid;grid-template-columns:.85fr 1.15fr;gap:60px;align-items:start}
.chips{display:flex;flex-wrap:wrap;gap:9px;margin:0;padding:0;list-style:none}
.chips li{font-family:var(--display);font-size:14px;font-weight:500;border:1px solid var(--rule);padding:7px 13px}
.sec-dark .chips li{border-color:var(--rule-dark)}

/* ---------- sample report mock ---------- */
.doc{background:#fff;border:1px solid var(--rule);box-shadow:14px 14px 0 rgba(19,26,46,.07);
  padding:30px 30px 26px;font-size:14px;line-height:1.5;max-width:none}
.doc-top{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;
  border-bottom:2px solid var(--ink);padding-bottom:14px;margin-bottom:18px}
.doc-top h3{font-size:1.05rem}
.doc-meta{font-family:var(--display);font-size:12px;font-weight:500;color:var(--scrub);text-align:right;line-height:1.7}
.doc h4{font-family:var(--display);font-size:12.5px;font-weight:700;color:var(--night);
  margin:20px 0 8px;padding-bottom:5px;border-bottom:1px solid var(--rule)}
.doc h4:first-of-type{margin-top:0}
.doc table{width:100%;border-collapse:collapse;font-size:13px}
.doc th{font-family:var(--display);font-size:11.5px;font-weight:700;text-align:left;
  color:var(--scrub);padding:5px 8px 5px 0;border-bottom:1px solid var(--rule)}
.doc td{padding:6px 8px 6px 0;border-bottom:1px solid rgba(19,26,46,.07);vertical-align:top}
.doc td:last-child,.doc th:last-child{padding-right:0}
.dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--scrub);margin-right:7px;vertical-align:1px}
.dot-flag{background:var(--amber)}
.doc p{margin:0 0 .7em;font-size:13.5px;max-width:none}
.doc .narr{background:#FCF8EF;border-left:3px solid var(--amber);padding:11px 13px;margin:0}
.doc-foot{margin-top:20px;padding-top:12px;border-top:1px solid var(--rule);
  font-family:var(--display);font-size:11px;color:var(--scrub);display:flex;justify-content:space-between;gap:16px}

/* ---------- about portrait ---------- */
.bio{display:grid;grid-template-columns:.72fr 1.28fr;gap:56px;align-items:start}
.portrait{background:var(--ink);aspect-ratio:4/5;display:flex;align-items:flex-end;padding:22px;
  border:1px solid var(--ink);position:relative;overflow:hidden}
.portrait img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.portrait figcaption{position:relative;z-index:2;font-family:var(--display);font-size:13px;
  font-weight:600;color:var(--bone);text-shadow:0 1px 8px rgba(0,0,0,.7)}
.portrait .ph{position:absolute;inset:0;display:grid;place-items:center;
  font-family:var(--display);font-size:13px;color:rgba(233,227,213,.42);text-align:center;padding:24px}
.timeline{margin-top:40px;border-top:2px solid var(--ink)}
.tl-row{display:grid;grid-template-columns:minmax(120px,.4fr) 2fr;gap:28px;
  padding:22px 0;border-bottom:1px solid var(--rule)}
.tl-row .yr{font-family:var(--display);font-weight:600;font-size:14px;color:var(--scrub)}
.tl-row h3{font-size:1.1rem;margin-bottom:5px}
.tl-row p{margin:0;font-size:15.5px;color:#33405C}

/* ---------- job listings ---------- */
.jobs{margin-top:44px;border-top:2px solid var(--ink)}
.job{border-bottom:1px solid var(--rule);padding:30px 0}
.job-top{display:flex;flex-wrap:wrap;justify-content:space-between;gap:14px 24px;align-items:baseline}
.job h3{font-size:1.4rem}
.job-facts{font-family:var(--display);font-size:13.5px;font-weight:500;color:var(--scrub);
  display:flex;flex-wrap:wrap;gap:6px 18px;margin-top:8px}
.job-body{display:grid;grid-template-columns:1.25fr 1fr;gap:44px;margin-top:20px}
.job-body h4{font-family:var(--display);font-size:12.5px;font-weight:700;color:var(--night);margin-bottom:9px}
.job-body ul{margin:0;padding-left:19px;font-size:15.5px;color:#33405C}
.job-body li{margin-bottom:6px}
.pay{font-family:var(--display);font-weight:700;font-size:1.05rem;white-space:nowrap}

/* ---------- forms ---------- */
.form-sec{background:var(--bone);padding:80px 0}
.form-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:60px;align-items:start}
.form-sec h2{font-size:2.2rem;margin-bottom:14px}
.intake-copy{position:sticky;top:96px}
.intake-guide{margin:30px 0 26px;border-top:2px solid var(--ink);border-bottom:1px solid var(--rule)}
.intake-guide-title{font-family:var(--display);font-size:12px;font-weight:800;letter-spacing:.12em;
  text-transform:uppercase;margin:0;padding:14px 0 10px;color:var(--scrub)}
.intake-guide ol{list-style:none;margin:0;padding:0}
.intake-guide li{display:grid;grid-template-columns:42px 1fr;gap:10px;padding:13px 0;border-top:1px solid var(--rule);
  font-size:15px;line-height:1.45;color:#33405C}
.intake-guide li span{font-family:var(--display);font-weight:800;color:var(--amber-dark)}
.intake-safety{margin-top:24px;padding:14px 16px;border-left:3px solid var(--amber);background:rgba(255,255,255,.38);
  font-size:14px;line-height:1.5;color:#33405C}
form{display:grid;grid-template-columns:1fr 1fr;gap:18px 20px}
.f-full{grid-column:1 / -1}
.form-section{display:flex;align-items:baseline;justify-content:space-between;gap:18px;margin-top:10px;
  padding:14px 0 6px;border-top:2px solid var(--ink)}
.form-section:first-of-type{margin-top:0}
.form-section p{font-family:var(--display);font-size:15px;font-weight:800;margin:0;color:var(--ink)}
.form-section span{font-size:12.5px;color:#59637A;text-align:right}
label{display:block;font-family:var(--display);font-weight:600;font-size:13.5px;margin-bottom:6px}
label:has(+ input[required])::after,label:has(+ select[required])::after,label:has(+ textarea[required])::after{content:" *";color:var(--amber-dark)}
input,select,textarea{width:100%;font-family:var(--text);font-size:16px;color:var(--ink);
  background:var(--paper);border:1px solid rgba(19,26,46,.28);padding:11px 12px;border-radius:0}
input:focus,select:focus,textarea:focus{outline:2px solid var(--amber);outline-offset:1px;border-color:var(--ink)}
textarea{min-height:96px;resize:vertical}
.field-help{font-size:12.5px;color:#59637A;margin:7px 0 0;line-height:1.45}
.consent{display:flex;gap:11px;align-items:flex-start;font-size:14.5px;line-height:1.5}
.consent input{width:auto;margin-top:4px;flex:none}
.consent label{font-family:var(--text);font-weight:400;font-size:14.5px;margin:0}
.form-note{font-size:13.5px;color:#4A5570;margin:0}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.checkgrid{display:grid;grid-template-columns:1fr 1fr;gap:8px 18px;margin-top:2px}
.checkgrid div{display:flex;gap:9px;align-items:center}
.checkgrid input{width:auto;flex:none}
.checkgrid label{font-family:var(--text);font-weight:400;font-size:15px;margin:0}

/* ---------- cta band ---------- */
.band{background:var(--ink);color:var(--bone);padding:60px 0;text-align:left}
.band h2{font-size:2rem;margin-bottom:10px}
.band p{color:rgba(233,227,213,.82);max-width:52ch}
.band .hero-cta{margin-top:24px}

/* ---------- footer ---------- */
footer{background:var(--ink);color:rgba(233,227,213,.76);padding:52px 0 40px;font-size:14.5px}
.foot-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:36px}
footer h4{font-family:var(--display);font-size:14px;color:var(--bone);margin-bottom:12px}
footer a{color:rgba(233,227,213,.76);text-decoration:none;border-bottom:1px solid transparent}
footer a:hover,footer a:focus-visible{color:var(--amber);border-bottom-color:var(--amber)}
footer ul{list-style:none;margin:0;padding:0}
footer li{margin-bottom:7px}
footer p{max-width:40ch}
.fine{margin-top:38px;padding-top:20px;border-top:1px solid var(--rule-dark);
  font-size:12.5px;color:rgba(233,227,213,.5);max-width:82ch}

/* ---------- responsive ---------- */
@media (max-width:980px){
  .foot-grid{grid-template-columns:1fr 1fr}
  .job-body{grid-template-columns:1fr;gap:24px}
}
@media (max-width:900px){
  .hero-grid,.div-split,.two,.two-side,.form-grid,.bio{grid-template-columns:1fr;gap:40px}
  .creds{grid-template-columns:1fr 1fr}
  .cred{padding-right:20px}
  .cred:nth-child(2){border-right:0}
  .row,.tl-row{grid-template-columns:1fr;gap:8px}
  .div-cell{padding:48px 28px}
  .hero{padding:52px 0 48px}
  .portrait{aspect-ratio:3/2;max-width:420px}
  .intake-copy{position:static}

  .navtoggle{display:block}
  .mast nav{position:absolute;top:64px;left:0;right:0;display:none;flex-direction:column;
    align-items:stretch;gap:0;background:var(--paper);border-bottom:1px solid var(--rule);padding:8px 28px 20px}
  .mast nav.open{display:flex}
  .mast nav a:not(.btn){padding:12px 0;border-bottom:1px solid var(--rule)}
  .mast nav .btn{margin-top:14px;text-align:center}
}
@media (max-width:560px){
  .creds{grid-template-columns:1fr}
  .cred{border-right:0;border-bottom:1px solid var(--rule-dark);padding-right:0}
  .creds-light .cred{border-bottom-color:var(--rule)}
  form,.checkgrid{grid-template-columns:1fr}
  .form-section{display:block}
  .form-section span{display:block;margin-top:4px;text-align:left}
  .foot-grid{grid-template-columns:1fr}
  body{font-size:16px}
  .doc{padding:20px 18px;box-shadow:8px 8px 0 rgba(19,26,46,.07)}
  .doc-top{flex-direction:column}
  .doc-meta{text-align:left}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *{transition:none!important}
}
@media print{
  .mast,footer,.band,.form-sec{display:none}
  body{background:#fff;font-size:12pt}
}
