:root{
  --ground:#F3EADA; --paper:#FBF6EC; --card:#FFFDF8; --ink:#5A2A1E; --ink-2:#6B4034; --muted:#7A5A4C;
  --gold:#C9A13B; --gold-ink:#8A6A1E; --line:#D6C39B; --line-soft:#E6D8BC; --err:#9A2B1F;
  --serif:'Libre Baskerville',Georgia,serif; --script:'Snell Roundhand','Pinyon Script',cursive;
  --gutter:clamp(20px,5.5vw,80px);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--ground);font-family:var(--serif);color:var(--ink);-webkit-font-smoothing:antialiased}
a{color:var(--ink)}a:hover{color:var(--gold-ink)}
img{max-width:100%}
[hidden]{display:none!important}
input,textarea,button{font-family:var(--serif);font-size:16px;color:var(--ink)}
.script{font-family:var(--script);font-weight:400;margin:0;color:var(--gold-ink);line-height:1.1}
.eyebrow{margin:0;font-size:12px;letter-spacing:.24em;text-transform:uppercase}
.eyebrow.gold{color:var(--gold-ink);font-size:13px;letter-spacing:.3em}
.eyebrow.muted{color:var(--muted)}
.lede{margin:0;font-size:17px;line-height:1.7;color:var(--ink-2)}
.rule{width:200px;height:1px;background:var(--gold);margin:6px 0}
.h-xl{font-size:clamp(48px,6vw,72px)}

