

@font-face { font-family:'Fraunces'; src:url('fonts/fraunces-latin-roman-var.woff2') format('woff2'); font-weight:100 900; font-display:swap; }
@font-face { font-family:'Inter'; src:url('fonts/inter-var.woff2') format('woff2'); font-weight:100 900; font-display:swap; }
@font-face { font-family:'IBM Plex Mono'; src:url('fonts/plex-mono-400.woff2') format('woff2'); font-weight:400; font-display:swap; }

*,*::before,*::after { box-sizing:border-box; }
html,body { margin:0; padding:0; }
ul,ol { margin:0; padding:0; }
img { max-width:100%; display:block; }

:root {
  
  --greige:#D9D2C4; --greige-line:#C7BFAE; --cream:#F3EFE7; --stone:#E2DACB;
  --sage:#556255; --pricing-bg:#FBF9F4; --footer-ink:#211E1C;
  --ink:#211E1C; --charcoal:#453F39; --muted:#6E6860;
  --paper-text:#EAE4D8; --paper-mute:#B4AC9E;
  
  --signal:#0F766E;      
  --signal-bright:#43D9C0;
  --signal-dim:rgba(67,217,192,.16);
  --live:#B8791F;        
  --live-dim:rgba(242,182,60,.16);

  --serif:'Fraunces', Georgia, 'Times New Roman', serif;
  --sans:'Inter', -apple-system, 'Segoe UI', sans-serif;
  --mono:'IBM Plex Mono', ui-monospace, Menlo, monospace;
}

html { scroll-behavior:smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior:auto; } }

body {
  font-family:var(--sans); color:var(--ink); background:var(--cream);
  font-size:1.0625rem; line-height:1.65; -webkit-font-smoothing:antialiased;
}
h1,h2,h3 { font-family:var(--serif); font-weight:560; line-height:1.15; margin:0 0 1rem; color:var(--ink); }
h1 { font-size:clamp(2rem,5.5vw,3.1rem); letter-spacing:-0.01em; }
h2 { font-size:clamp(1.35rem,3vw,1.7rem); }
h3 { font-size:clamp(1.1rem,2.2vw,1.3rem); font-weight:520; }
p { margin:0 0 1rem; max-width:38em; }
a { color:var(--signal); }
a:hover { color:var(--charcoal); }


.band { padding:clamp(2.5rem,7vw,4.5rem) clamp(1.25rem,6vw,4rem); }
.band > .inner { max-width:46rem; margin:0 auto; }



.eyebrow {
  font-family:var(--sans); font-size:.78rem; font-weight:640; letter-spacing:.14em;
  text-transform:uppercase; color:var(--charcoal); margin:0 0 1.25rem;
}

.eyebrow.mono {
  font-family:var(--mono); font-weight:400; color:var(--signal);
}
.eyebrow.mono .n { color:var(--muted); }


.site-header {
  position:sticky; top:0; z-index:50;
  background:rgba(243,239,231,.92); -webkit-backdrop-filter:saturate(1.3) blur(8px); backdrop-filter:saturate(1.3) blur(8px);
  border-bottom:1px solid var(--greige-line);
}
.nav-inner { max-width:60rem; margin:0 auto; padding:.7rem 1.25rem; display:flex; align-items:center; gap:.75rem 1.5rem; flex-wrap:wrap; }
.wordmark { font-family:var(--serif); font-weight:600; font-size:1.05rem; letter-spacing:.08em; color:var(--ink); text-decoration:none; text-transform:uppercase; white-space:nowrap; }
.nav-links { display:flex; gap:1.25rem; margin-left:auto; flex-wrap:wrap; }
.nav-links a { color:var(--charcoal); text-decoration:none; font-family:var(--mono); font-weight:400; font-size:.74rem; letter-spacing:.03em; text-transform:uppercase; border-bottom:1px solid transparent; }
.nav-links a:hover { color:var(--signal); border-bottom-color:var(--signal); }


.hero { background:var(--greige); border-bottom:1px solid var(--greige-line); }
.hero .lead { font-size:1.15rem; color:var(--charcoal); }
.cta { display:inline-block; margin-top:.5rem; padding:.8rem 1.4rem; background:var(--ink); color:var(--cream); text-decoration:none; font-weight:600; border-radius:2px; }
.cta:hover { background:var(--charcoal); color:var(--cream); }
.cta-row { display:flex; flex-wrap:wrap; gap:.75rem 1.25rem; align-items:center; }
.cta-outline { display:inline-block; margin-top:.5rem; padding:.75rem 1.3rem; background:transparent; color:var(--ink); text-decoration:none; font-weight:600; border:1px solid var(--ink); border-radius:2px; }
.cta-outline:hover { background:var(--ink); color:var(--cream); }


