/* LJ Growth — site.css
   Self-hosted fonts, no third-party origins, no framework. */

/* ---------- fonts ---------- */
@font-face{
  font-family:'Bodoni Moda';
  font-style:italic;
  font-weight:400 500;
  font-display:swap;
  src:url(../fonts/bodoni-moda-italic.woff2) format('woff2');
  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:'Bodoni Moda';
  font-style:normal;
  font-weight:400 600;
  font-display:swap;
  src:url(../fonts/bodoni-moda-normal.woff2) format('woff2');
  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:'Jost';
  font-style:normal;
  font-weight:300 500;
  font-display:swap;
  src:url(../fonts/jost-normal.woff2) format('woff2');
  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;
}
/* Metric-matched fallbacks, so text does not jump when the webfont swaps in.
   Measured with build/measure-fonts.js in Chrome on macOS: average advance width
   over a mixed sample, and the webfont's own ascent/descent as a share of the em.
   Only fonts confirmed present on the measuring machine are listed. Anywhere
   Georgia or Arial is missing (most Android builds) the browser skips these faces
   and uses the plain serif/sans at the end of the stack, unadjusted. */
@font-face{
  font-family:'Bodoni Fallback';
  src:local('Georgia');
  size-adjust:102.6%;
  ascent-override:113%;
  descent-override:40%;
  line-gap-override:0%;
}
@font-face{
  font-family:'Jost Fallback';
  src:local('Arial'),local('Helvetica Neue');
  size-adjust:96.2%;
  ascent-override:107%;
  descent-override:38%;
  line-gap-override:0%;
}

/* ---------- tokens ---------- */
:root{
  --hull:#0F0C09;
  --canvas:#EAE3D4;   /* eased down from #EFE9DC; less glare against the near-black */
  --brass:#D4B278;
  --brass-line:rgba(212,178,120,.24);
  --oak:#8A5A32;        /* display sizes only */
  --oak-deep:#7A4E2A;   /* small text on cream — 5.9:1 */
  --text:#F2ECE1;
  --text-2:#DCD3C4;
  --body:#D6CDBE;       /* brighter than before; thin faces need the extra punch */
  --muted:#ADA294;      /* only used at 12.5px and up now */

  /* One scale. Nothing outside this list. Smallest visible text is 12.5px. */
  --t-micro:13px;       /* eyebrows, labels, small caps */
  --t-small:15.5px;     /* captions, quiet notes */
  --t-body:17px;        /* every paragraph */
  --t-lead:19px;        /* ledes and intros */
  --track:.16em;        /* one tracking value for small caps, was up to .28em */
  --ink:#191410;
  --ink-2:#4C443A;      /* 7.9:1 on canvas */
  --serif:'Bodoni Moda','Bodoni Fallback',Didot,Georgia,serif;
  --sans:'Jost','Jost Fallback',system-ui,-apple-system,'Segoe UI',sans-serif;
  --ease:cubic-bezier(.22,1,.36,1);
  --focus:var(--brass);
  --focus-halo:var(--hull);
  --wrap:1120px;
}

/* ---------- reset ---------- */
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
@media(prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
body{
  margin:0;background:var(--hull);color:var(--text);
  font-family:var(--sans);font-weight:400;font-size:17px;line-height:1.7;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
}
a{color:inherit}
img{max-width:100%;height:auto}
button,input,select,textarea{font:inherit;color:inherit}
/* Two-tone focus ring: a halo in the surface colour then the ring itself, so the
   indicator stays visible even when a control is filled with the ring colour. */
:focus-visible{outline:2px solid var(--focus);outline-offset:2px;
  box-shadow:0 0 0 2px var(--focus-halo);border-radius:1px}
:focus:not(:focus-visible){outline:none}
section,header{scroll-margin-top:88px}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 28px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}

.skip{position:absolute;left:12px;top:-64px;z-index:200;background:var(--brass);color:var(--hull);
  padding:12px 20px;text-decoration:none;font-size:14px;letter-spacing:.08em;text-transform:uppercase;
  transition:top .2s var(--ease)}
.skip:focus{top:12px}

/* ---------- type ---------- */
/* Bodoni Moda is a high-contrast face: at 400 its thin strokes disappear on a
   low-density screen. 500 keeps the look and makes it legible. */
