*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#f7f1e9;color:#2c2025;font-family:Inter,system-ui,sans-serif}.grain{position:fixed;inset:0;pointer-events:none;opacity:.045;z-index:20;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.8'/%3E%3C/svg%3E")}.hero{min-height:100svh;background:linear-gradient(180deg,rgba(30,14,24,.2),rgba(30,14,24,.65)),url("assets/photo-06.jpg") center 35%/cover;display:flex;flex-direction:column;color:#fff;position:relative}.nav{display:flex;justify-content:space-between;align-items:center;padding:28px 5vw;position:relative;z-index:2}.monogram{font-family:"Cormorant Garamond",serif;font-size:28px;letter-spacing:.05em}.monogram span{font-size:16px;margin:0 4px;color:#e6b6a5}.nav-links{display:flex;gap:28px}.nav-links a{color:#fff;text-decoration:none;font-size:12px;letter-spacing:.12em;text-transform:uppercase;opacity:.9}.hero-inner{margin:auto;text-align:center;padding:80px 20px 120px}.eyebrow,.small-caps,.section-kicker{font-size:11px;letter-spacing:.22em;text-transform:uppercase}.hero h1{font:600 clamp(60px,10vw,130px)/.82 "Cormorant Garamond",serif;margin:28px 0}.hero h1 em{font-weight:400;color:#e7b7a7}.hero h1 span{display:block}.hero-date{letter-spacing:.4em;font-size:13px;margin:28px 0}.hero-copy{font-family:"Cormorant Garamond",serif;font-size:24px;line-height:1.35}.primary-btn{display:inline-flex;gap:18px;align-items:center;border:1px solid currentColor;padding:15px 22px;background:transparent;color:inherit;text-decoration:none;text-transform:uppercase;letter-spacing:.12em;font-size:11px;cursor:pointer;transition:.25s}.primary-btn:hover{background:#fff;color:#2c2025}.scroll-mark{position:absolute;bottom:25px;left:50%;transform:translateX(-50%);font-size:9px;letter-spacing:.2em}.section{padding:110px 7vw}.section-kicker{color:#8b5e62;margin-bottom:55px}.intro-grid,.wish-grid{display:grid;grid-template-columns:1.3fr .7fr;gap:10vw;max-width:1200px;margin:auto}.display{font:500 clamp(40px,5vw,76px)/.95 "Cormorant Garamond",serif;margin:0}.display i,.gallery-heading i,.quote i,.wish h2 i{color:#9b5c63;font-weight:400}.intro-copy{font-size:16px;line-height:1.9;padding-top:10px}.signature{font:600 30px "Cormorant Garamond",serif;margin-top:45px}.countdown-section{background:#321b2d;color:#fff}.countdown-section .section-kicker{color:#d6a99d}.countdown-card{text-align:center;max-width:1050px;margin:auto;border:1px solid rgba(255,255,255,.2);padding:70px 30px}.countdown{display:flex;justify-content:center;align-items:center;gap:clamp(14px,4vw,55px);margin:35px 0}.countdown strong{display:block;font:500 clamp(48px,8vw,100px) "Cormorant Garamond",serif}.countdown span{font-size:10px;letter-spacing:.18em;text-transform:uppercase;opacity:.65}.countdown i{font:400 50px "Cormorant Garamond",serif;opacity:.4}.countdown-note{font-size:12px;letter-spacing:.12em;text-transform:uppercase;opacity:.65}.gallery-section{background:#efe5d9}.gallery-heading{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:45px}.gallery-heading h2,.wish h2{font:600 clamp(50px,7vw,90px)/.9 "Cormorant Garamond",serif;margin:0}.gallery-heading p{max-width:330px;line-height:1.7;font-size:14px}.gallery{display:grid;grid-template-columns:repeat(12,1fr);grid-auto-rows:250px;gap:14px;max-width:1250px;margin:auto}.photo{margin:0;overflow:hidden;grid-column:span 4}.photo.wide{grid-column:span 8}.photo.tall{grid-row:span 2}.photo img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s}.photo:hover img{transform:scale(1.04)}.promise{background:#7e4c58;color:#fff;text-align:center}.promise-inner{max-width:900px;margin:auto}.promise .section-kicker{color:#e9c9c0}.quote{font:500 clamp(55px,9vw,120px)/.85 "Cormorant Garamond",serif;margin:40px 0}.quote-small{font-family:"Cormorant Garamond",serif;font-size:24px}.wish{background:#f7f1e9}.wish-grid{align-items:start}.wish h2{margin-bottom:25px}.wish-grid>div>p{line-height:1.8;max-width:450px}.wish-form{display:grid;gap:18px}.wish-form label{font-size:11px;letter-spacing:.1em;text-transform:uppercase}.wish-form input,.wish-form textarea{width:100%;margin-top:8px;border:0;border-bottom:1px solid #bca7a1;background:transparent;padding:14px 0;font:16px Inter;color:#2c2025;outline:none;resize:vertical}.wish-form textarea{border:1px solid #bca7a1;padding:14px}.wish-form .primary-btn{color:#2c2025;justify-content:center}.wish-form .primary-btn:hover{background:#2c2025;color:#fff}.form-status{font-size:12px;min-height:20px}footer{background:#24151d;color:#fff;padding:45px 7vw;display:flex;justify-content:space-between;align-items:center}footer p{font-size:10px;letter-spacing:.14em;text-transform:uppercase;opacity:.6}@media(max-width:760px){.nav{padding:22px 6vw}.nav-links{display:none}.hero{background-position:58% center}.hero-inner{padding-top:110px}.hero h1{font-size:68px}.section{padding:80px 6vw}.intro-grid,.wish-grid{grid-template-columns:1fr;gap:45px}.gallery-heading{display:block}.gallery{grid-template-columns:1fr 1fr;grid-auto-rows:210px}.photo,.photo.wide{grid-column:span 1}.photo.tall{grid-row:span 2}.countdown{gap:10px}.countdown i{font-size:30px}.countdown strong{font-size:45px}.countdown span{font-size:8px}.countdown-card{padding:50px 10px}footer{display:block;text-align:center}footer p{margin-top:20px}}

