/* ============ SHARED TOKENS & SHELL (nav, footer) ============ */
:root{
  --cream:        #FAF4E8;
  --cream-deep:   #F2E9D4;
  --butter:       #FCE6A4;
  --butter-bold:  #F5C84B;
  --blush:        #F7CFD2;
  --blush-bold:   #E27A8C;
  --rose:         #D85A6E;
  --ink:          #2A211B;
  --ink-soft:     #5B4A3F;
  --line:         #2A211B;
  --shadow:       0 10px 40px -16px rgba(42,33,27,.22);

  --f-display: "Fraunces", "Times New Roman", serif;
  --f-body:    "DM Sans", system-ui, sans-serif;
  --f-hand:    "Caveat", cursive;

  --maxw: 1320px;
  --pad:  clamp(20px, 4vw, 56px);
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0;
  font-family:var(--f-body);
  font-size:clamp(15px,1.05vw,17px);
  line-height:1.55;
  color:var(--ink);
  background:var(--cream);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
body::before{
  content:"";
  position:fixed; inset:0;
  pointer-events:none;
  z-index:1000;
  opacity:.45;
  mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='240' height='240'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0.15  0 0 0 0 0.13  0 0 0 0 0.11  0 0 0 .07 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
}
img{ display:block; max-width:100%; height:auto; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; cursor:pointer; }

h1,h2,h3,h4{ font-family:var(--f-display); font-weight:400; letter-spacing:-.02em; margin:0; }
h1{ font-variation-settings:"opsz" 144, "SOFT" 80; }
h2{ font-variation-settings:"opsz" 96, "SOFT" 60; }
.display{ font-family:var(--f-display); font-style:italic; font-variation-settings:"opsz" 144, "SOFT" 100; }
.eyebrow{
  font-family:var(--f-body);
  font-size:.72rem;
  letter-spacing:.32em;
  text-transform:uppercase;
  font-weight:500;
}
.hand{ font-family:var(--f-hand); font-weight:600; }
.wrap{ max-width:var(--maxw); margin:0 auto; padding:0 var(--pad); }

/* ====== MARQUEE ====== */
.ticker{
  background:var(--ink); color:var(--cream);
  border-bottom:1px solid var(--ink);
  overflow:hidden; position:relative;
}
.ticker__track{
  display:flex; gap:3rem;
  padding:11px 0;
  white-space:nowrap;
  animation: scroll 38s linear infinite;
  font-size:.78rem;
  letter-spacing:.22em;
  text-transform:uppercase;
}
.ticker__track span{ display:inline-flex; align-items:center; gap:.9rem; }
.ticker__track i{ color:var(--butter-bold); font-size:.7rem; }
@keyframes scroll { from{ transform:translateX(0); } to{ transform:translateX(-50%); } }

/* ====== NAV ====== */
.nav{
  position:sticky; top:0; z-index:60;
  background:rgba(250,244,232,.82);
  backdrop-filter:saturate(160%) blur(14px);
  -webkit-backdrop-filter:saturate(160%) blur(14px);
  border-bottom:1px solid rgba(42,33,27,.08);
}
.nav__inner{
  display:flex; align-items:center; justify-content:space-between;
  padding:22px 0;
}
.logo{
  display:inline-flex; align-items:center; gap:.7rem;
  font-family:var(--f-display);
  font-size:clamp(1.7rem, 2.4vw, 2.2rem);
  line-height:1;
  font-variation-settings:"opsz" 144, "SOFT" 100;
}
.logo b{ font-style:italic; font-weight:500; }
.logo i{ color:var(--rose); font-size:1.35rem; }
.nav__menu{ display:flex; gap:2rem; font-size:.85rem; }
.nav__menu a{ position:relative; padding:.25rem 0; }
.nav__menu a::after{
  content:""; position:absolute; left:0; bottom:-2px;
  width:0; height:1.5px; background:var(--rose);
  transition:width .35s ease;
}
.nav__menu a:hover::after{ width:100%; }
.nav__cta{
  display:inline-flex; align-items:center; gap:.55rem;
  background:var(--ink); color:var(--cream);
  padding:.7rem 1.1rem; border-radius:999px;
  font-size:.78rem; letter-spacing:.18em; text-transform:uppercase;
  transition:transform .25s ease, background .25s ease;
}
.nav__cta:hover{ background:var(--rose); transform:translateY(-2px); }
@media (max-width: 820px){ .nav__menu{ display:none; } }

/* ====== BUTTONS ====== */
.btn-primary{
  display:inline-flex; align-items:center; gap:.7rem;
  background:var(--ink); color:var(--cream);
  padding:1rem 1.5rem; border-radius:999px;
  font-size:.85rem; letter-spacing:.16em; text-transform:uppercase;
  border:1px solid var(--ink);
  transition:transform .25s ease, background .25s ease;
}
.btn-primary:hover{ background:var(--rose); border-color:var(--rose); transform:translateY(-2px); }
.btn-ghost{
  display:inline-flex; align-items:center; gap:.5rem;
  padding:1rem 1.3rem; border-radius:999px;
  font-size:.85rem; letter-spacing:.16em; text-transform:uppercase;
  border:1px solid rgba(42,33,27,.25); color:var(--ink);
  transition:background .25s ease, border-color .25s ease;
}
.btn-ghost:hover{ background:var(--blush); border-color:var(--blush); }

/* ====== EYEBROW / INDEX MARK ====== */
.index{
  font-family:var(--f-display); font-style:italic;
  color:var(--rose); font-size:1rem; margin-bottom:.6rem;
  display:flex; align-items:center; gap:.6rem;
}
.index::before{ content:""; width:34px; height:1px; background:var(--rose); }

/* ====== SECTION HEAD ====== */
section.s{ padding:clamp(80px, 10vw, 160px) 0; position:relative; }
.s__head{
  display:flex; align-items:flex-end; justify-content:space-between;
  gap:2rem; margin-bottom:clamp(40px,5vw,80px);
  flex-wrap:wrap;
}
.s__head h2{
  font-size:clamp(2.2rem,5.5vw,4.6rem);
  line-height:1; max-width:14ch;
}
.s__head h2 em{ font-style:italic; color:var(--rose); }
.s__head p{ max-width:34ch; color:var(--ink-soft); margin:0; font-size:1rem; }

/* ====== FOOTER ====== */
footer{
  background:var(--ink); color:var(--cream);
  padding:80px 0 28px;
}
.foot__top{
  display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr;
  gap:40px; padding-bottom:60px;
  border-bottom:1px solid rgba(250,244,232,.15);
}
@media (max-width: 880px){ .foot__top{ grid-template-columns:1fr 1fr; } }
@media (max-width: 520px){ .foot__top{ grid-template-columns:1fr; } }
.foot__brand h3{
  font-size:clamp(2rem,4vw,3.4rem); line-height:.95; margin-bottom:.8rem;
}
.foot__brand h3 em{ font-style:italic; color:var(--butter-bold); }
.foot__brand p{ color:rgba(250,244,232,.7); max-width:36ch; font-size:.9rem; }
.foot__col h5{
  font-size:.72rem; letter-spacing:.22em; text-transform:uppercase;
  color:var(--butter-bold); margin:0 0 1.2rem; font-weight:500;
}
.foot__col ul{ list-style:none; padding:0; margin:0; display:grid; gap:.6rem; }
.foot__col a{ color:rgba(250,244,232,.85); font-size:.92rem; }
.foot__col a:hover{ color:var(--butter-bold); }
.foot__bottom{
  display:flex; justify-content:space-between; align-items:center;
  padding-top:24px;
  font-size:.78rem; color:rgba(250,244,232,.55);
  gap:1rem; flex-wrap:wrap;
}
.foot__social{ display:flex; gap:1rem; }
.foot__social a{
  width:38px; height:38px; border-radius:50%;
  border:1px solid rgba(250,244,232,.25);
  display:grid; place-items:center; color:var(--cream);
  transition: background .25s ease, border-color .25s ease;
}
.foot__social a:hover{ background:var(--butter-bold); color:var(--ink); border-color:var(--butter-bold); }

/* ====== REVEAL ====== */
.reveal{ opacity:0; transform:translateY(28px); transition: opacity 1s ease, transform 1s cubic-bezier(.2,.7,.2,1); }
.reveal.in{ opacity:1; transform:none; }

/* ====== SUBPAGE HERO ====== */
.subhero{
  position:relative;
  padding:clamp(60px,8vw,120px) 0 clamp(40px,5vw,80px);
  background:
    radial-gradient(ellipse 70% 50% at 20% 20%, rgba(247,207,210,.5), transparent 60%),
    radial-gradient(ellipse 60% 50% at 90% 80%, rgba(252,230,164,.6), transparent 65%),
    var(--cream);
}
.subhero__inner{
  display:grid;
  grid-template-columns: 1.1fr .9fr;
  gap:clamp(24px,4vw,60px);
  align-items:end;
}
@media (max-width: 920px){ .subhero__inner{ grid-template-columns:1fr; } }
.subhero h1{
  font-size:clamp(2.4rem,7vw,5.6rem);
  line-height:.95;
  margin:.8rem 0 0;
}
.subhero h1 em{ font-style:italic; color:var(--rose); }
.subhero__crumbs{
  font-size:.78rem; letter-spacing:.2em; text-transform:uppercase;
  color:var(--ink-soft);
  display:flex; gap:.8rem; align-items:center;
}
.subhero__crumbs a:hover{ color:var(--rose); }
.subhero__crumbs i{ font-size:.6rem; color:var(--rose); }
.subhero__lede{
  font-size:clamp(1rem,1.15vw,1.18rem);
  color:var(--ink-soft); max-width:46ch;
  margin:0 0 1rem;
}