h1,h2,h3,h4{font-family:var(--serif);font-weight:500;margin:0}
h1{font-size:clamp(36px,4.6vw,58px);line-height:1.06;letter-spacing:-.012em;margin-bottom:26px;
  font-variation-settings:'opsz' 60}
.hero-sub h1{font-size:clamp(37px,5.2vw,64px)}
h2{font-size:clamp(28px,4.2vw,46px);line-height:1.1;letter-spacing:-.01em;
  font-variation-settings:'opsz' 44}
h3{font-size:23px;line-height:1.25;letter-spacing:0;font-variation-settings:'opsz' 22}
h4{font-size:19px;line-height:1.3;font-variation-settings:'opsz' 18}
/* Correct heading level, h3 size. Used where a column heading is the first
   heading under the h1 and an h3 would skip a level. */
h2.as-h3{font-size:23px;line-height:1.25;letter-spacing:0;font-variation-settings:'opsz' 22}
h1 i,h2 i,h3 i{font-style:italic;color:var(--brass)}
.sec-light h1 i,.sec-light h2 i,.sec-light h3 i{color:var(--oak)}
p{margin:0 0 18px}
p:last-child{margin-bottom:0}
.lede{font-size:var(--t-lead);color:var(--text-2);font-weight:400;max-width:54ch;line-height:1.62}
.sec-light .lede{color:var(--ink-2)}
.eyebrow{font-size:var(--t-micro);letter-spacing:var(--track);text-transform:uppercase;
  color:var(--brass);margin:0 0 22px;font-weight:500}
.sec-light .eyebrow{color:var(--oak-deep)}

/* ---------- nav ---------- */
.progress{position:fixed;top:0;left:0;height:2px;width:0;z-index:90;
  background:linear-gradient(90deg,var(--oak),var(--brass))}
/* Opaque, not 97%. At 97% bright headings ghost through it, and during a slow
   fade they collide with the logo outright. 160ms so it is solid before you notice. */
.nav{position:fixed;inset:0 0 auto;z-index:80;border-bottom:1px solid transparent;
  transition:background .16s linear,border-color .16s linear}
.nav.stuck{background:var(--hull);border-bottom-color:var(--brass-line)}
.nav-in{display:flex;align-items:center;justify-content:space-between;gap:16px;
  max-width:var(--wrap);margin:0 auto;padding:20px 28px;transition:padding .4s var(--ease)}
.nav.stuck .nav-in{padding:12px 28px}
.brand{font-family:var(--serif);font-weight:500;font-size:22px;text-decoration:none;
  white-space:nowrap;
  font-variation-settings:'opsz' 24;padding:6px 0}
.brand i{font-style:italic;color:var(--brass)}
.nav-menu{display:flex;gap:30px;align-items:center;font-size:13.5px;letter-spacing:.06em}
.nav-menu a:not(.btn){text-decoration:none;color:#CBC1B1;position:relative;
  padding:11px 0;min-height:44px;display:inline-flex;align-items:center;
  transition:color .3s var(--ease)}
.nav-menu a:not(.btn)::after{content:"";position:absolute;left:0;bottom:6px;height:1px;width:100%;
  background:var(--brass);transform:scaleX(0);transform-origin:right;
  transition:transform .4s var(--ease)}
.nav-menu a:not(.btn):hover{color:var(--brass)}
.nav-menu a:not(.btn):hover::after{transform:scaleX(1);transform-origin:left}
.nav-menu a[aria-current="page"]{color:var(--brass)}
.nav-menu a[aria-current="page"]::after{transform:scaleX(1)}
.nav-toggle{display:none;align-items:center;gap:10px;background:none;border:1px solid var(--brass-line);
  color:var(--brass);font-size:var(--t-micro);letter-spacing:var(--track);text-transform:uppercase;
  padding:12px 16px;min-height:44px;cursor:pointer}
.nav-toggle .bars{display:block;width:16px;height:1px;background:currentColor;position:relative}
.nav-toggle .bars::before,.nav-toggle .bars::after{content:"";position:absolute;left:0;width:16px;
  height:1px;background:currentColor;transition:transform .3s var(--ease)}
