:root{
  --navy: #0e1f38;
  --navy-deep: #091628;
  --gold: #c9973f;
  --gold-light: #e0b768;
  --gold-dark: #8a6a26;
  --ivory: #f7f5f0;
  --paper: #fbfaf7;
  --ink: #1a1d22;
  --slate: #565b64;
  --line: #e4e1d8;
  --radius: 14px;
  --maxw: 1200px;
  --shadow: 0 20px 50px -25px rgba(14,31,56,0.35);
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}
}

body{
  font-family:'Inter',sans-serif;
  color:var(--ink);
  background:var(--paper);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

img,svg{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;cursor:pointer;border:none;background:none;color:inherit}
ul{list-style:none}

h1,h2,h3,h4{font-family:'DM Serif Display',serif;font-weight:400;letter-spacing:-0.01em;color:var(--navy)}
.on-dark h1,.on-dark h2,.on-dark h3{color:#fff}

.wrap{max-width:var(--maxw);margin:0 auto;padding:0 1.75rem}
@media(min-width:900px){.wrap{padding:0 2.5rem}}

.eyebrow{
  font-size:0.72rem;font-weight:600;letter-spacing:0.14em;text-transform:uppercase;
  color:var(--gold-dark);display:inline-flex;align-items:center;gap:0.6rem;margin-bottom:1.1rem;
}
.eyebrow::before{content:"";width:1.6rem;height:1px;background:var(--gold)}

.skip-link{
  position:absolute;left:1rem;top:-3rem;background:var(--navy);color:#fff;padding:0.75rem 1.25rem;
  border-radius:8px;z-index:200;transition:top .2s ease;
}
.skip-link:focus{top:1rem}

:focus-visible{outline:2px solid var(--gold);outline-offset:3px}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:0.5rem;
  padding:0.95rem 1.75rem;border-radius:100px;font-weight:600;font-size:0.92rem;
  letter-spacing:0.01em;transition:transform .18s ease, box-shadow .18s ease, background .18s ease, color .18s ease;
  white-space:nowrap;
}
.btn-primary{background:var(--gold);color:var(--navy-deep);box-shadow:0 12px 24px -12px rgba(201,151,63,0.55)}
.btn-primary:hover{background:var(--gold-light);transform:translateY(-2px)}
.btn-primary:disabled{opacity:0.7;cursor:default;transform:none}
.btn-ghost{background:transparent;color:var(--navy);border:1.5px solid var(--line)}
.btn-ghost:hover{border-color:var(--navy);transform:translateY(-2px)}
.on-dark .btn-ghost{color:#fff;border-color:rgba(255,255,255,0.25)}
.on-dark .btn-ghost:hover{border-color:#fff}

/* ---------- Header ---------- */
header.site{
  position:sticky;top:0;z-index:100;background:rgba(251,250,247,0.85);backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
#how-we-help,#contact{scroll-margin-top:80px}
.nav{display:flex;align-items:center;justify-content:space-between;padding:1.1rem 0}
.logo{font-family:'DM Serif Display',serif;font-size:1.4rem;color:var(--navy);letter-spacing:-0.01em}
.logo b{color:var(--gold);font-weight:400}
.nav-links{display:none;align-items:center;gap:2.25rem}
.nav-links a{font-size:0.92rem;font-weight:500;color:var(--slate);transition:color .15s ease;position:relative}
.nav-links a:hover{color:var(--navy)}
.nav-actions{display:flex;align-items:center;gap:1rem}
.nav-actions .btn{padding:0.7rem 1.4rem;font-size:0.85rem}
.nav-toggle{display:flex;flex-direction:column;gap:5px;padding:0.5rem;z-index:110}
.nav-toggle span{width:22px;height:2px;background:var(--navy);transition:transform .2s ease, opacity .2s ease}
.nav-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
.nav-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

.mobile-menu{
  position:fixed;inset:0 0 0 auto;width:min(320px,85vw);height:100vh;background:var(--navy-deep);
  transform:translateX(100%);transition:transform .28s ease;z-index:105;padding:6rem 2rem 2rem;
  display:flex;flex-direction:column;gap:1.75rem;
}
.mobile-menu.open{transform:translateX(0)}
.mobile-menu a{color:#fff;font-size:1.15rem;font-weight:500}
.mobile-menu .btn-primary{margin-top:1rem;width:100%}
.scrim{position:fixed;inset:0;background:rgba(9,22,40,0.5);opacity:0;pointer-events:none;transition:opacity .28s ease;z-index:104}
.scrim.open{opacity:1;pointer-events:auto}

@media(min-width:960px){
  .nav-links{display:flex}
  .nav-toggle,.mobile-menu,.scrim{display:none}
}

/* ---------- Hero ---------- */
.hero{position:relative;padding:5rem 0 6rem;overflow:hidden;background:
  radial-gradient(1100px 480px at 85% -10%, rgba(201,151,63,0.14), transparent 60%),
  var(--paper);
}
.hero-grid{display:grid;gap:3rem;align-items:center}
@media(min-width:980px){.hero-grid{grid-template-columns:1.05fr 0.95fr;gap:4rem}}
.hero h1{font-size:clamp(2.4rem,5.4vw,3.6rem);line-height:1.12;margin-bottom:1.4rem}
.hero h1 em{font-style:normal;color:var(--gold)}
.hero p.lede{font-size:1.15rem;color:var(--slate);max-width:44ch;margin-bottom:2.25rem;font-weight:400}
.hero-actions{display:flex;flex-wrap:wrap;gap:1rem;margin-bottom:2.5rem}
.hero-trust{display:flex;flex-wrap:wrap;gap:1.75rem;color:var(--slate);font-size:0.85rem}
.hero-trust li{display:flex;align-items:center;gap:0.5rem}
.hero-trust svg{width:16px;height:16px;color:var(--gold);flex-shrink:0}

.hero-art{position:relative;aspect-ratio:4/3.4;border-radius:20px;overflow:hidden;box-shadow:var(--shadow)}
.hero-art svg{width:100%;height:100%}

/* ---------- Section shells ---------- */
section{padding:5.5rem 0}
.section-head{max-width:640px;margin-bottom:3rem}
.section-head.center{margin-left:auto;margin-right:auto;text-align:center}
.section-head h2{font-size:clamp(1.8rem,3.6vw,2.5rem);line-height:1.2;margin-bottom:1rem}
.section-head p{color:var(--slate);font-size:1.05rem;max-width:56ch}
.section-head.center p{margin:0 auto}

.on-dark{background:var(--navy);color:#e9edf3}
.on-dark .eyebrow{color:var(--gold-light)}
.on-dark .section-head p{color:#b9c2d1}
.on-alt{background:var(--ivory)}

/* ---------- Story section ---------- */
.story{display:grid;gap:3rem;align-items:center}
@media(min-width:960px){.story{grid-template-columns:0.85fr 1.15fr;gap:4.5rem}}
.story-copy p{color:var(--slate);margin-bottom:1.1rem;font-size:1.05rem}
.story-copy p:last-child{margin-bottom:0}
.story-visual{border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}

/* ---------- Services ---------- */
.service-grid{display:grid;gap:1.5rem;grid-template-columns:1fr}
@media(min-width:680px){.service-grid{grid-template-columns:1fr 1fr}}
@media(min-width:1100px){.service-grid{grid-template-columns:repeat(4,1fr)}}
.service-card{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:2rem 1.75rem;
  display:flex;flex-direction:column;gap:1.1rem;transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.service-card:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:transparent}
.service-icon{
  width:48px;height:48px;border-radius:12px;background:linear-gradient(155deg,var(--navy),var(--navy-deep));
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
.service-icon svg{width:24px;height:24px;color:var(--gold-light)}
.service-card h3{font-size:1.2rem;margin-bottom:0.15rem}
.service-card p.desc{color:var(--slate);font-size:0.96rem}
.service-card ul{display:flex;flex-direction:column;gap:0.5rem;margin-top:0.25rem}
.service-card ul li{font-size:0.88rem;color:var(--ink);display:flex;gap:0.55rem;align-items:flex-start}
.service-card ul li::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--gold);margin-top:0.55rem;flex-shrink:0}

/* ---------- Philosophy ---------- */
.philosophy{display:grid;gap:3rem;align-items:center}
@media(min-width:960px){.philosophy{grid-template-columns:1fr 1fr;gap:4rem}}
.philosophy blockquote{font-family:'DM Serif Display',serif;font-size:clamp(1.6rem,3vw,2.1rem);line-height:1.35;color:#fff;margin-bottom:1.5rem}
.philosophy blockquote span{color:var(--gold-light)}
.philosophy p{color:#b9c2d1;font-size:1.05rem;margin-bottom:1rem}
.philosophy-visual{border-radius:var(--radius);overflow:hidden;border:1px solid rgba(255,255,255,0.12)}

/* ---------- How we work ---------- */
.steps{display:grid;gap:2rem;grid-template-columns:1fr;counter-reset:step}
@media(min-width:820px){.steps{grid-template-columns:repeat(3,1fr);gap:1.75rem}}
.step{position:relative;padding:2.25rem 1.75rem 2rem;background:#fff;border:1px solid var(--line);border-radius:var(--radius)}
.step-num{
  font-family:'DM Serif Display',serif;font-size:2.75rem;color:var(--gold);opacity:0.55;line-height:1;margin-bottom:1rem;
}
.step h3{font-size:1.25rem;margin-bottom:0.6rem}
.step p{color:var(--slate);font-size:0.97rem}

/* ---------- Community ---------- */
.community{display:grid;gap:3rem;align-items:center}
@media(min-width:960px){.community{grid-template-columns:1fr 1fr;gap:4.5rem}}
.community-visual{border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}
.community-copy p{color:var(--slate);margin-bottom:1.1rem;font-size:1.05rem}
.stat-row{display:flex;gap:2.5rem;margin-top:2rem;flex-wrap:wrap}
.stat-row div strong{display:block;font-family:'DM Serif Display',serif;font-size:2rem;color:var(--navy)}
.stat-row div span{font-size:0.85rem;color:var(--slate)}

/* ---------- Final CTA ---------- */
.final-cta{
  background:linear-gradient(155deg,var(--navy) 0%, var(--navy-deep) 100%);
  border-radius:24px;padding:4rem 2rem;text-align:center;position:relative;overflow:hidden;
  margin:0 1.75rem;
}
@media(min-width:900px){.final-cta{margin:0 2.5rem;padding:5rem 3rem}}
.final-cta::before{
  content:"";position:absolute;inset:0;
  background:radial-gradient(700px 300px at 20% 0%, rgba(201,151,63,0.22), transparent 60%);
}
.final-cta-inner{position:relative;max-width:520px;margin:0 auto}
.final-cta h2{color:#fff;font-size:clamp(2rem,4.2vw,2.75rem);margin-bottom:1.25rem}
.final-cta p{color:#c3cad8;font-size:1.08rem;margin-bottom:2.25rem}
.final-cta .btn-primary{padding:1.1rem 2.4rem;font-size:1rem}

/* ---------- Contact form ---------- */
.contact-form{display:flex;flex-direction:column;gap:0.9rem;text-align:left}
.contact-form input,.contact-form textarea{
  font:inherit;font-size:0.95rem;padding:0.85rem 1.1rem;border-radius:10px;
  border:1.5px solid rgba(255,255,255,0.18);background:rgba(255,255,255,0.06);color:#fff;
  resize:vertical;transition:border-color .15s ease,background .15s ease;
}
.contact-form input::placeholder,.contact-form textarea::placeholder{color:#8b93a3}
.contact-form input:focus,.contact-form textarea:focus{border-color:var(--gold-light);background:rgba(255,255,255,0.1);outline:none}
.contact-form .btn-primary{margin-top:0.4rem;align-self:center;padding:1rem 2.2rem}
.form-msg{display:none;margin-top:1.25rem;font-weight:500;color:#f3b3ab}
.form-msg.is-success{color:var(--gold-light)}
.cta-fallback{margin-top:1.5rem;font-size:0.9rem;color:#8b93a3}
.cta-fallback a{color:var(--gold-light);text-decoration:underline}

.contact-tabs{display:flex;gap:0.5rem;margin-bottom:1.75rem}
.contact-tab{flex:1;padding:0.85rem 1rem;font:inherit;font-weight:600;font-size:0.92rem;color:#c3cad8;background:rgba(255,255,255,0.05);border:1px solid rgba(255,255,255,0.12);border-radius:999px;cursor:pointer;transition:background 0.2s,color 0.2s,border-color 0.2s}
.contact-tab.is-active{color:#0e1f38;background:var(--gold-light);border-color:var(--gold-light)}
.contact-panel{display:none}
.contact-panel.is-active{display:block}

.calendly-embed-heading{color:#fff;font-weight:600;font-size:1.05rem;margin-bottom:1rem}
.calendly-inline-widget{border-radius:12px;overflow:hidden}
.calendly-embed-fallback{margin-top:0.9rem;font-size:0.85rem;color:#8b93a3}
.calendly-embed-fallback a{color:var(--gold-light);text-decoration:underline}

.after-reach-out{margin-top:2.5rem;padding-top:2rem;border-top:1px solid rgba(255,255,255,0.12);text-align:left}
.after-reach-out .eyebrow{color:var(--gold-light)}
.after-reach-out p{margin-bottom:0.85rem;font-size:0.98rem}
.after-reach-out p:last-child{margin-bottom:0}

/* ---------- Footer ---------- */
footer.site{background:var(--navy-deep);color:#9aa5b5;padding:4rem 0 2rem;margin-top:5rem}
.footer-grid{display:grid;gap:2.5rem;grid-template-columns:1fr;margin-bottom:3rem}
@media(min-width:720px){.footer-grid{grid-template-columns:1.3fr 1fr 1fr}}
.footer-brand .logo{color:#fff;margin-bottom:0.85rem;display:inline-block}
.footer-brand p{max-width:32ch;font-size:0.92rem;line-height:1.7}
.footer-col h4{font-family:'Inter',sans-serif;font-weight:600;color:#fff;font-size:0.85rem;letter-spacing:0.06em;text-transform:uppercase;margin-bottom:1.1rem}
.footer-col ul{display:flex;flex-direction:column;gap:0.75rem}
.footer-col a{font-size:0.92rem;transition:color .15s ease}
.footer-col a:hover{color:#fff}
.footer-bottom{
  border-top:1px solid rgba(255,255,255,0.08);padding-top:1.75rem;
  display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between;font-size:0.8rem;
}

/* ---------- Reveal animation ---------- */
.reveal{transition:opacity .6s ease, transform .6s ease}
.reveal.pending{opacity:0;transform:translateY(18px)}
.reveal.pending.in{opacity:1;transform:translateY(0)}

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