:root{
  --bg:#0F1B14;
  --bg2:#122016;
  --fg:#F3ECDD;
  --mute:#B9AD8F;
  --gold:#C9A24B;
  --gold-hover:#DDB662;
  --rule:rgba(243,236,221,0.14);
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--bg);
  color:var(--fg);
  font-family:"IBM Plex Sans",system-ui,sans-serif;
  -webkit-font-smoothing:antialiased;
}
::selection{background:rgba(201,162,75,0.35);}
a{color:inherit;}
.wrap{max-width:1180px; margin:0 auto; padding:0 1.75rem;}
.eyebrow{
  font-family:"IBM Plex Mono",monospace;
  font-size:0.72rem;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--gold);
  margin:0 0 1rem;
}
h1,h2,h3{font-family:"Fraunces",serif; font-weight:480; text-wrap:balance; letter-spacing:-0.01em; margin:0;}
.rule{width:64px; height:2px; background:var(--gold); margin:1.3rem 0 1.6rem;}
.cta{
  display:inline-block;
  font-family:"IBM Plex Sans",sans-serif;
  font-weight:500;
  font-size:0.95rem;
  padding:0.85rem 1.6rem;
  border-radius:2px;
  text-decoration:none;
  background:var(--gold);
  color:#1B1508;
  border:1px solid var(--gold);
  transition:transform 0.15s ease, background 0.15s ease;
  cursor:pointer;
}
.cta:hover{background:var(--gold-hover); transform:translateY(-1px);}
.cta:focus-visible{outline:2px solid var(--gold); outline-offset:3px;}
.cta.ghost{background:transparent; color:var(--fg); border-color:var(--rule);}
.cta.ghost:hover{background:rgba(243,236,221,0.06); border-color:var(--gold);}

/* ---- Header ---- */
header{
  position:sticky; top:0; z-index:10;
  background:rgba(15,27,20,0.86);
  backdrop-filter:blur(6px);
  border-bottom:1px solid var(--rule);
}
header .wrap{
  display:flex; align-items:center; justify-content:space-between;
  padding-top:1rem; padding-bottom:1rem; gap:1.5rem;
}
.wordmark{
  font-family:"Fraunces",serif; font-weight:480; font-size:1.05rem; letter-spacing:0.01em;
  text-decoration:none; white-space:nowrap;
}
nav.primary{display:flex; align-items:center; gap:1.9rem; flex-wrap:wrap;}
nav.primary a{
  font-size:0.88rem; text-decoration:none; color:var(--mute);
  transition:color 0.15s ease;
}
nav.primary a:hover{color:var(--fg);}
nav.primary a[aria-current="page"]{color:var(--gold);}
.header-phone{font-family:"IBM Plex Mono",monospace; font-size:0.85rem; color:var(--fg); text-decoration:none; white-space:nowrap;}
.nav-toggle-checkbox{display:none;}
.nav-toggle-label{display:none; align-items:center; justify-content:center; cursor:pointer; padding:0.4rem; margin:-0.4rem; color:var(--fg);}
.nav-phone{display:none;}
@media (max-width:760px){
  .header-phone{display:none;}
  .nav-toggle-label{display:flex;}
  nav.primary{
    display:none;
    position:absolute; top:100%; left:0; right:0;
    flex-direction:column; align-items:stretch; gap:0;
    background:var(--bg2); border-bottom:1px solid var(--rule);
    padding:0.5rem 1.75rem 1rem;
    box-shadow:0 16px 28px rgba(0,0,0,0.4);
  }
  nav.primary a{padding:0.85rem 0; border-bottom:1px solid var(--rule); font-size:0.95rem;}
  nav.primary a:last-child{border-bottom:none;}
  .nav-phone{display:block; color:var(--gold);}
  .nav-toggle-checkbox:checked ~ nav.primary{display:flex;}
}

