/* JP Southern Flooring — site.css
   Palette from the logo roundel: gold #d6a24e (buttons, highlights), champagne #edc97c, bronze #7c5418,
   on the logo's black with clean white. (Re-derived 2026-10-27 from the new gold JP logo.) Display: Archivo (wide cut). Body: Hanken Grotesk. */

@font-face{font-family:"Archivo";src:url(/fonts/archivo-latin.woff2) format("woff2");font-weight:500 900;font-stretch:100% 125%;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Hanken Grotesk";src:url(/fonts/hanken-latin.woff2) format("woff2");font-weight:400 700;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root{
  --rose:#d6a24e;--sand:#edc97c;--brown:#7c5418;
  --ink:#0b0a08;--ink-2:#14120e;--ink-3:#201c16;--ink-4:#060505;
  --paper:#f8f6f1;--paper-2:#efebe2;--paper-3:#e3ddd0;
  --text:#1a1713;--muted:#5e574c;
  --on-dark:#f7f4ee;--muted-dark:#c9c2b5;
  --line-dark:rgba(247,244,238,.13);--line-light:rgba(26,23,19,.14);
  --display:"Archivo","Arial Narrow",Arial,sans-serif;
  --body:"Hanken Grotesk",system-ui,-apple-system,"Segoe UI",sans-serif;
  --head-h:68px;
  --pad:clamp(20px,5vw,44px);
  --sec:clamp(68px,9.5vw,132px);
  --r:12px;
  --ease:cubic-bezier(.2,.7,.2,1);
  --planks:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='960' height='132'%3E%3Cg fill='none' stroke='%237c5418' stroke-opacity='.065'%3E%3Cpath d='M0 43.5H960M0 87.5H960M0 131.5H960M210.5 0V44M690.5 0V44M450.5 44V88M930.5 44V88M90.5 88V132M570.5 88V132'/%3E%3C/g%3E%3C/svg%3E");
}
@media (min-width:1000px){:root{--head-h:78px}}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:calc(var(--head-h) + 12px)}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
body{margin:0;font-family:var(--body);font-size:16px;line-height:1.65;color:var(--text);background:var(--paper);overflow-x:clip;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
@media (min-width:1000px){body{font-size:17px}}
img,svg,video,iframe{display:block;max-width:100%}
img{height:auto}
a{color:inherit}
a,button,label,summary,input,select,textarea{touch-action:manipulation;-webkit-tap-highlight-color:rgba(214,162,78,.22)}
p{margin:0 0 1em}
h1,h2,h3{font-family:var(--display);font-weight:800;font-stretch:112%;line-height:1.02;letter-spacing:-.015em;margin:0 0 .5em;text-wrap:balance}
h2{font-size:clamp(1.85rem,1.25rem + 2.6vw,3.35rem)}
h3{font-size:clamp(1.3rem,1.1rem + .9vw,1.8rem);line-height:1.1}
ul,ol{margin:0;padding:0;list-style:none}
::selection{background:var(--rose);color:var(--ink)}
:focus-visible{outline:3px solid var(--sand);outline-offset:3px;border-radius:4px}
.acc{color:var(--rose)}
.wrap{width:100%;max-width:1240px;margin-inline:auto;padding-inline:var(--pad)}
.wrap.narrow{max-width:860px}
.skip{position:fixed;top:8px;left:8px;z-index:100;padding:10px 16px;background:var(--rose);color:var(--ink);font-weight:700;border-radius:8px;transform:translateY(-160%);transition:transform .2s}
.skip:focus{transform:none}

/* kicker with the three-plank mark from the logo */
.kicker{display:inline-flex;align-items:center;gap:12px;margin:0 0 18px;font:700 12.5px/1.2 var(--body);letter-spacing:.17em;text-transform:uppercase;color:var(--brown)}
.planks{flex:none;width:22px;height:13px;background:
  linear-gradient(var(--rose),var(--rose)) 0 0/16px 3px no-repeat,
  linear-gradient(var(--sand),var(--sand)) 6px 5px/16px 3px no-repeat,
  linear-gradient(var(--brown),var(--brown)) 2px 10px/16px 3px no-repeat}
.work .kicker,.vent .kicker,.areas .kicker,.estimate .kicker,.floors .kicker{color:var(--sand)}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 24px;border-radius:10px;border:1.5px solid transparent;font:700 16px/1.1 var(--body);letter-spacing:.01em;text-decoration:none;cursor:pointer;transition:background-color .25s,color .25s,border-color .25s,transform .25s var(--ease),box-shadow .25s;touch-action:manipulation}
.btn svg{width:18px;height:18px;fill:currentColor}
.btn-primary{background:var(--rose);color:var(--ink);box-shadow:0 10px 26px -12px rgba(214,162,78,.7)}
.btn-primary:hover{background:var(--sand);transform:translateY(-2px)}
.btn-ghost{border-color:rgba(247,244,238,.55);color:var(--on-dark);background:rgba(11,10,8,.28)}
.btn-ghost:hover{background:var(--on-dark);color:var(--ink);border-color:var(--on-dark)}
.btn-ghost-dark{border-color:var(--brown);color:var(--text);background:transparent}
.btn-ghost-dark:hover{background:var(--text);color:var(--paper);border-color:var(--text)}
.btn-block{width:100%}
.cta-row{display:flex;flex-wrap:wrap;justify-content:center;gap:12px}
.link-arrow{display:inline-flex;align-items:center;gap:10px;font-weight:700;text-decoration:none;color:var(--brown);border-bottom:1.5px solid currentColor;padding-bottom:3px;min-height:44px}
.link-arrow::after{content:"\2192";transition:transform .25s var(--ease)}
.link-arrow:hover::after{transform:translateX(5px)}

