/* ================================================================
   Vitality Strategy Group — shared stylesheet
   Palette: cream #F7F4EE · navy #12172B · gold #C89B3C · rose #B76E79
   Type: Fraunces (serif headings) · Inter (body)
================================================================ */

html { scroll-behavior:smooth; }
* { box-sizing:border-box; }
body { margin:0; background:#F7F4EE; color:#12172B; font-family:'Inter',sans-serif; -webkit-font-smoothing:antialiased; }
a { color:#12172B; text-decoration:none; }
a:hover { color:#C89B3C; }
h1, h2, h3, h4 { font-family:'Fraunces',serif; font-weight:500; letter-spacing:-0.01em; margin:0; }
p { margin:0; }

/* ---- form fields (kept for compatibility on any future forms) ---- */
input:focus, select:focus, button:focus { outline:none; border-bottom-color:#C89B3C !important; }
input::placeholder { color:rgba(18,23,43,0.35); }
.field { border:none; border-bottom:1px solid rgba(18,23,43,0.3); background:transparent; padding:6px 0 10px; font-family:'Inter',sans-serif; font-size:15px; color:#12172B; border-radius:0; width:100%; }
select.field { appearance:none; -webkit-appearance:none; cursor:pointer; }
.lbl { font-size:10px; font-weight:600; letter-spacing:0.2em; }

/* ---- buttons ---- */
.btn { display:inline-block; text-align:center; background:#C89B3C; color:#12172B; border:none; font-family:'Inter',sans-serif; font-size:12px; font-weight:600; letter-spacing:0.22em; padding:20px 44px; cursor:pointer; border-radius:0; transition:background .15s, color .15s, border-color .15s; text-transform:uppercase; }
.btn:hover { background:#12172B; color:#F7F4EE !important; }
.btn:disabled { opacity:0.6; cursor:default; }
.btn-sm { padding:14px 26px; }
.btn-ghost { background:transparent; color:#12172B; border:1px solid #12172B; padding:19px 43px; }
.btn-ghost:hover { background:#12172B; color:#F7F4EE !important; }
.btn-ghost.btn-sm { padding:13px 25px; }
.btn-navy { background:#12172B; color:#F7F4EE; }
.btn-navy:hover { background:#C89B3C; color:#12172B !important; }
.btn-invert { background:#F7F4EE; color:#12172B; }
.btn-invert:hover { background:#C89B3C; color:#12172B !important; }

/* ---- layout primitives ---- */
.wrap { max-width:1440px; margin:0 auto; }
.eyebrow { font-size:11px; font-weight:600; letter-spacing:0.24em; color:#C89B3C; text-transform:uppercase; }
.hairline { height:1px; background:rgba(200,155,60,0.45); }
section { padding:104px 72px; }
.sec-divide { border-top:1px solid rgba(200,155,60,0.28); }

/* ---- header / nav (sticky) ---- */
header.site { display:flex; align-items:center; justify-content:space-between; gap:24px; padding:22px 72px; border-bottom:1px solid rgba(200,155,60,0.45); background:rgba(247,244,238,0.94); backdrop-filter:saturate(1.1) blur(6px); -webkit-backdrop-filter:saturate(1.1) blur(6px); position:sticky; top:0; z-index:50; }
.brand { font-family:'Fraunces',serif; font-weight:500; font-size:17px; letter-spacing:0.22em; color:#12172B; white-space:nowrap; }
nav.nav { display:flex; align-items:center; gap:28px; }
.navlink { font-size:11px; font-weight:600; letter-spacing:0.2em; text-transform:uppercase; color:#3C4152; }
.navlink:hover, .navlink.on { color:#C89B3C; }

/* ---- hero ---- */
.hero { display:grid; grid-template-columns:1fr 360px; gap:72px; padding:88px 72px 104px; align-items:center; }
.hero h1 { font-size:66px; line-height:1.05; margin:22px 0 26px; text-wrap:balance; }
.lead { font-size:18px; line-height:1.65; color:#3C4152; max-width:56ch; }
.cta-row { display:flex; align-items:center; gap:18px; flex-wrap:wrap; margin-top:40px; }
.cta-tertiary { font-size:12px; letter-spacing:0.16em; text-transform:uppercase; color:#5B5F70; margin-top:22px; display:inline-block; }
.cta-tertiary:hover { color:#C89B3C; }
.hero-brand { border:1px solid rgba(200,155,60,0.5); background:#FBF9F4; padding:56px 40px; text-align:center; }
.hero-brand img { width:100%; max-width:220px; height:auto; display:block; margin:0 auto; }

/* ---- belief / problem section ---- */
.belief { max-width:760px; margin:0 auto; text-align:center; }
.belief h2 { font-size:44px; line-height:1.12; margin:18px 0 30px; }
.belief p { font-size:17px; line-height:1.75; color:#3C4152; max-width:62ch; margin:0 auto 22px; }
.emph { font-family:'Fraunces',serif; font-style:italic; font-weight:500; font-size:24px; color:#C89B3C; line-height:1.4; }
.gap-tag { display:inline-block; font-size:11px; font-weight:600; letter-spacing:0.24em; color:#12172B; border:1px solid rgba(18,23,43,0.4); padding:6px 14px; margin-top:8px; }

/* ---- Who VSG is for ---- */
.who-head { max-width:800px; margin:0 auto 44px; text-align:center; }
.who-head h2 { font-size:38px; line-height:1.15; margin:14px 0 12px; }
.who-head p { font-size:15px; color:#5B5F70; letter-spacing:0.02em; }
.who-list { max-width:760px; margin:0 auto; list-style:none; padding:0; display:grid; gap:22px; }
.who-list li { padding-left:34px; position:relative; font-size:16.5px; line-height:1.6; color:#12172B; }
.who-list li::before { content:''; position:absolute; left:0; top:12px; width:18px; height:1px; background:#C89B3C; }
.who-list li.final { font-family:'Fraunces',serif; font-style:italic; font-size:22px; color:#12172B; padding-top:22px; border-top:1px solid rgba(200,155,60,0.4); margin-top:10px; }
.who-list li.final::before { display:none; }

/* ---- VSG Access panel ---- */
.access { background:#12172B; color:#F7F4EE; padding:88px 72px; }
.access-inner { max-width:1200px; margin:0 auto; display:grid; grid-template-columns:1.1fr 1fr; gap:64px; align-items:center; }
.access .eyebrow { color:#C89B3C; }
.access h2 { color:#F7F4EE; font-size:44px; line-height:1.1; margin:16px 0 22px; }
.access .subhead { font-size:17px; line-height:1.65; color:rgba(247,244,238,0.78); max-width:52ch; margin-bottom:36px; }
.price-row { display:flex; align-items:baseline; gap:14px; margin-bottom:6px; }
.price-row .price { font-family:'Fraunces',serif; font-size:52px; font-weight:500; color:#F7F4EE; letter-spacing:-0.01em; }
.price-row .per { font-size:14px; color:rgba(247,244,238,0.7); letter-spacing:0.02em; }
.founding-tag { display:inline-block; font-size:10px; font-weight:600; letter-spacing:0.24em; color:#C89B3C; border:1px solid rgba(200,155,60,0.6); padding:6px 12px; margin-bottom:28px; }
.discount-callout { font-family:'Fraunces',serif; font-size:22px; line-height:1.35; color:#C89B3C; margin:26px 0 22px; padding-top:26px; border-top:1px solid rgba(200,155,60,0.35); }
.access ul.perks { list-style:none; padding:0; margin:0 0 34px; display:grid; gap:12px; }
.access ul.perks li { position:relative; padding-left:24px; font-size:14.5px; color:rgba(247,244,238,0.85); line-height:1.55; }
.access ul.perks li::before { content:''; position:absolute; left:0; top:10px; width:12px; height:1px; background:#C89B3C; }
.access .cta-row { margin-top:0; }
.access .cta-row .btn-invert { color:#12172B !important; }

/* ---- Personalized support (3 categories) ---- */
.support-head { text-align:center; max-width:720px; margin:0 auto 56px; }
.support-head h2 { font-size:40px; line-height:1.12; margin:14px 0 22px; }
.support-head p { font-size:16.5px; line-height:1.65; color:#3C4152; max-width:56ch; margin:0 auto; }
.support-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:36px; max-width:1200px; margin:0 auto; }
.support-card { border:1px solid rgba(200,155,60,0.45); background:#FBF9F4; padding:36px 30px; display:flex; flex-direction:column; }
.support-card .cat { font-size:10px; font-weight:600; letter-spacing:0.26em; color:#C89B3C; }
.support-card h3 { font-size:24px; line-height:1.2; margin:16px 0 6px; }
.support-card .starting { font-family:'Fraunces',serif; font-size:15px; color:#5B5F70; margin-bottom:20px; }
.support-card p { font-size:14.5px; line-height:1.6; color:#3C4152; flex:1; }
.support-foot { text-align:center; margin-top:48px; }
.support-foot .fineprint { display:block; font-size:12.5px; color:#5B5F70; margin-top:20px; letter-spacing:0.02em; }

/* ---- Discovery call section ---- */
.discover { max-width:820px; margin:0 auto; text-align:center; }
.discover h2 { font-size:40px; line-height:1.12; margin:14px 0 22px; }
.discover p { font-size:16.5px; line-height:1.7; color:#3C4152; max-width:56ch; margin:0 auto 14px; }
.discover .meta { font-size:12px; letter-spacing:0.2em; text-transform:uppercase; color:#5B5F70; margin:26px 0 30px; }

/* ---- Founder section ---- */
.founder { display:grid; grid-template-columns:400px 1fr; gap:72px; align-items:center; max-width:1200px; margin:0 auto; }
.founder-photo img { width:100%; height:auto; aspect-ratio:4/5; object-fit:cover; display:block; }
.founder h2 { font-size:40px; margin:14px 0 26px; }
.founder p { font-size:16px; line-height:1.72; color:#3C4152; max-width:60ch; margin-bottom:20px; }
.cred { font-size:13.5px; line-height:1.65; color:#5B5F70; border-left:2px solid rgba(200,155,60,0.6); padding-left:18px; max-width:60ch; margin-top:28px; }

/* ---- Services page ---- */
.page-hero { padding:96px 72px 64px; }
.page-hero .eyebrow { display:block; margin-bottom:14px; }
.page-hero h1 { font-family:'Fraunces',serif; font-weight:500; font-size:60px; line-height:1.06; letter-spacing:-0.01em; margin:0 0 22px; text-wrap:balance; }
.page-hero p { font-size:18px; line-height:1.65; color:#3C4152; max-width:62ch; }
.svc-group { margin-bottom:80px; }
.svc-group .group-eyebrow { font-size:11px; font-weight:600; letter-spacing:0.28em; color:#C89B3C; text-transform:uppercase; display:block; margin-bottom:10px; }
.svc-group .group-title { font-family:'Fraunces',serif; font-weight:500; font-size:38px; line-height:1.1; margin:0 0 6px; letter-spacing:-0.01em; color:#12172B; }
.svc-group .group-lede { font-size:14.5px; line-height:1.55; color:#5B5F70; max-width:52ch; margin:0 0 22px; }
.svc-group .group-hairline { height:1px; background:rgba(200,155,60,0.5); margin-bottom:6px; }
.svc-row { display:grid; grid-template-columns:1fr 260px; gap:44px; padding:28px 0; border-bottom:1px solid rgba(200,155,60,0.28); align-items:start; }
.svc-row:last-child { border-bottom:none; }
.svc-row h3 { font-family:'Fraunces',serif; font-weight:500; font-size:24px; line-height:1.2; margin:0 0 10px; }
.svc-row p { font-size:14.5px; line-height:1.6; color:#3C4152; max-width:60ch; }
.svc-row .best-for { font-size:12px; letter-spacing:0.2em; text-transform:uppercase; color:#5B5F70; margin-bottom:8px; }
.price-block { text-align:right; }
.price-block .full { font-family:'Fraunces',serif; font-size:28px; color:#12172B; letter-spacing:-0.01em; }
.price-block .member { display:block; font-size:12px; color:#5B5F70; margin-top:6px; letter-spacing:0.02em; }
.price-block .member strong { color:#C89B3C; font-weight:600; }
.svc-cta-row { display:flex; justify-content:flex-end; margin-top:12px; }

.access-cta { border:1px solid rgba(200,155,60,0.5); background:#FBF9F4; padding:44px 40px; margin-top:16px; display:grid; grid-template-columns:1fr auto; gap:32px; align-items:center; }
.access-cta h3 { font-family:'Fraunces',serif; font-size:24px; margin:0 0 8px; font-weight:500; }
.access-cta p { font-size:14.5px; color:#3C4152; margin:0; line-height:1.5; }

/* ---- About page ---- */
.about-hero { padding:88px 72px 56px; display:grid; grid-template-columns:1fr 380px; gap:64px; align-items:end; }
.about-hero h1 { font-family:'Fraunces',serif; font-weight:500; font-size:60px; line-height:1.05; letter-spacing:-0.01em; margin:16px 0 20px; text-wrap:balance; }
.about-hero p.lede { font-size:18px; line-height:1.65; color:#3C4152; max-width:52ch; }
.about-hero .about-photo { }
.about-hero .about-photo img { width:100%; height:auto; aspect-ratio:4/5; object-fit:cover; display:block; }
.about-hero .about-photo .cap { display:flex; justify-content:space-between; align-items:baseline; margin-top:14px; }
.about-hero .about-photo .cap .role-cap { font-size:10px; font-weight:600; letter-spacing:0.22em; color:#5B5F70; text-transform:uppercase; }
.about-hero .about-photo .cap .mark { font-family:'Fraunces',serif; font-size:13px; color:#C89B3C; }

.about-body { padding:32px 72px 104px; }
.about-inner { max-width:760px; margin:0 auto; }
.about-inner .bg { font-size:15px; line-height:1.75; color:#5B5F70; letter-spacing:0.005em; padding:26px 26px; border:1px solid rgba(200,155,60,0.4); background:#FBF9F4; margin-bottom:48px; }
.about-inner h2 { font-family:'Fraunces',serif; font-weight:500; font-size:40px; line-height:1.15; letter-spacing:-0.01em; margin:8px 0 22px; }
.about-inner p.narr { font-size:17px; line-height:1.75; color:#12172B; margin:0 0 22px; max-width:60ch; }
.about-inner .closing { font-family:'Fraunces',serif; font-style:italic; font-weight:500; font-size:24px; line-height:1.45; color:#C89B3C; margin-top:42px; padding-top:28px; border-top:1px solid rgba(200,155,60,0.5); max-width:60ch; }

/* ---- Services page: Testimonials block ---- */
.testi-section { padding:104px 72px; border-top:1px solid rgba(200,155,60,0.4); background:#FBF9F4; }

/* ---- Book page ---- */
.book-body { max-width:760px; margin:0 auto; text-align:center; }
.book-body h1 { font-family:'Fraunces',serif; font-weight:500; font-size:56px; line-height:1.06; margin:14px 0 22px; }
.book-body p.lead { font-size:17px; line-height:1.7; color:#3C4152; max-width:56ch; margin:0 auto 32px; }
.book-card { border:1px solid rgba(200,155,60,0.5); background:#FBF9F4; padding:44px 40px; margin:32px auto 0; max-width:640px; text-align:left; }
.book-card h3 { font-family:'Fraunces',serif; font-size:22px; margin:0 0 10px; font-weight:500; }
.book-card p { font-size:14.5px; color:#3C4152; line-height:1.6; margin-bottom:20px; }
.book-card .price-note { font-size:12.5px; color:#5B5F70; letter-spacing:0.02em; }

/* ---- Testimonials ---- */
.testi-head { text-align:center; max-width:720px; margin:0 auto 56px; }
.testi-head h2 { font-size:40px; line-height:1.12; margin:14px 0 18px; }
.testi-head p { font-size:15.5px; color:#5B5F70; letter-spacing:0.02em; }
.testi-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:36px; max-width:1200px; margin:0 auto; }
.testi { border-top:1px solid rgba(200,155,60,0.55); padding:26px 4px 0; display:flex; flex-direction:column; }
.testi blockquote { font-family:'Fraunces',serif; font-style:italic; font-weight:400; font-size:17px; line-height:1.6; color:#12172B; margin:0 0 26px; letter-spacing:-0.005em; }
.testi blockquote::before { content:'\201C'; font-family:'Fraunces',serif; font-style:normal; font-size:38px; line-height:0; color:#C89B3C; margin-right:6px; vertical-align:-18px; }
.testi .who { margin-top:auto; }
.testi .who .name { font-size:11px; font-weight:600; letter-spacing:0.22em; text-transform:uppercase; color:#12172B; }
.testi .who .role { display:block; font-family:'Fraunces',serif; font-style:italic; font-size:13.5px; color:#5B5F70; margin-top:4px; letter-spacing:0.01em; }

/* ---- Services page sidebar layout ---- */
.svc-layout { display:grid; grid-template-columns: 1fr 300px; gap:64px; align-items:start; max-width:1240px; margin:0 auto; }
.svc-main { min-width:0; }
.svc-sidebar { position:sticky; top:92px; display:flex; flex-direction:column; gap:0; }
.side-block { border-top:1px solid rgba(200,155,60,0.5); padding:22px 0 26px; }
.side-block:first-child { border-top:none; padding-top:0; }
.side-block .side-eyebrow { font-size:10px; font-weight:600; letter-spacing:0.26em; color:#C89B3C; text-transform:uppercase; margin-bottom:14px; }
.side-block h4 { font-family:'Fraunces',serif; font-weight:500; font-size:20px; line-height:1.2; margin:0 0 12px; letter-spacing:-0.005em; }
.side-block p { font-size:13.5px; line-height:1.6; color:#3C4152; margin:0 0 12px; }
.side-block ol.steps { list-style:none; counter-reset:step; padding:0; margin:0; display:grid; gap:14px; }
.side-block ol.steps li { counter-increment:step; padding-left:34px; position:relative; font-size:13.5px; line-height:1.5; color:#12172B; }
.side-block ol.steps li::before { content:counter(step,decimal-leading-zero); position:absolute; left:0; top:1px; font-family:'Fraunces',serif; font-size:13px; color:#C89B3C; letter-spacing:0.02em; }
.side-block ol.steps li strong { display:block; font-weight:600; font-size:12.5px; letter-spacing:0.02em; margin-bottom:2px; }
.side-block .faq { display:grid; gap:14px; }
.side-block .faq dt { font-size:12.5px; font-weight:600; color:#12172B; line-height:1.4; }
.side-block .faq dd { margin:4px 0 0; font-size:13px; line-height:1.55; color:#5B5F70; }
.side-mini-access { background:#12172B; color:#F7F4EE; padding:22px 22px 24px; margin-top:22px; border-top:none; }
.side-mini-access .side-eyebrow { color:#C89B3C; }
.side-mini-access h4 { color:#F7F4EE; font-size:22px; margin-bottom:6px; }
.side-mini-access .price { font-family:'Fraunces',serif; font-size:30px; color:#F7F4EE; letter-spacing:-0.01em; }
.side-mini-access .per { font-size:12px; color:rgba(247,244,238,0.65); margin-left:4px; }
.side-mini-access p { color:rgba(247,244,238,0.75); font-size:12.5px; margin:8px 0 16px; }
.side-mini-access .btn { display:block; width:100%; padding:14px 12px; font-size:11px; letter-spacing:0.2em; }

/* ---- Book page pricing snapshot ---- */
.book-preview { max-width:640px; margin:36px auto 8px; border-top:1px solid rgba(200,155,60,0.5); padding-top:26px; }
.book-preview .side-eyebrow { font-size:10px; font-weight:600; letter-spacing:0.26em; color:#C89B3C; text-align:center; margin-bottom:22px; text-transform:uppercase; }
.book-preview .rows { display:grid; gap:12px; text-align:left; }
.book-preview .row { display:flex; justify-content:space-between; align-items:baseline; gap:16px; padding:12px 0; border-bottom:1px solid rgba(200,155,60,0.28); }
.book-preview .row:last-child { border-bottom:none; }
.book-preview .row .name { font-family:'Fraunces',serif; font-size:16px; color:#12172B; }
.book-preview .row .from { font-size:12.5px; color:#5B5F70; letter-spacing:0.02em; white-space:nowrap; }
.book-preview .row .from strong { font-family:'Fraunces',serif; font-weight:500; font-size:15px; color:#12172B; letter-spacing:0; }
.book-preview .footnote { text-align:center; font-size:12px; color:#5B5F70; margin-top:22px; line-height:1.55; }
.book-preview .footnote a { color:#C89B3C; }

/* ---- footer ---- */
footer.site { display:flex; justify-content:space-between; align-items:center; gap:16px; padding:26px 72px; border-top:1px solid rgba(200,155,60,0.45); font-size:11px; letter-spacing:0.12em; color:#5B5F70; }
footer.site a { color:#5B5F70; }
footer.site .tag { font-family:'Fraunces',serif; font-style:italic; font-size:13px; letter-spacing:0.06em; color:#C89B3C; text-transform:none; }

/* ============ RESPONSIVE ============ */
@media (max-width: 1100px) {
  section { padding:72px 32px; }
  header.site, footer.site { padding-left:32px; padding-right:32px; }
  .hero { grid-template-columns:1fr; padding:56px 32px 72px; gap:48px; }
  .hero h1 { font-size:48px; }
  .hero-brand { max-width:420px; padding:48px 36px; }
  .access { padding:72px 32px; }
  .access-inner { grid-template-columns:1fr; gap:44px; }
  .access h2 { font-size:36px; }
  .support-grid { grid-template-columns:1fr; gap:24px; max-width:520px; }
  .founder { grid-template-columns:1fr; gap:40px; }
  .founder-photo { max-width:360px; }
  .belief h2 { font-size:34px; }
  .page-hero { padding:64px 32px 40px; }
  .page-hero h1 { font-size:44px; }
  .svc-row { grid-template-columns:1fr; gap:14px; }
  .price-block { text-align:left; }
  .svc-cta-row { justify-content:flex-start; }
  .access-cta { grid-template-columns:1fr; gap:22px; }
  .testi-grid { grid-template-columns:1fr 1fr; gap:32px; }
  .svc-layout { grid-template-columns:1fr; gap:44px; }
  .svc-sidebar { position:static; }
  .about-hero { grid-template-columns:1fr; padding:56px 32px 40px; gap:36px; }
  .about-hero h1 { font-size:44px; }
  .about-hero .about-photo { max-width:360px; }
  .about-body { padding:24px 32px 72px; }
  .testi-section { padding:72px 32px; }
  footer.site { flex-direction:column; gap:10px; text-align:center; }
}
@media (max-width: 640px) {
  .hero h1 { font-size:36px; }
  .belief h2, .who-head h2, .support-head h2, .discover h2, .founder h2 { font-size:28px; }
  .access h2 { font-size:30px; }
  .book-body h1 { font-size:38px; }
  .book-card, .access-cta { padding:28px 22px; }
  header.site { flex-wrap:wrap; justify-content:center; gap:14px; padding:20px 24px; }
  nav.nav { gap:16px; flex-wrap:wrap; justify-content:center; }
  .cta-row { flex-direction:column; align-items:stretch; }
  .cta-row .btn { width:100%; }
  section { padding:56px 22px; }
  .access { padding:56px 22px; }
  .support-head, .discover, .who-head, .who-list, .belief { padding:0 4px; }
  .price-row .price { font-size:44px; }
  .support-foot .btn { width:100%; }
  .svc-row .price-block .full { font-size:24px; }
  .testi-grid { grid-template-columns:1fr; gap:24px; }
  .testi blockquote { font-size:16px; }
  .svc-group .group-title { font-size:28px; }
  .svc-group { margin-bottom:56px; }
  .book-preview .row { flex-wrap:wrap; }
  .about-hero h1 { font-size:36px; }
  .about-inner h2 { font-size:30px; }
  .about-inner .closing { font-size:20px; }
  .testi-section { padding:56px 22px; }
  header.site { padding:16px 22px; gap:14px; }
}
