/* ═══════════════════════════════════════════════════════════════
   HEIRLOOM HERITAGE CO. — style.css  (shared, all pages)
   ═══════════════════════════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;0,600;1,300;1,400;1,500&family=Cormorant+SC:wght@300;400;500&family=EB+Garamond:ital,wght@0,400;0,500;1,400&display=swap');

/* RESET */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; font-size: 18px; }

/* TOKENS */
:root {
  --parchment:    #f7f3ec;
  --parchment-dk: #ede6d8;
  --ink:          #1a1714;
  --ink-soft:     #3d3830;
  --ink-muted:    #6b6255;
  --navy:         #1e2d4a;
  --navy-lt:      #2a3f66;
  --gold:         #b08d57;
  --gold-lt:      #c9a96e;
  --gold-pale:    #e8d9bf;
  --rule:         rgba(176,141,87,0.32);
  --serif:        'Cormorant Garamond','EB Garamond',Georgia,serif;
  --sc:           'Cormorant SC','Cormorant Garamond',serif;
  --sans:         'Arial','Helvetica Neue',sans-serif;
}

/* BASE */
body { font-family: var(--serif); background: var(--parchment); color: var(--ink); overflow-x: hidden; -webkit-font-smoothing: antialiased; }
body::before {
  content:''; position:fixed; inset:0; pointer-events:none; z-index:900; opacity:.6;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='400' height='400'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='400' height='400' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E");
}

/* ANIMATIONS */
@keyframes fadeUp { from{opacity:0;transform:translateY(22px)} to{opacity:1;transform:translateY(0)} }
@keyframes fadeIn { from{opacity:0} to{opacity:1} }
@keyframes scrollPulse { 0%,100%{transform:scaleY(1);opacity:.7} 50%{transform:scaleY(1.3);opacity:1} }

/* ── NAV ─────────────────────────────────────────────────────── */
nav {
  position:fixed; top:0; left:0; right:0; z-index:200;
  display:flex; align-items:center; justify-content:space-between; gap:1.5rem;
  padding:1.1rem 3rem;
  background:rgba(247,243,236,.95); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
  border-bottom:1px solid var(--rule);
  transition:padding .3s ease, box-shadow .3s ease;
}
nav.scrolled { padding:.65rem 3rem; box-shadow:0 2px 24px rgba(30,45,74,.07); }

.nav-logo { font-family:var(--sc); font-weight:400; font-size:1rem; letter-spacing:.12em; color:var(--navy); text-decoration:none; text-transform:uppercase; white-space:nowrap; flex-shrink:0; }
.nav-logo span { color:var(--gold); }

.nav-links { display:flex; gap:2rem; list-style:none; align-items:center; flex:1; justify-content:center; }
.nav-links a { font-family:var(--sc); font-size:.68rem; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-soft); text-decoration:none; transition:color .2s; position:relative; white-space:nowrap; }
.nav-links a::after { content:''; position:absolute; bottom:-3px; left:0; right:0; height:1px; background:var(--gold); transform:scaleX(0); transform-origin:left; transition:transform .25s ease; }
.nav-links a:hover, .nav-links a.active { color:var(--gold); }
.nav-links a:hover::after, .nav-links a.active::after { transform:scaleX(1); }