/* buttons */
.btn-dark,.btn-ghost{height:52px;padding:0 32px;border-radius:999px;font-size:13px;letter-spacing:.18em;text-transform:uppercase;cursor:pointer}
.btn-dark{border:none;background:var(--ink);color:var(--paper)}
.btn-dark:disabled{opacity:.4;cursor:not-allowed}
.btn-ghost{height:48px;padding:0 24px;border:1px solid var(--line);background:#fff;letter-spacing:.16em}
.pill{white-space:nowrap;display:flex;align-items:center;gap:10px;height:44px;padding:0 22px;border-radius:999px;font-size:12px;letter-spacing:.2em;text-transform:uppercase;text-decoration:none;cursor:pointer}
.pill-light{border:1px solid rgba(90,42,30,.35);background:rgba(251,246,236,.85);color:var(--ink)}
.pill-dark{background:var(--ink);color:var(--paper)!important;border:none}
.link-pill{white-space:nowrap;height:44px;padding:0 16px;border:none;border-radius:999px;background:rgba(251,246,236,.85);font-size:12px;text-decoration:underline;cursor:pointer}
:focus-visible{outline:2px solid var(--gold-ink);outline-offset:3px}

/* ---------- gate ---------- */
.gate{position:relative;min-height:100svh;display:flex;align-items:center;justify-content:center;overflow:hidden;padding:24px 16px}
.gate-bg{position:absolute;inset:-20px;width:calc(100% + 40px);height:calc(100% + 40px);max-width:none;object-fit:cover;filter:blur(5px)}
.gate-wash{position:absolute;inset:0;background:rgba(251,246,236,.45)}
.gate-card{position:relative;width:100%;max-width:560px;padding:clamp(32px,6vw,52px) clamp(24px,6vw,60px);background:var(--paper);border:3px solid var(--gold);outline:1px solid var(--gold);outline-offset:10px;display:flex;flex-direction:column;align-items:center;gap:16px;text-align:center;margin:12px}
.gate-mono{width:170px;height:180px;object-fit:contain}
.gate-names{font-size:clamp(44px,9vw,60px)}
.gate-label{font-size:15px;line-height:1.6;color:var(--ink-2)}
.gate-input{width:100%;height:54px;padding:0 18px;border:1px solid var(--line);border-radius:2px;background:#fff;text-align:center;text-transform:uppercase;letter-spacing:.2em}
.gate-btn{width:100%;height:54px;border-radius:2px;letter-spacing:.24em}

/* invitation opening */
.inv{position:fixed;inset:0;z-index:100;perspective:1400px;pointer-events:none;overflow:hidden}
.inv-bg{position:absolute;inset:0}
.inv-bg img{position:absolute;inset:-20px;width:calc(100% + 40px);height:calc(100% + 40px);max-width:none;object-fit:cover;filter:blur(5px)}
.inv-wash{position:absolute;inset:0;background:rgba(251,246,236,.45)}
.inv-shadow{position:absolute;background:rgba(60,30,15,.9);border-radius:6px}
.inv-scene{position:absolute;transform-style:preserve-3d;will-change:transform}
.inv-inner{position:absolute;inset:0;background:#FBF6EC;border:3px solid #C9A13B;padding:10px;transform:translateZ(-1px)}
.inv-inner img{width:100%;height:100%;object-fit:cover;display:block;max-width:none;box-shadow:inset 0 0 0 1px #C9A13B}
.inv-flap{position:absolute;top:0;bottom:0;width:50%;transform-style:preserve-3d;will-change:transform}
.inv-flap-left{left:0;transform-origin:left center}
.inv-flap-right{right:0;transform-origin:right center}
.inv-face{position:absolute;inset:0;overflow:hidden;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.inv-card{position:absolute;top:0;margin:0!important;outline:none!important;max-width:none!important}
.inv-sheen{position:absolute;inset:0;background:linear-gradient(105deg,rgba(255,250,230,0) 38%,rgba(255,244,205,.75) 48%,rgba(255,255,255,.9) 50%,rgba(255,244,205,.75) 52%,rgba(255,250,230,0) 62%) no-repeat;background-size:250% 100%;background-position:130% 0;mix-blend-mode:soft-light}
.inv-shade{position:absolute;inset:0;opacity:0}
.inv-flap-left .inv-shade{background:linear-gradient(90deg,rgba(30,14,6,.2),rgba(30,14,6,.75))}
.inv-flap-right .inv-shade{background:linear-gradient(270deg,rgba(30,14,6,.2),rgba(30,14,6,.75))}
.inv-back{transform:rotateY(180deg);background:#F7EEDC linear-gradient(135deg,rgba(201,161,59,.10),rgba(255,255,255,0) 40%,rgba(201,161,59,.14));border:3px solid #C9A13B}
.inv-back-frame{position:absolute;inset:12px;border:1px solid rgba(201,161,59,.8);outline:1px solid rgba(201,161,59,.45);outline-offset:-6px}
.inv-flap-left .inv-back{border-right-width:1px}.inv-flap-right .inv-back{border-left-width:1px}
.inv-edge{position:absolute;top:0;bottom:0;width:4px;background:linear-gradient(90deg,#B8902E,#E9CF86,#B8902E);transform-origin:left center}
.inv-flap-left .inv-edge{right:-2px;transform:rotateY(90deg)}
.inv-flap-right .inv-edge{left:-2px;transform:rotateY(-90deg)}
.inv-flash{position:absolute;inset:0;opacity:0;background:radial-gradient(ellipse at 50% 45%,#FFFBEF 0%,#FBF1D6 55%,#F3E2B8 100%)}
.hero.no-intro .veil,.hero.no-intro .splash{display:none}
.burst-petal{position:absolute;border-radius:60% 0 60% 0;z-index:2}
.gate-block{width:100%;display:flex;flex-direction:column;align-items:center;gap:16px}
.gate-dates{margin:0;font-size:15px;letter-spacing:.2em;text-transform:uppercase}

/* ---------- hero ---------- */
.hero{position:relative;height:100svh;min-height:560px;max-height:1100px;overflow:hidden;background:#F4ECD6;cursor:default}
.layer{position:absolute;inset:0;pointer-events:none}
.layer-far{inset:-30px;transition:transform .9s cubic-bezier(.2,.7,.2,1)}
.layer-mid{transition:transform 1.1s cubic-bezier(.2,.7,.2,1)}
.layer-near{left:-40px;right:-40px;transition:transform 1.3s cubic-bezier(.2,.7,.2,1)}
.scene{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;animation:breathe 24s ease-in-out infinite alternate;transform-origin:50% 40%}
@keyframes breathe{from{transform:scale(1)}to{transform:scale(1.05)}}
.veil{position:absolute;inset:0;background:var(--paper);animation:veil 2.2s ease .6s both;pointer-events:none}
@keyframes veil{from{opacity:1}to{opacity:0}}
.splash{position:absolute;border-radius:50%;filter:blur(18px);mix-blend-mode:multiply;pointer-events:none;animation:splash 2.6s cubic-bezier(.2,.7,.2,1) both}
@keyframes splash{0%{opacity:0;transform:scale(.15)}25%{opacity:.85}100%{opacity:0;transform:scale(2.6)}}
.petal{position:absolute;top:-30px;border-radius:60% 0 60% 0;opacity:.85;animation:fall linear infinite both}
@keyframes fall{0%{transform:translate(0,-20px) rotate(0)}25%{transform:translate(40px,26vh) rotate(120deg)}50%{transform:translate(-20px,52vh) rotate(220deg)}75%{transform:translate(50px,78vh) rotate(330deg)}100%{transform:translate(0,105vh) rotate(420deg)}}
.fly{position:absolute;left:-80px;animation:fly linear infinite both}
@keyframes fly{0%{transform:translate(0,0)}25%{transform:translate(28vw,-30px)}50%{transform:translate(56vw,10px)}75%{transform:translate(83vw,-40px)}100%{transform:translate(calc(100vw + 180px),-10px)}}
.wing{transform-box:fill-box;transform-origin:center;animation:flap .32s ease-in-out infinite alternate}
@keyframes flap{from{transform:scaleY(1)}to{transform:scaleY(-.5)}}
.flutter,.flutter2,.flutter3{position:absolute;left:0;top:0;animation-timing-function:ease-in-out;animation-iteration-count:infinite;animation-fill-mode:both}
.flutter{animation-name:flutter}.flutter2{animation-name:flutter2}.flutter3{animation-name:flutter3}
@keyframes flutter{0%{transform:translate(-6vw,54vh) rotate(10deg)}20%{transform:translate(21vw,40vh) rotate(-8deg)}40%{transform:translate(39vw,49vh) rotate(12deg)}60%{transform:translate(62vw,31vh) rotate(-10deg)}80%{transform:translate(83vw,44vh) rotate(8deg)}100%{transform:translate(107vw,27vh) rotate(-6deg)}}
@keyframes flutter2{0%{transform:translate(105vw,67vh) rotate(-10deg)}25%{transform:translate(76vw,54vh) rotate(8deg)}50%{transform:translate(54vw,73vh) rotate(-12deg)}75%{transform:translate(26vw,58vh) rotate(10deg)}100%{transform:translate(-7vw,69vh) rotate(-8deg)}}
@keyframes flutter3{0%{transform:translate(48vw,102vh) rotate(0)}30%{transform:translate(39vw,67vh) rotate(-14deg)}55%{transform:translate(57vw,49vh) rotate(12deg)}80%{transform:translate(44vw,25vh) rotate(-10deg)}100%{transform:translate(62vw,-8vh) rotate(8deg)}}
.bwing{transform-box:fill-box;transform-origin:center;animation:bflap .22s ease-in-out infinite alternate}
@keyframes bflap{from{transform:scaleX(1)}to{transform:scaleX(.25)}}
.twinkle{position:absolute;width:10px;height:10px;background:#E9C46A;clip-path:polygon(50% 0,62% 38%,100% 50%,62% 62%,50% 100%,38% 62%,0 50%,38% 38%);animation:twinkle 3.2s ease-in-out infinite both}
@keyframes twinkle{0%,100%{opacity:0;transform:scale(.4) rotate(0)}50%{opacity:1;transform:scale(1.3) rotate(45deg)}}
@keyframes rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.rise-late{animation:rise 1s ease 2.4s both}
.bob{animation:bob 2s ease-in-out infinite}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(8px)}}
.glow{position:absolute;width:260px;height:320px;border-radius:50%;background:radial-gradient(circle,rgba(255,236,170,.55) 0%,rgba(255,236,170,0) 70%);mix-blend-mode:screen;animation:glow 5s ease-in-out infinite alternate}
@keyframes glow{from{opacity:.35;transform:scale(.9)}to{opacity:.9;transform:scale(1.12)}}
.cloud{position:absolute;left:-400px;border-radius:50%;background:radial-gradient(ellipse at center,rgba(255,255,255,.75) 0%,rgba(255,255,255,0) 70%);filter:blur(6px);animation:drift linear infinite}
@keyframes drift{from{transform:translateX(0)}to{transform:translateX(calc(100vw + 600px))}}
.ray{position:absolute;top:-120px;width:160px;height:130%;background:linear-gradient(180deg,rgba(255,244,210,0) 0%,rgba(255,244,210,.42) 35%,rgba(255,244,210,0) 100%);transform:rotate(18deg);transform-origin:top center;mix-blend-mode:screen;filter:blur(8px);animation:ray 9s ease-in-out infinite alternate}
@keyframes ray{from{opacity:.15;transform:rotate(15deg)}to{opacity:.7;transform:rotate(21deg)}}
.mote{position:absolute;border-radius:50%;background:#FFE7A0;box-shadow:0 0 8px 3px rgba(255,220,130,.7);animation:mote ease-in-out infinite both}
@keyframes mote{0%{opacity:0;transform:translate(0,0)}20%{opacity:1}50%{transform:translate(30px,-220px)}80%{opacity:.9}100%{opacity:0;transform:translate(-20px,-460px)}}
.ripple{position:absolute;width:360px;height:360px;margin:-180px 0 0 -180px;border-radius:50%;filter:blur(14px);mix-blend-mode:multiply;animation:splash 2.2s cubic-bezier(.2,.7,.2,1) both}
.ripple-ring{position:absolute;width:40px;height:40px;margin:-20px 0 0 -20px;border-radius:50%;border:2px solid;animation:ring 1.6s ease-out both}
@keyframes ring{from{opacity:.9;transform:scale(.2)}to{opacity:0;transform:scale(6)}}

.hero-hint{position:absolute;left:0;right:0;top:96px;margin:0;text-align:center;font-size:12px;letter-spacing:.3em;text-transform:uppercase;pointer-events:none;padding:0 16px}
.hero-bar{position:absolute;top:28px;left:var(--gutter);right:var(--gutter);display:flex;justify-content:space-between;align-items:center;gap:12px}
.hero-bar-right{display:flex;align-items:center;gap:12px}
#sound-btn .ico-on{display:none}
#sound-btn[aria-pressed="true"] .ico-on{display:block}
#sound-btn[aria-pressed="true"] .ico-off{display:none}
.hero-foot{position:absolute;left:0;right:0;bottom:44px;display:flex;flex-direction:column;align-items:center;gap:10px;padding:0 16px}
.hero-date{padding:8px 20px;background:rgba(251,246,236,.88);border-radius:999px;font-size:13px;letter-spacing:.24em;text-transform:uppercase;text-align:center}
.down{width:48px;height:48px;border-radius:50%;background:rgba(251,246,236,.88);display:flex;align-items:center;justify-content:center}

/* ---------- celebrations ---------- */
.events{--bg:#F2E3B6;--fg:#4A2418;--accent:#7A5A14;--line:rgba(74,36,24,.2);min-height:100svh;padding:72px clamp(20px,6.6vw,96px) 56px;background:var(--bg);color:var(--fg);display:flex;flex-direction:column;gap:40px;transition:background-color .6s ease,color .6s ease}
.events-head{white-space:nowrap;display:flex;justify-content:space-between;align-items:baseline;gap:16px}
.events-title{font-size:clamp(44px,5vw,64px);line-height:1;color:var(--accent)}
.stage{flex-grow:1;display:flex;align-items:center;gap:clamp(40px,6vw,88px)}
.frame{width:540px;max-width:100%;flex-shrink:0;padding:10px;border:3px solid var(--gold);outline:1px solid var(--gold);outline-offset:10px;background:var(--bg)}
/* padding-box ratio (600/540) instead of aspect-ratio: Safari can collapse %-height children of aspect-ratio boxes */
.frame-inner{position:relative;width:100%;height:0;padding-top:111.111%}
.frame-inner>*{position:absolute;top:0;left:0;width:100%;height:100%}
.frame img{object-fit:cover;display:block}
.stage-art{animation:bloom .8s ease both}
@keyframes bloom{from{opacity:0;transform:scale(1.04)}to{opacity:1;transform:none}}
.stage-copy{flex-grow:1;display:flex;flex-direction:column;gap:18px;animation:rise .7s ease both;min-width:0}
.stage-name{font-family:var(--script);font-size:clamp(64px,7.8vw,112px);line-height:1.02;color:var(--accent)}
.stage-tag{font-size:22px}
.stage-line{width:120px;height:1px;background:var(--accent)}
.stage-time{font-size:19px;line-height:1.8;white-space:pre-line}
.dress-btn{align-self:flex-start;height:44px;padding:0 4px;border:none;border-bottom:1px solid var(--accent);background:transparent;color:var(--fg);font-size:13px;letter-spacing:.2em;text-transform:uppercase;cursor:pointer}
.stage-nav{display:flex;gap:12px;margin-top:18px}
.circle-btn{width:52px;height:52px;border-radius:50%;border:1px solid var(--accent);background:transparent;color:var(--fg);cursor:pointer;display:flex;align-items:center;justify-content:center}
.next-btn{height:52px;padding:0 26px;border-radius:999px;border:1px solid var(--accent);background:var(--accent);color:var(--bg);font-size:12px;letter-spacing:.22em;text-transform:uppercase;cursor:pointer;display:flex;align-items:center;gap:10px}
.timeline{display:flex;justify-content:center;align-items:flex-start;gap:8px;padding-top:28px;border-top:1px solid var(--line);flex-wrap:wrap}
.tl{width:170px;padding:6px;border:none;background:transparent;color:var(--fg);cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:10px;opacity:.55;transition:opacity .3s ease}
.tl[aria-pressed="true"]{opacity:1}
.tl img{width:76px;height:76px;border-radius:50%;object-fit:cover;border:2px solid transparent;outline:1px solid transparent;outline-offset:4px}
.tl[aria-pressed="true"] img{border-color:var(--gold);outline-color:var(--gold)}
.tl-name{font-size:14px}
.tl-date{font-size:11px;letter-spacing:.16em;text-transform:uppercase}

.dress{width:100%;height:100%;padding:34px 36px;background:var(--paper);color:#4A2418;display:flex;flex-direction:column;gap:14px;overflow:auto}
.dress .k{font-size:10px;letter-spacing:.26em;text-transform:uppercase;color:var(--gold-ink)}
.dress-world{font-family:var(--script);font-size:50px;line-height:1.1;color:var(--gold-ink)}
.dress-sub{font-size:13px;font-style:italic;color:var(--ink-2)}
.dress p{margin:0;font-size:15px;line-height:1.6}
.tags{display:flex;flex-wrap:wrap;gap:6px}
.tags span{padding:5px 12px;border:1px solid var(--line);border-radius:999px;font-size:12px}
.dress-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;padding-top:12px;border-top:1px solid var(--line-soft)}
.dress-grid>div{display:flex;flex-direction:column;gap:6px}
.mood{font-size:14px;font-style:italic;line-height:1.6}
.swatch-row{display:flex;align-items:center;gap:8px;font-size:12px;line-height:1.4}
.swatch{width:12px;height:12px;flex-shrink:0;border-radius:50%;border:1px solid rgba(0,0,0,.12)}

/* ---------- venue ---------- */
.venue{padding:100px var(--gutter);display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(40px,6.6vw,96px)}
.venue-photo{min-height:420px;border:3px solid var(--gold);background:#E9DEC6;display:flex;align-items:center;justify-content:center;font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);text-align:center;padding:16px}
.venue-copy{display:flex;flex-direction:column;gap:20px}
.travel{margin:0;display:flex;flex-direction:column;border-bottom:1px solid var(--line)}
.travel>div{display:flex;gap:24px;padding:20px 0;border-top:1px solid var(--line)}
.travel dt{width:110px;flex-shrink:0;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-ink);padding-top:4px}
.travel dd{margin:0;font-size:16px;line-height:1.7}

/* ---------- rsvp ---------- */
.rsvp{padding:110px var(--gutter);display:flex;flex-direction:column;align-items:center;gap:44px}
.rsvp-head{display:flex;flex-direction:column;align-items:center;gap:14px;text-align:center}
.h-rsvp{font-size:clamp(64px,7vw,88px)}
.rsvp-card{width:100%;max-width:800px;padding:clamp(28px,5vw,56px) clamp(20px,5vw,64px);background:var(--card);border:1px solid var(--gold);border-radius:4px;outline:1px solid var(--gold);outline-offset:8px;display:flex;flex-direction:column;gap:30px}
.rsvp-progress{white-space:nowrap;display:flex;justify-content:space-between;align-items:center;gap:12px}
.dots{display:flex;gap:6px}
.dots span{width:28px;height:3px;border-radius:2px;background:var(--line-soft)}
.dots span.on{background:var(--ink)}
.step{border:0;margin:0;padding:0;min-width:0;display:flex;flex-direction:column;gap:24px}
.h-step{font-size:clamp(36px,5vw,46px)}
.field{display:flex;flex-direction:column;gap:8px}
.field label,.q{font-size:15px;font-weight:500}
.req{color:var(--err)}
.hint{font-size:14px;color:var(--muted)}
.field input,.field textarea{height:52px;padding:0 16px;border:1px solid var(--line);border-radius:8px;background:#fff;width:100%}
.field textarea{height:auto;padding:14px 16px;resize:vertical}
.field input.narrow{width:180px}
.grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.chips{display:flex;flex-wrap:wrap;gap:12px}
.chip{height:48px;padding:0 24px;border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--ink);font-size:15px;cursor:pointer}
.chip[aria-pressed="true"]{border-color:var(--ink);background:var(--ink);color:var(--paper)}
#event-chips .chip{height:44px;padding:0 20px;font-size:14px}
#event-chips .chip[aria-pressed="true"]::before{content:"✓ "}
.thanks{align-items:center;text-align:center;padding:36px 0;gap:16px}
.thanks .lede{max-width:500px}
.h-thanks{font-family:var(--script);font-size:64px;color:var(--gold-ink)}
.form-error{margin:0;font-size:14px;color:var(--err)}
.rsvp-nav{display:flex;justify-content:space-between;align-items:center;padding-top:24px;border-top:1px solid var(--line-soft);gap:12px}

/* ---------- faq & footer ---------- */
.faq{padding:90px var(--gutter);background:#EDE2CC;display:flex;flex-direction:column;gap:44px}
.faq-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:56px}
.faq-item{display:flex;flex-direction:column;gap:12px;padding-top:22px;border-top:1px solid var(--gold)}
.faq-item h3{margin:0;font-size:18px;font-weight:700}
.faq-item p{margin:0;font-size:15px;line-height:1.8;color:var(--ink-2)}
.foot{padding:48px var(--gutter) 64px;display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center;border-top:1px solid var(--gold)}
.foot img{object-fit:contain}
.foot-names{font-size:44px}

/* ---------- responsive ---------- */
@media (max-width:1024px){
  .stage{flex-direction:column;align-items:stretch}
  .frame{align-self:center;width:min(540px,100%)}
  .venue{grid-template-columns:1fr}
  .faq-grid{grid-template-columns:1fr;gap:32px}
  .tl{width:118px}
}
@media (max-width:640px){
  .hero-bar{top:16px}
  .hero-hint{top:80px}
  .pill{padding:0 16px;letter-spacing:.14em}
  #sound-btn{width:44px;padding:0;justify-content:center}
  #sound-label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .link-pill{padding:0 12px}
  .hero-bar-right{gap:8px}
  .hero-date{font-size:11px;letter-spacing:.16em}
  .events{padding-top:56px;gap:28px}
  .tl{width:96px}
  .tl img{width:60px;height:60px}
  .dress{padding:24px 22px}
  .dress-world{font-size:40px}
  .dress-grid{grid-template-columns:1fr}
  .frame-inner{height:auto;padding-top:0}
  .frame-inner>*{position:static;height:auto}
  .venue,.rsvp{padding-top:72px;padding-bottom:72px}
  .venue-photo{min-height:260px}
  .travel>div{flex-direction:column;gap:6px}
  .grid2{grid-template-columns:1fr}
  .dots span{width:18px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .scene,.petal,.fly,.flutter,.flutter2,.flutter3,.wing,.bwing,.twinkle,.bob,.splash,.mote,.ray,.cloud,.glow{animation:none!important}
  .petal,.splash,.mote,.cloud,.fly,.flutter,.flutter2,.flutter3{display:none}
}