.nav-toggle .bars::before{top:-5px}
.nav-toggle .bars::after{top:5px}
.nav.open .nav-toggle .bars{background:transparent}
.nav.open .nav-toggle .bars::before{transform:translateY(5px) rotate(45deg)}
.nav.open .nav-toggle .bars::after{transform:translateY(-5px) rotate(-45deg)}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;
  font-size:13.5px;letter-spacing:.11em;text-transform:uppercase;padding:14px 28px;
  text-decoration:none;border:1px solid var(--brass);color:var(--brass);
  position:relative;overflow:hidden;isolation:isolate;cursor:pointer;
  transition:color .4s var(--ease);white-space:nowrap;background:none}
.btn::before{content:"";position:absolute;inset:0;background:var(--brass);z-index:-1;
  transform:translateY(101%);transition:transform .45s var(--ease)}
.btn:hover{color:var(--hull)}
.btn:hover::before{transform:translateY(0)}
.btn-solid{background:var(--brass);color:var(--hull)}
.btn-solid::before{background:#E7CB99}
.btn-solid:hover{color:var(--hull)}
.sec-light .btn{border-color:var(--oak-deep);color:var(--oak-deep)}
.sec-light .btn::before{background:var(--oak-deep)}
.sec-light .btn:hover{color:var(--canvas)}
.sec-light .btn-solid{background:var(--oak-deep);color:var(--canvas)}
.sec-light .btn-solid::before{background:var(--ink)}
.nav .btn{padding:11px 20px;font-size:12.5px;min-height:44px}
.cta-row{display:flex;flex-wrap:wrap;gap:14px;margin-top:34px}

/* ---------- hero ---------- */
.hero{padding:150px 0 92px;position:relative;isolation:isolate}
.hero-media{position:absolute;inset:0;z-index:-2;overflow:hidden;background:var(--hull)}
.hero-media img{width:100%;height:100%;object-fit:cover;display:block;
  filter:saturate(.76) contrast(1.08) brightness(.72)}
@media(min-width:861px){
  .hero-media img{transform:scale(1.06);animation:drift 32s ease-in-out infinite alternate}
}
@keyframes drift{to{transform:scale(1.12) translate3d(-1.2%,-.9%,0)}}
.hero-media::after{content:"";position:absolute;inset:0;background:
  linear-gradient(96deg,var(--hull) 21%,rgba(15,12,9,.82) 43%,rgba(15,12,9,.5) 68%,rgba(15,12,9,.6) 100%),
  linear-gradient(to bottom,rgba(15,12,9,.9) 0,transparent 26%,transparent 62%,var(--hull) 100%)}
.hero-grid{display:grid;grid-template-columns:1.02fr .98fr;gap:60px;align-items:center}
.hero-lede{font-size:var(--t-lead);color:var(--text-2);max-width:42ch;margin:0 0 34px;
  font-weight:400;line-height:1.62}
.hero-sub{padding:112px 0 56px}
.hero-sub h1{margin-bottom:20px}

/* ---------- search panel ---------- */
.search{position:relative;border:1px solid var(--brass-line);padding:34px 32px 30px;
  background:linear-gradient(158deg,rgba(255,248,235,.055),rgba(255,248,235,.018));
  box-shadow:0 30px 70px rgba(0,0,0,.45)}
.search::before,.search::after{content:"";position:absolute;width:10px;height:10px;
  border:1px solid var(--brass);opacity:.5}
.search::before{top:13px;left:13px;border-right:0;border-bottom:0}
.search::after{bottom:13px;right:13px;border-left:0;border-top:0}
.field{display:flex;align-items:center;gap:12px;border-bottom:1px solid var(--brass-line);
  padding-bottom:15px;margin-bottom:24px;min-width:0;overflow:hidden}
.field svg{width:15px;height:15px;flex:none;stroke:var(--brass);fill:none;stroke-width:1.6;opacity:.85}
.query{font-size:16.5px;color:#EAE0CE;white-space:nowrap;min-width:0}
.caret{display:inline-block;width:1px;height:17px;background:var(--brass);vertical-align:-3px;
  margin-left:2px;flex:none;animation:blink 1.05s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
.result{position:relative;min-height:132px}
.state{transition:opacity .8s var(--ease),transform .8s var(--ease)}
.state-dead{position:absolute;inset:0}
.dead-line{font-size:var(--t-small);color:#968A7B;margin:0 0 16px}
.ghost{height:9px;background:rgba(255,248,235,.055);margin-bottom:11px}
.w1{width:46%}.w2{width:31%}.w3{width:38%}
.state-live{opacity:0;transform:translateY(10px)}
.search.on .state-dead{opacity:0;transform:translateY(-10px)}
.search.on .state-live{opacity:1;transform:none;transition-delay:.2s}
.biz{font-family:var(--serif);font-weight:500;font-size:24px;letter-spacing:-.012em;
  margin:0 0 9px;color:#F3EBDD;
  font-variation-settings:'opsz' 28}
.meta{display:flex;align-items:baseline;gap:10px;row-gap:6px;flex-wrap:wrap;font-size:15px;color:#C6BCAC}
.rating{color:var(--brass);letter-spacing:.06em}
.open{color:#A9BC94}
.tags{display:flex;gap:8px;flex-wrap:wrap;margin-top:18px}
.tag{font-size:12.5px;letter-spacing:var(--track);text-transform:uppercase;color:var(--brass);
  border:1px solid var(--brass-line);padding:6px 12px}
.replay{position:absolute;right:8px;top:8px;min-width:44px;min-height:44px;
  display:inline-flex;align-items:center;justify-content:center;
  font-size:12.5px;letter-spacing:var(--track);text-transform:uppercase;color:var(--muted);
  background:none;border:0;cursor:pointer;font-family:var(--sans);padding:6px 10px;
  transition:color .3s}
.replay:hover{color:var(--brass)}
.search-cap{display:flex;justify-content:space-between;gap:14px;margin:14px 0 0;
  font-size:12.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.search-cap b{color:var(--brass);font-weight:400}

/* ---------- sections ---------- */
.sec{padding:100px 0}
.sec-tight{padding:72px 0}
/* Fade in and out of the cream instead of cutting to it. A hard edge between
   near-black and near-white across the full width is genuinely painful on a phone
   at night. Padding clears the fade so no dark text ever sits on the dark part. */
.sec-light{
  --fade:130px;
  color:var(--ink);--focus:#2A211A;--focus-halo:var(--canvas);
  /* Solid colour underneath, fades layered on top. Keeping a real
     background-color means the section still reads as cream if the gradients
     ever fail to paint, in forced-colours mode, and in print. Explicit
     rgba(15,12,9,0) rather than `transparent` so it does not grey out midway. */
  background-color:var(--canvas);
  background-image:
    linear-gradient(to bottom, var(--hull), rgba(15,12,9,0) var(--fade)),
    linear-gradient(to top,    var(--hull), rgba(15,12,9,0) var(--fade));
  padding-top:calc(96px + var(--fade));
  padding-bottom:calc(96px + var(--fade));
}
.sec-light.sec-tight{padding-top:calc(62px + var(--fade));padding-bottom:calc(62px + var(--fade))}
.sec-light p{color:var(--ink-2)}
.sec-head{display:grid;grid-template-columns:1.25fr 1fr;gap:52px;align-items:end;margin-bottom:56px}
.sec-intro{color:var(--text-2);margin:0;font-size:var(--t-lead);font-weight:400;max-width:48ch;
  line-height:1.62}
.sec-light .sec-intro{color:var(--ink-2)}

.facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(230px,100%),1fr))}
.fact{padding:36px 34px 36px 0;border-top:1px solid rgba(25,20,16,.16)}
.fact-line{margin:0;color:var(--ink-2);font-size:var(--t-body)}
.fact-n{font-family:var(--serif);font-size:clamp(38px,4.6vw,52px);line-height:1.05;
  display:block;margin-bottom:6px;color:var(--oak);letter-spacing:-.02em;font-weight:500;
  font-variation-settings:'opsz' 48}
.fact p{margin:0;color:var(--ink-2);font-size:var(--t-body)}
.fact cite{display:block;margin-top:12px;font-size:12.5px;font-style:normal;color:#6B6154;
  letter-spacing:.04em}

.cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(266px,100%),1fr));gap:52px}
.cols-2{grid-template-columns:repeat(auto-fit,minmax(min(320px,100%),1fr))}
.rule{height:1px;background:var(--brass-line);margin-bottom:22px;transform:scaleX(0);
  transform-origin:left;transition:transform 1s var(--ease)}
.sec-light .rule{background:rgba(122,78,42,.3)}
.reveal.in .rule{transform:scaleX(1)}
.step-n{font-family:var(--serif);font-weight:500;font-style:italic;font-size:16px;color:var(--brass);
  display:block;margin-bottom:14px}
.sec-light .step-n{color:var(--oak-deep)}
.cols h3,.cols .as-h3{margin-bottom:12px}
.cols p{margin:0 0 14px;color:var(--body);font-size:var(--t-body)}
.sec-light .cols p{color:var(--ink-2)}

/* ---------- prices ---------- */
.price{display:flex;justify-content:space-between;align-items:flex-start;gap:32px;
  padding:32px 20px 32px 0;border-top:1px solid var(--brass-line);position:relative;
  transition:padding-left .45s var(--ease)}
.price::before{content:"";position:absolute;left:0;top:-1px;height:1px;width:0;
  background:var(--brass);transition:width .6s var(--ease)}
.price:hover{padding-left:22px}
.price:hover::before{width:100%}
.price:last-of-type{border-bottom:1px solid var(--brass-line)}
.price h3,.price .as-h3{font-size:23px;margin-bottom:10px}
.price h3 a,.price .as-h3 a{text-decoration:none;background-image:linear-gradient(var(--brass),var(--brass));
  background-size:0 1px;background-repeat:no-repeat;background-position:0 100%;
  transition:background-size .4s var(--ease)}
.price h3 a:hover,.price .as-h3 a:hover{background-size:100% 1px}
.price p{margin:0;color:var(--body);font-size:var(--t-body);max-width:52ch}
.price-tag{font-family:var(--serif);font-weight:500;font-size:29px;white-space:nowrap;
  color:var(--brass);
  letter-spacing:-.02em;font-variation-settings:'opsz' 32}
.price-tag small{display:block;font-family:var(--sans);font-size:12.5px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--muted);margin-top:6px}
.note{margin-top:40px;padding:26px 30px;border-left:2px solid var(--brass);
  background:rgba(212,178,120,.07);font-size:var(--t-body);color:var(--text-2)}
