:root {
  color-scheme: light;
  --paper: #fbfaf6;
  --ivory: #f4efe5;
  --ink: #493136;
  --wine: #6e414a;
  --sage: #9eaa96;
  --blue: #aebcc7;
  --gold: #b49159;
  --line: rgba(73, 49, 54, .2);
  font-family: Georgia, "Times New Roman", serif;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; overflow-x: hidden; color: var(--ink); background: var(--paper); }
button, input, select, textarea { font: inherit; }
a { color: inherit; }
[hidden] { display: none !important; }

.cover { min-height: 100svh; display: grid; place-items: center; overflow: hidden; background: radial-gradient(circle at 52% 42%, #fffef9 0 16%, transparent 48%), var(--ivory); }
.cover__open { width: 100%; min-height: 100svh; position: relative; display: grid; place-items: center; align-content: center; gap: 34px; padding: 42px 24px; overflow: hidden; border: 0; color: var(--ink); background: transparent; cursor: pointer; }
.cover__paper { position: absolute; inset: 0; background: linear-gradient(32deg, transparent 49.7%, rgba(110,65,74,.12) 50%, transparent 50.3%), linear-gradient(-32deg, transparent 49.7%, rgba(110,65,74,.12) 50%, transparent 50.3%); }
.cover__paper::before { content: ""; position: absolute; top: -38vw; left: 50%; width: min(122vw, 1000px); aspect-ratio: 1; transform: translateX(-50%) rotate(45deg); border: 1px solid rgba(110,65,74,.13); border-radius: 0 0 22px; background: linear-gradient(135deg, #fffdf7, #eee6d8); box-shadow: 14px 18px 36px rgba(73,49,54,.1); }
.cover__seal, .cover__title, .cover__hint { position: relative; z-index: 1; }
.cover__seal { width: 112px; height: 112px; display: grid; place-items: center; margin-top: 8vh; border: 6px double #815d28; border-radius: 50%; color: #68491f; background: radial-gradient(circle at 35% 30%, #e4c47f, #b47b2f 64%, #7a4f1d); box-shadow: 0 10px 22px rgba(73,49,54,.2), inset 0 0 0 3px rgba(255,238,183,.4); font: italic 1.8rem/1 Georgia, serif; text-shadow: 0 1px rgba(255,244,207,.55); }
.cover__title { font-size: clamp(1.25rem, 5vw, 1.65rem); font-style: italic; }
.cover__hint { min-height: 44px; display: inline-flex; align-items: center; font: .68rem ui-sans-serif, system-ui, sans-serif; letter-spacing: .2em; text-transform: uppercase; }
.cover__open:focus-visible, .button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, a:focus-visible { outline: 3px solid var(--gold); outline-offset: 4px; }

.hero, .section, .footer { width: min(100%, 900px); margin-inline: auto; }
.hero { min-height: 100svh; position: relative; display: grid; place-items: center; overflow: hidden; padding: 92px 54px; isolation: isolate; text-align: center; background: #fff; }
.hero__frame { position: absolute; z-index: -1; inset: 0; width: 100%; height: 100%; object-fit: fill; pointer-events: none; }
.hero__copy { width: min(100%, 600px); display: grid; justify-items: center; gap: 23px; padding: 62px 10px; }
.eyebrow { margin: 0; color: var(--wine); font: .68rem ui-sans-serif, system-ui, sans-serif; letter-spacing: .21em; text-transform: uppercase; }
.hero h1 { min-width: 0; margin: 0; display: grid; justify-items: center; color: var(--ink); font: 400 clamp(2.9rem, 14vw, 6.8rem)/.88 Georgia, serif; letter-spacing: -.035em; }
.hero h1 span { min-width: 0; max-width: 100%; overflow-wrap: anywhere; }
.hero h1 i { padding-block: .12em; color: var(--gold); font-size: .42em; font-weight: 400; }
.hero__promise { margin: 0; color: var(--wine); font-size: clamp(1.45rem, 6vw, 2rem); font-style: italic; }
.hero__date { margin: 0; font: .73rem ui-sans-serif, system-ui, sans-serif; letter-spacing: .18em; text-transform: uppercase; }
.scroll-cue { min-height: 44px; display: inline-flex; align-items: center; gap: 10px; font: .66rem ui-sans-serif, system-ui, sans-serif; letter-spacing: .16em; text-transform: uppercase; text-decoration: none; }

.section { position: relative; padding: 96px 22px; overflow: hidden; text-align: center; border-top: 1px solid var(--line); }
.section::before, .section::after { content: "❀"; position: absolute; color: rgba(158,170,150,.62); font-size: 2.2rem; }
.section::before { top: 24px; left: 22px; transform: rotate(-18deg); }
.section::after { right: 22px; bottom: 24px; transform: rotate(22deg); }
.section h2 { max-width: 760px; margin: 16px auto 0; color: var(--ink); font: 400 clamp(2.7rem, 12vw, 5.8rem)/.98 Georgia, serif; letter-spacing: -.035em; overflow-wrap: anywhere; }
.section > p:not(.eyebrow, .venue__time, .rsvp__status) { max-width: 610px; margin: 28px auto 0; font-size: clamp(1.05rem, 4vw, 1.28rem); line-height: 1.7; }
.date { color: #fff; background: var(--wine); }
.date h2, .date .eyebrow { color: #fff8ec; }
.date::before, .date::after { color: rgba(255,248,236,.35); }
.countdown { max-width: 540px; margin: 38px auto 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid rgba(255,255,255,.46); border-bottom: 1px solid rgba(255,255,255,.46); }
.countdown span { min-width: 0; padding: 22px 5px; border-right: 1px solid rgba(255,255,255,.3); }
.countdown span:last-child { border: 0; }
.countdown b { display: block; font: 400 clamp(2.2rem, 10vw, 4.6rem)/1 Georgia, serif; }
.countdown small { display: block; margin-top: 8px; font: .63rem ui-sans-serif, system-ui, sans-serif; letter-spacing: .13em; text-transform: uppercase; }
.venue { background: var(--ivory); }
.venue__time { margin: 13px 0 0; font-weight: 700; }
.button-row { margin-top: 32px; display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; }
.button { min-height: 48px; display: inline-flex; align-items: center; justify-content: center; padding: 12px 22px; border: 1px solid var(--wine); border-radius: 2px; color: #fff; background: var(--wine); text-decoration: none; cursor: pointer; }
.button--light { color: var(--wine); background: transparent; }
.schedule ol { max-width: 610px; margin: 40px auto 0; padding: 0; list-style: none; text-align: left; }
.schedule li { display: grid; grid-template-columns: 72px minmax(0,1fr); gap: 16px; padding: 24px 6px; border-top: 1px solid var(--line); }
.schedule time { color: var(--wine); font-weight: 700; }
.schedule h3 { margin: 0 0 6px; font-size: 1.15rem; }
.schedule p { margin: 0; line-height: 1.55; }
.dress { background: #eef0e8; }
.swatches { margin-top: 30px; display: flex; justify-content: center; gap: 10px; }
.swatches i { width: 46px; height: 46px; border: 1px solid rgba(73,49,54,.13); border-radius: 50%; background: #f1e4d2; }
.swatches i:nth-child(2) { background: #d8bfc2; }
.swatches i:nth-child(3) { background: var(--blue); }
.swatches i:nth-child(4) { background: var(--sage); }
form { max-width: 580px; margin: 38px auto 0; display: grid; gap: 10px; text-align: left; }
label { margin-top: 8px; font: .68rem ui-sans-serif, system-ui, sans-serif; letter-spacing: .13em; text-transform: uppercase; }
input, select, textarea { width: 100%; min-height: 48px; padding: 12px 14px; border: 1px solid var(--wine); border-radius: 2px; color: var(--ink); background: rgba(255,255,255,.7); }
textarea { resize: vertical; }
form .button { margin-top: 14px; }
.honeypot { position: absolute; left: -10000px; width: 1px; height: 1px; }
.rsvp__status { min-height: 28px; margin: 20px 0 0; font-weight: 700; }
.footer { padding: 56px 22px; display: grid; gap: 15px; color: #fff; text-align: center; background: var(--ink); }
.footer p { margin: 0; }
.footer a { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; }
.demo-order { min-height: 48px; display: inline-flex; align-items: center; justify-content: center; padding: 12px 22px; border: 1px solid #d8be8e; color: #fff; text-decoration: none; }
@media (max-width: 420px) { .hero { padding-inline: 42px; } .hero__copy { padding-block: 82px; } }
@media (min-width: 760px) { .hero { padding-inline: 88px; } .section { padding: 120px 52px; } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; } }