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

:root {
  --cream: #F7F2EA;
  --warm:  #FAF7F2;
  --ink:   #18130E;
  --ink2:  #3A2F26;
  --terra: #B8522A;
  --terra-light: #E8D5CC;
  --sage:  #6B7F63;
  --gold:  #C4973A;
  --mist:  #DDD8CE;
  --blush: #F0E4DC;
}

*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
  background: var(--cream);
  color: var(--ink);
  font-family: 'DM Sans', sans-serif;
  font-weight: 300;
  overflow-x: hidden;
}

/* ── NAV ── */
nav {
  position: fixed; top:0; left:0; right:0; z-index:200;
  padding: 22px 60px;
  display: flex; justify-content:space-between; align-items:center;
  background: rgba(247,242,234,0.94);
  backdrop-filter: blur(14px);
  border-bottom: 1px solid transparent;
  transition: border-color 0.3s;
}
nav.scrolled { border-bottom-color: var(--mist); }
.nav-logo {
  font-family: 'Cormorant Garamond', serif;
  font-size: 20px; letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--ink); text-decoration: none;
}
.nav-links { display:flex; gap:36px; align-items:center; }
.nav-links a {
  font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--ink2); text-decoration: none; opacity: 0.55;
  transition: opacity 0.2s;
}
.nav-links a:hover, .nav-links a.active { opacity: 1; }
.nav-cta {
  padding: 10px 24px;
  background: var(--ink); color: var(--cream);
  font-family: 'DM Sans', sans-serif;
  font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase;
  border: none; cursor: pointer; text-decoration: none;
  display: inline-block;
  transition: background 0.25s;
}
.nav-cta:hover { background: var(--terra); }

/* ── SHARED UTILS ── */
.sec-tag {
  font-size: 10px; letter-spacing: 0.25em; text-transform: uppercase;
  color: var(--terra); margin-bottom: 18px; display: block;
}
.sec-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: clamp(34px,4vw,56px); font-weight:300; line-height:1.08;
  margin-bottom: 16px;
}
.sec-title em { font-style:italic; color:var(--terra); }
.sec-sub {
  font-size: 15px; line-height:1.85; color:var(--ink2); opacity:0.72;
}
.divline { height:1px; background:var(--mist); margin:0 60px; }
.btn-primary {
  display: inline-block; padding:16px 32px;
  background: var(--ink); color: var(--cream);
  font-family: 'DM Sans', sans-serif;
  font-size: 11px; letter-spacing:0.18em; text-transform:uppercase;
  border: none; cursor: pointer; text-decoration: none;
  transition: background 0.25s; text-align:center;
}
.btn-primary:hover { background: var(--terra); }
.btn-ghost {
  display: inline-block; padding:16px 32px;
  background: transparent; color: var(--ink);
  font-family: 'DM Sans', sans-serif;
  font-size: 11px; letter-spacing:0.18em; text-transform:uppercase;
  border: 1px solid var(--ink); cursor: pointer; text-decoration: none;
  transition: all 0.25s; text-align:center;
}
.btn-ghost:hover { background:var(--ink); color:var(--cream); }

/* ── PAGE HERO BANNER (inner pages) ── */
.page-banner {
  padding: 160px 60px 80px;
  background: var(--ink);
  position: relative; overflow: hidden;
}
.page-banner-char {
  position:absolute; font-family:'Cormorant Garamond',serif;
  font-size:340px; color:rgba(255,255,255,0.04);
  top:50%; right:-40px; transform:translateY(-50%);
  line-height:1; pointer-events:none; user-select:none;
}
.page-banner-tag { font-size:10px; letter-spacing:0.25em; text-transform:uppercase; color:var(--gold); opacity:0.65; margin-bottom:20px; display:block; }
.page-banner-title {
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(44px,6vw,80px); font-weight:300; line-height:1.06;
  color:var(--cream); max-width:700px;
}
.page-banner-title em { font-style:italic; color:var(--terra); }
.page-banner-sub { font-size:15px; line-height:1.8; color:rgba(255,255,255,0.45); max-width:520px; margin-top:20px; }

/* ── FOOTER ── */
footer {
  padding: 40px 60px;
  border-top: 1px solid var(--mist);
  display: flex; justify-content:space-between; align-items:center;
}
.footer-logo { font-family:'Cormorant Garamond',serif; font-size:18px; letter-spacing:0.16em; text-transform:uppercase; text-decoration:none; color:var(--ink); }
.footer-links { display:flex; gap:28px; }
.footer-links a { font-size:11px; letter-spacing:0.12em; text-transform:uppercase; color:var(--ink2); opacity:0.35; text-decoration:none; }
.footer-links a:hover { opacity:0.7; }
.footer-note { font-size:11px; color:var(--ink2); opacity:0.28; letter-spacing:0.05em; }

/* ── REVEAL ANIMATION ── */
.reveal { opacity:0; transform:translateY(22px); transition:opacity 0.65s ease, transform 0.65s ease; }
.reveal.visible { opacity:1; transform:translateY(0); }

/* ── MOBILE ── */
@media(max-width:768px){
  nav { padding:18px 24px; }
  .nav-links { display:none; }
  .divline { margin:0 24px; }
  .page-banner { padding:120px 24px 60px; }
  footer { padding:32px 24px; flex-direction:column; gap:16px; text-align:center; }
  .footer-links { flex-wrap:wrap; justify-content:center; }
}