.note b{color:var(--brass);font-weight:400}
.sec-light .note{border-left-color:var(--oak-deep);background:rgba(122,78,42,.07);color:var(--ink-2)}
.sec-light .note b{color:var(--oak-deep)}

/* ---------- lists ---------- */
.tick{list-style:none;padding:0;margin:0}
.tick li{padding-left:32px;position:relative;margin-bottom:15px;font-size:var(--t-body);color:var(--body)}
.tick li::before{content:"";position:absolute;left:0;top:12px;width:18px;height:1px;background:var(--brass)}
.sec-light .tick li{color:var(--ink-2)}
.sec-light .tick li::before{background:var(--oak-deep)}
.cross li::before{width:14px;height:14px;top:6px;background:none;
  border-left:1px solid var(--muted);border-bottom:1px solid var(--muted);transform:rotate(-45deg) translate(2px,-2px)}
.sec-light .cross li::before{border-color:#6B6154;background:none}

/* ---------- cards ---------- */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(280px,100%),1fr));gap:1px;
  background:var(--brass-line);border:1px solid var(--brass-line)}
.card{background:var(--hull);padding:34px 30px;display:flex;flex-direction:column;
  text-decoration:none;transition:background .35s var(--ease)}
.card:hover{background:#151109}
.sec-light .cards{background:rgba(122,78,42,.22);border-color:rgba(122,78,42,.22)}
.sec-light .card{background:var(--canvas)}
.sec-light .card:hover{background:#E7E0D0}
.card h3,.card .as-h3{margin-bottom:10px}
.card p{margin:0 0 18px;font-size:16.5px;color:var(--body);flex:1}
.sec-light .card p{color:var(--ink-2)}
.card .more{font-size:var(--t-micro);letter-spacing:var(--track);text-transform:uppercase;
  color:var(--brass)}
.sec-light .card .more{color:var(--oak-deep)}
.card:hover .more{text-decoration:underline;text-underline-offset:4px}

/* compact link grid for towns */
.grid-links{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(210px,100%),1fr));gap:1px;
  background:var(--brass-line);border:1px solid var(--brass-line);margin:0;padding:0;list-style:none}