/* ---- Hero (homepage only) ---- */
#hero{position:relative; min-height:min(66vh, 620px); display:grid; overflow:hidden; isolation:isolate;
  background:radial-gradient(120% 100% at 15% 10%, var(--bg2), var(--bg) 65%);
}
#hero canvas{position:absolute; inset:0; width:100%; height:100%; display:block;}
#hero .wrap{position:relative; z-index:2; display:grid; align-items:center; min-height:min(66vh, 620px); padding:3.5rem 1.75rem;}
#hero .wrap::before{
  content:""; position:absolute; top:0; bottom:0; left:-1.75rem; width:min(58%, 760px);
  background:linear-gradient(to right, rgba(9,16,12,0.72) 0%, rgba(9,16,12,0.5) 55%, rgba(9,16,12,0) 100%);
  z-index:0; pointer-events:none;
}
.hero-copy{position:relative; z-index:1; max-width:620px;}
#hero h1{font-size:clamp(2.5rem,5.6vw,4.2rem); line-height:1.06; text-shadow:0 2px 18px rgba(0,0,0,0.55);}
#hero p.sub{font-size:1.08rem; line-height:1.6; color:var(--mute); max-width:46ch; margin:0 0 1.9rem; text-shadow:0 2px 14px rgba(0,0,0,0.55);}

/* ---- Page header (inner pages) ---- */
.page-header{
  padding:4.2rem 0 3.4rem;
  background:radial-gradient(120% 100% at 15% 0%, var(--bg2), var(--bg) 75%);
  border-bottom:1px solid var(--rule);
}
.page-header h1{font-size:clamp(2.1rem,4.4vw,3.1rem); line-height:1.12;}
.page-header p.lead{font-size:1.05rem; line-height:1.65; color:var(--mute); max-width:58ch; margin:0;}

@media (max-width:760px){
  #hero{min-height:0;}
  #hero .wrap{min-height:auto; padding:2.75rem 1.75rem 3.5rem;}
  .page-header{padding:3rem 0 2.6rem;}
}

/* ---- Generic section rhythm ---- */
section{padding:5.5rem 0;}
section.alt{background:var(--bg2);}
.section-head{max-width:640px; margin:0 0 3rem;}
.section-head p.lead{font-size:1.02rem; line-height:1.65; color:var(--mute); margin:1rem 0 0; max-width:56ch;}
h2.h-md{font-size:clamp(1.9rem,3.6vw,2.6rem);}

/* ---- Numbered list (services etc.) ---- */
.service-list{border-top:1px solid var(--rule);}
.service-row{
  display:grid; grid-template-columns:56px 1fr; gap:1.4rem;
  padding:1.7rem 0; border-bottom:1px solid var(--rule);
  align-items:baseline;
}
.service-num{font-family:"IBM Plex Mono",monospace; font-size:0.85rem; color:var(--gold);}
.service-row h3{font-size:1.3rem; margin:0 0 0.45rem;}
.service-row p{font-size:0.96rem; line-height:1.6; color:var(--mute); margin:0; max-width:56ch;}
.group-label{
  font-family:"IBM Plex Mono",monospace; font-size:0.76rem; letter-spacing:0.1em; text-transform:uppercase;
  color:var(--mute); margin:2.6rem 0 0; padding-top:2.2rem; border-top:1px solid var(--rule);
}
.group-label:first-child{margin-top:0; padding-top:0; border-top:none;}

/* ---- About + credentials ---- */
.about-grid{display:grid; grid-template-columns:1.15fr 0.85fr; gap:3.5rem;}
.about-grid p{font-size:1.02rem; line-height:1.7; color:var(--mute); max-width:52ch;}
.about-grid p + p{margin-top:1.1rem;}
.credentials{border-top:1px solid var(--rule); padding-top:1.6rem;}
.credentials .k{font-family:"IBM Plex Mono",monospace; font-size:0.72rem; letter-spacing:0.1em; text-transform:uppercase; color:var(--mute); margin-bottom:0.9rem;}
.cred-row{display:flex; flex-wrap:wrap; gap:0.7rem 0;}
.cred-item{
  font-family:"IBM Plex Mono",monospace; font-size:0.82rem; color:var(--fg);
  padding:0.55rem 0; border-bottom:1px solid var(--rule); width:100%;
  display:flex; justify-content:space-between; gap:1rem;
}
.cred-item span:last-child{color:var(--mute); text-align:right;}
@media (max-width:820px){ .about-grid{grid-template-columns:1fr;} }

