:root {
  --cream:      #F6F1E7;
  --cream-2:    #FBF8F2;
  --purple:     #2C1B45;
  --purple-2:   #4B3568;
  --purple-tint:#EFEAF3;
  --gold:       #B08D3E;
  --gold-lt:    #D4AF6A;
  --ink:        #241933;
  --gray:       #6E6A61;
  --border:     rgba(44,27,69,0.12);
  --white:      #FFFFFF;
  --serif:      'IBM Plex Serif', Georgia, serif;
  --sans:       'IBM Plex Sans', system-ui, sans-serif;
}

*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; }
body {
  background: var(--cream);
  color: var(--ink);
  font-family: var(--sans);
  font-size: 17px;
  line-height: 1.7;
}
a { color:inherit; text-decoration:none; }
ul { list-style:none; }
img { max-width:100%; display:block; }

.wrap { max-width:1180px; margin:0 auto; padding:0 clamp(24px,5vw,64px); }
.sp   { padding:clamp(64px,9vw,108px) 0; }
.sp-sm{ padding:clamp(40px,6vw,64px) 0; }

.eyebrow {
  display:block; font-size:0.76rem; font-weight:700;
  letter-spacing:0.22em; text-transform:uppercase; color:var(--gold);
  margin-bottom:14px;
}
.gline { width:52px; height:2px; background:var(--gold); display:block; margin-bottom:22px; }
.h1 { font-family:var(--serif); font-weight:300; line-height:1.1; color:var(--purple); font-size:clamp(2.4rem,5vw,3.8rem); }
.h2 { font-family:var(--serif); font-weight:300; line-height:1.15; color:var(--purple); font-size:clamp(2rem,4vw,2.9rem); }
.h3 { font-family:var(--serif); font-weight:400; color:var(--purple); font-size:1.4rem; }
.h1 em, .h2 em { font-style:italic; color:var(--gold); }
.lede { font-size:1.15rem; color:var(--purple-2); max-width:640px; }
.body { color:var(--ink); }
.muted { color:var(--gray); }

.btn {
  display:inline-flex; align-items:center; gap:10px;
  padding:15px 30px; font-size:0.8rem; font-weight:600;
  letter-spacing:0.14em; text-transform:uppercase; border-radius:2px;
  border:1.5px solid var(--purple); color:var(--purple);
  background:transparent; cursor:pointer; transition:all 0.2s ease;
}
.btn:hover { background:var(--purple); color:var(--cream-2); }
.btn-gold { border-color:var(--gold); background:var(--gold); color:var(--white); }
.btn-gold:hover { background:var(--gold-lt); border-color:var(--gold-lt); color:var(--white); }
.btn-ghost { border-color:var(--purple-2); color:var(--purple-2); background:var(--white); }
.btn-ghost:hover { border-color:var(--purple); background:var(--purple); color:var(--cream-2); }

nav {
  position:sticky; top:0; z-index:100;
  background:var(--cream-2); border-bottom:1px solid var(--border);
}
.nav-inner { display:flex; align-items:center; justify-content:space-between; padding:18px clamp(24px,5vw,64px); max-width:1180px; margin:0 auto; }
.nav-brand { font-family:var(--serif); font-size:1.2rem; font-weight:500; color:var(--purple); }
.nav-brand span { color:var(--gold); font-style:italic; }
.nav-links { display:flex; align-items:center; gap:30px; }
.nav-links a { font-size:0.85rem; font-weight:500; color:var(--purple-2); letter-spacing:0.02em; transition:color 0.2s; }
.nav-links a:hover, .nav-links a.on { color:var(--gold); }
.nav-cta { border:1px solid var(--gold); color:var(--gold); padding:9px 20px; font-size:0.78rem; font-weight:600; letter-spacing:0.1em; text-transform:uppercase; transition:all 0.2s; }
.nav-cta:hover { background:var(--gold); color:var(--white); }
.nav-toggle { display:none; }

footer { background:var(--purple); color:var(--cream); padding:64px 0 28px; }
.footer-grid { display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:48px; padding-bottom:40px; border-bottom:1px solid rgba(246,241,231,0.14); }
.footer-brand { font-family:var(--serif); font-size:1.3rem; margin-bottom:12px; }
.footer-brand span { color:var(--gold-lt); font-style:italic; }
.footer-blurb { font-size:0.92rem; color:rgba(246,241,231,0.72); max-width:280px; }
.footer-head { font-size:0.76rem; font-weight:700; letter-spacing:0.18em; text-transform:uppercase; color:var(--gold-lt); margin-bottom:16px; }
.footer-links { display:flex; flex-direction:column; gap:10px; }
.footer-links a { font-size:0.92rem; color:rgba(246,241,231,0.82); transition:color 0.2s; }
.footer-links a:hover { color:var(--gold-lt); }
.footer-bottom { display:flex; flex-wrap:wrap; justify-content:space-between; gap:12px; padding-top:24px; font-size:0.8rem; color:rgba(246,241,231,0.6); }
.footer-legal a { color:rgba(246,241,231,0.6); transition:color 0.2s; }
.footer-legal a:hover { color:var(--gold-lt); }
.flsep { margin:0 8px; opacity:0.4; }

.card { background:var(--white); border:1px solid var(--border); border-radius:6px; padding:32px 28px; box-shadow:0 1px 2px rgba(44,27,69,0.04), 0 8px 24px rgba(44,27,69,0.05); }
.grid-2 { display:grid; grid-template-columns:1fr 1fr; gap:40px; }
.grid-3 { display:grid; grid-template-columns:repeat(3,1fr); gap:28px; }
.grid-4 { display:grid; grid-template-columns:repeat(4,1fr); gap:24px; }

.legacy-row { display:flex; flex-direction:column; }
.legacy-item { display:flex; gap:28px; padding:26px 0; border-bottom:1px solid var(--border); }
.legacy-item:last-child { border-bottom:none; }
.legacy-letter { font-family:var(--serif); font-size:2.8rem; color:var(--gold); font-weight:300; min-width:64px; line-height:1; }
.legacy-word { font-family:var(--serif); font-size:1.35rem; color:var(--purple); margin-bottom:6px; }

.journey { display:flex; flex-wrap:wrap; align-items:stretch; gap:0; }
.journey-step { flex:1; min-width:180px; padding:24px 20px; border:1px solid var(--border); background:var(--white); position:relative; }
.journey-step .num { font-family:var(--serif); font-size:0.85rem; color:var(--gold); font-weight:600; margin-bottom:8px; }
.journey-arrow { display:flex; align-items:center; justify-content:center; color:var(--gold); font-size:1.2rem; padding:0 6px; }

section + section { border-top:none; }
.alt { background:var(--white); }

@media (max-width:900px) {
  .grid-2, .grid-3, .grid-4 { grid-template-columns:1fr; }
  .footer-grid { grid-template-columns:1fr; gap:32px; }
  .nav-inner { flex-wrap:wrap; gap:12px; }
  .nav-links { gap:16px; flex-wrap:wrap; order:3; width:100%; padding-top:10px; border-top:1px solid var(--border); }
  .nav-links a { font-size:0.8rem; }
  .journey { flex-direction:column; }
  .journey-arrow { transform:rotate(90deg); padding:6px 0; }
}