@import url("https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;1,400&family=Manrope:wght@400;500;600;700&display=swap");
@font-face { font-family:"Bodega Script"; src:url("assets/fonts/bodega-script.woff2") format("woff2"); font-display:swap; }

:root { --navy:#0d1b23; --navy-2:#13232e; --cream:#f4eade; --gold:#c38b4d; --red:#7c211e; --light:#f7efe6; --line:rgba(195,139,77,.55); }
* { box-sizing:border-box; } [hidden] { display:none!important; } html { scroll-behavior:smooth; background:var(--navy); } body { margin:0; color:var(--navy); background:var(--cream); font:400 14px/1.65 Manrope,Arial,sans-serif; } a { color:inherit; text-decoration:none; } button,input,textarea { font:inherit; } button { cursor:pointer; } img { display:block; max-width:100%; }

/* Generated envelope gate */
.invitation-gate { position:fixed; z-index:50; inset:0; display:grid; place-content:center; gap:24px; padding:22px; overflow:hidden; color:var(--light); background:#10212b url("assets/folk-pattern.png") center/520px repeat; transition:opacity .8s ease,visibility .8s ease; }.invitation-gate.is-open { visibility:hidden; opacity:0; pointer-events:none; }.envelope { width:min(78vw,640px); padding:0; border:0; background:transparent; filter:drop-shadow(0 25px 24px rgba(0,0,0,.38)); transition:transform .8s cubic-bezier(.2,.8,.2,1),opacity .5s ease; }.envelope img { width:100%; }.envelope.is-opening { opacity:0; transform:translateY(-16%) scale(1.1); }.envelope-hint,.gate-skip { margin:0; text-align:center; font-size:9px; font-weight:600; letter-spacing:.16em; text-transform:uppercase; }.gate-skip { justify-self:center; border:0; color:rgba(247,239,230,.62); background:none; font-size:8px; text-decoration:underline; text-underline-offset:4px; }
#site-content { visibility:hidden; } body.is-ready #site-content { visibility:visible; }.music-button { position:fixed; z-index:20; right:18px; top:82px; bottom:auto; display:flex; gap:9px; align-items:center; min-height:40px; padding:0 13px; border:1px solid var(--line); border-radius:99px; color:var(--light); background:rgba(10,21,28,.9); font-size:8px; letter-spacing:.13em; text-transform:uppercase; }.music-bars { display:flex; gap:2px; align-items:center; height:16px; }.music-bars i { width:2px; height:5px; background:var(--gold); }.music-button.is-playing .music-bars i { animation:sound .55s ease-in-out infinite alternate; }.music-button.is-playing .music-bars i:nth-child(2) { animation-delay:.18s; }.music-button.is-playing .music-bars i:nth-child(3) { animation-delay:.36s; }

/* Hero */
.site-header { position:absolute; z-index:10; top:0; right:0; left:0; display:grid; grid-template-columns:1fr 70px; align-items:center; min-height:68px; padding:0 clamp(22px,5vw,72px); border-bottom:1px solid rgba(195,139,77,.35); color:var(--light); }.site-header nav { display:flex; gap:clamp(16px,3.1vw,43px); align-items:center; font-size:9px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; }.site-header nav a:hover { color:var(--gold); }.header-mark { display:grid; width:56px; height:56px; place-items:center; justify-self:end; border:1px solid var(--gold); border-radius:50%; color:var(--gold); font:500 16px/1 "Cormorant Garamond",serif; letter-spacing:.08em; }.hero { position:relative; min-height:min(760px,100vh); overflow:hidden; color:var(--light); background:var(--navy); }.hero::after { position:absolute; inset:0; background:linear-gradient(90deg,rgba(10,20,27,.14),rgba(10,20,27,.02) 58%,rgba(10,20,27,.08)); content:""; }.hero-art { position:absolute; inset:0; width:100%; height:100%; }.hero-art img { width:100%; height:100%; object-fit:cover; object-position:center; }.hero-copy { position:relative; z-index:2; width:min(43%,575px); padding-top:clamp(190px,25vh,270px); margin-left:clamp(34px,12vw,180px); }.eyebrow,.section-kicker { margin:0 0 18px; color:var(--gold); font-size:9px; font-weight:700; letter-spacing:.22em; text-transform:uppercase; } h1,h2,h3,p { margin-top:0; } h1,h2 { font-family:"Cormorant Garamond",Georgia,serif; font-weight:400; } h1 { display:flex; flex-direction:column; font-size:clamp(74px,7.4vw,122px); line-height:.7; letter-spacing:-.035em; } h1 em { align-self:flex-start; margin:18px 0 12px 24%; color:var(--gold); font:400 .46em/.5 "Bodega Script",cursive; } h1 span:last-child { align-self:flex-end; }.hero-date { display:inline-block; margin:38px 0 0; padding:8px 0; border-block:1px solid var(--line); color:var(--gold); font:500 13px/1 "Cormorant Garamond",serif; letter-spacing:.26em; text-transform:uppercase; }.hero-subtitle { margin:18px 0 0; font:italic 400 20px/1.3 "Cormorant Garamond",serif; }

/* Countdown and story */
.countdown-section { position:relative; z-index:3; padding:18px 20px 20px; text-align:center; background:var(--cream); }.countdown-title { margin:0 0 8px; font-size:10px; font-weight:700; letter-spacing:.17em; text-transform:uppercase; }.countdown { display:flex; justify-content:center; max-width:730px; margin:0 auto; }.countdown div { min-width:140px; padding:0 20px; border-right:1px solid rgba(124,33,30,.3); }.countdown div:last-child { border:0; }.countdown strong { display:block; color:#7c2826; font:500 clamp(32px,4vw,52px)/1 "Cormorant Garamond",serif; }.countdown small { font-size:8px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }.section-wrap { padding:clamp(70px,8vw,115px) max(6vw,30px); }.story { position:relative; display:grid; grid-template-columns:minmax(230px,.55fr) minmax(300px,.7fr); gap:clamp(50px,9vw,140px); align-items:center; overflow:hidden; color:var(--light); background:var(--navy) url("assets/folk-pattern.png") left center/460px repeat; }.story-frame { position:relative; z-index:1; width:min(100%,330px); padding:8px; border:1px solid var(--line); border-radius:180px 180px 0 0; }.story-frame img { width:100%; aspect-ratio:.72; border-radius:172px 172px 0 0; object-fit:cover; object-position:67% center; }.story-copy { position:relative; z-index:1; max-width:500px; }.story h2,.location h2,.details h2 { margin-bottom:18px; font-size:clamp(40px,4.5vw,62px); line-height:.9; }.story-text { color:rgba(247,239,230,.73); font-size:12px; }.story-text p { margin-bottom:10px; }.outline-button,.primary-button { display:inline-flex; min-height:42px; align-items:center; justify-content:center; padding:0 22px; border:1px solid var(--gold); color:var(--gold); background:transparent; font-size:8px; font-weight:700; letter-spacing:.17em; text-transform:uppercase; transition:.2s ease; }.outline-button:hover { color:var(--navy); background:var(--gold); }.story-floral { position:absolute; right:3%; bottom:-8%; width:clamp(180px,23vw,330px); pointer-events:none; }

/* Programme, location and two information cards */
.schedule { position:relative; overflow:hidden; padding:48px max(5vw,24px) 58px; color:var(--gold); background:var(--red) url("assets/folk-pattern.png") center/520px repeat; }.schedule-floral { position:absolute; z-index:0; width:clamp(180px,22vw,310px); pointer-events:none; }.schedule-floral-left { bottom:-9%; left:-5%; }.schedule-floral-right { top:-12%; right:-5%; transform:rotate(180deg); }.section-title,.rsvp-heading { position:relative; z-index:1; display:flex; flex-direction:column; gap:5px; align-items:center; justify-content:center; margin-bottom:32px; text-align:center; }.section-title p,.rsvp-heading p { margin:0; }.section-divider { width:min(220px,58vw); height:18px; object-fit:contain; }.schedule-list { position:relative; z-index:1; display:grid; grid-template-columns:repeat(6,1fr); max-width:1080px; margin:0 auto; }.schedule-item { min-height:126px; padding:14px 8px; border-top:1px solid rgba(195,139,77,.55); text-align:center; }.schedule-item .icon { display:block; margin:10px 0 8px; font-size:26px; }.schedule-item time { color:var(--light); font:500 20px/1 "Cormorant Garamond",serif; }.schedule-item h3 { margin:9px 0 0; color:rgba(247,239,230,.85); font-size:8px; letter-spacing:.08em; text-transform:uppercase; }.location { display:grid; grid-template-columns:.65fr 1.35fr; gap:clamp(35px,6vw,100px); align-items:center; min-height:390px; padding:70px 0; color:var(--light); background:var(--navy-2) url("assets/folk-pattern.png") left center/460px repeat; }.location-copy { padding-left:max(6vw,30px); }.location h2 { margin-bottom:22px; }.location-address { color:var(--light); font:400 17px/1.45 "Cormorant Garamond",serif; }.location-note { max-width:360px; color:rgba(247,239,230,.67); font-size:11px; }.map-card { min-height:255px; margin-right:max(6vw,30px); padding:8px; border:1px solid var(--line); background:#0b161e; }.map-card img { width:100%; min-height:238px; height:100%; object-fit:cover; }.details { display:grid; grid-template-columns:1fr 1fr; }.dress-code,.wishes { position:relative; min-height:310px; padding:48px max(6vw,30px); overflow:hidden; }.dress-code { color:var(--light); background:#122923 url("assets/folk-pattern.png") left center/460px repeat; }.dress-code p:not(.section-kicker),.wishes p:not(.section-kicker) { max-width:340px; font-size:11px; }.palette { display:flex; flex-wrap:wrap; gap:10px; margin-top:18px; }.swatch { width:37px; height:37px; border:1px solid rgba(247,239,230,.5); }.swatch-label { flex-basis:100%; color:rgba(247,239,230,.66); font-size:7px; letter-spacing:.1em; text-transform:uppercase; }.wishes { background:var(--cream); }.wishes-floral { position:absolute; right:-2%; bottom:-18%; width:230px; pointer-events:none; }

/* RSVP and footer */
.rsvp { padding:42px 20px 46px; color:var(--light); text-align:center; background:var(--navy) url("assets/folk-pattern.png") center/460px repeat; }.rsvp-heading { margin-bottom:13px; }.rsvp > p { max-width:620px; margin:0 auto 6px; color:rgba(247,239,230,.68); font-size:11px; }.rsvp > strong { display:block; color:var(--gold); font-size:9px; font-weight:500; letter-spacing:.1em; }.rsvp .outline-button { margin-top:18px; }.rsvp-form,.form-success { width:min(520px,100%); margin:30px auto 0; padding:28px; border:1px solid rgba(195,139,77,.45); text-align:left; background:rgba(7,13,18,.54); }.rsvp-form { display:grid; gap:17px; }.rsvp-form label,.rsvp-form legend { color:rgba(247,239,230,.75); font-size:8px; letter-spacing:.13em; text-transform:uppercase; }.rsvp-form input[type="text"],.rsvp-form textarea { width:100%; margin-top:7px; padding:8px 0; border:0; border-bottom:1px solid rgba(247,239,230,.32); outline:0; color:#fff; background:transparent; font-size:12px; text-transform:none; }.rsvp-form fieldset { display:grid; gap:8px; padding:0; border:0; }.rsvp-form fieldset label { display:flex; gap:8px; align-items:center; font-size:11px; letter-spacing:0; text-transform:none; }.rsvp-form input[type="radio"] { accent-color:var(--gold); }.primary-button { color:var(--navy); background:var(--gold); }.primary-button:hover { color:var(--light); background:var(--red); }.form-success { text-align:center; }.form-success span { color:var(--gold); font-size:9px; letter-spacing:.16em; text-transform:uppercase; }.form-success h3 { margin:14px 0; font:400 32px/1 "Cormorant Garamond",serif; } footer { position:relative; padding:36px 20px 18px; overflow:hidden; color:var(--light); text-align:center; background:#091117 url("assets/folk-pattern.png") center/460px repeat; }.footer-mark { display:grid; width:48px; height:48px; margin:0 auto 10px; place-items:center; border:1px solid var(--gold); border-radius:50%; color:var(--gold); font:500 14px/1 "Cormorant Garamond",serif; }.footer-floral { position:absolute; right:-1%; bottom:-42px; width:180px; pointer-events:none; } footer small { color:var(--gold); font-size:8px; letter-spacing:.17em; text-transform:uppercase; }
.reveal { opacity:0; transform:translateY(22px); transition:opacity .65s ease,transform .65s ease; }.reveal.is-visible { opacity:1; transform:none; } @keyframes sound { from { height:5px; } to { height:15px; } }

@media (max-width:820px) { .site-header { grid-template-columns:1fr 50px; padding-inline:22px; }.site-header nav { gap:16px; }.site-header nav a:nth-child(5) { display:none; }.hero { min-height:690px; }.hero-art { object-position:58% center; }.hero-copy { width:48%; padding-top:190px; margin-left:7vw; }.story { grid-template-columns:minmax(210px,.7fr) 1fr; gap:48px; }.story-frame { width:100%; }.schedule-list { grid-template-columns:repeat(3,1fr); row-gap:20px; }.location { grid-template-columns:1fr; gap:26px; padding:65px 30px; }.location-copy { padding:0; }.map-card { min-height:280px; margin:0; }.details { grid-template-columns:1fr; }.dress-code,.wishes { min-height:0; } }
@media (max-width:560px) { .invitation-gate { gap:20px; }.envelope { width:min(94vw,410px); }.site-header { grid-template-columns:1fr; justify-items:center; min-height:63px; padding:4px 20px; }.site-header nav { display:none; }.header-mark { width:48px; height:48px; font-size:14px; justify-self:center; }.hero { min-height:100svh; }.hero::after { background:linear-gradient(90deg,rgba(8,17,24,.92) 0%,rgba(8,17,24,.70) 50%,rgba(8,17,24,.08) 100%); }.hero-art img { object-position:center; }.hero-copy { width:52%; padding-top:142px; margin-left:20px; }.eyebrow { margin-bottom:13px; font-size:7px; letter-spacing:.14em; }.hero h1 { font-size:clamp(42px,12vw,50px); line-height:.78; }.hero h1 em { margin:9px 0 7px 13%; }.hero h1 span:last-child { align-self:flex-start; margin-left:.38em; }.hero-date { margin-top:22px; font-size:9px; letter-spacing:.1em; }.hero-subtitle { max-width:13ch; font-size:15px; line-height:1.22; }.countdown-section { padding:17px 7px; }.countdown-title { font-size:8px; }.countdown div { min-width:25%; padding:0 3px; }.countdown strong { font-size:35px; }.countdown small { font-size:6px; }.section-wrap { padding:68px 24px; }.story { grid-template-columns:1fr; gap:44px; }.story-frame { width:min(76%,300px); }.story-copy { max-width:100%; }.story h2,.location h2,.details h2 { font-size:45px; }.story-floral { right:-17%; bottom:-6%; width:210px; }.schedule { padding:40px 18px 48px; }.schedule-floral { width:180px; }.schedule-floral-left { bottom:-5%; left:-22%; }.schedule-floral-right { top:-8%; right:-23%; }.section-title { margin-bottom:28px; }.section-divider { width:160px; height:14px; }.schedule-list { grid-template-columns:repeat(2,1fr); }.schedule-item { min-height:112px; }.location { padding:62px 24px; }.map-card { min-height:205px; padding:5px; }.map-card img { min-height:193px; }.dress-code,.wishes { padding:60px 24px; }.wishes-floral { right:-12%; bottom:-24%; width:190px; }.rsvp { padding:38px 20px; }.rsvp-form,.form-success { padding:23px 18px; }.footer-floral { width:140px; }.music-button { top:73px; }.music-button > span:last-child { display:none; } }
/* Reference-matched floral placement: every generated element remains fully visible. */
.schedule-floral { display:none; }.story-floral { right:18px; bottom:28px; width:220px; }.dress-wheat { position:absolute; bottom:14px; left:14px; width:150px; pointer-events:none; }.wishes-floral { right:16px; bottom:12px; width:170px; }.footer-floral { right:14px; bottom:8px; width:120px; }
.schedule { background:#7c211e; }.schedule .section-kicker { color:#f0bb72; font-size:12px; letter-spacing:.25em; }.schedule-list { grid-template-columns:repeat(5,1fr); }.schedule-item { border-top-color:rgba(240,187,114,.82); }.schedule-item time { color:#fff0dd; font-size:24px; }.schedule-item h3 { color:#fff0dd; font-size:9px; font-weight:700; }.section-divider { width:250px; height:24px; }
@media (max-width:560px) { .story-floral { right:4px; bottom:22px; width:165px; }.dress-wheat { bottom:12px; left:8px; width:115px; }.wishes-floral { right:8px; bottom:8px; width:130px; }.footer-floral { right:8px; bottom:4px; width:90px; }.schedule-list { grid-template-columns:repeat(2,1fr); }.schedule-item { min-height:120px; }.schedule .section-kicker { font-size:10px; }.section-divider { width:190px; height:20px; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { animation-duration:.01ms!important; transition-duration:.01ms!important; }.reveal { opacity:1; transform:none; } }
