/* Classics for Weddings — house style
   Ivory paper, near-black ink, oxblood from the SL interiors, forest from the PNW gardens.
   Type: Bodoni Moda (masthead) · Cormorant Garamond (text) · Jost (labels)
         Courier Prime (typewriter notes) · Mrs Saint Delafield (signatures) */

:root {
  --ivory: #f6f2ea;
  --paper: #efe8da;
  --bone: #e6dfd2;
  --stone: #d9d4cb;
  --ink: #1c1b19;
  --ink-soft: #5d5952;
  --rule: rgba(28, 27, 25, .16);
  --oxblood: #5e1f1e;
  --forest: #2f3a2e;
  --forest-ink: #ece6d8;

  --f-display: "Bodoni Moda", "Didot", serif;
  --f-serif: "Cormorant Garamond", "Garamond", serif;
  --f-label: "Jost", "Helvetica Neue", sans-serif;
  --f-type: "Courier Prime", "Courier New", monospace;
  --f-script: "Mrs Saint Delafield", cursive;

  --gutter: clamp(16px, 4vw, 56px);
  --max: 1440px;
  --ease: cubic-bezier(.22, .61, .36, 1);
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--ivory);
  color: var(--ink);
  font: 400 19px/1.55 var(--f-serif);
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
img, video { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
::selection { background: var(--oxblood); color: var(--ivory); }

/* ---------- shared type ---------- */
.label {
  font: 400 11px/1.4 var(--f-label);
  letter-spacing: .24em;
  text-transform: uppercase;
}
.label--soft { color: var(--ink-soft); }
.display {
  font-family: var(--f-display);
  font-weight: 400;
  line-height: .92;
  letter-spacing: -.01em;
  margin: 0;
}
.italic { font-style: italic; }
.script { font-family: var(--f-script); font-weight: 400; line-height: 1; }
.typed { font-family: var(--f-type); font-size: 14px; line-height: 1.75; letter-spacing: .01em; }
.link-quiet {
  border-bottom: 1px solid currentColor;
  padding-bottom: 2px;
  transition: opacity .4s var(--ease);
}
.link-quiet:hover { opacity: .55; }

/* ---------- header ---------- */
.site-header {
  position: fixed; inset: 0 0 auto 0; z-index: 50;
  display: flex; align-items: center; justify-content: space-between;
  padding: 22px var(--gutter);
  color: var(--ivory);
  transition: background .5s var(--ease), color .5s var(--ease), padding .5s var(--ease);
}
.site-header.is-solid {
  background: rgba(246, 242, 234, .94);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  color: var(--ink);
  padding-top: 14px; padding-bottom: 14px;
}
.site-header--ink { color: var(--ink); }
.wordmark {
  font: italic 400 22px/1 var(--f-display);
  letter-spacing: .01em;
  white-space: nowrap;
}
.wordmark b { font-style: normal; font-weight: 400; }
.nav { display: flex; gap: 34px; }
.nav a { font: 400 11px/1 var(--f-label); letter-spacing: .24em; text-transform: uppercase; }
.nav a:hover { opacity: .6; }
.nav-toggle { display: none; background: none; border: 0; color: inherit; cursor: pointer; padding: 6px 0; }
@media (max-width: 820px) {
  .nav {
    position: fixed; inset: 0; flex-direction: column; justify-content: center; align-items: center; gap: 30px;
    background: var(--ivory); color: var(--ink);
    opacity: 0; pointer-events: none; transition: opacity .5s var(--ease);
  }
  .nav a { font: italic 400 34px/1 var(--f-display); letter-spacing: 0; text-transform: none; }
  .nav.is-open { opacity: 1; pointer-events: auto; }
  .nav-toggle { display: block; position: relative; z-index: 2; }
  body.nav-open .site-header { color: var(--ink); }
}

/* ---------- reveal ---------- */
.rv { opacity: 0; transform: translateY(26px); transition: opacity 1.2s var(--ease), transform 1.4s var(--ease); }
.rv.in { opacity: 1; transform: none; }
.rv-img { overflow: hidden; }
.rv-img > img, .rv-img > video { transform: scale(1.06); transition: transform 2.4s var(--ease); }
.rv.in .rv-img > img, .rv.in .rv-img > video, .rv-img.in > img, .rv-img.in > video { transform: none; }
@media (prefers-reduced-motion: reduce) {
  .rv, .rv-img > img, .rv-img > video { opacity: 1; transform: none; transition: none; }
}

.media { position: relative; background: var(--bone); }
.media img, .media video { width: 100%; height: 100%; object-fit: cover; }
.credit-tag {
  margin-top: 10px;
  font: 400 10px/1.4 var(--f-label); letter-spacing: .2em; text-transform: uppercase; color: var(--ink-soft);
}

/* ---------- footer ---------- */
.site-footer {
  padding: 120px var(--gutter) 40px;
  border-top: 1px solid var(--rule);
}
.site-footer .wordmark-xl {
  font: italic 400 clamp(54px, 13vw, 220px)/.85 var(--f-display);
  letter-spacing: -.02em;
  margin: 0 0 60px;
}
.footer-row { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 24px; }
.footer-row nav { display: flex; gap: 28px; flex-wrap: wrap; }