:root { --cream: #fdf9ed; --sand: #dac7bb; --brown: #563a2b; --header-footer: #aac1a2; --ink: #302923; --script: "Petit Formal Script", cursive; --body: "Nixie One", serif; }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--cream); font-family: var(--body); font-size: 16px; letter-spacing: .035em; }
section { position: relative; overflow: hidden; }
.hero, .contact { min-height: 100svh; display: grid; place-items: center; color: white; text-align: center; }
.hero-photo, .contact-photo { position: absolute; inset: 0; }
.hero-photo.placeholder-photo { background: var(--header-footer); }
.hero-shade { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(75, 101, 74, .15), rgba(75, 101, 74, .30)); }
.contact-shade { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(42,28,19,.36), rgba(42,28,19,.54)); }
.hero-content, .contact-content { position: relative; z-index: 1; padding: 60px 24px; }
.eyebrow { margin: 0 0 18px; font-size: .7rem; letter-spacing: .22em; }
.light { color: #fff; }
h1, h2 { margin: 0; font-family: var(--script); font-weight: 400; line-height: 1.18; }
h1 { font-size: clamp(3.8rem, 10vw, 7.6rem); text-shadow: 0 2px 16px rgba(0,0,0,.14); }
h1 i, h2 i { font-style: normal; font-size: .8em; }
.hero-date { margin: 26px 0 38px; font-size: clamp(.8rem, 1.5vw, 1rem); }
.scroll-link, .text-link { color: inherit; font-size: .7rem; letter-spacing: .16em; text-decoration: none; border-bottom: 1px solid currentColor; padding-bottom: 6px; }
.scroll-link span { padding-left: 8px; font-size: 1rem; }
.paper { padding: clamp(72px, 10vw, 130px) 24px; text-align: center; background: var(--cream); }
h2 { font-size: clamp(2.5rem, 6vw, 4.8rem); color: var(--brown); }
.date { margin: 20px 0 60px; font-size: .9rem; }
.detail-grid { max-width: 960px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1px 1fr; align-items: stretch; gap: clamp(24px, 6vw, 78px); }
.divider { background: var(--sand); }
.event-card { line-height: 1.65; font-size: .86rem; }
.round-icon { margin: 0 auto 23px; width: 62px; height: 62px; display: grid; place-items: center; border: 1px solid var(--sand); border-radius: 50%; color: var(--brown); font-size: 1.35rem; }
.event-card .eyebrow { margin-bottom: 12px; }.time { color: var(--brown); font-family: var(--script); font-size: 1.7rem; margin: 0 0 10px; }.event-card p { margin: 0; }.text-link { display: inline-block; color: var(--brown); margin-top: 25px; }
.rsvp { min-height: 660px; display: grid; grid-template-columns: 1fr 1fr; background: var(--sand); }
.rsvp-image { min-height: 660px; }.rsvp-copy { align-self: center; max-width: 450px; padding: 72px clamp(34px, 8vw, 120px); }.rsvp-copy > p:not(.eyebrow) { line-height: 1.7; font-size: .9rem; margin: 26px 0 30px; }.button { display: inline-block; padding: 15px 36px; color: var(--cream); background: var(--brown); text-decoration: none; font-size: .72rem; letter-spacing: .18em; }.rsvp-copy small { display: block; margin-top: 16px; font-size: .55rem; opacity: .65; line-height: 1.45; }
.honeymoon h2 { margin-bottom: 50px; }.destinations { display: grid; grid-template-columns: repeat(2, minmax(0, 330px)); justify-content: center; gap: clamp(20px, 4vw, 58px); }.destination { aspect-ratio: 1 / .74; display: grid; place-items: center; position: relative; }.destination p { position: absolute; bottom: 12px; margin: 0; color: white; font-family: var(--script); font-size: 1.55rem; text-shadow: 0 1px 7px #000; }.contribute { max-width: 530px; margin: 55px auto 18px; line-height: 1.75; font-size: .87rem; }.iban { color: var(--brown); font-size: .82rem; line-height: 1.8; }
.contact { min-height: 650px; }.contact-content h2 { color: white; font-size: clamp(2.5rem, 6vw, 4.7rem); }.contact-content > p:not(.eyebrow) { margin: 20px 0 32px; }.contact-names { display: flex; justify-content: center; gap: 55px; font-size: .8rem; line-height: 1.7; }.contact-names p { margin: 0; } footer { padding: 20px; text-align: center; background: var(--header-footer); color: var(--ink); font-size: .62rem; letter-spacing: .18em; }
.placeholder-photo { background: linear-gradient(135deg, rgba(85,58,43,.42), rgba(239,226,203,.34)), repeating-linear-gradient(45deg, #b9957b 0 1px, #cba98e 1px 18px); }.placeholder-photo span { color: rgba(255,255,255,.92); font-size: .65rem; letter-spacing: .18em; border: 1px solid rgba(255,255,255,.7); padding: 10px 13px; }
@media (max-width: 650px) { .detail-grid { grid-template-columns: 1fr; gap: 45px; }.divider { width: 70px; height: 1px; justify-self: center; }.rsvp { grid-template-columns: 1fr; }.rsvp-image { min-height: 370px; }.rsvp-copy { padding: 70px 32px; }.destinations { grid-template-columns: minmax(0, 330px); }.contact-names { gap: 28px; } }