/* ---- Pillars (three-column value props) ---- */
.pillars{display:grid; grid-template-columns:repeat(3,1fr); gap:2.4rem; border-top:1px solid var(--rule); padding-top:2.6rem;}
.pillar .service-num{display:block; margin-bottom:0.8rem;}
.pillar h3{font-size:1.15rem; margin:0 0 0.5rem;}
.pillar p{font-size:0.92rem; line-height:1.6; color:var(--mute); margin:0;}
@media (max-width:820px){ .pillars{grid-template-columns:1fr; gap:1.8rem;} }

/* ---- Process steps (fees) ---- */
.steps{display:grid; grid-template-columns:repeat(3,1fr); gap:2.4rem; margin:0 0 3rem;}
.step .service-num{display:block; margin-bottom:0.8rem;}
.step h3{font-size:1.1rem; margin:0 0 0.5rem;}
.step p{font-size:0.92rem; line-height:1.6; color:var(--mute); margin:0;}
@media (max-width:820px){ .steps{grid-template-columns:1fr; gap:1.8rem;} }

.callout{
  border:1px solid var(--rule); border-left:2px solid var(--gold);
  background:var(--bg2); padding:1.6rem 1.8rem; margin:0 0 3rem;
}
.callout p{font-size:0.96rem; line-height:1.65; color:var(--mute); margin:0; max-width:62ch;}
.callout p strong{color:var(--fg);}

/* ---- Fees CTA band ---- */
#fees-cta .wrap{display:grid; grid-template-columns:1.2fr 0.8fr; gap:3rem; align-items:end;}
#fees-cta p.lead{max-width:46ch;}
.fee-actions{display:flex; gap:0.9rem; flex-wrap:wrap;}
@media (max-width:820px){ #fees-cta .wrap{grid-template-columns:1fr;} }

/* ---- Contact / footer ---- */
#contact{background:var(--bg2); border-top:1px solid var(--rule);}
.contact-grid{display:grid; grid-template-columns:1fr 1fr; gap:3rem;}
.contact-list{list-style:none; margin:0; padding:0;}
.contact-list li{
  display:grid; grid-template-columns:110px 1fr; gap:1rem;
  padding:0.9rem 0; border-bottom:1px solid var(--rule);
  font-size:0.95rem;
}
.contact-list li .k{font-family:"IBM Plex Mono",monospace; font-size:0.76rem; letter-spacing:0.08em; text-transform:uppercase; color:var(--mute);}
.contact-list li a{color:var(--fg); text-decoration:none; border-bottom:1px solid transparent;}
.contact-list li a:hover{border-bottom-color:var(--gold);}
@media (max-width:820px){ .contact-grid{grid-template-columns:1fr;} }

.reg-list{list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:0.6rem;}
.reg-list li{
  font-family:"IBM Plex Mono",monospace; font-size:0.78rem; color:var(--mute);
  border:1px solid var(--rule); padding:0.45rem 0.8rem;
}

footer.bottom{border-top:1px solid var(--rule); padding:1.8rem 0;}
footer.bottom .wrap{display:flex; justify-content:space-between; flex-wrap:wrap; gap:1rem;}
footer.bottom p{font-size:0.8rem; color:var(--mute); margin:0;}
footer.bottom nav{display:flex; gap:1.4rem; flex-wrap:wrap;}
footer.bottom nav a{font-size:0.8rem; color:var(--mute); text-decoration:none;}
footer.bottom nav a:hover{color:var(--fg);}

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