:root {
  --sunset: #E0704F; --coral: #EE8A6F; --peach: #F5BFA0; --cream: #FDF9F6;
  --sand: #F5E6D8; --charcoal: #2D1F1A; --muted: #8B7468; --gold: #C9A96E;
  --ivory: #FFFDFB;
  --font-serif: "Cormorant Garamond", Georgia, serif;
  --font-sans: "Outfit", system-ui, sans-serif;
}
* { margin:0; padding:0; box-sizing:border-box; }
html { background-color:var(--cream); color:var(--charcoal); color-scheme:light; scroll-behavior:smooth; }
body { min-height:100vh; background-color:var(--cream); color:var(--charcoal); font-family:var(--font-sans); -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; }
::selection { background-color:var(--peach); color:var(--charcoal); }
a { text-decoration:none; color:inherit; }
.text-center { text-align:center; }
.container-narrow { max-width:42rem; margin:0 auto; padding:0 1.5rem; }
.container-medium { max-width:36rem; margin:0 auto; padding:0 1.5rem; }
.container-wide { max-width:56rem; margin:0 auto; padding:0 1.5rem; }
.fixed-nav { position:fixed; top:0; z-index:50; width:100%; display:flex; align-items:center; justify-content:space-between; padding:1rem 1.5rem; }
.nav-brand { font-family:var(--font-serif); font-size:1.25rem; color:var(--cream); }
.nav-amp { color:var(--peach); }
.nav-rsvp { border:1px solid rgba(253,249,246,0.4); border-radius:9999px; padding:0.375rem 1.25rem; font-size:0.75rem; text-transform:uppercase; letter-spacing:0.15em; color:var(--cream); backdrop-filter:blur(4px); transition:all 0.3s; }
.nav-rsvp:hover { background:var(--cream); color:var(--sunset); }
.hero { position:relative; display:flex; flex-direction:column; align-items:center; justify-content:center; min-height:100dvh; width:100%; overflow:hidden; }
.hero-bg { position:absolute; inset:0; background:url("assets/hero.jpg") center/cover no-repeat; }
.hero-gradient { position:absolute; inset:0; background:linear-gradient(to bottom, rgba(0,0,0,0.6), rgba(0,0,0,0.4), var(--cream)); }
.hero-radial { position:absolute; inset:0; background:radial-gradient(ellipse at center, rgba(0,0,0,0.45) 0%, rgba(0,0,0,0.15) 60%, transparent 100%); }
.hero-content { position:relative; z-index:10; display:flex; flex-direction:column; align-items:center; padding:0 1.5rem; text-align:center; text-shadow:0 2px 20px rgba(0,0,0,0.5); }
.hero-eyebrow { margin-bottom:1rem; font-size:0.75rem; text-transform:uppercase; letter-spacing:0.3em; color:var(--cream); }
.hero-title { font-family:var(--font-serif); font-size:3.75rem; font-weight:400; line-height:1.1; color:var(--cream); }
@media (min-width:768px) { .hero-title { font-size:6rem; } }
.hero-amp { color:var(--peach); font-style:italic; }
.hero-divider { margin-top:1.5rem; display:flex; align-items:center; gap:1rem; }
.divider-line-small { display:block; height:1px; width:3rem; background:rgba(253,249,246,0.6); }
.hero-date { font-family:var(--font-serif); font-size:1.125rem; color:var(--cream); }
@media (min-width:768px) { .hero-date { font-size:1.25rem; } }
.hero-location { margin-top:0.5rem; font-size:0.875rem; letter-spacing:0.1em; color:var(--cream); }
.welcome { padding:6rem 0; }
@media (min-width:768px) { .welcome { padding:8rem 0; } }
.ornament { display:flex; align-items:center; justify-content:center; gap:0.75rem; margin-bottom:2rem; }
.ornament-line { display:block; height:1px; width:2.5rem; background:rgba(201,169,110,0.5); }
.welcome-quote { font-family:var(--font-serif); font-size:1.5rem; font-weight:300; line-height:1.6; color:var(--charcoal); }
@media (min-width:768px) { .welcome-quote { font-size:1.875rem; } .welcome-body { font-size:1.875rem !important; } }
.welcome-body { margin-top:1.5rem; font-size:1rem; line-height:1.625; color:var(--muted); }
.details { background:rgba(245,230,216,0.6); padding:6rem 0; }
@media (min-width:768px) { .details { padding:7rem 0; } }
.details-grid { display:grid; gap:3rem; }
@media (min-width:768px) { .details-grid { grid-template-columns:repeat(3,1fr); gap:2rem; } }
.detail-icon { margin-bottom:1rem; display:flex; justify-content:center; }
.detail-label { margin-bottom:0.5rem; font-size:0.75rem; text-transform:uppercase; letter-spacing:0.2em; color:var(--muted); }
.detail-main { font-family:var(--font-serif); font-size:1.5rem; color:var(--charcoal); }
.detail-sub { font-family:var(--font-serif); font-size:1.25rem; color:var(--muted); }
.detail-time { margin-top:0.25rem; font-size:0.875rem; color:var(--muted); }