/* Personal wedding motion */
.hero-inner,.nav{animation:softIn 1.1s ease both}.hero-inner{animation-delay:.15s}
@keyframes softIn{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
.reveal{opacity:0;transform:translateY(35px);transition:opacity .9s ease,transform .9s ease}
.reveal.visible{opacity:1;transform:none}
.venue{background:#321b2d;color:#fff;text-align:center;position:relative;overflow:hidden}
.venue .section-kicker{color:#d6a99d}
.venue-card{max-width:900px;margin:auto;padding:75px 30px;border:1px solid rgba(255,255,255,.22);position:relative;overflow:hidden}
.venue-glow{position:absolute;width:420px;height:420px;border-radius:50%;background:rgba(211,155,145,.11);filter:blur(60px);left:50%;top:50%;transform:translate(-50%,-50%);animation:pulseGlow 5s ease-in-out infinite}
@keyframes pulseGlow{0%,100%{transform:translate(-50%,-50%) scale(.9);opacity:.5}50%{transform:translate(-50%,-50%) scale(1.15);opacity:1}}
.venue-card>*:not(.venue-glow){position:relative}
.venue-card h2{font:600 clamp(55px,8vw,100px)/.9 "Cormorant Garamond",serif;margin:25px 0 8px}
.venue-place{font:italic 28px "Cormorant Garamond",serif;color:#e7b7a7}
.venue-details{display:flex;justify-content:center;gap:35px;margin:35px 0;text-transform:uppercase;font-size:11px;letter-spacing:.15em}
.venue-note{max-width:500px;margin:auto;line-height:1.7;font-size:13px;opacity:.75}
.timeline{max-width:1100px;margin:100px auto 0;position:relative;padding:10px 0}
.timeline-line{position:absolute;left:50%;top:0;bottom:0;width:1px;background:#cdb8ad;transform:translateX(-50%)}
.timeline-item{width:44%;position:relative;padding:10px 0 45px}
.timeline-item:nth-of-type(odd){margin-right:auto;text-align:right;padding-right:45px}
.timeline-item:nth-of-type(even){margin-left:auto;text-align:left;padding-left:45px}
.timeline-dot{position:absolute;width:11px;height:11px;border-radius:50%;background:#9b5c63;top:18px}
.timeline-item:nth-of-type(odd) .timeline-dot{right:-5px}
.timeline-item:nth-of-type(even) .timeline-dot{left:-5px}
.timeline-year{font-size:10px;letter-spacing:.2em;color:#9b5c63;text-transform:uppercase}
.timeline-item h3{font:600 34px "Cormorant Garamond",serif;margin:12px 0 6px}
.timeline-item p{font-size:13px;line-height:1.7;margin:0;color:#66565b}
.music-toggle{position:fixed;right:22px;bottom:22px;z-index:30;border:1px solid rgba(255,255,255,.35);background:rgba(40,22,31,.88);backdrop-filter:blur(12px);color:#fff;border-radius:999px;padding:11px 16px;display:flex;align-items:center;gap:9px;cursor:pointer;box-shadow:0 10px 30px rgba(0,0,0,.2);font-size:10px;letter-spacing:.1em;text-transform:uppercase}
.music-icon{font:20px "Cormorant Garamond",serif;animation:musicPulse 1.4s ease-in-out infinite}
.music-toggle.playing .music-icon{animation:musicPulse .6s ease-in-out infinite}
@keyframes musicPulse{0%,100%{transform:scale(1);opacity:.7}50%{transform:scale(1.25);opacity:1}}
.petals{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.petal{position:absolute;top:-30px;width:9px;height:14px;background:#e8b7ab;border-radius:100% 0 100% 0;opacity:.45;animation:fall linear infinite}
@keyframes fall{0%{transform:translate3d(0,-30px,0) rotate(0)}100%{transform:translate3d(80px,105vh,0) rotate(540deg)}}
@media(max-width:760px){
 .venue-card{padding:60px 20px}.venue-details{gap:18px;flex-wrap:wrap}
 .timeline-line{left:8px}.timeline-item,.timeline-item:nth-of-type(odd),.timeline-item:nth-of-type(even){width:100%;margin:0;text-align:left;padding:8px 0 40px 35px}
 .timeline-item:nth-of-type(odd) .timeline-dot,.timeline-item:nth-of-type(even) .timeline-dot{left:3px;right:auto}
 .music-toggle{right:12px;bottom:12px}
}

/* Cinematic opening sequence */
.opening{position:fixed;inset:0;z-index:100;background:#160e13;color:#fff;display:grid;place-items:center;overflow:hidden;transition:opacity 1.2s ease,visibility 1.2s ease;cursor:default}
.opening.is-exiting{opacity:0;visibility:hidden;pointer-events:none}
.opening-bg{position:absolute;inset:-4%;background-position:center;background-size:cover;filter:saturate(.75) contrast(1.02);transform:scale(1.04);opacity:0;animation:openingPhoto 16s ease-in-out infinite}
.opening-bg-1{background-image:url('assets/photo-10.jpg');animation-delay:0s}
.opening-bg-2{background-image:url('assets/photo-06.jpg');animation-delay:4s}
.opening-bg-3{background-image:url('assets/photo-01.jpg');animation-delay:8s}
.opening-vignette{position:absolute;inset:0;background:radial-gradient(circle at 50% 45%,rgba(0,0,0,.12),rgba(13,7,11,.82) 76%),linear-gradient(180deg,rgba(20,9,15,.3),rgba(20,9,15,.72))}
.opening-content{position:relative;z-index:2;text-align:center;padding:30px 20px;max-width:1100px}
.opening-overline{font-size:10px;letter-spacing:.4em;text-transform:uppercase;opacity:.72;margin:0 0 25px;animation:fadeUp 1.2s .2s both}
.opening-title{font:500 clamp(64px,11vw,150px)/.76 'Cormorant Garamond',serif;margin:0;letter-spacing:-.03em;text-shadow:0 12px 45px rgba(0,0,0,.3)}
.opening-title span{display:block;animation:fadeUp 1.25s .35s both}
.opening-title span:last-child{animation-delay:.65s}
.opening-title em{display:block;font-size:.46em;font-weight:400;color:#efc1b1;line-height:1.35;animation:fadeIn 1.2s .5s both}
.opening-story{height:76px;margin:28px auto 24px;position:relative;max-width:800px}
.story-line{position:absolute;inset:0;margin:0;font:400 clamp(22px,3vw,34px)/1.25 'Cormorant Garamond',serif;color:#f9eae5;opacity:0;animation:storyLine 16s ease-in-out infinite}
.story-line-1{animation-delay:0s}.story-line-2{animation-delay:4s}.story-line-3{animation-delay:8s}.story-line-4{animation-delay:12s}
.enter-story{border:1px solid rgba(255,255,255,.55);background:rgba(20,10,15,.25);backdrop-filter:blur(8px);color:#fff;padding:15px 25px;text-transform:uppercase;letter-spacing:.16em;font-size:10px;cursor:pointer;transition:.3s;animation:fadeUp 1.1s 1s both}
.enter-story:hover{background:#fff;color:#2c2025;transform:translateY(-2px)}
.enter-story span{margin-left:10px;font-size:15px}
.opening-location{font-size:9px;letter-spacing:.18em;text-transform:uppercase;opacity:.55;margin:18px 0 0;animation:fadeUp 1.1s 1.2s both}
.opening-progress{position:absolute;left:50%;bottom:30px;width:min(280px,55vw);height:1px;background:rgba(255,255,255,.18);transform:translateX(-50%);overflow:hidden}
.opening-progress span{display:block;width:25%;height:100%;background:#efc1b1;animation:progress 16s linear infinite}
@keyframes openingPhoto{0%,25%{opacity:1;transform:scale(1.04)}33%,100%{opacity:0;transform:scale(1.1)}}
@keyframes storyLine{0%,5%{opacity:0;transform:translateY(10px)}8%,22%{opacity:1;transform:none}25%,100%{opacity:0;transform:translateY(-10px)}}
@keyframes fadeUp{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes progress{0%{transform:translateX(-100%)}100%{transform:translateX(400%)}}
body.opening-active{overflow:hidden}
.hero{scroll-margin-top:0}
@media(max-width:760px){
 .opening-title{font-size:68px}.opening-story{height:92px;margin-top:25px}.story-line{font-size:24px;padding:0 10px}
 .opening-location{font-size:8px;line-height:1.5}.opening-bg{background-position:58% center}
}
@media(prefers-reduced-motion:reduce){.opening-bg,.story-line,.opening-progress span,.opening-title span,.opening-title em,.opening-overline,.enter-story,.opening-location{animation:none}.opening-bg-1{opacity:1}.story-line-1{opacity:1}.reveal{transition:none}}