.grid-links li{background:var(--hull)}
.grid-links a{display:flex;flex-direction:column;gap:3px;padding:18px 20px;min-height:44px;
  text-decoration:none;transition:background .3s var(--ease)}
.grid-links a:hover{background:#151109}
.grid-links a:hover .gl-name{color:var(--brass)}
.gl-name{font-size:16px;transition:color .3s var(--ease)}
.gl-sub{font-size:var(--t-micro);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}

/* ---------- breadcrumbs ---------- */
.crumbs{font-size:var(--t-micro);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);
  margin:0 0 26px}
.crumbs ol{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0}
.crumbs li::after{content:"/";margin-left:8px;color:rgba(212,178,120,.4)}
.crumbs li:last-child::after{content:""}
.crumbs a{color:var(--muted);text-decoration:none;padding:4px 0;display:inline-block}
.crumbs a:hover{color:var(--brass)}
.crumbs [aria-current]{color:var(--text-2)}

/* ---------- FAQ ---------- */
.faq{border-top:1px solid var(--brass-line)}
.faq details{border-bottom:1px solid var(--brass-line)}
.faq summary{cursor:pointer;list-style:none;padding:22px 44px 22px 0;position:relative;
  font-size:18.5px;font-weight:400}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";position:absolute;right:8px;top:31px;width:11px;height:11px;
  border-right:1px solid var(--brass);border-bottom:1px solid var(--brass);
  transform:rotate(45deg);transition:transform .3s var(--ease)}