.nav-cta { font-family:var(--sc); font-size:.68rem; letter-spacing:.14em; text-transform:uppercase; color:var(--navy); border:1px solid var(--navy); padding:.45rem 1.2rem; text-decoration:none; transition:all .25s; white-space:nowrap; flex-shrink:0; }
.nav-cta:hover { background:var(--navy); color:#f7f3ec; }
.nav-cta .cta-short { display:none; }

.nav-hamburger { display:none; flex-direction:column; gap:5px; cursor:pointer; background:none; border:none; padding:4px; flex-shrink:0; }
.nav-hamburger span { display:block; width:22px; height:1.5px; background:var(--navy); transition:all .3s ease; transform-origin:center; }
.nav-hamburger.open span:nth-child(1) { transform:translateY(6.5px) rotate(45deg); }
.nav-hamburger.open span:nth-child(2) { opacity:0; transform:scaleX(0); }
.nav-hamburger.open span:nth-child(3) { transform:translateY(-6.5px) rotate(-45deg); }

.nav-drawer { position:fixed; inset:0; background:rgba(247,243,236,.98); z-index:190; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2.2rem; opacity:0; pointer-events:none; transition:opacity .3s ease; }
.nav-drawer.open { opacity:1; pointer-events:auto; }
.nav-drawer a { font-family:var(--sc); font-size:1.1rem; letter-spacing:.22em; text-transform:uppercase; color:var(--navy); text-decoration:none; transition:color .2s; }
.nav-drawer a:hover { color:var(--gold); }
.nav-drawer .drawer-cta { margin-top:1rem; border:1px solid var(--navy); padding:.65rem 2rem; font-size:.82rem; }
.nav-drawer .drawer-cta:hover { background:var(--navy); color:#f7f3ec; }

/* ── HERO (homepage) ─────────────────────────────────────────── */
#hero { min-height:100vh; display:grid; place-items:center; text-align:center; padding:9rem 2rem 6rem; position:relative; overflow:hidden; background-color:#f7f3ec; }
.hero-bg-ornament { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:700px; height:700px; border-radius:50%; background:radial-gradient(ellipse,rgba(176,141,87,.09) 0%,transparent 70%); pointer-events:none; }
.hero-inner { max-width:820px; position:relative; }
.hero-ornament { font-size:1.1rem; color:var(--gold); letter-spacing:.4em; margin-bottom:2.5rem; opacity:0; animation:fadeUp 1s .2s ease forwards; }
.hero-title { font-family:var(--sc); font-size:clamp(2.6rem,6vw,5rem); font-weight:300; line-height:1.1; color:var(--navy); letter-spacing:.02em; margin-bottom:.5rem; opacity:0; animation:fadeUp 1s .4s ease forwards; }
.hero-title em { font-style:italic; font-family:'Cormorant Garamond',serif; color:var(--gold); font-weight:400; }
.hero-rule { width:80px; height:1px; background:var(--gold); margin:2rem auto; opacity:0; animation:fadeUp 1s .6s ease forwards; }
.hero-sub { font-size:1.3rem; font-style:italic; color:var(--ink-soft); line-height:1.65; max-width:620px; margin:0 auto 3rem; font-weight:300; opacity:0; animation:fadeUp 1s .8s ease forwards; }
.hero-sub strong { font-style:normal; font-weight:500; color:var(--ink); }
.hero-ctas { display:flex; gap:1.2rem; justify-content:center; flex-wrap:wrap; opacity:0; animation:fadeUp 1s 1s ease forwards; align-items:center; }
.hero-scroll { position:absolute; bottom:2.5rem; left:50%; transform:translateX(-50%); display:flex; flex-direction:column; align-items:center; gap:.5rem; opacity:0; animation:fadeIn 1s 1.6s ease forwards; }
.hero-scroll span { font-family:var(--sc); font-size:.6rem; letter-spacing:.2em; color:var(--ink-muted); text-transform:uppercase; }
.scroll-line { width:1px; height:40px; background:linear-gradient(to bottom,var(--gold),transparent); animation:scrollPulse 2s 2s ease-in-out infinite; }

/* ── EPIGRAPH ────────────────────────────────────────────────── */
#epigraph { background:var(--navy); padding:5rem 2rem; text-align:center; position:relative; overflow:hidden; }
#epigraph::before { content:''; position:absolute; inset:0; background:radial-gradient(ellipse at center,rgba(176,141,87,.12) 0%,transparent 70%); }
.epigraph-text { font-family:'Cormorant Garamond',serif; font-style:italic; font-size:clamp(1.5rem,3vw,2.2rem); font-weight:300; color:var(--parchment); max-width:760px; margin:0 auto 2rem; line-height:1.55; position:relative; }
.epigraph-text::before { content:'\201C'; font-size:4rem; color:var(--gold); line-height:0; vertical-align:-1.2rem; margin-right:.1em; font-style:normal; }
.epigraph-attr { font-family:var(--sc); font-size:.7rem; letter-spacing:.2em; text-transform:uppercase; color:var(--gold-lt); position:relative; }

/* ── PAGE HERO (interior) ────────────────────────────────────── */
.page-hero { background:var(--navy); padding:9rem 2rem 5rem; text-align:center; position:relative; overflow:hidden; }
.page-hero::before { content:''; position:absolute; inset:0; background:radial-gradient(ellipse at center,rgba(176,141,87,.10) 0%,transparent 65%); pointer-events:none; }
.page-hero-label { font-family:var(--sc); font-size:.65rem; letter-spacing:.3em; text-transform:uppercase; color:var(--gold-lt); display:block; margin-bottom:1.2rem; position:relative; }
.page-hero-title { font-family:var(--sc); font-size:clamp(2.2rem,5vw,4rem); font-weight:300; color:#f7f3ec; letter-spacing:.03em; line-height:1.15; position:relative; margin-bottom:1rem; }
.page-hero-title em { font-style:italic; font-family:'Cormorant Garamond',serif; color:var(--gold-lt); font-weight:400; }
.page-hero-rule { width:50px; height:1px; background:var(--gold); margin:1.5rem auto; position:relative; }
.page-hero-sub { font-family:var(--serif); font-style:italic; font-size:clamp(1rem,2vw,1.22rem); font-weight:300; color:rgba(247,243,236,.75); max-width:600px; margin:0 auto; line-height:1.68; position:relative; }

/* ── BREADCRUMB ──────────────────────────────────────────────── */
.breadcrumb { font-family:var(--sc); font-size:.58rem; letter-spacing:.15em; text-transform:uppercase; color:rgba(247,243,236,.45); margin-bottom:1.2rem; position:relative; }
.breadcrumb a { color:rgba(247,243,236,.45); text-decoration:none; }
.breadcrumb a:hover { color:var(--gold-lt); }
.breadcrumb span { margin:0 .55em; opacity:.4; }

/* ── LAYOUT ──────────────────────────────────────────────────── */
section { padding:6rem 2rem; }
section.tight { padding:3.5rem 2rem; }
.container    { max-width:1080px; margin:0 auto; }
.container-sm { max-width:760px;  margin:0 auto; }
.container-xs { max-width:560px;  margin:0 auto; }

/* ── SECTION TYPE ────────────────────────────────────────────── */
.section-label { font-family:var(--sc); font-size:.63rem; letter-spacing:.27em; text-transform:uppercase; color:var(--gold); display:block; margin-bottom:1rem; }
.section-label.light { color:var(--gold-lt); }
.section-title { font-family:var(--sc); font-size:clamp(1.8rem,3.5vw,2.8rem); font-weight:300; color:var(--navy); line-height:1.18; letter-spacing:.02em; margin-bottom:.4rem; }
.section-title.light { color:#f7f3ec; }
.section-rule { width:50px; height:1px; background:var(--gold); margin:1.4rem 0 2rem; }
.section-rule.centered { margin-left:auto; margin-right:auto; }
.section-body { font-size:1.05rem; line-height:1.82; color:var(--ink-soft); }
.section-body.light { color:rgba(247,243,236,.78); }
.section-body p + p { margin-top:1.1em; }
.lead { font-size:1.2rem; font-style:italic; font-weight:300; line-height:1.7; color:var(--ink-soft); }
.lead.light { color:rgba(247,243,236,.78); }

/* ── BUTTONS ─────────────────────────────────────────────────── */
.btn-primary   { font-family:var(--sc); font-size:.78rem; letter-spacing:.18em; text-transform:uppercase; color:#f7f3ec; background:var(--navy); padding:.9rem 2.4rem; text-decoration:none; transition:all .25s; border:1px solid var(--navy); display:inline-block; white-space:nowrap; cursor:pointer; }
.btn-primary:hover { background:var(--navy-lt); border-color:var(--navy-lt); }
.btn-secondary { font-family:var(--sc); font-size:.78rem; letter-spacing:.18em; text-transform:uppercase; color:var(--navy); background:transparent; padding:.9rem 2.4rem; text-decoration:none; border:1px solid var(--navy); transition:all .25s; display:inline-block; white-space:nowrap; cursor:pointer; }
.btn-secondary:hover { background:var(--navy); color:#f7f3ec; }
.btn-gold      { font-family:var(--sc); font-size:.78rem; letter-spacing:.18em; text-transform:uppercase; color:var(--ink); background:var(--gold); padding:.9rem 2.4rem; text-decoration:none; border:1px solid var(--gold); transition:all .25s; display:inline-block; white-space:nowrap; cursor:pointer; }
.btn-gold:hover { background:var(--gold-lt); border-color:var(--gold-lt); }
.btn-ghost-light { font-family:var(--sc); font-size:.78rem; letter-spacing:.18em; text-transform:uppercase; color:#f7f3ec; background:transparent; padding:.9rem 2.4rem; text-decoration:none; border:1px solid rgba(247,243,236,.5); transition:all .25s; display:inline-block; white-space:nowrap; cursor:pointer; }
.btn-ghost-light:hover { border-color:#f7f3ec; background:rgba(247,243,236,.08); }

/* ── HOMEPAGE SECTIONS ───────────────────────────────────────── */
#what { background:var(--parchment); border-top:1px solid var(--rule); }
.what-grid { display:grid; grid-template-columns:1fr 1fr; gap:4rem 5rem; margin-top:3.5rem; }
.what-num { font-family:var(--sc); font-size:.63rem; letter-spacing:.2em; color:var(--gold); display:block; margin-bottom:.8rem; }
.what-item h3 { font-family:var(--sc); font-size:1.1rem; font-weight:400; color:var(--navy); letter-spacing:.05em; margin-bottom:.7rem; line-height:1.3; }
.what-item p { font-size:1rem; line-height:1.78; color:var(--ink-soft); }
.what-divider { width:100%; height:1px; background:var(--rule); margin:1rem 0; grid-column:1/-1; }

#volumes { background:var(--parchment-dk); border-top:1px solid var(--rule); border-bottom:1px solid var(--rule); }
.volumes-intro { text-align:center; margin-bottom:4rem; }
.rating-badge { display:inline-flex; align-items:center; gap:.6rem; background:var(--navy); color:var(--gold-lt); font-family:var(--sc); font-size:.63rem; letter-spacing:.18em; text-transform:uppercase; padding:.45rem 1.1rem; margin-bottom:3rem; }
.rating-badge .stars { font-size:.8rem; letter-spacing:.05em; }
.volumes-grid { display:grid; grid-template-columns:1fr 1fr; gap:3rem; }
.volume-card { border:1px solid var(--rule); background:var(--parchment); padding:2.8rem; position:relative; transition:box-shadow .3s,transform .3s; }
.volume-card:hover { box-shadow:0 12px 40px rgba(30,45,74,.08); transform:translateY(-3px); }
.volume-flag { position:absolute; top:2.8rem; right:2.8rem; font-family:var(--sc); font-size:.58rem; letter-spacing:.15em; text-transform:uppercase; color:var(--gold); border:1px solid var(--gold-pale); padding:.22rem .55rem; }
.volume-heritage { font-family:var(--sc); font-size:.6rem; letter-spacing:.2em; text-transform:uppercase; color:var(--ink-muted); margin-bottom:.8rem; display:block; }
.volume-title { font-family:'Cormorant Garamond',serif; font-style:italic; font-size:1.9rem; font-weight:400; color:var(--navy); margin-bottom:.25rem; line-height:1.2; }
.volume-subtitle { font-family:var(--sc); font-size:.68rem; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-muted); margin-bottom:1.5rem; display:block; }
.volume-rule { width:36px; height:1px; background:var(--gold); margin-bottom:1.5rem; }
.volume-desc { font-size:1rem; line-height:1.75; color:var(--ink-soft); margin-bottom:1.8rem; }
.volume-stats { display:grid; grid-template-columns:1fr 1fr; gap:1.2rem; padding-top:1.4rem; border-top:1px solid var(--rule); }
.stat { display:flex; flex-direction:column; gap:.15rem; }
.stat-num { font-family:var(--sc); font-size:1.5rem; color:var(--navy); font-weight:300; line-height:1; }
.stat-num.light { color:var(--gold-lt); }
.stat-label { font-family:var(--sc); font-size:.58rem; letter-spacing:.13em; text-transform:uppercase; color:var(--ink-muted); }
.stat-label.light { color:rgba(247,243,236,.52); }
.supergrok-bar { margin-top:3rem; padding:2.2rem 2.8rem; background:var(--navy); display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:1.5rem; }
.sg-label { font-family:var(--sc); font-size:.58rem; letter-spacing:.2em; text-transform:uppercase; color:var(--gold-lt); display:block; margin-bottom:.5rem; }
.sg-quote { font-family:'Cormorant Garamond',serif; font-style:italic; font-size:1.1rem; color:#f7f3ec; line-height:1.5; }
.sg-score { text-align:right; flex-shrink:0; }
.sg-score-num { font-family:var(--sc); font-size:2.8rem; color:var(--gold-lt); font-weight:300; line-height:1; display:block; }
.sg-score-label { font-family:var(--sc); font-size:.58rem; letter-spacing:.13em; text-transform:uppercase; color:var(--gold); }

#process { background:var(--parchment); }
.process-intro { max-width:560px; margin-bottom:4.5rem; }
.process-timeline { position:relative; }
.process-timeline::before { content:''; position:absolute; left:2.2rem; top:0; bottom:0; width:1px; background:linear-gradient(to bottom,var(--gold),var(--rule) 85%,transparent); }
.process-step { display:flex; gap:2.5rem; margin-bottom:3rem; align-items:flex-start; opacity:0; transform:translateX(-16px); transition:opacity .6s ease,transform .6s ease; }
.process-step.visible { opacity:1; transform:translateX(0); }
.step-marker { flex-shrink:0; width:4.4rem; height:4.4rem; border:1px solid var(--gold); background:var(--parchment); display:flex; align-items:center; justify-content:center; position:relative; z-index:1; }
.step-num { font-family:var(--sc); font-size:1.1rem; color:var(--gold); font-weight:400; }
.step-timing { font-family:var(--sc); font-size:.6rem; letter-spacing:.2em; text-transform:uppercase; color:var(--gold); display:block; margin-bottom:.4rem; }
.step-title { font-family:var(--sc); font-size:1.1rem; font-weight:400; color:var(--navy); letter-spacing:.04em; margin-bottom:.6rem; }
.step-desc { font-size:.97rem; line-height:1.78; color:var(--ink-soft); }
.step-detail { margin-top:1rem; padding-left:1rem; border-left:2px solid var(--rule); list-style:none; }
.step-detail li { font-size:.9rem; line-height:1.7; color:var(--ink-muted); margin-bottom:.35rem; }

#who { background:var(--navy); border-top:1px solid rgba(176,141,87,.2); }
.who-grid { display:grid; grid-template-columns:1fr 1fr; gap:6rem; align-items:start; }
.who-left .section-title { color:#f7f3ec; }
.who-portrait p { font-size:1rem; line-height:1.82; color:rgba(247,243,236,.78); margin-bottom:1.1em; }
.who-communities { display:flex; flex-direction:column; }
.community-item { border-left:2px solid var(--gold); padding-left:1.4rem; margin-bottom:1.8rem; }
.community-item--soon { border-left-color:rgba(176,141,87,.4); opacity:.8; }
.community-name { font-family:var(--sc); font-size:.95rem; color:var(--gold-lt); letter-spacing:.06em; display:block; margin-bottom:.4rem; }
.community-desc { font-size:.93rem; color:rgba(247,243,236,.68); line-height:1.65; display:block; }
.coming-soon-badge { display:inline-block; font-family:var(--sc); font-size:.5rem; letter-spacing:.14em; text-transform:uppercase; color:#1a1714; background:var(--gold-pale); border:1px solid rgba(176,141,87,.5); padding:.13rem .45rem; vertical-align:middle; margin-left:.5rem; line-height:1.6; }
.who-triggers { margin-top:2.5rem; padding-top:2rem; border-top:1px solid rgba(176,141,87,.2); }
.triggers-label { font-family:var(--sc); font-size:.6rem; letter-spacing:.22em; text-transform:uppercase; color:var(--gold); display:block; margin-bottom:1rem; }
.trigger-list { list-style:none; display:flex; flex-direction:column; gap:.6rem; }
.trigger-list li { font-size:.95rem; color:rgba(247,243,236,.72); padding-left:1.2rem; position:relative; line-height:1.5; }
.trigger-list li::before { content:'—'; position:absolute; left:0; color:var(--gold); }

#pricing { background:var(--parchment-dk); border-top:1px solid var(--rule); }
.pricing-intro { text-align:center; margin-bottom:4rem; }
.pricing-intro .section-body { max-width:540px; margin:0 auto; }
.pricing-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1.5rem; align-items:start; }
.pricing-card { border:1px solid var(--rule); background:var(--parchment); padding:2.2rem 1.8rem 2rem; position:relative; transition:box-shadow .3s,transform .3s; }
.pricing-card:hover { box-shadow:0 8px 32px rgba(30,45,74,.07); transform:translateY(-3px); }
.pricing-card.featured { border-color:var(--navy); background:var(--navy); }
.pricing-card.featured .price-tier  { color:var(--gold-lt); }
.pricing-card.featured .price-amount{ color:#f7f3ec; }
.pricing-card.featured .price-range { color:rgba(247,243,236,.5); }
.pricing-card.featured .price-rule  { background:rgba(176,141,87,.35); }
.pricing-card.featured .price-desc  { color:rgba(247,243,236,.75); }
.pricing-card.featured .price-use   { color:var(--gold-lt); border-color:rgba(176,141,87,.3); }
.pricing-card.featured .price-feature{ color:rgba(247,243,236,.72); }
.pricing-card.featured .price-feature::before { color:var(--gold); }
.featured-badge { position:absolute; top:-1px; right:1.6rem; font-family:var(--sc); font-size:.53rem; letter-spacing:.14em; text-transform:uppercase; background:var(--gold); color:var(--ink); padding:.25rem .6rem; }
.price-tier    { font-family:var(--sc); font-size:.62rem; letter-spacing:.17em; text-transform:uppercase; color:var(--gold); display:block; margin-bottom:1rem; }
.price-amount  { font-family:var(--sc); font-size:1.6rem; color:var(--navy); font-weight:300; line-height:1; display:block; margin-bottom:.2rem; }
.price-range   { font-family:var(--sc); font-size:.58rem; letter-spacing:.1em; color:var(--ink-muted); display:block; margin-bottom:1.2rem; }
.price-rule    { width:28px; height:1px; background:var(--rule); margin-bottom:1.1rem; }
.price-desc    { font-size:.9rem; line-height:1.72; color:var(--ink-soft); margin-bottom:1.1rem; }
.price-use     { font-family:var(--sc); font-size:.58rem; letter-spacing:.13em; text-transform:uppercase; color:var(--ink-muted); border-top:1px solid var(--rule); padding-top:.9rem; margin-bottom:.9rem; display:block; }
.price-features{ list-style:none; display:flex; flex-direction:column; gap:.45rem; }
.price-feature { font-size:.86rem; color:var(--ink-soft); display:flex; gap:.55rem; align-items:baseline; line-height:1.5; }
.price-feature::before { content:'·'; color:var(--gold); font-size:1.2rem; line-height:.8; flex-shrink:0; }
.pricing-note  { text-align:center; margin-top:2.5rem; font-family:var(--sc); font-size:.63rem; letter-spacing:.13em; color:var(--ink-muted); }

#contact { background:var(--parchment); border-top:1px solid var(--rule); }
.contact-inner { max-width:720px; margin:0 auto; text-align:center; }
.contact-ornament { font-size:1.4rem; color:var(--gold); display:block; margin-bottom:1.5rem; }
.contact-title { font-family:var(--sc); font-size:clamp(1.8rem,3.5vw,2.8rem); font-weight:300; color:var(--navy); margin-bottom:1rem; letter-spacing:.02em; }
.contact-body { font-size:1.05rem; line-height:1.8; color:var(--ink-soft); margin-bottom:3rem; font-style:italic; }
.contact-form { display:flex; flex-direction:column; gap:1rem; text-align:left; }
.contact-assurance { font-family:var(--sc); font-size:.58rem; letter-spacing:.13em; text-transform:uppercase; color:var(--ink-muted); margin-top:1rem; line-height:1.8; }

/* ── FORMS ───────────────────────────────────────────────────── */
.form-group { display:flex; flex-direction:column; gap:.4rem; }
.form-label { font-family:var(--sc); font-size:.6rem; letter-spacing:.17em; text-transform:uppercase; color:var(--ink-muted); }
.form-input { font-family:var(--serif); font-size:1rem; color:var(--ink); background:#f7f3ec; border:1px solid rgba(176,141,87,.38); padding:.8rem 1.1rem; outline:none; transition:border-color .2s; width:100%; -webkit-appearance:none; appearance:none; }
.form-input:focus { border-color:var(--navy); }
.form-input::placeholder { color:var(--ink-muted); font-style:italic; font-size:.95rem; }
select.form-input { cursor:pointer; background-color:#f7f3ec; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23b08d57'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 1rem center; padding-right:2.5rem; }
textarea.form-input { resize:vertical; font-family:var(--serif); min-height:130px; line-height:1.6; }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.btn-submit { font-family:var(--sc); font-size:.78rem; letter-spacing:.2em; text-transform:uppercase; color:#f7f3ec; background:var(--navy); border:1px solid var(--navy); padding:1rem 2.8rem; cursor:pointer; transition:background .25s; display:inline-block; width:auto; min-width:180px; align-self:center; }
.btn-submit:hover { background:var(--navy-lt); }
.btn-submit:disabled { opacity:.65; cursor:default; }

/* ── COMPONENTS ──────────────────────────────────────────────── */
.callout { border-left:3px solid var(--gold); padding:1.3rem 1.6rem; background:rgba(176,141,87,.06); margin:2rem 0; }
.callout p { font-style:italic; font-size:.98rem; line-height:1.75; color:var(--ink-soft); }
.ornament { font-size:1rem; color:var(--gold); letter-spacing:.4em; display:block; text-align:center; margin:2rem 0; }
.card { border:1px solid var(--rule); background:var(--parchment); padding:2.8rem; transition:box-shadow .3s,transform .3s; }
.card:hover { box-shadow:0 10px 36px rgba(30,45,74,.08); transform:translateY(-3px); }

/* FAQ */
.faq-item { border-bottom:1px solid var(--rule); }
.faq-question { font-family:var(--sc); font-size:.98rem; font-weight:400; color:var(--navy); letter-spacing:.03em; padding:1.4rem 2.5rem 1.4rem 0; cursor:pointer; display:flex; justify-content:space-between; align-items:center; transition:color .2s; user-select:none; line-height:1.4; }
.faq-question:hover { color:var(--gold); }
.faq-question::after { content:'+'; font-family:var(--sans); font-size:1.4rem; font-weight:300; color:var(--gold); line-height:1; transition:transform .3s ease; flex-shrink:0; margin-left:1rem; }
.faq-item.open .faq-question::after { transform:rotate(45deg); }
.faq-answer { max-height:0; overflow:hidden; transition:max-height .4s ease; }
.faq-item.open .faq-answer { max-height:600px; }
.faq-answer p { font-size:.98rem; line-height:1.82; color:var(--ink-soft); padding-bottom:1.5rem; }
.faq-answer ul { padding-left:1.2rem; margin-bottom:1.4rem; }
.faq-answer li { font-size:.93rem; line-height:1.75; color:var(--ink-soft); margin-bottom:.35rem; }

/* Comparison table */
.compare-table { width:100%; border-collapse:collapse; font-size:.92rem; }
.compare-table th { font-family:var(--sc); font-size:.62rem; letter-spacing:.15em; text-transform:uppercase; color:#f7f3ec; background:var(--navy); padding:1rem 1.2rem; text-align:left; font-weight:400; }
.compare-table th.featured-col { background:var(--navy-lt); }
.compare-table td { padding:.85rem 1.2rem; border-bottom:1px solid var(--rule); color:var(--ink-soft); vertical-align:top; line-height:1.5; }
.compare-table tr:last-child td { border-bottom:none; }
.compare-table tr:nth-child(even) td { background:rgba(176,141,87,.035); }
.compare-table .row-label { font-family:var(--sc); font-size:.7rem; letter-spacing:.08em; color:var(--navy); }
.check { color:var(--gold); }
.dash  { color:var(--ink-muted); }

/* Reveal */
.reveal { opacity:0; transform:translateY(26px); transition:opacity .75s ease,transform .75s ease; }
.reveal.visible { opacity:1; transform:translateY(0); }
.reveal-delay-1 { transition-delay:.10s; }
.reveal-delay-2 { transition-delay:.20s; }
.reveal-delay-3 { transition-delay:.30s; }
.reveal-delay-4 { transition-delay:.40s; }
.reveal-delay-5 { transition-delay:.50s; }

/* Scroll-to-top */
#scroll-top { position:fixed; bottom:2rem; right:2rem; width:44px; height:44px; background:var(--navy); border:none; cursor:pointer; display:flex; align-items:center; justify-content:center; opacity:0; pointer-events:none; transition:opacity .3s,background .2s; z-index:150; }
#scroll-top:hover { background:var(--navy-lt); }
#scroll-top.visible { opacity:1; pointer-events:auto; }

/* ── FOOTER ──────────────────────────────────────────────────── */
footer { background:var(--ink); color:rgba(247,243,236,.5); text-align:center; padding:3rem 2rem; }
.footer-logo { font-family:var(--sc); font-size:1rem; letter-spacing:.14em; color:rgba(247,243,236,.7); display:block; margin-bottom:.5rem; }
.footer-tagline { font-family:'Cormorant Garamond',serif; font-style:italic; font-size:.9rem; color:rgba(176,141,87,.68); display:block; margin-bottom:1.8rem; }
.footer-links { display:flex; gap:1.8rem; justify-content:center; flex-wrap:wrap; margin-bottom:1.8rem; }
.footer-links a { font-family:var(--sc); font-size:.58rem; letter-spacing:.14em; text-transform:uppercase; color:rgba(247,243,236,.38); text-decoration:none; transition:color .2s; }
.footer-links a:hover { color:var(--gold); }
.footer-bottom { display:flex; justify-content:center; align-items:center; gap:2rem; flex-wrap:wrap; padding-top:1.5rem; border-top:1px solid rgba(247,243,236,.07); }
.footer-copy { font-family:var(--sc); font-size:.56rem; letter-spacing:.1em; color:rgba(247,243,236,.2); }
.footer-legal a { font-family:var(--sc); font-size:.56rem; letter-spacing:.1em; color:rgba(247,243,236,.2); text-decoration:none; transition:color .2s; }
.footer-legal a:hover { color:rgba(176,141,87,.6); }

/* ── RESPONSIVE 900px ────────────────────────────────────────── */
@media (max-width:900px) {
  nav { padding:1rem 1.5rem; }
  .nav-links { display:none; }
  .nav-hamburger { display:flex; }
  .what-grid { grid-template-columns:1fr; gap:2.5rem; }
  .volumes-grid { grid-template-columns:1fr; }
  .who-grid { grid-template-columns:1fr; gap:3rem; }
  .pricing-grid { grid-template-columns:1fr 1fr; }
  .form-row { grid-template-columns:1fr; }
  .supergrok-bar { flex-direction:column; text-align:center; }
  .sg-score { text-align:center; }
}

/* ── RESPONSIVE 600px ────────────────────────────────────────── */
@media (max-width:600px) {
  html { font-size:16px; }
  section { padding:4rem 1.3rem; }
  nav { padding:.85rem 1rem; gap:.5rem; }
  .nav-logo { font-size:.72rem; letter-spacing:.05em; }
  .nav-cta { font-size:.58rem; padding:.35rem .65rem; letter-spacing:.07em; }
  .nav-cta .cta-long { display:none; }
  .nav-cta .cta-short { display:inline; }
  #hero { padding:7rem 1.3rem 5rem; }
  .hero-ctas { flex-direction:column; align-items:center; gap:.9rem; }
  .btn-primary,.btn-secondary,.btn-gold { min-width:200px; text-align:center; }
  .pricing-grid { grid-template-columns:1fr; }
  .page-hero { padding:7rem 1.3rem 4rem; }
  .volume-flag { position:static; margin-bottom:.8rem; display:inline-block; }
}
