:root{
  --canvas:#0c0c0d;
  --canvas-2:#17181a;
  --ink:#f2f0ec;
  --ink-dim:#c9c7c2;
  --plate-1:#2b2b2e;
  --plate-2:#1a1a1a;
  --rivet:#000;
  --accent:#9C7C38;
  --accent-ink:#1b1a17;
  --light-bg:#f7f5f1;
  --light-ink:#2a2a2a;
  --rule:#3a3a3d;
  --max:1200px;
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  font-family:'Public Sans',Arial,Helvetica,sans-serif;
  background:var(--canvas);
  color:var(--ink);
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4{
  font-family:'Fraunces',Georgia,'Times New Roman',serif;
  font-weight:600;
  line-height:1.15;
  margin:0 0 .5em;
  color:var(--ink);
}
p{margin:0 0 1em;color:var(--ink-dim);}
a{color:inherit;text-decoration:none;}
img{max-width:100%;display:block;}
.container{max-width:var(--max);margin:0 auto;padding:0 24px;}
.section{padding:88px 0;}
.section--tight{padding:56px 0;}
.section--light{background:var(--light-bg);color:var(--light-ink);}
.section--light p{color:#4a4a4a;}
.section--light h2,.section--light h3{color:var(--light-ink);}
.bg-photo{
  position:relative;
  background-size:cover;
  background-position:center;
  color:var(--ink);
}
.bg-photo::before{
  content:"";
  position:absolute;inset:0;
  background:linear-gradient(180deg, rgba(8,8,9,.72), rgba(8,8,9,.55) 40%, rgba(8,8,9,.85));
  z-index:0;
}
.bg-photo > .container{position:relative;z-index:1;}

/* ---- Header / Nav (pure-CSS riveted plate, no baked text images) ---- */
.site-header{
  position:sticky;top:0;z-index:50;
  background:#0a0a0b;
  border-bottom:1px solid #000;
  padding:14px 0;
}
.site-header .container{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;}
.brand-logo{display:flex;align-items:center;gap:10px;}
.brand-logo img{height:34px;width:auto;}
.brand-logo .wordmark{font-family:'Fraunces',serif;font-weight:700;font-size:20px;letter-spacing:.02em;color:var(--ink);}
.brand-logo .sub{display:block;font-size:10px;letter-spacing:.28em;color:var(--ink-dim);font-family:Arial,sans-serif;}
nav.plates{display:flex;gap:10px;flex-wrap:wrap;}
nav.plates a{
  position:relative;
  display:inline-block;
  padding:10px 18px;
  font-size:13px;
  font-weight:700;
  letter-spacing:.05em;
  text-transform:uppercase;
  color:var(--ink);
  background:linear-gradient(155deg, var(--plate-1), var(--plate-2));
  border-radius:3px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), inset 0 -2px 4px rgba(0,0,0,.6), 0 2px 5px rgba(0,0,0,.5);
  border:1px solid #050505;
  transition:box-shadow .15s ease, transform .15s ease, color .15s ease;
}
nav.plates a::before,nav.plates a::after{
  content:"";position:absolute;top:50%;width:5px;height:5px;border-radius:50%;
  background:radial-gradient(circle at 35% 35%, #888, #111 70%);
  transform:translateY(-50%);
}
nav.plates a::before{left:6px;}
nav.plates a::after{right:6px;}
nav.plates a:hover{color:var(--accent);box-shadow: inset 0 1px 0 rgba(255,255,255,.12), inset 0 -2px 4px rgba(0,0,0,.6), 0 0 0 1px var(--accent);}
nav.plates a.active{color:var(--accent);}

/* ---- Buttons ---- */
.btn{
  display:inline-block;
  padding:14px 28px;
  font-size:14px;
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
  background:var(--accent);
  color:var(--accent-ink);
  border-radius:2px;
  border:none;
  cursor:pointer;
}
.btn:hover{filter:brightness(1.08);}
.btn--outline{background:transparent;color:var(--ink);border:1px solid var(--ink-dim);}
.btn--outline:hover{border-color:var(--accent);color:var(--accent);}

/* ---- Hero ---- */
.hero{min-height:640px;display:flex;align-items:center;padding:140px 0 90px;}
.hero .pre{font-size:13px;letter-spacing:.22em;text-transform:uppercase;color:var(--accent);font-weight:700;margin-bottom:18px;}
.hero h1{font-size:48px;max-width:820px;}
.hero .subhead{font-size:19px;max-width:640px;color:var(--ink-dim);margin:22px 0 32px;}

/* ---- Icon grid ---- */
.grid{display:grid;gap:24px;}
.grid--4{grid-template-columns:repeat(4,1fr);}
.grid--3{grid-template-columns:repeat(3,1fr);}
.grid--2{grid-template-columns:repeat(2,1fr);}
@media (max-width:900px){.grid--4{grid-template-columns:repeat(2,1fr);} .grid--3{grid-template-columns:repeat(1,1fr);} .grid--2{grid-template-columns:1fr;}}
@media (max-width:560px){.grid--4{grid-template-columns:1fr;}}
.pillar{
  background:var(--canvas-2);
  border:1px solid var(--rule);
  padding:26px 20px;
  border-radius:4px;
}
.pillar .num{color:var(--accent);font-family:'Fraunces',serif;font-size:26px;margin-bottom:10px;display:block;}
.pillar h4{font-size:16px;margin-bottom:6px;}
.pillar p{font-size:14px;margin:0;}

/* ---- Cards (portfolio) ---- */
.card{
  background:var(--canvas-2);
  border:1px solid var(--rule);
  border-radius:6px;
  padding:28px;
  display:flex;flex-direction:column;gap:14px;
}
.card img.logo-mark{height:56px;width:auto;object-fit:contain;filter:grayscale(0);}
.card h4{font-size:18px;margin:0;}
.card .badge{
  display:inline-block;font-size:11px;letter-spacing:.06em;text-transform:uppercase;
  color:var(--accent);border:1px solid var(--accent);padding:4px 9px;border-radius:20px;width:fit-content;
}
.card .link{margin-top:auto;font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--ink);}
.card .link:hover{color:var(--accent);}
.card--tier2{opacity:.92;}
.card--tier2 img.logo-mark{filter:grayscale(15%);}

.tier-note{
  font-size:14px;color:var(--ink-dim);max-width:760px;margin-bottom:28px;padding:16px 18px;
  background:rgba(156,124,56,.08);border-left:3px solid var(--accent);border-radius:2px;
}

/* ---- Callout / TODO ---- */
.callout{
  background:rgba(156,124,56,.1);
  border-left:3px solid var(--accent);
  padding:16px 20px;border-radius:2px;font-size:14px;color:var(--ink-dim);margin:24px 0;
}

/* ---- FAQ ---- */
.faq-item{border-bottom:1px solid var(--rule);padding:22px 0;}
.faq-item h4{font-size:17px;margin-bottom:8px;}
.faq-item p{margin:0;font-size:15px;}

/* ---- Stats ---- */
.stat{text-align:left;}
.stat .value{font-family:'Fraunces',serif;font-size:48px;color:var(--accent);display:block;}
.stat .label{font-size:13px;color:var(--ink-dim);text-transform:uppercase;letter-spacing:.05em;}

/* ---- Form ---- */
form.contact-form{display:grid;gap:18px;max-width:640px;}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:18px;}
@media (max-width:600px){.form-row{grid-template-columns:1fr;}}
.field label{display:block;font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-dim);margin-bottom:6px;}
.field input,.field select,.field textarea{
  width:100%;padding:12px 14px;background:#111214;border:1px solid var(--rule);color:var(--ink);
  font-family:inherit;font-size:15px;border-radius:3px;
}
.field textarea{min-height:120px;resize:vertical;}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--accent);}
.hp-field{position:absolute;left:-9999px;top:-9999px;}
.form-msg{padding:14px 16px;border-radius:3px;font-size:14px;margin-bottom:6px;display:none;}
.form-msg.success{display:block;background:rgba(60,140,80,.15);border:1px solid #3c8c50;color:#bfe6c8;}
.form-msg.error{display:block;background:rgba(180,60,50,.15);border:1px solid #b43c32;color:#f0bdb6;}

/* ---- Footer ---- */
footer.site-footer{background:#08090a;border-top:1px solid #000;padding:64px 0 32px;}
.family-strip h3{font-size:13px;text-transform:uppercase;letter-spacing:.12em;color:var(--ink-dim);margin-bottom:22px;}
.family-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-bottom:48px;}
@media (max-width:800px){.family-cards{grid-template-columns:1fr;}}
.family-card{background:var(--canvas-2);border:1px solid var(--rule);border-radius:4px;padding:18px 20px;}
.family-card .name{font-weight:700;font-size:14px;margin-bottom:4px;}
.family-card .desc{font-size:13px;color:var(--ink-dim);margin-bottom:8px;}
.family-card .go{font-size:12px;font-weight:700;text-transform:uppercase;color:var(--accent);}
.disclaimer{font-size:11.5px;line-height:1.6;color:#7a7a7d;border-top:1px solid var(--rule);padding-top:24px;max-width:980px;}
.disclaimer p{color:#7a7a7d;font-size:11.5px;margin:0 0 10px;}
.copyright{font-size:12px;color:#5c5c5f;margin-top:18px;}

/* ---- Utility ---- */
.eyebrow{font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--accent);font-weight:700;margin-bottom:10px;}
.section h2{font-size:32px;}
.lede{font-size:18px;max-width:760px;color:var(--ink-dim);}
.mt-0{margin-top:0;}