/* ---------------- header */
.site-head{position:fixed;inset:0 0 auto;z-index:50;transition:transform .35s var(--ease),background-color .3s}
.site-head::before{content:"";position:absolute;inset:0 0 -40px;background:linear-gradient(180deg,rgba(6,5,5,.72),rgba(6,5,5,0));pointer-events:none;transition:opacity .3s}
.site-head.scrolled{background:rgba(11,10,8,.97);box-shadow:0 1px 0 var(--line-dark)}
.site-head.scrolled::before{opacity:0}
.site-head.hide{transform:translateY(-100%)}
.head-in{position:relative;display:flex;align-items:center;gap:14px;height:var(--head-h);max-width:1320px;margin-inline:auto;padding-inline:max(clamp(14px,3vw,32px),env(safe-area-inset-left)) max(clamp(14px,3vw,32px),env(safe-area-inset-right))}
.brand{display:flex;align-items:center;gap:11px;text-decoration:none;color:var(--on-dark);margin-right:auto;min-width:0}
.brand-mark{width:48px;height:48px;flex:none;filter:drop-shadow(0 4px 10px rgba(0,0,0,.45))}
.brand-word{display:flex;flex-direction:column;line-height:1.05;min-width:0}
.brand-word b{font:800 19px/1 var(--display);font-stretch:112%;letter-spacing:-.01em;white-space:nowrap}
.brand-word span{font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--sand);margin-top:5px;white-space:nowrap}
@media (min-width:1000px){.brand-mark{width:56px;height:56px}.brand-word b{font-size:21px}}
.nav{display:none}
.nav>ul{display:flex;align-items:center;gap:4px}
.nav a{display:flex;align-items:center;min-height:44px;padding:0 14px;color:var(--on-dark);text-decoration:none;font-weight:600;font-size:15px;border-radius:8px;text-shadow:0 1px 8px rgba(0,0,0,.35)}
.nav a:hover,.nav a[aria-current]{color:var(--sand)}
.has-menu{position:relative}
.has-menu>a::after{content:"";width:7px;height:7px;margin-left:8px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:translateY(-2px) rotate(45deg)}
.menu{position:absolute;top:100%;left:0;min-width:240px;padding:10px;background:var(--ink);border:1px solid var(--line-dark);border-radius:12px;box-shadow:0 24px 50px -20px rgba(0,0,0,.7);opacity:0;visibility:hidden;transform:translateY(6px);transition:opacity .2s,transform .2s,visibility .2s}
.has-menu:hover .menu,.has-menu:focus-within .menu{opacity:1;visibility:visible;transform:none}
.menu a{font-weight:500;text-shadow:none;padding:0 12px}
.head-call{min-height:46px;padding:0 14px;width:46px}
.head-call span{display:none}
@media (min-width:1000px){.nav{display:block}.head-call{width:auto;padding:0 20px}.head-call span{display:inline}}
.burger{display:inline-flex;flex-direction:column;justify-content:center;gap:5px;width:46px;height:46px;padding:0 12px;border:1px solid var(--line-dark);border-radius:10px;background:rgba(11,10,8,.35);cursor:pointer}
.burger span{display:block;height:2px;background:var(--on-dark);border-radius:2px;transition:transform .3s,opacity .3s}
.burger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
@media (min-width:1000px){.burger{display:none}}
.drawer{position:fixed;top:var(--head-h);left:0;right:0;bottom:0;background:var(--ink);overflow-y:auto;overscroll-behavior:contain;border-top:1px solid var(--line-dark)}
.drawer[hidden]{display:none}
.drawer-in{display:flex;flex-direction:column;justify-content:flex-start;gap:6px;padding:22px clamp(20px,6vw,40px) calc(40px + env(safe-area-inset-bottom));animation:drop .3s var(--ease)}
@keyframes drop{from{opacity:0;transform:translateY(-8px)}}
.drawer-label{margin:14px 0 4px;font-size:11.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--sand)}
.drawer a:not(.btn){display:flex;align-items:center;min-height:46px;color:var(--on-dark);text-decoration:none;font:700 19px/1.2 var(--display);font-stretch:108%;border-bottom:1px solid var(--line-dark)}
.drawer-towns{display:grid;grid-template-columns:1fr 1fr;column-gap:18px}
.drawer-plain{margin:10px 0 18px}
.drawer .btn{margin-top:10px}

/* ---------------- home hero */
.hero{position:relative;isolation:isolate;display:grid;place-items:center;min-height:100vh;min-height:100svh;overflow:hidden;background:var(--ink);color:var(--on-dark)}
.hero-media,.hero-media picture{position:absolute;inset:0;z-index:-2}
.hero-media img{width:100%;height:100%;object-fit:cover;object-position:50% 60%;transform-origin:50% 60%}
@media (prefers-reduced-motion:no-preference){.hero-media img{animation:kb 28s ease-in-out infinite alternate}}
@keyframes kb{from{transform:scale(1.02) translate(0,0)}to{transform:scale(1.13) translate(-1.6%,-1.2%)}}
.hero-veil{position:absolute;inset:0;z-index:-1;background:
  radial-gradient(ellipse 72% 56% at 50% 50%,rgba(11,10,8,.58),rgba(11,10,8,0) 72%),
  linear-gradient(180deg,rgba(11,10,8,.82) 0%,rgba(11,10,8,.55) 42%,rgba(11,10,8,.9) 100%)}