/* Schedule */
.schedule-section { padding: 6rem 0; }
@media (min-width:768px) { .schedule-section { padding: 8rem 0; } }
.schedule-title { font-family: var(--font-serif); font-size: 1.875rem; color: var(--charcoal); margin-bottom: 3rem; text-align: center; }
@media (min-width:768px) { .schedule-title { font-size: 2.25rem; } }
.schedule-list { display: flex; flex-direction: column; gap: 2rem; }
.schedule-item { display: flex; align-items: baseline; gap: 1.5rem; }
.schedule-date { width: 7rem; flex-shrink: 0; text-align: right; font-size: 0.875rem; letter-spacing: 0.05em; color: var(--muted); }
.schedule-line { display: block; height: 1px; flex: 1; background: var(--sand); }
.schedule-desc { flex: 1; font-family: var(--font-serif); font-size: 1.125rem; color: var(--charcoal); }

.gallery-section { overflow:hidden; padding:3rem 0; }
@media (min-width:768px) { .gallery-section { padding:4rem 0; } }
.gallery-container { position:relative; }
.gallery-scroll { display:flex; gap:1rem; overflow-x:auto; padding:0 1.5rem 1rem; scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch; scrollbar-width:none; -ms-overflow-style:none; }
.gallery-scroll::-webkit-scrollbar { display:none; }
.gallery-item { scroll-snap-align:center; }
.gallery-img { height:18rem; width:30rem; border-radius:0.5rem; object-fit:cover; }
@media (min-width:768px) { .gallery-img { height:24rem; width:40rem; } .gallery-scroll { padding:0 3rem 1rem; } }
.gallery-arrow { position:absolute; top:50%; transform:translateY(-50%); z-index:10; display:flex; align-items:center; justify-content:center; width:2.75rem; height:2.75rem; border-radius:9999px; background:rgba(253,249,246,0.9); color:var(--charcoal); box-shadow:0 4px 12px rgba(0,0,0,0.15); backdrop-filter:blur(4px); border:none; cursor:pointer; transition:all 0.3s; }
.gallery-arrow:hover { background:var(--cream); transform:translateY(-50%) scale(1.1); }
.gallery-arrow-left { left:0.75rem; }
.gallery-arrow-right { right:0.75rem; }
@media (min-width:768px) { .gallery-arrow-left { left:1.5rem; } .gallery-arrow-right { right:1.5rem; } }
.rsvp-section { background:rgba(245,230,216,0.6); padding:6rem 0; }
@media (min-width:768px) { .rsvp-section { padding:8rem 0; } }
.rsvp-header { margin-bottom:3rem; }
.rsvp-title { font-family:var(--font-serif); font-size:2.5rem; color:var(--charcoal); }
@media (min-width:768px) { .rsvp-title { font-size:3rem; } }
.rsvp-deadline { margin-top:1rem; font-size:1rem; color:var(--muted); }
.rsvp-form { max-width:32rem; margin:0 auto; display:flex; flex-direction:column; gap:1.5rem; }
.form-field { display:flex; flex-direction:column; gap:0.5rem; }
.form-label { font-size:0.875rem; font-weight:500; color:var(--charcoal); }
.form-optional { color:var(--muted); font-weight:400; }
.form-input { width:100%; border:1px solid var(--sand); border-radius:0.5rem; background:white; padding:0.75rem 1rem; color:var(--charcoal); font-family:var(--font-sans); font-size:1rem; }
.form-input::placeholder { color:rgba(139,116,104,0.6); }
.form-input:focus { outline:none; border-color:var(--sunset); box-shadow:0 0 0 1px var(--sunset); }
.form-textarea { resize:vertical; }
.form-select { appearance:none; cursor:pointer; }
.radio-row { display:flex; gap:1rem; }
.radio-option { display:flex; align-items:center; gap:0.5rem; cursor:pointer; color:var(--charcoal); }
.radio-input { accent-color:var(--sunset); }
.form-error { border-radius:0.5rem; background:#fef2f2; padding:0.75rem 1rem; font-size:0.875rem; color:#b91c1c; }
.form-submit { width:100%; border-radius:9999px; background:var(--sunset); color:var(--cream); padding:0.875rem 2rem; font-size:0.875rem; font-weight:500; border:none; cursor:pointer; transition:all 0.3s; }
.form-submit:hover { background:var(--coral); }
.form-submit:disabled { opacity:0.6; cursor:not-allowed; }
.rsvp-success { max-width:32rem; margin:0 auto; }
.success-icon { display:inline-flex; align-items:center; justify-content:center; width:4rem; height:4rem; border-radius:9999px; background:rgba(245,191,160,0.3); margin-bottom:1.5rem; }
.success-title { font-family:var(--font-serif); font-size:1.875rem; color:var(--charcoal); }
.success-body { margin-top:1rem; color:var(--muted); }
.footer { padding:4rem 0; text-align:center; }
.footer-names { font-family:var(--font-serif); font-size:2.5rem; color:var(--charcoal); }
.footer-amp { color:var(--peach); font-style:italic; }
.footer-date { margin-top:1rem; font-size:0.875rem; letter-spacing:0.1em; color:var(--muted); }
.footer-location { font-size:0.875rem; letter-spacing:0.1em; color:var(--muted); }
@keyframes fadeUp { from { opacity:0; transform:translateY(24px); } to { opacity:1; transform:translateY(0); } }
.reveal { animation:fadeUp 1s cubic-bezier(0.16,1,0.3,1) both; }
.scroll-reveal { opacity:0; transform:translateY(30px); transition:opacity 0.8s cubic-bezier(0.16,1,0.3,1), transform 0.8s cubic-bezier(0.16,1,0.3,1); }
.scroll-reveal.is-visible { opacity:1; transform:translateY(0); }
@keyframes scrollHint { 0%,100% { transform:translateY(0); opacity:0.6; } 50% { transform:translateY(8px); opacity:1; } }
.scroll-hint { position:absolute; bottom:2rem; left:50%; transform:translateX(-50%); animation:scrollHint 2s ease-in-out infinite; }
.envelope-overlay { position:fixed; inset:0; z-index:100; display:flex; flex-direction:column; align-items:center; justify-content:center; background:linear-gradient(rgba(253,249,246,0.78), rgba(245,230,216,0.78)), url("assets/aisle.jpg") center/cover no-repeat; transition:opacity 0.8s cubic-bezier(0.16,1,0.3,1) 1s; }
.envelope-overlay.opening { opacity:0; pointer-events:none; }
.envelope-wrap { display:flex; flex-direction:column; align-items:center; gap:2.5rem; }
.envelope { position:relative; width:480px; height:320px; perspective:1400px; }
@media (max-width:640px) { .envelope { width:340px; height:230px; } }
@media (max-width:380px) { .envelope { width:300px; height:205px; } }
.envelope-back { position:absolute; inset:0; background:var(--ivory); border:1px solid var(--gold); border-radius:6px; box-shadow:0 12px 40px rgba(45,31,26,0.1); z-index:1; }
.env-name { font-family:var(--font-serif); font-size:1.25rem; color:var(--sunset); }
.env-date { margin-top:0.25rem; font-size:0.625rem; text-transform:uppercase; letter-spacing:0.2em; color:var(--muted); }
.envelope-names { position:absolute; top:18%; left:50%; transform:translateX(-50%); text-align:center; opacity:0; transition:opacity 0.5s ease 0.6s; }
.envelope.opening .envelope-names { opacity:1; }
.envelope-pocket { position:absolute; inset:0; background:var(--ivory); border:1px solid var(--gold); border-radius:6px; z-index:2; clip-path:polygon(0 100%, 0 0, 50% 50%, 100% 0, 100% 100%); box-shadow:inset 0 4px 12px rgba(201,169,110,0.08); }
.envelope-flap { position:absolute; top:0; left:0; width:100%; height:60%; background:linear-gradient(180deg, var(--ivory) 0%, var(--sand) 100%); border:1px solid var(--gold); border-radius:6px 6px 0 0; clip-path:polygon(0 0, 100% 0, 50% 100%); transform-origin:top center; transition:transform 1.2s cubic-bezier(0.4,0,0.2,1); z-index:3; }
.envelope.opening .envelope-flap { transform:rotateX(180deg); z-index:1; }
.wax-seal { position:absolute; top:55%; left:50%; transform:translate(-50%, -50%); width:140px; height:140px; z-index:4; cursor:pointer; display:flex; align-items:center; justify-content:center; border:none; background:transparent; transition:opacity 0.4s ease, transform 0.4s ease; animation:sealFloat 3s ease-in-out infinite; }
@media (max-width:640px) { .wax-seal { width:100px; height:100px; } }
@media (max-width:380px) { .wax-seal { width:88px; height:88px; } }
.seal-img { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; pointer-events:none; filter:drop-shadow(0 4px 12px rgba(168,53,32,0.35)); }
.seal-text { position:relative; z-index:1; font-family:var(--font-serif); font-size:32px; font-style:italic; font-weight:500; color:var(--cream); text-shadow:0 1px 4px rgba(0,0,0,0.5); letter-spacing:-0.02em; pointer-events:none; }
@media (max-width:640px) { .seal-text { font-size:24px; } }
@media (max-width:380px) { .seal-text { font-size:20px; } }
.wax-seal:hover { transform:translate(-50%, -50%) scale(1.08); }
.envelope.opening .wax-seal { opacity:0; transform:translate(-50%, -50%) scale(1.5); animation:none; }
@keyframes sealFloat { 0%,100% { transform:translate(-50%, -50%); } 50% { transform:translate(-50%, calc(-50% - 5px)); } }
.click-hint { font-family:var(--font-sans); font-size:11px; letter-spacing:0.25em; text-transform:uppercase; color:var(--muted); animation:hintPulse 2s ease-in-out infinite; }
@keyframes hintPulse { 0%,100% { opacity:0.4; } 50% { opacity:0.9; } }
@media (prefers-reduced-motion:reduce) {
  .reveal, .scroll-reveal { animation:none !important; transition:none !important; opacity:1 !important; transform:none !important; }
  html { scroll-behavior:auto; }
  .scroll-hint, .wax-seal, .click-hint { animation:none; }
  .envelope-overlay { transition:opacity 0.3s ease; }
  .envelope-flap { transition:transform 0.4s ease; }
  .envelope-names { transition:opacity 0.2s ease; }
}