.system { background:var(--cream); }
.firm { background:var(--sage); color:var(--paper-text); }
.firm .eyebrow, .firm .eyebrow.mono { color:var(--paper-mute); }
.contact { background:var(--pricing-bg); }
.contact a { font-weight:600; }


.pull {
  border-left:3px solid var(--signal); background:var(--signal-dim);
  padding:1.25rem 1.5rem; margin:1.5rem 0 0; border-radius:0 8px 8px 0;
}
.pull p { font-family:var(--serif); font-size:1.12rem; line-height:1.45; color:var(--ink); margin:0; max-width:none; }


.door { border-top:1px solid var(--greige-line); }
.door .two-houses { font-size:.95rem; color:var(--charcoal); border-left:3px solid var(--signal); padding-left:1rem; margin:1.25rem 0; }
.door-note { font-size:.9rem; color:var(--muted); font-style:italic; }


.shelf-cards { display:grid; gap:1.1rem; margin:1.75rem 0 0; }
@media (min-width:700px) { .shelf-cards { grid-template-columns:1fr 1fr; } }
.card {
  background:var(--cream); border:1px solid var(--greige-line); border-radius:8px;
  padding:1.35rem 1.45rem 1.2rem; position:relative; overflow:hidden;
}
.card::before { content:""; position:absolute; left:0; top:0; bottom:0; width:3px; background:var(--signal); }
.card.watch::before { background:var(--live); }
.card .pill {
  display:inline-block; font-family:var(--mono); font-size:.68rem; letter-spacing:.05em;
  text-transform:uppercase; color:var(--charcoal); background:var(--live-dim);
  border:1px solid rgba(184,121,31,.4); border-radius:999px; padding:.35em .9em; margin-bottom:.7rem;
}
.card h3 { margin-bottom:.5rem; }
.card .field { font-size:.95rem; margin-bottom:.4rem; }
.card .field:last-child { margin-bottom:0; }
.card .field .label { font-family:var(--mono); font-size:.68rem; letter-spacing:.05em; text-transform:uppercase; color:var(--muted); margin-right:.4em; }


footer.site-footer { background:var(--footer-ink); color:var(--paper-mute); font-size:.9rem; padding:2rem clamp(1.25rem,6vw,4rem); }
footer.site-footer a { color:var(--paper-text); }
footer.site-footer p { max-width:46rem; margin:0 auto 1rem; }
footer.site-footer p:last-child { margin-bottom:0; }


.visually-hidden { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }


.desk-back { display:inline-block; margin-bottom:1.5rem; font-family:var(--mono); font-size:.78rem; letter-spacing:.04em; text-transform:uppercase; color:var(--charcoal); text-decoration:none; border-bottom:1px solid transparent; }
.desk-back:hover { color:var(--signal); border-bottom-color:var(--signal); }


.fence { border-left:3px solid var(--live); background:var(--live-dim); padding:1.25rem 1.5rem; margin:1.5rem 0; border-radius:0 8px 8px 0; }
.fence p { margin:0; max-width:none; }
.fence .fence-label { font-family:var(--mono); font-size:.72rem; letter-spacing:.05em; text-transform:uppercase; color:var(--charcoal); display:block; margin-bottom:.5rem; }


.offer-block { border:1px solid var(--greige-line); border-radius:8px; padding:1.5rem 1.75rem; margin:1.75rem 0; background:var(--cream); }
.offer-block h3 { margin-bottom:.6rem; }
.offer-block .offer-field { margin-bottom:.75rem; }
.offer-block .offer-field:last-of-type { margin-bottom:.5rem; }
.offer-block .field-label { font-family:var(--mono); font-size:.7rem; letter-spacing:.05em; text-transform:uppercase; color:var(--muted); display:block; margin-bottom:.25rem; }


.price-placeholder { display:none;  font-family:var(--mono); font-size:.82rem; color:var(--charcoal); background:var(--stone); border:1px dashed var(--greige-line); padding:.7rem 1rem; border-radius:4px; margin:.5rem 0 1rem; }


.reply-note { font-size:.95rem; color:var(--charcoal); }