.hero-inner{width:100%;max-width:900px;margin-inline:auto;padding:calc(var(--head-h) + 26px) 24px 56px;text-align:center}
.hero-logo{width:min(46vw,188px);height:auto;margin:0 auto 18px;filter:drop-shadow(0 14px 34px rgba(0,0,0,.6))}
@media (min-width:701px){.hero-logo{width:240px;margin-bottom:24px}}
.pill{display:inline-flex;align-items:center;gap:10px;margin:0 0 20px;padding:9px 16px;border:1px solid rgba(237,201,124,.5);border-radius:999px;background:rgba(11,10,8,.42);font-size:12px;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--sand);max-width:100%}
.pill .dot{width:7px;height:7px;border-radius:50%;background:var(--rose);box-shadow:0 0 0 4px rgba(214,162,78,.22);flex:none}
.hero h1{font-size:clamp(2.3rem,1.45rem + 4.3vw,5.2rem);line-height:.98;letter-spacing:-.022em;max-width:15ch;margin:0 auto 18px;text-shadow:0 2px 30px rgba(0,0,0,.4)}
.hero-sub{max-width:36ch;margin:0 auto 28px;font-size:clamp(1.02rem,.95rem + .45vw,1.22rem);line-height:1.55;color:#efebe2}
.hero-trust{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 20px;margin-top:26px;padding-top:20px;border-top:1px solid rgba(247,244,238,.16);font-size:14px;font-weight:600;color:var(--muted-dark)}
.hero-trust li{display:flex;align-items:center;gap:8px}
.hero-trust li+li::before{content:"";width:4px;height:4px;border-radius:50%;background:var(--rose);margin-right:12px}
.hero-trust a{color:inherit;text-decoration:none;display:inline-flex;align-items:center;gap:8px;min-height:32px}
.hero-trust a:hover{color:var(--on-dark)}
.stars{color:var(--rose);letter-spacing:.06em}
@media (max-width:560px){
  .hero .cta-row{flex-direction:column}
  .hero .cta-row .btn{width:100%}
  .hero-trust{gap:4px 14px;font-size:13px}
  .hero-trust li+li::before{margin-right:6px}
}

/* ---------------- services strip */
.strip{background:var(--rose);color:var(--ink)}
.strip ul{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:4px 14px;max-width:1240px;margin-inline:auto;padding:14px var(--pad)}
.strip a{display:inline-flex;align-items:center;min-height:36px;text-decoration:none;font-size:12.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.strip a:hover{text-decoration:underline;text-underline-offset:4px}
.strip .sep{font:800 14px/1 var(--display);color:var(--brown)}
@media (max-width:899px){
  .strip{overflow-x:auto;scrollbar-width:none;-webkit-mask-image:linear-gradient(90deg,#000 85%,transparent);mask-image:linear-gradient(90deg,#000 85%,transparent)}
  .strip::-webkit-scrollbar{display:none}
  .strip ul{flex-wrap:nowrap;justify-content:flex-start;width:max-content;max-width:none;padding-block:10px}
  .strip a{white-space:nowrap}
}

/* ---------------- intro */
.intro{position:relative;padding-block:var(--sec);background:var(--paper) var(--planks)}
.intro-grid{display:grid;gap:44px;align-items:center}
@media (min-width:860px){.intro-grid{grid-template-columns:5fr 6fr;gap:clamp(48px,7vw,104px)}}
.intro-fig,.split-fig{position:relative;margin:0}
.intro-fig img,.split-fig img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:var(--r);position:relative;z-index:1}
.intro-fig::after,.split-fig::after{content:"";position:absolute;inset:16px -14px -14px 16px;border:1.5px solid var(--rose);border-radius:var(--r);z-index:0}
.intro-fig figcaption{margin-top:24px;font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.intro-copy h2{max-width:16ch}
.intro-copy p{max-width:52ch;color:var(--muted);font-size:1.06em}

/* ---------------- services as numbered scenes */
.work{background:var(--ink);color:var(--on-dark);padding-top:var(--sec)}
.work-head{margin-bottom:clamp(36px,5vw,64px)}
.work-head h2{max-width:18ch}
.scene{display:grid;border-top:1px solid var(--line-dark)}
.scene-fig{margin:0;overflow:hidden;background:var(--ink-3)}
.scene-fig img{width:100%;height:100%;aspect-ratio:4/3;object-fit:cover;transform:scale(1.06);transition:transform 1.8s var(--ease)}
.scene.in .scene-fig img{transform:none}
.scene-copy{padding:36px var(--pad) 56px}
.scene-num,.scene-copy .scene-num{font:900 clamp(4rem,2.8rem + 7vw,9.5rem)/.8 var(--display);font-stretch:125%;letter-spacing:-.04em;color:rgba(214,162,78,.24);margin:0 0 -.1em;max-width:none}
.scene-copy .scene-k{margin:0 0 10px;font-size:12.5px;font-weight:700;letter-spacing:.17em;text-transform:uppercase;color:var(--rose);position:relative}
.scene-copy h3{font-size:clamp(1.7rem,1.2rem + 2vw,2.7rem);line-height:1.04;max-width:17ch}
.scene-copy p{color:var(--muted-dark);max-width:44ch}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin:20px 0 26px}
.chips li{padding:7px 13px;border:1px solid var(--line-dark);border-radius:999px;font-size:13.5px;color:var(--muted-dark)}
.work .link-arrow,.areas .link-arrow{color:var(--sand)}
.scene-copy .link-arrow{align-self:flex-start}
@media (min-width:900px){
  .scene{grid-template-columns:1fr 1fr;min-height:min(86vh,720px)}
  .scene-fig img{aspect-ratio:auto;min-height:100%}
  .scene-copy{display:flex;flex-direction:column;justify-content:center;padding:clamp(48px,6vw,96px) clamp(40px,6vw,104px)}
  .scene.flip .scene-fig{order:2}
}

/* ---------------- vent test (signature) */
.vent{position:relative;padding-block:var(--sec);background:radial-gradient(ellipse 60% 50% at 20% 30%,rgba(214,162,78,.12),transparent 70%),var(--ink-2);color:var(--on-dark)}
.vent-grid{display:grid;gap:32px}
.vent-head p{color:var(--muted-dark);max-width:52ch}
.vent-head h2{max-width:18ch}
@media (min-width:980px){
  .vent-grid{grid-template-columns:1.08fr .92fr;grid-template-areas:"stage head" "stage ctrl";column-gap:clamp(40px,5vw,80px);row-gap:8px;align-items:start}
  .vent-head{grid-area:head}.vent-stage{grid-area:stage;position:sticky;top:calc(var(--head-h) + 20px)}.vent-ctrl{grid-area:ctrl}
}
.vent-photo{position:relative;margin:0;border-radius:14px;overflow:hidden;background:#000;perspective:700px}
.vent-photo img{width:100%;height:auto}
.vent-photo figcaption{position:absolute;left:0;right:0;bottom:0;padding:34px 16px 12px;font-size:12.5px;color:#ebe7df;background:linear-gradient(180deg,transparent,rgba(6,5,5,.85))}
.grille{position:absolute;left:37.6%;top:33.2%;width:25%;height:10.8%;display:flex;justify-content:space-evenly;align-items:center;padding:0 5%;border-radius:3px;background:linear-gradient(180deg,#efe9e0,#cbc1b4);box-shadow:0 2px 0 #a99d8e,0 8px 16px rgba(0,0,0,.35);transform-origin:50% 100%;transition:transform .9s var(--ease),opacity .7s .2s}
.grille i{display:block;width:6%;height:58%;border-radius:2px;background:linear-gradient(180deg,#4b4036,#2a221c);transform:skewX(-14deg)}
.lifted .grille{transform:translateY(-150%) rotateX(58deg) rotateZ(-8deg);opacity:0}
.vent-ring{position:absolute;left:50.2%;top:38.4%;width:30%;aspect-ratio:3/1;transform:translate(-50%,-50%);border:2px solid var(--rose);border-radius:50%;opacity:0;pointer-events:none}
.lifted .vent-ring{animation:ring 1.6s .5s 2 ease-out}
@keyframes ring{0%{opacity:.9;transform:translate(-50%,-50%) scale(.6)}100%{opacity:0;transform:translate(-50%,-50%) scale(1.5)}}
.vent-lift{position:absolute;left:14px;top:14px;min-height:44px;padding:0 16px;border-radius:999px;border:0;background:var(--sand);color:var(--ink);font:700 14px/1 var(--body);cursor:pointer;box-shadow:0 8px 20px -8px rgba(0,0,0,.6)}
.vent-lift:hover{background:var(--rose)}
.xsec{margin-top:14px;padding:12px;border:1px solid var(--line-dark);border-radius:14px;background:var(--ink-4)}
.xsec svg{width:100%;height:auto}
.legend{display:flex;flex-wrap:wrap;gap:6px 16px;margin:12px 4px 2px;font-size:12.5px;color:var(--muted-dark)}
.legend span{display:inline-flex;align-items:center;gap:7px}
.legend i{width:14px;height:10px;border-radius:2px;display:inline-block}
.opts{border:0;margin:0 0 22px;padding:0;min-width:0}
.opts legend{padding:0;margin-bottom:12px;font-size:12.5px;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--sand)}
.opts label{position:relative;display:inline-flex;margin:0 6px 8px 0;cursor:pointer}
.opts input{position:absolute;opacity:0;width:1px;height:1px;margin:0}
.opts span{display:inline-flex;align-items:center;min-height:44px;padding:8px 15px;border:1px solid rgba(247,244,238,.22);border-radius:999px;font-size:14.5px;font-weight:600;line-height:1.25;color:var(--on-dark);transition:background-color .2s,border-color .2s,color .2s}
.opts label:hover span{border-color:var(--sand)}
.opts input:checked+span{background:var(--rose);border-color:var(--rose);color:var(--ink)}
.opts input:focus-visible+span{outline:3px solid var(--sand);outline-offset:3px}
.opts input:disabled+span{opacity:.35;cursor:not-allowed}
.seg{display:grid;grid-template-columns:repeat(5,1fr);gap:6px}
.seg legend{grid-column:1/-1}
.seg label{margin:0;display:block}
.seg span{justify-content:center;width:100%;border-radius:10px;font:800 17px/1 var(--display)}
.readout{padding:20px 0 22px;margin-bottom:22px;border-block:1px solid var(--line-dark)}
.ro-num{display:flex;align-items:baseline;gap:14px;margin:0 0 6px}
.ro-num b{font:900 clamp(3.6rem,2.8rem + 3vw,5.4rem)/.9 var(--display);font-stretch:118%;color:var(--rose);font-variant-numeric:tabular-nums}
.ro-num span{font-size:15px;color:var(--muted-dark);max-width:16ch;line-height:1.3}
.ro-verdict{font:800 clamp(1.5rem,1.2rem + 1vw,2rem)/1.1 var(--display);font-stretch:110%;margin:0 0 8px}
.ro-text{color:var(--muted-dark);margin:0;max-width:46ch}
.readout.flash{animation:flash .5s var(--ease)}
@keyframes flash{from{opacity:.35;transform:translateY(4px)}}
.vent-note{margin-top:16px;font-size:13px;color:var(--muted-dark);max-width:52ch}

/* ---------------- full-bleed photo break */
.break{position:relative;isolation:isolate;display:flex;align-items:flex-end;min-height:66vh;min-height:66svh;overflow:hidden;background:var(--ink);color:var(--on-dark)}
@media (min-width:900px){.break{min-height:84vh}}
.break-media{position:absolute;inset:0;z-index:-2}
.break-media img{width:100%;height:100%;object-fit:cover}
@media (prefers-reduced-motion:no-preference){.break-media img{animation:kb 30s ease-in-out infinite alternate-reverse}}
.break-veil{position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(11,10,8,.1) 30%,rgba(11,10,8,.82))}
.break-line{width:100%;max-width:1240px;margin:0 auto;padding:0 var(--pad) clamp(40px,7vw,90px);font:800 clamp(2rem,1.2rem + 3.6vw,4.4rem)/1 var(--display);font-stretch:112%;letter-spacing:-.02em;text-wrap:balance}
.break-line .acc{display:block}

/* ---------------- gallery mosaic */
.gallery{padding-block:var(--sec);background:var(--paper)}
.gal-head{max-width:640px;margin-bottom:clamp(30px,4vw,52px)}
.gal-head p{color:var(--muted)}
.gal-head a{color:var(--brown);font-weight:700}
.mosaic{display:grid;grid-template-columns:1fr 1fr;grid-auto-rows:44vw;gap:10px}
.mosaic figure{position:relative;margin:0;overflow:hidden;border-radius:10px;background:var(--paper-3)}
.mosaic img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.mosaic figure:hover img{transform:scale(1.04)}
.mosaic figcaption{position:absolute;left:0;right:0;bottom:0;padding:28px 12px 10px;font-size:12.5px;font-weight:600;line-height:1.3;color:#f7f4ee;background:linear-gradient(180deg,transparent,rgba(6,5,5,.82))}
.m1{grid-row:span 2}.m4{grid-column:span 2}
.m4 img{object-position:50% 88%}
@media (min-width:760px){
  .mosaic{grid-template-columns:repeat(12,1fr);grid-auto-rows:clamp(130px,13vw,190px);gap:14px}
  .m1{grid-column:1/5;grid-row:1/4}.m2{grid-column:5/13;grid-row:1/3}.m3{grid-column:5/9;grid-row:3/4}
  .m4{grid-column:9/13;grid-row:3/6}.m5{grid-column:1/5;grid-row:4/6}.m6{grid-column:5/9;grid-row:4/6}
  .mosaic figcaption{font-size:13.5px;padding:36px 16px 14px}
}
.mosaic.three{grid-auto-rows:auto}
.mosaic.three figure{aspect-ratio:4/5}
.mosaic.three figure:first-child{grid-column:span 2;aspect-ratio:4/3}
@media (min-width:760px){.mosaic.three{grid-template-columns:repeat(3,1fr)}.mosaic.three figure,.mosaic.three figure:first-child{grid-column:auto;grid-row:auto;aspect-ratio:4/5}}

/* ---------------- process */
.process{padding-block:var(--sec);background:var(--paper-2) var(--planks)}
.proc-grid{display:grid;gap:40px}
@media (min-width:900px){.proc-grid{grid-template-columns:5fr 7fr;gap:clamp(48px,7vw,110px)}.proc-side{position:sticky;top:calc(var(--head-h) + 30px);align-self:start}}
.proc-fig{margin:28px 0 0;max-width:420px}
.proc-fig img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:var(--r)}
@media (min-width:900px){.proc-fig img{aspect-ratio:4/5}}
.proc-fig figcaption,.ledger-fig figcaption{margin-top:12px;font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.steps{counter-reset:s;display:grid}
.steps li{counter-increment:s;position:relative;display:grid;grid-template-columns:62px 1fr;column-gap:16px;padding:0 0 34px}
.steps li::before{content:counter(s,decimal-leading-zero);font:900 2rem/1 var(--display);font-stretch:118%;color:var(--brown)}
.steps li::after{content:"";position:absolute;left:21px;top:44px;bottom:8px;width:2px;background:linear-gradient(var(--rose),rgba(214,162,78,.15))}
.steps li:last-child::after{display:none}
.steps h3{margin:2px 0 6px;font-size:1.35rem}
.steps p{margin:0;color:var(--muted);max-width:48ch}

/* ---------------- service area board */
.areas{padding-block:var(--sec);background:var(--ink);color:var(--on-dark)}
.area-grid{display:grid;gap:36px}
@media (min-width:900px){.area-grid{grid-template-columns:5fr 7fr;gap:clamp(48px,7vw,110px);align-items:start}}
.area-head p{color:var(--muted-dark);max-width:46ch}
.board li a{display:flex;align-items:baseline;gap:12px;min-height:60px;padding:14px 0;border-bottom:1px solid var(--line-dark);text-decoration:none;color:var(--on-dark);transition:color .2s,padding .3s var(--ease)}
.board li:first-child a{border-top:1px solid var(--line-dark)}
.board a:hover{color:var(--rose);padding-left:8px}
.b-town{font:800 clamp(1.4rem,1.1rem + 1.2vw,2rem)/1.1 var(--display);font-stretch:112%}
.b-lead{flex:1;border-bottom:2px dotted rgba(237,201,124,.35);transform:translateY(-6px);min-width:20px}
.b-min{font-weight:700;color:var(--sand);font-variant-numeric:tabular-nums;white-space:nowrap}
.counties{grid-column:1/-1;margin:0;padding-top:8px;font-size:14px;color:var(--muted-dark);max-width:110ch}
.counties b{color:var(--sand)}
.map .counties{color:var(--muted)}.map .counties b{color:var(--brown)}

/* ---------------- FAQ */
.faq{padding-block:var(--sec);background:var(--paper)}
.faq-list{border-top:1px solid var(--line-light)}
.faq details{border-bottom:1px solid var(--line-light)}
.faq summary{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:64px;padding:16px 0;cursor:pointer;list-style:none;font-weight:700;font-size:1.1rem;line-height:1.35}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";flex:none;width:28px;height:28px;border-radius:50%;background:
  linear-gradient(var(--brown),var(--brown)) center/12px 2px no-repeat,
  linear-gradient(var(--brown),var(--brown)) center/2px 12px no-repeat,var(--paper-2);transition:transform .3s var(--ease)}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{margin:0 0 22px;color:var(--muted);max-width:64ch}

/* ---------------- estimate + form */
.estimate{padding-block:var(--sec);background:var(--ink);color:var(--on-dark)}
.est-in{display:grid;gap:36px;width:100%;max-width:1240px;margin-inline:auto;padding-inline:var(--pad)}
@media (min-width:960px){.est-in{grid-template-columns:5fr 7fr;gap:clamp(48px,6vw,96px);align-items:start}}
.est-lead{color:var(--muted-dark);max-width:42ch}
.est-phone{display:inline-flex;flex-direction:column;margin:10px 0 24px;text-decoration:none;font:900 clamp(2rem,1.5rem + 2vw,3rem)/1 var(--display);font-stretch:112%;color:var(--rose)}
.est-phone small{font:700 12px/1 var(--body);letter-spacing:.16em;text-transform:uppercase;color:var(--sand);margin-bottom:10px}
.est-phone:hover{color:var(--sand)}
.est-hours{display:grid;grid-template-columns:1fr 1fr;gap:4px 24px;margin:0 0 18px;max-width:360px;font-size:14px}
.est-hours div{display:flex;justify-content:space-between;gap:10px;border-bottom:1px solid var(--line-dark);padding:5px 0}
.est-hours dt{font-weight:700;color:var(--sand)}
.est-hours dd{margin:0;color:var(--muted-dark);font-variant-numeric:tabular-nums}
.est-mail a{color:var(--muted-dark)}
.est-form{position:relative;display:grid;gap:14px;padding:clamp(22px,4vw,40px);background:var(--paper);color:var(--text);border-radius:16px;box-shadow:0 40px 80px -40px rgba(0,0,0,.6)}
.f2{display:grid;gap:14px}
@media (min-width:560px){.f2{grid-template-columns:1fr 1fr}}
.fld{display:grid;gap:6px;font-size:14px;font-weight:700}
.fld em{font-style:normal;font-weight:500;color:var(--muted)}
.fld input,.fld select,.fld textarea{width:100%;min-height:50px;padding:12px 14px;border:1px solid #cdc6b8;border-radius:10px;background:#fffdf9;color:var(--text);font:500 16px/1.4 var(--body);transition:border-color .2s,box-shadow .2s}
.fld textarea{min-height:110px;resize:vertical}
.fld select{appearance:none;-webkit-appearance:none;padding-right:40px;background:#fffdf9 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%237c5418' stroke-width='2'/%3E%3C/svg%3E") right 16px center no-repeat}
.fld input:focus,.fld select:focus,.fld textarea:focus{outline:none;border-color:var(--brown);box-shadow:0 0 0 3px rgba(214,162,78,.45)}
.fld input[aria-invalid="true"]{border-color:#a3402c;box-shadow:0 0 0 3px rgba(163,64,44,.18)}
.hp{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.f-status{margin:0;font-weight:600;min-height:1.2em}
.f-status.err{color:#9b3b28}
.f-status.ok{color:#3f5e2b}
.f-note{margin:0;font-size:14px;color:var(--muted)}
.f-note a{color:var(--brown);font-weight:700}
.est-form.sent>*:not(.f-done){display:none}
.f-done h3{margin-bottom:8px}
.f-done p{color:var(--muted);margin:0}

/* ---------------- inner page hero */
.phero{position:relative;isolation:isolate;display:grid;place-items:center;min-height:clamp(480px,74svh,720px);overflow:hidden;background:var(--ink);color:var(--on-dark);text-align:center}
.phero-media{position:absolute;inset:0;z-index:-2}
.phero-media img{width:100%;height:100%;object-fit:cover}
@media (prefers-reduced-motion:no-preference){.phero-media img{animation:kb 30s ease-in-out infinite alternate}}
.phero-veil{position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse 70% 60% at 50% 55%,rgba(11,10,8,.55),transparent 75%),linear-gradient(180deg,rgba(11,10,8,.82),rgba(11,10,8,.55) 45%,rgba(11,10,8,.88))}
.phero-in{width:100%;max-width:920px;padding:calc(var(--head-h) + 34px) 22px 52px}
.phero h1{font-size:clamp(2.1rem,1.35rem + 3.5vw,4.4rem);line-height:1;letter-spacing:-.02em;max-width:17ch;margin:0 auto 16px}
.phero h1 .acc{display:inline}
.phero-sub{max-width:44ch;margin:0 auto 26px;color:#efebe2;font-size:clamp(1rem,.95rem + .4vw,1.18rem)}
@media (max-width:560px){.phero .cta-row{flex-direction:column}.phero .cta-row .btn{width:100%}}
.crumbs ol{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 10px;margin:0 0 18px;font-size:13px;color:var(--muted-dark)}
.crumbs li+li::before{content:"/";margin-right:10px;color:var(--rose)}
.crumbs a{color:var(--sand);text-decoration:none}
.crumbs a:hover{text-decoration:underline}

/* ---------------- split / ledger / near (inner pages) */
.split{padding-block:var(--sec);background:var(--paper) var(--planks)}
.split-grid{display:grid;gap:48px;align-items:center}
@media (min-width:860px){.split-grid{grid-template-columns:7fr 5fr;gap:clamp(48px,7vw,104px)}}
.split-copy h2{max-width:18ch}
.split-copy p{color:var(--muted);max-width:60ch}
.split-trust{margin-top:22px;padding-top:16px;border-top:1px solid var(--line-light);font-size:13px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--brown)!important}
.ledger{padding-block:var(--sec);background:var(--paper-2)}
.ledger-grid{display:grid;gap:36px}
@media (min-width:900px){.ledger-grid{grid-template-columns:5fr 7fr;gap:clamp(48px,7vw,110px)}.ledger-side{position:sticky;top:calc(var(--head-h) + 30px);align-self:start}}
.ledger-note{color:var(--muted)}
.ledger-note a{color:var(--brown);font-weight:700}
.ledger-fig{margin:26px 0 0}
.ledger-fig img{width:100%;aspect-ratio:3/2;object-fit:cover;border-radius:var(--r)}
.rows{border-top:1px solid var(--line-light)}
.rows li{display:grid;grid-template-columns:56px 1fr;gap:14px;padding:22px 0;border-bottom:1px solid var(--line-light)}
.r-n{font:900 1.7rem/1 var(--display);font-stretch:118%;color:var(--rose)}
.rows h3{font-size:1.3rem;margin:0 0 6px}
.rows h3 a{text-decoration:none;color:var(--text);background:linear-gradient(var(--rose),var(--rose)) 0 100%/0 2px no-repeat;transition:background-size .3s var(--ease)}
.rows h3 a:hover{background-size:100% 2px}
.rows h3 a::after{content:" \2192";color:var(--brown)}
.rows p{margin:0;color:var(--muted)}
.near{padding-block:clamp(56px,7vw,96px);background:var(--paper)}
.near h2{font-size:clamp(1.6rem,1.2rem + 1.6vw,2.4rem)}
.near-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,200px),1fr));gap:10px;margin-bottom:40px}
.near-list a{display:flex;flex-direction:column;gap:2px;min-height:64px;padding:14px 16px;border-left:3px solid var(--rose);background:var(--paper-2);border-radius:0 10px 10px 0;text-decoration:none;transition:background-color .2s,transform .25s var(--ease)}
.near-list a:hover{background:var(--paper-3);transform:translateX(3px)}
.near-list b{font:800 1.12rem/1.2 var(--display);font-stretch:108%}
.near-list span{font-size:13.5px;color:var(--muted)}
.near-h2{margin-top:6px}
.also{display:flex;flex-wrap:wrap;gap:8px 22px}
.also a{display:inline-flex;align-items:center;min-height:44px;color:var(--brown);font-weight:700;text-underline-offset:4px}
.floors{position:relative;isolation:isolate;display:flex;align-items:center;min-height:70vh;min-height:70svh;padding-block:var(--sec);overflow:hidden;background:var(--ink);color:var(--on-dark)}
.floors-media{position:absolute;inset:0;z-index:-2}
.floors-media img{width:100%;height:100%;object-fit:cover}
.floors-veil{position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(11,10,8,.9),rgba(11,10,8,.72) 55%,rgba(11,10,8,.35))}
.floors-in p{max-width:56ch;color:#ebe6dc;font-size:1.06em}
.floors-in h2{max-width:16ch}
.mini-steps{padding-block:clamp(56px,7vw,96px);background:var(--paper-2)}
.mini-steps h2{font-size:clamp(1.6rem,1.2rem + 1.6vw,2.4rem);margin-bottom:28px}
.mini-steps ol{display:grid;gap:22px;counter-reset:m}
@media (min-width:860px){.mini-steps ol{grid-template-columns:repeat(4,1fr);gap:30px}}
.mini-steps li{counter-increment:m;padding-top:16px;border-top:2px solid var(--rose);color:var(--muted)}
.mini-steps li::before{content:counter(m,decimal-leading-zero);display:block;font:900 1.4rem/1 var(--display);color:var(--brown);margin-bottom:10px}
.mini-steps b{color:var(--text)}

/* ---------------- services hub */
.hub{padding-block:var(--sec);background:var(--paper)}
.hub-head{max-width:680px;margin-bottom:clamp(36px,5vw,64px)}
.hub-head p{color:var(--muted)}
.hub-row{display:grid;gap:22px;align-items:center;padding-block:clamp(28px,4vw,52px);border-top:1px solid var(--line-light)}
@media (min-width:860px){.hub-row{grid-template-columns:1fr 1fr;gap:clamp(40px,6vw,90px)}.hub-row.flip figure{order:2}}
.hub-row figure{margin:0}
.hub-row img{width:100%;aspect-ratio:3/2;object-fit:cover;border-radius:var(--r)}
.hub-copy .scene-num{color:rgba(124,84,24,.22);font-size:clamp(3.6rem,2.6rem + 4vw,6rem)}
.hub-copy h3 a{text-decoration:none;color:var(--text)}
.hub-copy p{color:var(--muted);max-width:52ch}

/* ---------------- contact */
.contact-top{padding-block:var(--sec);background:var(--paper) var(--planks)}
.ct-grid{display:grid;gap:44px}
@media (min-width:900px){.ct-grid{grid-template-columns:7fr 5fr;gap:clamp(48px,7vw,104px)}}
.ct-grid p{color:var(--muted);max-width:52ch}
.ct-actions{display:flex;flex-wrap:wrap;gap:12px;margin:24px 0}
.ct-mail a{color:var(--brown);font-weight:700}
.ct-hours{padding:clamp(22px,3vw,32px);background:var(--paper-2);border-radius:16px}
.ct-hours h3{font-size:1.4rem}
.ct-hours table{width:100%;border-collapse:collapse;font-size:15px;margin-bottom:16px}
.ct-hours th,.ct-hours td{padding:9px 0;border-bottom:1px solid var(--line-light);text-align:left}
.ct-hours td{text-align:right;color:var(--muted)}
.ct-area a{color:var(--brown);font-weight:700}
.map{padding-block:var(--sec);background:var(--paper)}
.map p{color:var(--muted);max-width:60ch}
.map-frame{margin:26px 0 22px;border-radius:16px;overflow:hidden;background:var(--paper-2);border:1px solid var(--line-light)}
.map-frame iframe{width:100%;height:clamp(320px,48vw,500px);border:0}
.nf{padding:calc(var(--head-h) + var(--sec)) 0 var(--sec);background:var(--paper)}
.nf h1{font-size:clamp(2.2rem,1.5rem + 3vw,4rem)}
.is-404 .site-head{background:var(--ink)}
.is-404 .site-head::before{display:none}

/* ---------------- footer + dock */
.site-foot{background:var(--ink-4);color:var(--muted-dark);font-size:15px}
.foot-in{display:grid;gap:36px;max-width:1240px;margin-inline:auto;padding:clamp(56px,7vw,96px) var(--pad) 40px}
.foot-in{grid-template-columns:1fr 1fr}
.foot-brand,.nap{grid-column:1/-1}
@media (min-width:700px){.foot-brand,.nap{grid-column:auto}}
@media (min-width:1060px){.foot-in{grid-template-columns:1.3fr 1fr .9fr 1fr}}
.foot-brand img{width:96px;height:96px;margin-bottom:16px}
.foot-tag{max-width:30ch;color:var(--on-dark)}
.foot-badges{font-size:12.5px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--sand)}
.foot-col h2{font:700 12.5px/1 var(--body);letter-spacing:.17em;text-transform:uppercase;color:var(--sand);margin:0 0 16px}
.foot-col li a,.foot-col p a{display:inline-flex;align-items:center;min-height:36px;color:var(--muted-dark);text-decoration:none}
.foot-col a:hover{color:var(--on-dark);text-decoration:underline;text-underline-offset:4px}
.nap strong{color:var(--on-dark)}
.foot-base{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 24px;max-width:1240px;margin-inline:auto;padding:22px var(--pad) 30px;border-top:1px solid var(--line-dark);font-size:13.5px}
.foot-base p{margin:0}
.foot-base a{color:var(--muted-dark);text-decoration:none}
.dock{position:fixed;left:0;right:0;bottom:0;z-index:40;display:grid;grid-template-columns:1fr 1fr 1.6fr;background:rgba(6,5,5,.97);border-top:1px solid var(--line-dark);padding-bottom:env(safe-area-inset-bottom)}
.dock a{display:flex;align-items:center;justify-content:center;gap:8px;min-height:58px;color:var(--on-dark);text-decoration:none;font-weight:700;font-size:15px}
.dock svg{width:18px;height:18px;fill:var(--sand)}
.dock a+a{border-left:1px solid var(--line-dark)}
.dock .dock-main{background:var(--rose);color:var(--ink)}
@media (max-width:999px){body{padding-bottom:calc(58px + env(safe-area-inset-bottom))}}
@media (min-width:1000px){.dock{display:none}}

/* ---------------- reveal (only when JS is running) */
.js .reveal{opacity:0;transform:translateY(22px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.js .reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  .js .reveal{opacity:1;transform:none;transition:none}
  .scene-fig img{transform:none;transition:none}
  .grille{transition:none}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important}
}
@media print{.site-head,.dock,.estimate form,.vent{display:none}}