/* =====================================================================
   Meridian Wealth Partners — styles.css
   Light, premium wealth aesthetic. Design tokens via CSS custom
   properties. Responsive with Flexbox + Grid.
   ===================================================================== */

:root {
  /* Surfaces */
  --m-bg:#FBFAF6;
  --m-bg2:#F2EEE4;
  --m-card:#FFFFFF;
  /* Ink / text */
  --m-ink:#1C2E44;
  --m-ink2:#455468;
  --m-muted:#7C8695;
  /* Lines */
  --m-line:#EAE4D6;
  --m-line2:#DDD5C4;
  /* Accents */
  --m-gold:#B4913F;
  --m-gold-hi:#C7A253;
  --m-gold-soft:#F5EDD9;
  --m-teal:#2E8C70;
  --m-teal-soft:#E2F0EA;
  /* Type */
  --m-serif:'Newsreader',Georgia,'Times New Roman',serif;
  --m-sans:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  /* Layout */
  --m-maxw:1240px;
  --m-px:40px;
  /* Motion */
  --m-ease:cubic-bezier(.2,.7,.3,1);
}

/* ---- Reset ---- */
*,*::before,*::after { box-sizing:border-box; }
html { scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body {
  margin:0;
  background:var(--m-bg);
  color:var(--m-ink);
  font-family:var(--m-sans);
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
img,svg { max-width:100%; display:block; }
a { color:inherit; text-decoration:none; }
button { font-family:inherit; cursor:pointer; }
h1,h2,h3,p,blockquote,ul { margin:0; }
ul { padding:0; list-style:none; }
::selection { background:var(--m-gold); color:#fff; }
:focus-visible { outline:2px solid var(--m-gold); outline-offset:3px; }

/* ---- Layout helpers ---- */
.container { max-width:var(--m-maxw); margin-inline:auto; padding-inline:var(--m-px); }
.section { padding-block:88px; }
.section__head { max-width:620px; margin-bottom:48px; }
.section__title {
  font-family:var(--m-serif); font-weight:400;
  font-size:clamp(32px,3.6vw,46px); letter-spacing:-.02em; line-height:1.08;
  color:var(--m-ink); margin-bottom:16px;
}
.section__lead { font-size:17px; line-height:1.62; color:var(--m-ink2); }
.eyebrow {
  font-size:12px; letter-spacing:.14em; text-transform:uppercase;
  color:var(--m-gold); font-weight:600; margin-bottom:14px;
}
.eyebrow--gold { color:var(--m-gold-hi); margin-bottom:20px; }

/* ---- Buttons ---- */
.btn {
  display:inline-flex; align-items:center; justify-content:center;
  font-weight:600; font-size:14.5px; padding:11px 20px; border-radius:8px;
  border:1px solid transparent; white-space:nowrap;
  transition:transform .2s var(--m-ease), background .2s ease, color .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.btn--lg { font-size:15.5px; padding:15px 28px; }
.btn--primary { background:var(--m-gold); color:#fff; }
.btn--primary:hover { transform:translateY(-2px); background:var(--m-ink); color:#fff; box-shadow:0 14px 34px -12px rgba(28,46,68,.5); }
.btn--ghost { background:var(--m-card); border-color:var(--m-line2); color:var(--m-ink2); }
.btn--ghost:hover { border-color:var(--m-ink); color:var(--m-ink); }

/* ---- Pill / tag ---- */
.pill {
  display:inline-flex; align-items:center; gap:9px; padding:7px 15px;
  border:1px solid var(--m-line2); border-radius:999px; background:var(--m-card);
  margin-bottom:30px; font-size:12.5px; color:var(--m-ink2);
}
.pill__dot { width:7px; height:7px; border-radius:50%; background:var(--m-teal); }
.tag { display:inline-flex; align-items:center; gap:5px; padding:5px 11px; border-radius:999px; font-size:12.5px; font-weight:600; }
.tag--up { background:var(--m-teal-soft); color:var(--m-teal); }

/* ---- Inputs ---- */
.input {
  flex:1; background:var(--m-card); border:1px solid var(--m-line2);
  border-radius:8px; padding:13px 16px; color:var(--m-ink); font-size:15px;
  font-family:inherit; transition:border-color .18s ease, box-shadow .18s ease;
}
.input::placeholder { color:var(--m-muted); }
.input:focus { outline:none; border-color:var(--m-gold); box-shadow:0 0 0 3px var(--m-gold-soft); }

/* =====================================================================
   NAV
   ===================================================================== */
.nav {
  position:sticky; top:0; z-index:50;
  background:rgba(251,250,246,.82); backdrop-filter:blur(16px);
  border-bottom:1px solid var(--m-line);
}
.nav__inner {
  max-width:var(--m-maxw); margin-inline:auto; padding-inline:var(--m-px);
  height:74px; display:flex; align-items:center; justify-content:space-between; gap:24px;
}
.brand { display:flex; align-items:center; gap:12px; }
.brand__mark {
  width:36px; height:36px; border-radius:9px; flex:none;
  background:linear-gradient(145deg,var(--m-gold-hi),var(--m-gold));
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 4px 14px -6px rgba(180,145,63,.7);
}
.brand__name { font-family:var(--m-serif); font-size:20px; font-weight:500; letter-spacing:-.01em; color:var(--m-ink); }
.brand__sub { color:var(--m-muted); }
.nav__links { display:flex; align-items:center; gap:36px; }
.nav__link { color:var(--m-ink2); font-size:15px; transition:color .18s ease; }
.nav__link:hover { color:var(--m-ink); }
.nav__actions { display:flex; align-items:center; gap:12px; }
.nav__toggle {
  display:none; background:none; border:1px solid var(--m-line2);
  border-radius:8px; padding:8px; color:var(--m-ink);
}
.nav__mobile { display:none; }

/* =====================================================================
   HERO
   ===================================================================== */
.hero { position:relative; padding-top:96px; padding-bottom:84px; }
.hero__glow {
  position:absolute; top:0; right:60px; width:480px; height:480px;
  background:radial-gradient(circle,rgba(180,145,63,.13),transparent 66%);
  pointer-events:none;
}
.hero__grid { position:relative; display:grid; grid-template-columns:1.02fr .98fr; gap:60px; align-items:center; }
.hero__title {
  font-family:var(--m-serif); font-weight:400;
  font-size:clamp(46px,5.4vw,72px); letter-spacing:-.02em; line-height:1.02;
  color:var(--m-ink); margin-bottom:24px;
}
.hero__title em { font-style:italic; color:var(--m-gold); }
.hero__lead { font-size:19px; line-height:1.62; color:var(--m-ink2); max-width:500px; margin-bottom:36px; }
.hero__ctas { display:flex; flex-wrap:wrap; gap:14px; margin-bottom:36px; }

.capture { display:flex; flex-direction:column; gap:11px; }
.capture__label { font-size:13px; color:var(--m-muted); letter-spacing:.02em; }
.capture__form { display:flex; gap:10px; max-width:448px; }
.capture__success {
  display:flex; align-items:center; gap:10px; padding:14px 16px;
  border:1px solid rgba(46,140,112,.4); background:var(--m-teal-soft);
  border-radius:9px; max-width:448px; font-size:14px; color:var(--m-ink);
}

/* hero visual */
.hero__visual { position:relative; }
.mini-card {
  position:absolute; top:-28px; right:-6px; width:196px; z-index:2;
  background:var(--m-card); border:1px solid var(--m-line); border-radius:14px; padding:16px;
  box-shadow:0 24px 50px -22px rgba(28,46,68,.28);
  animation:mFloat 6s ease-in-out infinite;
}
.mini-card__label { font-size:11px; color:var(--m-muted); letter-spacing:.05em; text-transform:uppercase; margin-bottom:10px; }
.mini-card__body { display:flex; align-items:center; gap:14px; }
.legend { display:flex; flex-direction:column; gap:7px; }
.legend__item { font-size:11.5px; color:var(--m-ink2); display:flex; align-items:center; }
.legend__item i { width:7px; height:7px; border-radius:2px; margin-right:6px; display:inline-block; }

.dash { background:var(--m-card); border:1px solid var(--m-line); border-radius:18px; padding:28px; box-shadow:0 30px 60px -28px rgba(28,46,68,.32); }
.dash__head { display:flex; justify-content:space-between; align-items:flex-start; margin-bottom:22px; }
.dash__meta { font-size:12.5px; color:var(--m-muted); margin-bottom:7px; }
.dash__balance { font-family:var(--m-serif); font-size:38px; font-weight:500; letter-spacing:-.02em; color:var(--m-ink); }
.dash__head .tag { margin-top:24px; }
.dash__chart { width:100%; height:auto; margin-bottom:18px; }
.dash__foot { display:flex; justify-content:space-between; border-top:1px solid var(--m-line); padding-top:16px; }
.dash__k { font-size:11px; color:var(--m-muted); margin-bottom:4px; }
.dash__v { font-size:15px; font-weight:600; color:var(--m-ink); }
.dash__v--teal { color:var(--m-teal); }

/* trust strip */
.trust { margin-top:64px; padding-top:32px; border-top:1px solid var(--m-line); display:flex; flex-wrap:wrap; align-items:center; gap:14px 40px; }
.trust__label { font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--m-muted); }
.trust__logos { display:flex; flex-wrap:wrap; gap:32px; align-items:center; opacity:.72; font-family:var(--m-serif); font-size:17px; color:var(--m-ink2); }

/* =====================================================================
   SERVICES
   ===================================================================== */
.services { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.card { background:var(--m-card); border:1px solid var(--m-line); border-radius:16px; padding:32px; transition:transform .24s var(--m-ease), border-color .24s ease, box-shadow .24s ease; }
.card:hover { transform:translateY(-5px); border-color:var(--m-line2); box-shadow:0 22px 48px -22px rgba(28,46,68,.22); }
.card__ico {
  width:52px; height:52px; border-radius:12px; background:var(--m-gold-soft);
  border:1px solid var(--m-line2); display:flex; align-items:center; justify-content:center;
  color:var(--m-gold); margin-bottom:24px; transition:all .24s ease;
}
.card:hover .card__ico { color:#fff; background:var(--m-gold); border-color:var(--m-gold); }
.card__title { font-family:var(--m-serif); font-size:22px; font-weight:500; margin-bottom:10px; color:var(--m-ink); }
.card__text { font-size:15px; line-height:1.6; color:var(--m-ink2); margin-bottom:20px; }
.ticks { display:flex; flex-direction:column; gap:9px; }
.ticks li { display:flex; gap:9px; font-size:14px; color:var(--m-ink2); }
.ticks span { color:var(--m-teal); }

/* =====================================================================
   CALCULATOR
   ===================================================================== */
.calc-wrap { background:var(--m-bg2); border-top:1px solid var(--m-line); border-bottom:1px solid var(--m-line); padding-block:88px; margin-top:8px; }
.calc { display:grid; grid-template-columns:1.1fr .9fr; gap:28px; align-items:stretch; }
.calc__inputs { background:var(--m-card); border:1px solid var(--m-line); border-radius:18px; padding:34px; box-shadow:0 20px 44px -28px rgba(28,46,68,.2); }
.field { margin-bottom:30px; }
.field--last { margin-bottom:0; }
.field__head { display:flex; justify-content:space-between; align-items:baseline; margin-bottom:14px; }
.field__label { font-size:15px; font-weight:600; color:var(--m-ink); }
.field__label--block { display:block; margin-bottom:12px; }
.field__value { font-family:var(--m-serif); font-size:22px; color:var(--m-gold); font-weight:500; }
.field__scale { display:flex; justify-content:space-between; font-size:12px; color:var(--m-muted); margin-top:8px; }

.range { -webkit-appearance:none; appearance:none; width:100%; height:6px; border-radius:999px; background:var(--m-bg2); cursor:pointer; }
.range::-webkit-slider-thumb { -webkit-appearance:none; appearance:none; width:24px; height:24px; border-radius:50%; background:var(--m-card); border:2px solid var(--m-gold); box-shadow:0 3px 10px rgba(28,46,68,.22); cursor:pointer; }
.range::-moz-range-thumb { width:24px; height:24px; border:2px solid var(--m-gold); border-radius:50%; background:var(--m-card); cursor:pointer; }

.seg { display:flex; gap:10px; }
.seg__btn {
  flex:1; padding:12px 10px; border-radius:8px; font-size:13.5px; font-weight:600;
  background:var(--m-bg); color:var(--m-ink2); border:1px solid var(--m-line2);
  transition:all .18s ease;
}
.seg__btn.is-active { background:var(--m-ink); color:#fff; border-color:var(--m-ink); }

.calc__result { background:var(--m-ink); border-radius:18px; padding:34px; color:#fff; display:flex; flex-direction:column; align-items:center; text-align:center; position:relative; overflow:hidden; }
.calc__result-glow { position:absolute; top:-60px; right:-40px; width:200px; height:200px; background:radial-gradient(circle,rgba(180,145,63,.35),transparent 70%); }
.calc__eyebrow { font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:rgba(255,255,255,.6); margin-bottom:22px; position:relative; }
.gauge { position:relative; width:180px; height:104px; margin-bottom:8px; }
.gauge svg { width:180px; height:104px; }
#gaugeArc { transition:stroke-dashoffset .5s var(--m-ease); }
.gauge__num { position:absolute; bottom:2px; left:0; right:0; font-family:var(--m-serif); font-size:44px; font-weight:500; line-height:1; }
.calc__tier { font-size:15px; font-weight:600; color:var(--m-gold-hi); margin-bottom:6px; position:relative; }
.calc__msg { font-size:14px; line-height:1.6; color:rgba(255,255,255,.72); margin-bottom:24px; position:relative; }
.calc__cta { width:100%; font-size:15px; padding:14px 24px; position:relative; }
.calc__fine { font-size:11.5px; color:rgba(255,255,255,.45); margin-top:14px; position:relative; line-height:1.5; }

/* =====================================================================
   WHY US
   ===================================================================== */
.why { display:grid; grid-template-columns:.9fr 1.1fr; gap:60px; align-items:center; }
.why__grid { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.feature { background:var(--m-card); border:1px solid var(--m-line); border-radius:14px; padding:26px; }
.feature__ico { color:var(--m-teal); margin-bottom:16px; }
.feature__title { font-size:16px; font-weight:600; margin-bottom:7px; color:var(--m-ink); }
.feature__text { font-size:14px; line-height:1.55; color:var(--m-ink2); }
.why__copy .btn { margin-top:28px; }

/* =====================================================================
   SOCIAL PROOF & STATS
   ===================================================================== */
.proof { background:var(--m-ink); color:#fff; padding-block:88px; }
.proof__grid { display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:center; }
.proof__quote { font-family:var(--m-serif); font-size:26px; line-height:1.42; font-weight:400; color:#fff; margin-bottom:28px; letter-spacing:-.01em; }
.proof__author { display:flex; align-items:center; gap:14px; }
.avatar { width:48px; height:48px; border-radius:50%; background:linear-gradient(145deg,var(--m-gold-hi),var(--m-gold)); display:flex; align-items:center; justify-content:center; font-family:var(--m-serif); font-size:19px; color:#fff; font-weight:500; }
.proof__name { font-size:15px; font-weight:600; color:#fff; }
.proof__role { font-size:13px; color:rgba(255,255,255,.6); }
.stats { display:grid; grid-template-columns:1fr 1fr; gap:1px; background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.1); border-radius:16px; overflow:hidden; }
.stat { background:var(--m-ink); padding:30px 28px; }
.stat__num { font-family:var(--m-serif); font-size:40px; font-weight:500; color:var(--m-gold-hi); line-height:1; margin-bottom:8px; }
.stat__num span { font-size:22px; }
.stat__label { font-size:13.5px; color:rgba(255,255,255,.68); line-height:1.45; }

/* =====================================================================
   BOOKING CTA
   ===================================================================== */
.book { display:grid; grid-template-columns:1.1fr .9fr; gap:56px; align-items:center; background:var(--m-card); border:1px solid var(--m-line); border-radius:22px; padding:56px; box-shadow:0 30px 64px -34px rgba(28,46,68,.28); }
.book__title { font-family:var(--m-serif); font-weight:400; font-size:clamp(32px,3.8vw,50px); letter-spacing:-.02em; line-height:1.05; color:var(--m-ink); margin-bottom:18px; }
.book__copy .section__lead { max-width:460px; margin-bottom:30px; }
.book__list { display:flex; flex-direction:column; gap:16px; }
.book__list li { display:flex; gap:14px; align-items:flex-start; }
.book__list div { display:flex; flex-direction:column; }
.book__list strong { font-size:15px; font-weight:600; color:var(--m-ink); margin-bottom:2px; }
.book__list span:last-child { font-size:14px; color:var(--m-ink2); line-height:1.5; }
.book__tick { width:34px; height:34px; border-radius:8px; background:var(--m-gold-soft); color:var(--m-gold); display:flex; align-items:center; justify-content:center; flex:none; }

/* =====================================================================
   FOOTER
   ===================================================================== */
.footer { background:var(--m-bg2); border-top:1px solid var(--m-line); padding-top:64px; padding-bottom:40px; }
.footer__grid { display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:40px; margin-bottom:48px; }
.footer__brand .brand { margin-bottom:18px; }
.footer__desc { font-size:14px; line-height:1.6; color:var(--m-ink2); max-width:300px; margin-bottom:6px; }
.footer__addr { font-size:13px; color:var(--m-muted); }
.footer__col { display:flex; flex-direction:column; gap:11px; }
.footer__col .nav__link { font-size:14px; }
.footer__h { font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:var(--m-muted); font-weight:600; margin-bottom:5px; }
.footer__legal { padding-top:28px; border-top:1px solid var(--m-line); font-size:12.5px; line-height:1.65; color:var(--m-muted); }
.footer__legal p { margin-bottom:12px; }
.footer__legal strong { color:var(--m-ink2); font-weight:600; }
.footer__link { color:var(--m-gold); text-decoration:underline; }
.footer__copy { color:var(--m-muted); margin-bottom:0; }

/* =====================================================================
   ANIMATIONS
   ===================================================================== */
@keyframes mFloat { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-9px)} }
@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after { animation:none !important; transition:none !important; scroll-behavior:auto !important; }
}

/* =====================================================================
   RESPONSIVE
   ===================================================================== */
@media (max-width:1024px) {
  .why { grid-template-columns:1fr; gap:40px; }
}
@media (max-width:920px) {
  :root { --m-px:24px; }
  .nav__links { display:none; }
  .nav__toggle { display:inline-flex; }
  .nav__mobile.is-open { display:flex; flex-direction:column; gap:16px; padding:20px var(--m-px) 26px; border-top:1px solid var(--m-line); background:var(--m-bg); }
  .nav__mobile.is-open .btn { align-self:flex-start; }
  .hero__grid { grid-template-columns:1fr; gap:40px; }
  .hero__visual { display:none; }
  .services { grid-template-columns:1fr; }
  .calc { grid-template-columns:1fr; }
  .proof__grid { grid-template-columns:1fr; gap:36px; }
  .book { grid-template-columns:1fr; padding:36px; gap:32px; }
  .footer__grid { grid-template-columns:1fr 1fr; gap:32px; }
  .section { padding-block:64px; }
  .calc-wrap,.proof { padding-block:64px; }
}
@media (max-width:560px) {
  .why__grid { grid-template-columns:1fr; }
  .stats { grid-template-columns:1fr; }
  .footer__grid { grid-template-columns:1fr; }
  .capture__form { flex-direction:column; }
  .capture__form .btn { width:100%; }
  .hero__ctas .btn { width:100%; }
}