:root{
  --granite:#1A1A1A;--bone:#F4F2EE;--bone-soft:#FAF8F4;
  --ember:#BD3F24;--ember-bright:#C8472C;
  --slate:#6B6B6B;--slate-soft:#8C8C8C;--rule:#D9D9D9;--rule-dark:#3A3A3A;
  --maxw:1180px;--pad:clamp(1.25rem,4vw,2.5rem);--sec-y:clamp(4.5rem,9vw,8rem);--radius:2px;
  --grid-ink:rgba(26,26,26,.045);--grid-bone:rgba(244,242,238,.06);
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
/* Keyboard focus — visible across every interactive element */
a,button,summary,[tabindex]{touch-action:manipulation;}
a:focus-visible,button:focus-visible,summary:focus-visible,.tile:focus-visible,.scard:focus-visible,.pillar:focus-visible{outline:2.5px solid var(--ember);outline-offset:3px;border-radius:2px;}
:focus:not(:focus-visible){outline:none;}
body{margin:0;background:var(--bone);color:var(--granite);
  font-family:"Inter",system-ui,Arial,Helvetica,sans-serif;font-size:clamp(1rem,1.05rem,1.125rem);
  line-height:1.6;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;}
.wrap{max-width:var(--maxw);margin:0 auto;padding-left:var(--pad);padding-right:var(--pad);}
.narrow{max-width:880px;}
h1,h2,h3{font-family:"Inter",system-ui,Arial,Helvetica,sans-serif;font-weight:800;letter-spacing:-0.02em;line-height:1.02;margin:0;}
h1{font-size:clamp(2.7rem,6vw,4.75rem);letter-spacing:-0.035em;line-height:0.99;}
h2{font-size:clamp(2.15rem,5vw,3.6rem);letter-spacing:-0.03em;line-height:1.0;}
h3{font-size:clamp(1.2rem,1.7vw,1.5rem);font-weight:700;letter-spacing:-0.015em;line-height:1.15;}
p{margin:0;} a{color:inherit;text-decoration:none;}
.measure{max-width:62ch;} .measure-narrow{max-width:54ch;}
.eyebrow{font-family:"JetBrains Mono",ui-monospace,monospace;font-size:.74rem;font-weight:500;text-transform:uppercase;letter-spacing:.22em;color:var(--ember);margin:0 0 1.3rem 0;display:inline-flex;align-items:center;gap:.7rem;}
.eyebrow::before{content:"";width:1.6rem;height:1px;background:var(--ember);opacity:.7;}
.finalcta .eyebrow,.sec-head.center .eyebrow{justify-content:center;}
.mono{font-family:"JetBrains Mono",ui-monospace,monospace;}
.lede{font-size:clamp(1.1rem,1.5vw,1.3rem);line-height:1.55;}
.muted{color:var(--slate);}
.kicker{font-weight:700;font-size:1.05rem;}

/* Buttons */
.btn{display:inline-flex;align-items:center;gap:.55rem;font-weight:600;font-size:1rem;line-height:1;
  border-radius:var(--radius);padding:.95rem 1.5rem;border:1.5px solid transparent;cursor:pointer;
  transition:transform .12s ease,background .15s ease,color .15s ease;}
.btn-primary{background:var(--ember);color:var(--bone);}
.btn-primary:hover{background:#b13d24;} .btn-primary:active{transform:translateY(1px);}
.btn-ghost{background:transparent;color:var(--granite);border-color:var(--granite);}
.btn-ghost:hover{background:var(--granite);color:var(--bone);} .btn-ghost:active{transform:translateY(1px);}
.dark .btn-ghost{color:var(--bone);border-color:var(--bone);}
.dark .btn-ghost:hover{background:var(--bone);color:var(--granite);}
.textlink{font-weight:600;border-bottom:1.5px solid var(--ember);padding-bottom:2px;}
.textlink:hover{color:var(--ember);}
.arrow{transition:transform .15s ease;display:inline-block;}
.textlink:hover .arrow{transform:translateX(3px);}
.ctarow{display:flex;flex-wrap:wrap;align-items:center;gap:1.1rem;}

/* Nav */
header.nav{position:sticky;top:0;z-index:40;background:rgba(244,242,238,.92);backdrop-filter:saturate(120%) blur(6px);border-bottom:1px solid var(--rule);}
.nav-inner{display:flex;align-items:center;justify-content:space-between;height:70px;gap:1.5rem;}
.brand{display:flex;align-items:center;gap:.6rem;flex-shrink:0;}
.brand svg{height:28px;width:auto;color:var(--granite);}
.brand .wm{font-weight:800;letter-spacing:-0.02em;font-size:1.02rem;white-space:nowrap;}
.navlinks{display:flex;align-items:center;gap:1.4rem;font-size:.95rem;font-weight:500;white-space:nowrap;}
.navlinks a{color:var(--granite);transition:color .15s;padding-bottom:2px;white-space:nowrap;}
.navlinks a:hover{color:var(--ember);}
.navlinks a.active{color:var(--ember);border-bottom:2px solid var(--ember);}
.nav-right{display:flex;align-items:center;gap:1.1rem;flex-shrink:0;}
.nav-phone{font-weight:600;font-size:.95rem;white-space:nowrap;} .nav-phone:hover{color:var(--ember);}
.menu-btn{display:none;background:none;border:0;cursor:pointer;font-size:1.5rem;color:var(--granite);padding:.25rem;}
.mobile-menu{display:none;border-top:1px solid var(--rule);}
.mobile-menu a{display:block;padding:.85rem var(--pad);border-bottom:1px solid var(--rule);font-weight:500;}

/* Blueprint grid texture */
.gridbg{position:relative;}
.gridbg::before{content:"";position:absolute;inset:0;pointer-events:none;z-index:0;
  background-image:linear-gradient(var(--grid-ink) 1px,transparent 1px),linear-gradient(90deg,var(--grid-ink) 1px,transparent 1px);
  background-size:clamp(34px,4vw,56px) clamp(34px,4vw,56px);
  -webkit-mask-image:radial-gradient(120% 100% at 70% 0%,#000 35%,transparent 78%);mask-image:radial-gradient(120% 100% at 70% 0%,#000 35%,transparent 78%);}
.gridbg > *{position:relative;z-index:1;}
.dark.gridbg::before{background-image:linear-gradient(var(--grid-bone) 1px,transparent 1px),linear-gradient(90deg,var(--grid-bone) 1px,transparent 1px);
  -webkit-mask-image:radial-gradient(120% 110% at 15% 0%,#000 30%,transparent 80%);mask-image:radial-gradient(120% 110% at 15% 0%,#000 30%,transparent 80%);}

/* Breadcrumb */
.crumb{font-size:.85rem;color:var(--slate);padding-top:1.5rem;}
.crumb a:hover{color:var(--ember);} .crumb .sep{margin:0 .5rem;color:var(--rule);}

/* Interior page head (typographic hero, left aligned) */
.pagehead{padding-top:clamp(2.5rem,5vw,3.75rem);padding-bottom:var(--sec-y);position:relative;overflow:hidden;}
.pagehead h1{margin-bottom:1.4rem;max-width:15ch;}
.pagehead .lede{margin-bottom:2rem;max-width:46ch;color:var(--granite);}
.contour{position:absolute;pointer-events:none;opacity:.06;color:var(--granite);}

/* Split hero (image/visual + copy) - use at most once per page */
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(2rem,5vw,4rem);align-items:center;}
.hero-visual{position:relative;} .hero-visual svg{width:100%;height:auto;display:block;overflow:visible;}

/* Animated blueprint hero + illustrations (self-drawing, on brand) */
.bp-draw{stroke-dasharray:var(--len,2200);stroke-dashoffset:var(--len,2200);animation:bpdraw 2s cubic-bezier(.65,0,.35,1) forwards;}
.bp-dim{opacity:0;animation:bpfade .6s ease forwards .9s;}
.bp-fig{opacity:0;animation:bpfig .5s ease forwards 2.1s;}
.bp-catch{opacity:0;animation:bpcatch .45s cubic-bezier(.34,1.56,.64,1) forwards 2.35s;}
.bp-catch-dot{transform-box:fill-box;transform-origin:center;animation:bppulse 1.9s ease-in-out 2.9s infinite;}
@keyframes bpdraw{to{stroke-dashoffset:0;}}
@keyframes bpfade{to{opacity:1;}}
@keyframes bpfig{from{opacity:0;transform:translateY(6px);}to{opacity:.85;transform:none;}}
@keyframes bpcatch{from{opacity:0;transform:scale(.4);}to{opacity:1;transform:scale(1);}}
@keyframes bppulse{0%,100%{transform:scale(1);}50%{transform:scale(1.55);}}
.bp-ill{width:100%;height:auto;display:block;}

/* Sections */
section{padding-top:var(--sec-y);padding-bottom:var(--sec-y);}
.rule-top{border-top:1px solid var(--rule);}
.sec-head{margin-bottom:2.5rem;}
.sec-head h2{max-width:18ch;}
.sec-head .intro{color:var(--slate);max-width:46ch;font-weight:500;margin-top:1rem;}

/* Statement */
.statement h2{margin-bottom:1.5rem;max-width:18ch;}
.statement .body{font-size:clamp(1.1rem,1.5vw,1.35rem);line-height:1.55;max-width:60ch;}
.statement .kicker{margin-top:1.75rem;}

/* Three-up divided columns (NOT cards) */
.cols3{display:grid;grid-template-columns:repeat(3,1fr);margin-top:2.5rem;}
.cols2{display:grid;grid-template-columns:repeat(2,1fr);margin-top:2.5rem;}
.col{padding:0 clamp(1rem,2.2vw,2rem);}
.cols3 .col:not(:last-child),.cols2 .col:not(:last-child){border-right:1px solid var(--rule);}
.col:first-child{padding-left:0;} .col:last-child{padding-right:0;}
.col .vlabel{font-size:1.25rem;font-weight:800;letter-spacing:-0.01em;margin-bottom:.85rem;}
.col p{font-size:.98rem;line-height:1.55;}

/* Dark block */
.dark{background:var(--granite);color:var(--bone);} .dark .eyebrow{color:var(--ember);}
.dark .intro,.dark .muted{color:#C9C6C0;}
.bigh{margin-bottom:1.25rem;}
.lead-dark{color:#D8D5CF;max-width:54ch;font-size:1.15rem;margin-bottom:2.5rem;}

/* Big-type list (examples / pains) on dark */
.biglist{border-top:1px solid var(--rule-dark);} .biglist ul{margin:0;padding:0;}
.biglist li{list-style:none;border-bottom:1px solid var(--rule-dark);padding:1.15rem 0;
  font-size:clamp(1.2rem,2.5vw,1.8rem);font-weight:700;letter-spacing:-0.01em;line-height:1.2;
  display:flex;gap:1rem;align-items:baseline;}
.biglist .tick{color:var(--ember);font-family:"JetBrains Mono",monospace;font-size:.85rem;font-weight:500;flex-shrink:0;transform:translateY(-.35em);}
.close-dark{margin-top:2.5rem;max-width:56ch;color:#D8D5CF;font-size:1.1rem;}
.close-dark strong{color:var(--bone);}

/* Light pain/checklist list */
.checklist{border-top:1px solid var(--rule);margin-top:2.25rem;} .checklist ul{margin:0;padding:0;}
.checklist li{list-style:none;border-bottom:1px solid var(--rule);padding:1.1rem 0;display:flex;gap:1rem;align-items:baseline;
  font-size:clamp(1.05rem,1.6vw,1.3rem);font-weight:600;letter-spacing:-0.01em;}
.checklist .tick{color:var(--ember);font-family:"JetBrains Mono",monospace;font-size:.8rem;font-weight:500;flex-shrink:0;}

/* Persona / link tile grid */
.tilegrid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--rule);border-left:1px solid var(--rule);}
.tile{border-right:1px solid var(--rule);border-bottom:1px solid var(--rule);padding:1.75rem;min-height:170px;
  display:flex;flex-direction:column;justify-content:space-between;transition:background .18s ease,color .18s ease;}
.tile:nth-child(even){background:var(--bone-soft);}
.tile:hover{background:var(--granite);color:var(--bone);}
.tile h3{margin-bottom:.5rem;} .tile .pline{font-size:.95rem;color:var(--slate);line-height:1.4;}
.tile:hover .pline{color:#C9C6C0;}
.tile .go{margin-top:1.4rem;font-size:.85rem;font-weight:600;color:var(--ember);display:flex;align-items:center;gap:.4rem;}

/* Steps */
.steps{display:grid;grid-template-columns:1fr;margin-top:2.5rem;border-top:1px solid var(--rule);}
.step{display:grid;grid-template-columns:auto 1fr;gap:clamp(1rem,3vw,2.5rem);padding:1.5rem 0;border-bottom:1px solid var(--rule);align-items:start;}
.step .num{font-family:"JetBrains Mono",monospace;color:var(--ember);font-size:.9rem;font-weight:500;padding-top:.35rem;}
.step h3{margin-bottom:.45rem;} .step p{font-size:1rem;max-width:60ch;}
.note{margin-top:2.25rem;font-size:1.05rem;font-weight:500;max-width:60ch;} .note .free{color:var(--ember);font-weight:700;}

/* Feature row (icon-free, label + body), divided */
.featrow{display:grid;grid-template-columns:repeat(3,1fr);margin-top:2.5rem;counter-reset:feat;border-top:1px solid var(--rule);border-left:1px solid var(--rule);}
.feat{position:relative;counter-increment:feat;overflow:hidden;border-right:1px solid var(--rule);border-bottom:1px solid var(--rule);padding:1.9rem clamp(1.1rem,2vw,1.9rem) 2rem;transition:background .2s ease,color .2s ease;}
.feat::before{content:counter(feat,decimal-leading-zero);font-family:"JetBrains Mono",monospace;font-size:.82rem;font-weight:500;letter-spacing:.08em;color:var(--ember);display:block;margin-bottom:.85rem;}
.feat::after{content:"";position:absolute;right:0;top:0;width:58px;height:58px;pointer-events:none;background-image:linear-gradient(var(--grid-ink) 1px,transparent 1px),linear-gradient(90deg,var(--grid-ink) 1px,transparent 1px);background-size:14px 14px;-webkit-mask-image:radial-gradient(100% 100% at 100% 0,#000 38%,transparent 75%);mask-image:radial-gradient(100% 100% at 100% 0,#000 38%,transparent 75%);}
.feat .barb{width:26px;height:2px;background:var(--ember);margin-bottom:1rem;transition:width .3s cubic-bezier(.65,0,.35,1);}
.feat h3{margin-bottom:.55rem;} .feat p{font-size:.98rem;color:var(--granite);line-height:1.55;}
.feat:hover{background:var(--granite);color:var(--bone);}
.feat:hover .barb{width:62px;}
.feat:hover p{color:#C9C6C0;}
.feat:hover::after{background-image:linear-gradient(var(--grid-bone) 1px,transparent 1px),linear-gradient(90deg,var(--grid-bone) 1px,transparent 1px);}

/* Studio cities inline */
.cities{display:flex;flex-wrap:wrap;align-items:center;margin-top:2.5rem;border-top:1px solid var(--rule);padding-top:1.5rem;}
.cities .label{font-size:.78rem;text-transform:uppercase;letter-spacing:.18em;color:var(--slate);font-weight:600;margin-right:1.5rem;}
.cities .city{font-weight:700;font-size:1.15rem;} .cities .sep{color:var(--rule);margin:0 1rem;}

/* Stat band */
.statband{display:flex;flex-wrap:wrap;gap:clamp(2rem,6vw,5rem);margin-top:.5rem;}
.statb .fig{font-size:clamp(2.75rem,6vw,4.5rem);font-weight:800;letter-spacing:-0.03em;line-height:1;}
.statb .cap{margin-top:.5rem;color:var(--slate);font-weight:500;max-width:24ch;}
.dark .statb .cap{color:#C9C6C0;}

/* Social proof / quote */
.proof-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(2rem,5vw,4rem);align-items:center;margin-top:1rem;}
.stats{display:flex;flex-direction:column;gap:2rem;}
.stat .fig{font-size:clamp(2.6rem,4.6vw,3.75rem);font-weight:800;letter-spacing:-0.03em;line-height:.98;font-variant-numeric:tabular-nums;}
.stat .cap{margin-top:.6rem;color:var(--slate);font-weight:500;max-width:26ch;}
.casestudy{border-left:3px solid var(--ember);padding:.25rem 0 .25rem 1.75rem;}
.casestudy .tag{font-size:.7rem;text-transform:uppercase;letter-spacing:.18em;color:var(--slate);font-weight:600;margin-bottom:1rem;}
.casestudy blockquote{margin:0;font-size:clamp(1.4rem,2.4vw,1.85rem);font-weight:700;letter-spacing:-0.01em;line-height:1.25;}
.casestudy .attr{margin-top:1.25rem;color:var(--slate);font-weight:500;font-size:.95rem;}

/* FAQ */
.faq h2{margin-bottom:2rem;}
.faq details{border-bottom:1px solid var(--rule);} .faq details:first-of-type{border-top:1px solid var(--rule);}
.faq summary{list-style:none;cursor:pointer;padding:1.35rem 0;font-weight:700;font-size:1.15rem;letter-spacing:-0.01em;
  display:flex;justify-content:space-between;align-items:center;gap:1rem;}
.faq summary::-webkit-details-marker{display:none;}
.faq summary .pm{color:var(--ember);font-weight:500;font-size:1.5rem;line-height:1;transition:transform .2s;flex-shrink:0;}
.faq details[open] summary .pm{transform:rotate(45deg);}
.faq .ans{padding:0 0 1.5rem 0;max-width:62ch;line-height:1.6;}

/* Photo placeholder slot (on-brand, clearly a placeholder) */
.photoslot{position:relative;background:var(--bone-soft);border:1px solid var(--rule);border-radius:var(--radius);
  aspect-ratio:4/3;display:flex;align-items:center;justify-content:center;overflow:hidden;}
.photoslot .label{position:relative;z-index:2;font-family:"JetBrains Mono",monospace;font-size:.78rem;color:var(--slate);
  text-align:center;letter-spacing:.04em;padding:1rem;line-height:1.5;}
.photoslot.tall{aspect-ratio:3/4;} .photoslot.wide{aspect-ratio:16/9;}
.photoslot .grid-bg{position:absolute;inset:0;opacity:.5;
  background-image:linear-gradient(var(--rule) 1px,transparent 1px),linear-gradient(90deg,var(--rule) 1px,transparent 1px);
  background-size:28px 28px;}
.photoslot .bp-ill{position:relative;z-index:2;width:88%;height:auto;}
.ph-tag{position:absolute;left:1rem;bottom:.85rem;z-index:3;font-family:"JetBrains Mono",monospace;font-size:.68rem;color:var(--slate);letter-spacing:.12em;text-transform:uppercase;}
.nap .mapph .bp-ill{position:absolute;inset:0;width:100%;height:100%;z-index:1;}
.photo-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-top:2.5rem;}

/* Filter chips (interactive) */
.filterbar{display:flex;flex-wrap:wrap;gap:.6rem;margin-bottom:.5rem;}
.fchip{border:1.5px solid var(--rule);border-radius:var(--radius);padding:.5rem 1rem;font-weight:600;font-size:.9rem;
  cursor:pointer;background:var(--bone);color:var(--granite);font-family:inherit;transition:background .15s,color .15s,border-color .15s;}
.fchip:hover{border-color:var(--granite);}
.fchip.active{background:var(--granite);color:var(--bone);border-color:var(--granite);}
.hidden{display:none !important;}

/* Pillar tiles (resources) */
.pillars{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--rule);border:1px solid var(--rule);margin-top:2.5rem;}
.pillar{background:var(--bone);padding:1.9rem;transition:background .18s,color .18s;}
.pillar:hover{background:var(--granite);color:var(--bone);}
.pillar .pn{font-family:"JetBrains Mono",monospace;color:var(--ember);font-size:.8rem;}
.pillar h3{margin:.5rem 0 .6rem;} .pillar p{color:var(--slate);font-size:.95rem;} .pillar:hover p{color:#C9C6C0;}

/* Post list */
.posts{margin-top:2.5rem;border-top:1px solid var(--rule);}
.post{display:grid;grid-template-columns:auto 1fr auto;gap:1.5rem;align-items:baseline;padding:1.3rem 0;border-bottom:1px solid var(--rule);}
.post .ptag{font-family:"JetBrains Mono",monospace;font-size:.75rem;color:var(--ember);}
.post .ttl{font-weight:700;font-size:1.1rem;letter-spacing:-0.01em;} .post:hover .ttl{color:var(--ember);}
.post .pmeta{font-size:.85rem;color:var(--slate);white-space:nowrap;}

/* Form (mockup) */
.formcard{border:1px solid var(--rule);border-radius:var(--radius);padding:clamp(1.5rem,3vw,2.25rem);background:var(--bone-soft);}
.formcard h3{margin-bottom:.4rem;} .formcard .fc-sub{color:var(--slate);font-size:.95rem;}
.formcard .form{max-width:none;margin-top:1.25rem;}
.form .btn{width:100%;justify-content:center;}
.form-ok{margin-top:1rem;padding:1rem 1.1rem;border:1px solid var(--ember);border-radius:var(--radius);background:var(--bone);font-weight:600;font-size:.95rem;}
.form{margin-top:2.5rem;display:grid;gap:1.5rem;max-width:640px;}
.field{display:grid;gap:.5rem;} .field.row{grid-template-columns:1fr 1fr;gap:1.5rem;}
.field label{font-weight:600;font-size:.9rem;}
.field input,.field textarea,.field select{font-family:inherit;font-size:1rem;color:var(--granite);background:var(--bone-soft);
  border:1.5px solid var(--rule);border-radius:var(--radius);padding:.85rem 1rem;width:100%;}
.field input:focus,.field textarea:focus,.field select:focus{outline:none;border-color:var(--granite);}
.studio-pick{display:flex;flex-wrap:wrap;gap:.75rem;}
.studio-pick label{display:flex;align-items:center;gap:.5rem;border:1.5px solid var(--rule);border-radius:var(--radius);
  padding:.7rem 1.1rem;cursor:pointer;font-weight:600;font-size:.95rem;}
.studio-pick input{accent-color:var(--ember);}
.form-note{font-size:.9rem;color:var(--slate);max-width:52ch;}

/* NAP cards */
.napgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;margin-top:2.5rem;}
.nap{border:1px solid var(--rule);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column;}
.nap .mapph{aspect-ratio:16/10;background:var(--bone-soft);position:relative;display:flex;align-items:center;justify-content:center;border-bottom:1px solid var(--rule);}
.nap .mapph .grid-bg{position:absolute;inset:0;opacity:.5;background-image:linear-gradient(var(--rule) 1px,transparent 1px),linear-gradient(90deg,var(--rule) 1px,transparent 1px);background-size:24px 24px;}
.nap .mapph .pin{position:relative;z-index:2;color:var(--ember);font-size:1.6rem;}
.nap .body{padding:1.4rem;display:flex;flex-direction:column;gap:.45rem;flex:1;}
.nap h3{margin-bottom:.2rem;} .nap .line{font-size:.92rem;color:var(--granite);}
.nap .line.m{color:var(--slate);font-family:"JetBrains Mono",monospace;font-size:.82rem;}
.nap .nap-cta{margin-top:.6rem;}

/* Town list chips */
.towns{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1.75rem;}
.towns .chip{border:1px solid var(--rule);border-radius:var(--radius);padding:.5rem .9rem;font-size:.9rem;font-weight:600;color:var(--granite);background:var(--bone-soft);}

/* Studio cards (link to geo) */
.scards{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;margin-top:2.5rem;}
.scard{border:1px solid var(--rule);border-radius:var(--radius);padding:1.6rem;transition:background .18s,color .18s;display:flex;flex-direction:column;gap:.4rem;}
.scard:hover{background:var(--granite);color:var(--bone);}
.scard .nm{font-weight:800;font-size:1.3rem;letter-spacing:-0.01em;}
.scard .meta{color:var(--slate);font-size:.9rem;} .scard:hover .meta{color:#C9C6C0;}
.scard .go{margin-top:.8rem;font-size:.85rem;font-weight:600;color:var(--ember);}

/* Belief list */
.beliefs{margin-top:2.5rem;border-top:1px solid var(--rule);}
.belief{display:grid;grid-template-columns:auto 1fr;gap:1.5rem;padding:1.3rem 0;border-bottom:1px solid var(--rule);align-items:baseline;}
.belief .bn{font-family:"JetBrains Mono",monospace;color:var(--ember);font-size:.85rem;}
.belief p{font-size:clamp(1.05rem,1.6vw,1.3rem);font-weight:600;letter-spacing:-0.01em;line-height:1.3;max-width:60ch;}

/* Final CTA */
.finalcta{text-align:center;} .finalcta .eyebrow{color:var(--ember);}
.finalcta h2{font-size:clamp(2.25rem,5vw,3.4rem);margin-bottom:1.25rem;}
.finalcta .sub{max-width:46ch;margin:0 auto 2rem;font-size:1.15rem;}
.finalcta .ctarow{justify-content:center;}
.seal{display:flex;justify-content:center;margin-bottom:2rem;} .seal svg{height:46px;color:var(--granite);opacity:.85;}

/* Footer */
footer{background:var(--granite);color:var(--bone);padding-top:clamp(3.5rem,6vw,5rem);padding-bottom:8rem;}
.foot-top{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:2rem;}
.foot-brand .brand svg{color:var(--bone);height:30px;} .foot-brand .wm{color:var(--bone);}
.foot-tag{margin-top:1rem;color:#C9C6C0;max-width:24ch;}
.foot-col h4{font-size:.75rem;text-transform:uppercase;letter-spacing:.18em;color:var(--slate);font-weight:600;margin:0 0 1rem;}
.foot-col a{display:block;color:#D8D5CF;padding:.3rem 0;font-size:.95rem;} .foot-col a:hover{color:var(--ember);}
.foot-bottom{margin-top:3rem;padding-top:1.5rem;border-top:1px solid var(--rule-dark);display:flex;flex-wrap:wrap;justify-content:space-between;gap:1rem;color:var(--slate);font-size:.85rem;}
.foot-bottom a{border-bottom:1px solid var(--rule-dark);} .foot-bottom a:hover{color:var(--bone);}

/* Sticky call */
.sticky-call{position:fixed;z-index:50;right:1.5rem;bottom:1.5rem;}
.sticky-call .btn{box-shadow:0 8px 24px rgba(26,26,26,.22);}

/* Reveal */
.reveal{opacity:0;transform:translateY(14px);transition:opacity .6s ease,transform .6s ease;}
.reveal.in{opacity:1;transform:none;}

/* Skip link */
.skip{position:absolute;left:-9999px;} .skip:focus{left:1rem;top:1rem;background:var(--granite);color:var(--bone);padding:.6rem 1rem;z-index:100;border-radius:2px;}

@media (max-width:1024px){.navlinks,.nav-phone{display:none;} .menu-btn{display:block;}}
@media (max-width:960px){
  .hero-grid{grid-template-columns:1fr;} .hero-visual{order:-1;max-width:460px;}
  .proof-grid{grid-template-columns:1fr;gap:2.5rem;}
  .featrow{grid-template-columns:1fr;}
  .napgrid,.scards,.pillars{grid-template-columns:1fr;}
  .pillars{gap:1px;}
  .photo-grid{grid-template-columns:1fr;}
  .foot-top{grid-template-columns:1fr 1fr;}
}
@media (max-width:720px){
  .cols3,.cols2{grid-template-columns:1fr;}
  .col{padding:1.5rem 0;} .cols3 .col:not(:last-child),.cols2 .col:not(:last-child){border-right:0;border-bottom:1px solid var(--rule);}
  .tilegrid{grid-template-columns:1fr 1fr;}
  .cities .sep{display:none;} .cities .city{margin-right:1.25rem;}
  .field.row{grid-template-columns:1fr;}
  .post{grid-template-columns:1fr;gap:.4rem;} .post .pmeta{white-space:normal;}
  .foot-top{grid-template-columns:1fr;gap:2.25rem;}
  .sticky-call{right:0;left:0;bottom:0;}
  .sticky-call .btn{width:100%;justify-content:center;border-radius:0;padding:1.05rem;box-shadow:0 -4px 18px rgba(26,26,26,.18);}
}
@media (max-width:420px){.tilegrid{grid-template-columns:1fr;}}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none;}html{scroll-behavior:auto;}
  .bp-draw,.bp-dim,.bp-fig,.bp-catch,.bp-catch-dot{animation:none;opacity:1;stroke-dashoffset:0;transform:none;} .bp-fig{opacity:.85;}}

/* ============================================================
   BOOK + CONTACT HEADER — THE DRAWING SHEET
   ------------------------------------------------------------
   This header carries both jobs the page now has, so it is set
   as a drawing sheet: struck corner marks, a sheet number, and a
   title block — the panel every construction drawing carries its
   office, its locations and its phone numbers in. The title block
   is what fills the column the form used to leave empty, and it
   puts a phone number above the fold for anyone who arrived on a
   "Contact" link and does not want a form at all.
   ============================================================ */

.pagehead.sheet{padding-top:clamp(2rem,4vw,3rem);padding-bottom:clamp(3.5rem,6.5vw,6rem);}
.pagehead.sheet .hero-scan{z-index:2;opacity:.7;}

/* --- Struck corner marks: the sheet edge, drawn on load ---
   Held to the content column plus a margin, not the viewport, or on a wide
   screen they read as four stray ticks in the far corners of the browser. */
.sheet-frame{position:absolute;z-index:0;pointer-events:none;
  top:clamp(.6rem,1.6vw,1.35rem);bottom:clamp(.6rem,1.6vw,1.35rem);
  left:50%;transform:translateX(-50%);
  width:min(calc(100% - 1.75rem), calc(var(--maxw) - 1rem));}
.sheet-frame i{position:absolute;width:clamp(16px,2.2vw,28px);height:clamp(16px,2.2vw,28px);}
.sheet-frame i::before,.sheet-frame i::after{content:"";position:absolute;left:0;top:0;background:rgba(26,26,26,.24);}
.sheet-frame i::before{width:100%;height:1px;transform:scaleX(0);transform-origin:left;
  animation:sheetMarkX .5s cubic-bezier(.22,1,.36,1) forwards;}
.sheet-frame i::after{width:1px;height:100%;transform:scaleY(0);transform-origin:top;
  animation:sheetMarkY .5s cubic-bezier(.22,1,.36,1) forwards;}
.sheet-frame i:nth-child(1){left:0;top:0;}
.sheet-frame i:nth-child(2){right:0;top:0;transform:rotate(90deg);}
.sheet-frame i:nth-child(3){right:0;bottom:0;transform:rotate(180deg);}
.sheet-frame i:nth-child(4){left:0;bottom:0;transform:rotate(270deg);}
.sheet-frame i:nth-child(1)::before,.sheet-frame i:nth-child(1)::after{animation-delay:.15s;}
.sheet-frame i:nth-child(2)::before,.sheet-frame i:nth-child(2)::after{animation-delay:.28s;}
.sheet-frame i:nth-child(3)::before,.sheet-frame i:nth-child(3)::after{animation-delay:.41s;}
.sheet-frame i:nth-child(4)::before,.sheet-frame i:nth-child(4)::after{animation-delay:.54s;}
@keyframes sheetMarkX{to{transform:scaleX(1);}}
@keyframes sheetMarkY{to{transform:scaleY(1);}}

/* --- Sheet bar: eyebrow left, sheet number right --- */
.sheetbar{display:flex;align-items:baseline;justify-content:space-between;gap:1rem 1.5rem;flex-wrap:wrap;
  padding-bottom:1.05rem;margin-bottom:clamp(2rem,4vw,3.25rem);border-bottom:1px solid var(--rule);}
.sheetbar .eyebrow{margin:0;}
.sheet-no{display:flex;align-items:center;gap:.65rem;font-family:"JetBrains Mono",ui-monospace,monospace;
  font-size:.68rem;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--slate);}
.sheet-no .sep{color:var(--rule);}

/* --- The two-column sheet ---
   Mobile order is copy → form → title block: the form is the thing
   most people came for, and the title block reads as the footer it
   is on a drawing. On desktop the form spans both rows so its card
   runs the full height of the sheet beside them. */
.sheet-grid{display:grid;grid-template-columns:1fr;gap:clamp(2rem,4vw,3rem);align-items:start;}
.sheet-copy{order:1;} .sheet-form{order:2;} .titleblock{order:3;}
.pagehead.sheet h1{max-width:13ch;margin-bottom:1.35rem;}
.pagehead.sheet .lede{max-width:45ch;margin-bottom:0;}
.pagehead.sheet .checklist{margin-top:clamp(1.75rem,3vw,2.25rem);}
@media (min-width:961px){
  .sheet-grid{grid-template-columns:1.04fr .96fr;column-gap:clamp(2.5rem,5vw,4.5rem);row-gap:clamp(2rem,3.5vw,2.75rem);}
  .sheet-copy{grid-area:1 / 1;} .titleblock{grid-area:2 / 1;} .sheet-form{grid-area:1 / 2 / 3 / 3;}
}

/* --- Title block --- */
.titleblock{border:1px solid var(--rule);border-radius:var(--radius);background:var(--bone-soft);overflow:hidden;}
.titleblock .tb-shot{aspect-ratio:5 / 2;border:0;border-bottom:1px solid var(--rule);border-radius:0;}
.tb-head{display:flex;align-items:baseline;justify-content:space-between;gap:.75rem 1rem;flex-wrap:wrap;
  padding:.8rem clamp(1rem,2vw,1.3rem);background:var(--bone);border-bottom:1px solid var(--rule);
  font-family:"JetBrains Mono",ui-monospace,monospace;font-size:.66rem;font-weight:500;
  letter-spacing:.16em;text-transform:uppercase;color:var(--slate);}
.tb-row{position:relative;display:grid;grid-template-columns:1fr auto;align-items:baseline;
  row-gap:.1rem;padding:.9rem clamp(1rem,2vw,1.3rem);border-bottom:1px solid var(--rule);
  transition:background .18s ease,color .18s ease,padding-left .18s ease;}
.tb-row::before{content:"";position:absolute;left:0;top:-1px;bottom:-1px;width:2px;background:var(--ember);
  transform:scaleY(0);transform-origin:top;transition:transform .22s cubic-bezier(.22,1,.36,1);}
.tb-city{font-weight:700;font-size:1.06rem;letter-spacing:-.015em;}
.tb-note{grid-column:1;font-family:"JetBrains Mono",ui-monospace,monospace;font-size:.68rem;
  font-weight:500;letter-spacing:.13em;text-transform:uppercase;color:var(--slate);}
.tb-num{grid-column:2;grid-row:1 / span 2;align-self:center;color:var(--ember);
  font-family:"JetBrains Mono",ui-monospace,monospace;font-size:.88rem;font-variant-numeric:tabular-nums;}
.tb-row:hover{background:var(--granite);color:var(--bone);padding-left:calc(clamp(1rem,2vw,1.3rem) + 6px);}
.tb-row:hover::before{transform:scaleY(1);}
.tb-row:hover .tb-note{color:#A5A19B;}
.tb-row:hover .tb-num{color:var(--ember-bright);}
.tb-foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;
  gap:.65rem 1.25rem;padding:.9rem clamp(1rem,2vw,1.3rem);}
.tb-mail{font-family:"JetBrains Mono",ui-monospace,monospace;font-size:.76rem;color:var(--slate);
  border-bottom:1px solid var(--rule);word-break:break-all;}
.tb-mail:hover{color:var(--ember);border-bottom-color:var(--ember);}
.tb-maps{font-weight:600;font-size:.86rem;white-space:nowrap;border-bottom:1.5px solid var(--ember);padding-bottom:1px;}
.tb-maps:hover{color:var(--ember);}

/* --- The form, set as the sheet's request block --- */
.pagehead.sheet .formcard{padding:0;overflow:hidden;background:var(--bone-soft);
  box-shadow:0 22px 55px -38px rgba(26,26,26,.55);}
.fc-head{position:relative;display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;
  padding:clamp(1.3rem,2.5vw,1.85rem) clamp(1.35rem,2.6vw,2rem);
  background:var(--bone);border-bottom:1px solid var(--rule);}
.fc-head::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--ember);}
.fc-head h3{margin-bottom:.35rem;}
.fc-tag{flex:none;padding-top:.35rem;font-family:"JetBrains Mono",ui-monospace,monospace;font-size:.64rem;
  font-weight:500;letter-spacing:.18em;text-transform:uppercase;color:var(--slate);white-space:nowrap;}
.pagehead.sheet .formcard .form{margin-top:0;gap:1.2rem;padding:clamp(1.35rem,2.6vw,2rem);}
/* Hours close the card, and they are the other half of what a contact page is
   asked for. They also bring the card down to roughly the height of the title
   block beside it, so the sheet does not end on one short column. */
.fc-foot{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:.5rem 1.25rem;
  padding:.95rem clamp(1.35rem,2.6vw,2rem);background:var(--bone);border-top:1px solid var(--rule);}
.fc-foot .fcf-k{display:block;font-family:"JetBrains Mono",ui-monospace,monospace;font-size:.64rem;
  font-weight:500;letter-spacing:.18em;text-transform:uppercase;color:var(--slate);margin-bottom:.2rem;}
.fc-foot .fcf-v{font-size:.88rem;color:var(--granite);}
.fcf-call{font-weight:600;font-size:.86rem;white-space:nowrap;border-bottom:1.5px solid var(--ember);padding-bottom:1px;}
.fcf-call:hover{color:var(--ember);}
.fcf-call:hover .arrow{transform:translateX(3px);}
/* "St. George" wrapped to two lines inside its own pill. */
.studio-pick label{white-space:nowrap;}

@media (max-width:520px){
  .sheet-no{font-size:.6rem;letter-spacing:.14em;gap:.45rem;}
  .titleblock .tb-shot{aspect-ratio:16 / 9;}
  .tb-foot{flex-direction:column;align-items:flex-start;}
}
@media (prefers-reduced-motion:reduce){
  .sheet-frame i::before{transform:scaleX(1);animation:none;}
  .sheet-frame i::after{transform:scaleY(1);animation:none;}
  .tb-row,.tb-row::before{transition:none;}
}