.faq details[open] summary::after{transform:rotate(-135deg);top:35px}
.faq .answer{padding:0 44px 24px 0;color:var(--body);font-size:var(--t-body)}
.sec-light .faq{border-color:rgba(122,78,42,.25)}
.sec-light .faq details{border-color:rgba(122,78,42,.25)}
.sec-light .faq summary::after{border-color:var(--oak-deep)}
.sec-light .faq .answer{color:var(--ink-2)}

/* ---------- plate / CTA ---------- */
.plate{border:1px solid var(--brass-line);padding:74px 44px;text-align:center;position:relative;
  background:linear-gradient(158deg,rgba(212,178,120,.05),transparent 60%)}
.plate::before,.plate::after{content:"";position:absolute;width:12px;height:12px;border:1px solid var(--brass)}
.plate::before{top:16px;left:16px;border-right:0;border-bottom:0}
.plate::after{bottom:16px;right:16px;border-left:0;border-top:0}
.plate h2{margin-bottom:20px}
/* scoped so it cannot swallow the eyebrow and the phone line inside the plate */
.plate > p{color:var(--text-2);max-width:46ch;margin:0 auto 34px;font-size:18.5px;line-height:1.62}
.plate > p.eyebrow{font-size:var(--t-micro);max-width:none;margin:0 0 22px}
.plate > p.plate-detail{font-size:14px;max-width:none}
.plate-cta{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.plate-detail{margin-top:32px;font-size:14px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--muted);display:flex;gap:10px;justify-content:center;flex-wrap:wrap;align-items:center}
.plate-detail a{color:var(--brass);text-decoration:none;padding:11px 4px;min-height:44px;
  display:inline-flex;align-items:center;transition:opacity .3s}
.plate-detail a:hover{opacity:.72}

/* ---------- form ---------- */
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.f-row{display:flex;flex-direction:column;gap:8px}
.f-row.full{grid-column:1/-1}
.f-row label{font-size:var(--t-micro);letter-spacing:var(--track);text-transform:uppercase;
  color:var(--brass)}
