@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@500;700&family=Jost:wght@400;500;600&display=swap');

:root {
  --cream: #F5F0E6;
  --forest: #1B3327;
  --fuchsia: #8C2858;
  --c1: #1B3327;
  --c2: #3F5A46;
  --c3: #8C2858;
  --c4: #A8447B;
  --c5: #6B1E42;
  --ink: #1B3327;
  --max: 1120px;
}

* { margin:0; padding:0; box-sizing:border-box; }

html { scroll-behavior: smooth; }

body {
  background: var(--cream);
  color: var(--ink);
  font-family: 'Jost', sans-serif;
  font-weight: 400;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, .display {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 700;
  color: var(--forest);
  line-height: 1.12;
}

a { color: inherit; }

.wrap { max-width: var(--max); margin: 0 auto; padding: 0 28px; }

/* Nav */
.nav {
  position: sticky; top: 0; z-index: 50;
  background: rgba(245,240,230,0.92); backdrop-filter: blur(6px);
  border-bottom: 1px solid rgba(27,51,39,0.12);
}
.nav .wrap { display:flex; align-items:center; justify-content:space-between; height:76px; }
.nav .brand { font-family:'Cormorant Garamond',serif; font-weight:700; font-size:22px; color:var(--forest); text-decoration:none; letter-spacing:0.3px; }
.nav ul { list-style:none; display:flex; gap:36px; }
.nav a.link { text-decoration:none; font-size:14px; letter-spacing:1px; text-transform:uppercase; color:var(--forest); opacity:0.75; font-weight:600; transition:opacity .15s; }
.nav a.link:hover, .nav a.link.active { opacity:1; color:var(--fuchsia); }
.nav-toggle { display:none; }

@media (max-width: 760px) {
  .nav ul { position:fixed; top:76px; left:0; right:0; background:var(--cream); flex-direction:column; gap:0; border-bottom:1px solid rgba(27,51,39,0.12); max-height:0; overflow:hidden; transition:max-height .25s ease; }
  .nav ul.open { max-height:400px; }
  .nav ul li { border-top:1px solid rgba(27,51,39,0.08); }
  .nav a.link { display:block; padding:18px 28px; }
  .nav-toggle { display:block; background:none; border:none; font-size:26px; color:var(--forest); cursor:pointer; line-height:1; }
}

/* Hero */
.hero { padding: 90px 0 60px; position:relative; overflow:hidden; }
.hero .ring { position:absolute; border-radius:50%; border:2px solid rgba(27,51,39,0.06); width:640px; height:640px; top:-260px; right:-220px; pointer-events:none; }
.eyebrow { font-size:14px; letter-spacing:4px; text-transform:uppercase; color:var(--fuchsia); font-weight:600; margin-bottom:18px; }
.hero h1 { font-size:clamp(40px, 6vw, 74px); max-width: 820px; }
.hero .sub { font-size:20px; color:var(--forest); opacity:0.75; max-width:640px; margin-top:22px; }
.hero .byline { margin-top:26px; font-size:14px; letter-spacing:2px; text-transform:uppercase; color:var(--fuchsia); font-weight:600; }

.cta-row { margin-top:38px; display:flex; gap:16px; flex-wrap:wrap; }
.btn { display:inline-block; padding:14px 26px; border-radius:3px; font-size:14px; letter-spacing:1px; text-transform:uppercase; font-weight:600; text-decoration:none; transition: transform .15s ease, opacity .15s ease; }
.btn:hover { transform: translateY(-1px); }
.btn-primary { background: var(--forest); color: var(--cream); }
.btn-ghost { background:transparent; color:var(--forest); border:1.5px solid rgba(27,51,39,0.35); }

/* Sections */
section { padding: 70px 0; }
.section-title { font-size: clamp(30px, 4vw, 42px); }
.section-kicker { font-size:13px; letter-spacing:3px; text-transform:uppercase; color:var(--fuchsia); font-weight:600; margin-bottom:14px; }
.lede { font-size:19px; color:var(--forest); opacity:0.8; max-width:740px; margin-top:16px; }

.figure { margin-top: 46px; border-radius:6px; overflow:hidden; border:1px solid rgba(27,51,39,0.12); }
.figure img { display:block; width:100%; height:auto; }
.figure-caption { margin-top:14px; font-size:14px; color:var(--forest); opacity:0.6; }

/* Stage cards */
.stage-grid { display:grid; grid-template-columns: repeat(5, 1fr); gap:2px; margin-top:46px; background:rgba(27,51,39,0.12); border-radius:6px; overflow:hidden; }
.stage-card { background: var(--cream); padding:28px 22px; min-height:230px; display:flex; flex-direction:column; }
.stage-card .n { font-family:'Cormorant Garamond',serif; font-weight:700; font-size:30px; }
.stage-card .t { font-family:'Cormorant Garamond',serif; font-weight:700; font-size:20px; margin-top:8px; color:var(--forest); line-height:1.15; }
.stage-card .w { font-size:11px; letter-spacing:1px; text-transform:uppercase; font-weight:600; margin-top:10px; opacity:0.85; }
.stage-card .d { font-size:14px; color:var(--forest); opacity:0.75; margin-top:12px; line-height:1.5; flex:1; }
.s1 .n, .s1 .w { color:var(--c1); } .s2 .n, .s2 .w { color:var(--c2); } .s3 .n, .s3 .w { color:var(--c3); }
.s4 .n, .s4 .w { color:var(--c4); } .s5 .n, .s5 .w { color:var(--c5); }

@media (max-width: 900px) {
  .stage-grid { grid-template-columns: 1fr; }
}

/* Foundation band */
.foundation { margin-top:2px; background: var(--forest); color:var(--cream); padding:34px 32px; border-radius: 0 0 6px 6px; display:flex; align-items:baseline; gap:26px; flex-wrap:wrap; }
.foundation h3 { color:var(--cream); font-size:26px; }
.foundation p { opacity:0.85; font-size:15px; max-width:640px; }

/* Comparison table */
.compare { margin-top:44px; border-collapse:collapse; width:100%; }
.compare th, .compare td { text-align:left; padding:16px 18px; border-bottom:1px solid rgba(27,51,39,0.14); font-size:15px; vertical-align:top; }
.compare th { font-family:'Cormorant Garamond',serif; font-weight:700; font-size:18px; color:var(--forest); }
.compare td.old { color:var(--forest); opacity:0.55; }
.compare td.new { color:var(--forest); font-weight:500; }

/* Quote / callout */
.callout { margin-top:60px; background:var(--forest); color:var(--cream); border-radius:6px; padding:52px 44px; }
.callout .kicker { font-size:13px; letter-spacing:3px; text-transform:uppercase; color:#7FBF9E; font-weight:600; margin-bottom:16px; }
.callout .q { font-family:'Cormorant Garamond',serif; font-weight:700; font-size: clamp(26px, 3.4vw, 38px); line-height:1.28; max-width:820px; }
.callout p.body-text { margin-top:20px; opacity:0.85; font-size:16px; max-width:720px; }

/* Two-col */
.twocol { display:grid; grid-template-columns: 1fr 1fr; gap:60px; align-items:start; }
@media (max-width: 800px) { .twocol { grid-template-columns:1fr; } }

/* Footer */
footer { border-top:1px solid rgba(27,51,39,0.15); padding:44px 0; margin-top:40px; }
footer .wrap { display:flex; justify-content:space-between; flex-wrap:wrap; gap:14px; font-size:13px; opacity:0.65; }

.divider { height:1px; background:rgba(27,51,39,0.14); margin:20px 0; }

.tag-pill { display:inline-block; font-size:12px; letter-spacing:1px; text-transform:uppercase; font-weight:600; color:var(--fuchsia); border:1px solid rgba(140,40,88,0.35); padding:5px 12px; border-radius:20px; }