.f-row .hint{font-size:14px;color:var(--muted);letter-spacing:0;text-transform:none}
.f-row ::placeholder{color:#8B8074;opacity:1}
.f-row input,.f-row select,.f-row textarea{
  background:rgba(255,248,235,.04);border:1px solid var(--brass-line);color:var(--text);
  padding:14px 15px;min-height:50px;font-size:16px;width:100%;
  transition:border-color .3s var(--ease),background .3s var(--ease)}
.f-row textarea{min-height:130px;resize:vertical;line-height:1.6}
.f-row input:hover,.f-row select:hover,.f-row textarea:hover{border-color:rgba(212,178,120,.45)}
.f-row input:focus,.f-row select:focus,.f-row textarea:focus{
  border-color:var(--brass);background:rgba(255,248,235,.07)}
.f-row select{appearance:none;
  background-image:linear-gradient(45deg,transparent 50%,var(--brass) 50%),
                   linear-gradient(135deg,var(--brass) 50%,transparent 50%);
  background-position:calc(100% - 20px) 22px,calc(100% - 14px) 22px;
  background-size:6px 6px,6px 6px;background-repeat:no-repeat;padding-right:44px}
.f-row .err{font-size:14px;color:#E8A38B;letter-spacing:0;text-transform:none;min-height:0}
.f-row input[aria-invalid="true"],.f-row textarea[aria-invalid="true"],
.f-row select[aria-invalid="true"]{border-color:#C4735A}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form-foot{display:flex;flex-wrap:wrap;gap:18px;align-items:center;margin-top:26px}
.form-note{font-size:var(--t-small);color:var(--muted);max-width:46ch}
.form-note a{color:var(--brass)}
.form-status{margin-top:20px;padding:16px 20px;border-left:1px solid var(--brass);
  background:rgba(212,178,120,.07);font-size:16px;color:#D8CFC0}
.form-status[hidden]{display:none}
.form-status.bad{border-left-color:#C4735A;background:rgba(196,115,90,.1)}
.contact-split{display:grid;grid-template-columns:1.35fr .65fr;gap:64px;align-items:start}
.contact-aside h3,.contact-aside .as-h3{margin-bottom:14px}
.contact-aside p{color:var(--body);font-size:var(--t-body)}
.direct{list-style:none;padding:0;margin:22px 0 0}
.direct li{border-top:1px solid var(--brass-line);padding:0}
.direct li:last-child{border-bottom:1px solid var(--brass-line)}
.direct a{display:flex;flex-direction:column;gap:2px;padding:16px 0;text-decoration:none;min-height:44px}
.direct a:hover .d-val{color:var(--brass)}
.d-key{font-size:12.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.d-val{font-size:17px;transition:color .3s var(--ease)}

/* ---------- sticky mobile contact bar ---------- */
.dock{position:fixed;left:0;right:0;bottom:0;z-index:85;display:none;
  border-top:1px solid var(--brass-line);background:rgba(15,12,9,.97);
  padding:10px 12px calc(10px + env(safe-area-inset-bottom,0px));gap:10px}
.dock a{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:8px;
  min-height:52px;text-decoration:none;font-size:14px;letter-spacing:.1em;text-transform:uppercase;
  border:1px solid var(--brass);color:var(--brass)}
.dock a.solid{background:var(--brass);color:var(--hull)}
.dock svg{width:16px;height:16px;flex:none}

/* ---------- footer ---------- */
footer{border-top:1px solid var(--brass-line);padding:56px 0 40px;font-size:var(--t-body);color:var(--body)}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:40px;margin-bottom:44px}
.foot-grid-3{grid-template-columns:1.6fr 1fr 1fr}
.foot-grid .foot-h{font-family:var(--sans);font-size:var(--t-micro);letter-spacing:var(--track);
  text-transform:uppercase;color:var(--brass);margin:0 0 16px;font-weight:400;line-height:1.4;
  font-variation-settings:normal}
.foot-grid ul{list-style:none;margin:0;padding:0}
.foot-grid li{margin-bottom:9px}
.foot-grid a{color:var(--body);text-decoration:none;transition:color .3s var(--ease);
  font-size:16px;display:inline-block;padding:4px 0}
.foot-grid a:hover{color:var(--brass)}
.foot-brand{font-family:var(--serif);font-weight:500;font-size:24px;margin-bottom:14px;
  font-variation-settings:'opsz' 26}
.foot-brand i{font-style:italic;color:var(--brass)}
.foot-blurb{font-size:16px;color:var(--text-2);max-width:34ch;margin:0 0 18px;line-height:1.6}
.foot-bar{border-top:1px solid var(--brass-line);padding-top:26px;display:flex;
  justify-content:space-between;flex-wrap:wrap;gap:14px;font-size:var(--t-micro);letter-spacing:.1em;
  text-transform:uppercase;color:var(--muted)}
.foot-bar a{color:var(--muted);text-decoration:none}
.foot-bar a:hover{color:var(--brass)}

/* ---------- small utilities ----------
   These exist so no markup needs a style="" attribute; the CSP blocks those. */
.mt-l{margin-top:32px}
.aside-note{margin-top:26px;font-size:var(--t-small);color:var(--muted)}
.rule-static{transform:scaleX(1)}
.sec-standalone{padding-top:150px}

/* ---------- reveal ---------- */
.reveal{opacity:0;transform:translateY(26px);
  transition:opacity .9s var(--ease),transform .9s var(--ease)}
.reveal.in{opacity:1;transform:none}
.no-js .reveal{opacity:1;transform:none}
/* Without JS the panel can never animate, so show the resolved state statically
   rather than leaving an empty search box reading "No listing found." forever. */
.nojs-only{display:none}
.no-js .nojs-only{display:inline}
.no-js .state-dead,.no-js .caret,.no-js .replay{display:none}
.no-js .state-live{opacity:1;transform:none;position:static}
.no-js .result{min-height:0}

/* ---------- responsive ---------- */
@media(max-width:1000px){
  .contact-split{grid-template-columns:1fr;gap:44px}
  .foot-grid{grid-template-columns:1fr 1fr;gap:34px}
}
@media(max-width:980px){.hero-grid{grid-template-columns:1fr;gap:44px}}
@media(max-width:860px){
  .nav-toggle{display:inline-flex}
  .nav-menu{display:none;position:absolute;left:0;right:0;top:100%;flex-direction:column;
    align-items:stretch;gap:0;padding:8px 28px 24px;
    background:var(--hull);border-bottom:1px solid var(--brass-line)}
  .nav.open .nav-menu{display:flex}
  .nav.open{background:var(--hull);border-bottom-color:transparent}
  .nav-menu a:not(.btn){padding:15px 0;border-bottom:1px solid rgba(212,178,120,.14);font-size:16px}
  .nav-menu a:not(.btn)::after{display:none}
  .nav-menu .btn{margin-top:16px;width:100%}
  .dock{display:flex}
  body{padding-bottom:76px}
}
@media(max-width:820px){
  .sec-head{grid-template-columns:1fr;gap:20px;margin-bottom:40px}
  .form-grid{grid-template-columns:1fr}
}
@media(max-width:760px){
  .wrap{padding:0 20px}
  .sec-light{--fade:84px}
  .hero{padding:120px 0 68px}
  .hero-sub{padding:104px 0 44px}
  .hero-media::after{background:linear-gradient(to bottom,rgba(15,12,9,.84) 0,rgba(15,12,9,.9) 55%,var(--hull) 100%)}
  .sec{padding:70px 0}
  .sec-tight{padding:54px 0}
  .search{padding:40px 20px 26px}
  .field{padding-bottom:13px;margin-bottom:20px}
  .query{font-size:15px}
  .biz{font-size:22px}
  .price{flex-direction:column-reverse;align-items:flex-start;gap:12px;padding-right:0}
  .price:hover{padding-left:0}
  .price-tag{font-size:26px}
  .price-tag small{display:inline;margin-left:10px;margin-top:0}
  .cta-row{gap:12px}
  .cta-row .btn,.plate-cta .btn{flex:1 1 100%}
  .cols{gap:40px}
  .fact{padding-right:0}
  .plate{padding:52px 22px}
  .foot-grid{grid-template-columns:1fr;gap:30px}
}
@media(max-width:400px){
  .query{font-size:14px}
  .search-cap{font-size:12px;letter-spacing:.06em}
}

/* ---------- reduced motion ---------- */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;
    transition-duration:.001ms!important;scroll-behavior:auto!important}
  .hero-media img{transform:none;animation:none}
  .reveal{opacity:1;transform:none}
  .state-live{opacity:1;transform:none;position:static}
  .state-dead,.caret{display:none}
  .rule{transform:scaleX(1)}
  .result{min-height:0}
}