:root {
  --forest: #063f36;
  --forest-dark: #032d29;
  --forest-soft: #0b6455;
  --rio: #089bb3;
  --rio-dark: #08677c;
  --sky: #dff4f1;
  --coral: #ee665d;
  --sun: #f6cb54;
  --pink: #efb2b4;
  --cream: #f8f2e7;
  --paper: #fffdf8;
  --ink: #143b3a;
  --muted: #5d7772;
  --line: rgba(20, 59, 58, 0.14);
  --shadow: 0 22px 55px rgba(4, 49, 44, 0.14);
  --wrap: min(1120px, calc(100% - 44px));
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 24px; }
body { margin: 0; min-width: 320px; background: var(--cream); color: var(--ink); font-family: ui-rounded, "Arial Rounded MT Bold", "Trebuchet MS", system-ui, sans-serif; line-height: 1.6; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; }
body.gated { overflow: hidden; }
button, input, textarea, select { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { color: inherit; }
a { color: inherit; }
img, video { display: block; max-width: 100%; }
img { height: auto; }
:focus-visible { outline: 3px solid var(--sun); outline-offset: 4px; }
h1, h2, h3, p, figure { margin-top: 0; }
h1, h2, h3 { line-height: 1.05; }
h2 { margin-bottom: 22px; font-size: clamp(2.35rem, 5vw, 4.8rem); letter-spacing: -0.055em; }

.wrap { width: var(--wrap); margin-inline: auto; }
.section { padding: clamp(86px, 9vw, 132px) 0; }
.skip-link { position: fixed; z-index: 300; top: 10px; left: 10px; padding: 9px 15px; border-radius: 99px; background: white; transform: translateY(-150%); }
.skip-link:focus { transform: none; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.kicker { margin: 0 0 16px; color: var(--rio-dark); font-size: .71rem; font-weight: 900; letter-spacing: .18em; text-transform: uppercase; }
.kicker--pale { color: #bfe9e3; }

.button { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 52px; padding: 14px 22px; border: 1px solid rgba(255,255,255,.55); border-radius: 99px; font-size: .83rem; font-weight: 900; letter-spacing: .025em; text-decoration: none; box-shadow: 0 14px 32px rgba(2,37,34,.2); cursor: pointer; transition: transform .2s ease, box-shadow .2s ease; }
.button:hover { transform: translateY(-2px); box-shadow: 0 18px 38px rgba(2,37,34,.28); }
.button--sun { background: var(--sun); color: var(--forest-dark); }
.button svg { fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.6; }

/* Cinematic entry */
.jungle-gate { position: fixed; z-index: 150; inset: 0; display: grid; place-items: center; min-height: 100svh; overflow: hidden; perspective: 1500px; background: var(--forest-dark); color: white; isolation: isolate; }
.jungle-gate__world { position: absolute; z-index: -3; inset: 0; background: linear-gradient(rgba(3,48,39,.28), rgba(3,48,39,.44)), url("assets/images/picnic-lg.jpg") center 43% / cover no-repeat; transform: scale(1.04); }
.jungle-door { position: absolute; z-index: 2; top: 0; bottom: 0; width: 50.2%; overflow: hidden; background-image: linear-gradient(rgba(2,43,36,.44), rgba(3,39,34,.58)), url("assets/images/treehouse-lg.jpg"); background-size: 100vw auto; background-repeat: no-repeat; box-shadow: inset 0 0 90px rgba(1,26,22,.48); transition: transform 1.35s cubic-bezier(.72,.02,.22,1); transform-style: preserve-3d; backface-visibility: hidden; }
.jungle-door::before { content: ""; position: absolute; inset: 15px; border: 1px solid rgba(246,203,84,.55); box-shadow: inset 0 0 0 7px rgba(2,44,37,.35); }
.jungle-door::after { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 50% 45%, transparent 0 23%, rgba(2,41,35,.25) 68%, rgba(2,32,28,.52)); }
.jungle-door--left { left: 0; background-position: left center; border-right: 5px solid #9a6a3d; transform-origin: left center; }
.jungle-door--right { right: 0; background-position: right center; border-left: 5px solid #9a6a3d; transform-origin: right center; }
.jungle-gate.is-opening .jungle-door--left { transform: rotateY(-105deg); }
.jungle-gate.is-opening .jungle-door--right { transform: rotateY(105deg); }
.jungle-gate.is-opening .gate-crest, .jungle-gate.is-opening .jungle-gate__date, .jungle-gate.is-opening .jungle-gate__seam { opacity: 0; transform: scale(.86); }
.jungle-gate.is-opening { animation: gateFade .35s ease 1.2s forwards; }
.jungle-gate__seam { position: absolute; z-index: 4; top: 0; bottom: 0; left: 50%; width: 2px; background: linear-gradient(transparent 4%, rgba(246,203,84,.7) 20%, rgba(246,203,84,.92) 50%, rgba(246,203,84,.7) 80%, transparent 96%); box-shadow: 0 0 28px rgba(246,203,84,.6); transition: .35s ease; }
.jungle-door__vine { position: absolute; z-index: 2; width: 110px; height: 310px; border-radius: 70% 0 70% 0; background: linear-gradient(135deg, #2b8d5a, #0d5d43); filter: drop-shadow(0 12px 15px rgba(0,0,0,.22)); opacity: .85; }
.jungle-door__vine--one { top: -90px; left: -25px; transform: rotate(30deg); }
.jungle-door__vine--two { right: -40px; bottom: -130px; transform: rotate(210deg); }
.gate-crest { position: relative; z-index: 7; width: min(430px, calc(100% - 46px)); padding: 30px 26px 26px; border: 1px solid rgba(255,255,255,.45); border-radius: 190px 190px 28px 28px; background: rgba(3,49,43,.78); text-align: center; box-shadow: 0 28px 80px rgba(0,22,19,.48); backdrop-filter: blur(10px); transition: opacity .3s ease, transform .3s ease; }
.gate-crest__monogram { display: grid; place-items: center; width: 72px; height: 72px; margin: -3px auto 17px; border: 1px solid rgba(246,203,84,.8); border-radius: 50%; color: var(--sun); font-family: Georgia, serif; font-size: 1.8rem; font-style: italic; }
.gate-crest h1 { margin: 0; font-family: Georgia, "Times New Roman", serif; font-size: clamp(3.2rem, 8vw, 5.7rem); font-style: italic; font-weight: 500; letter-spacing: -.07em; }
.gate-crest__age { margin: 5px 0 20px; font-size: .9rem; letter-spacing: .12em; text-transform: uppercase; }
.gate-crest__age strong { margin-inline: 5px; color: var(--sun); font-size: 1.7rem; }
.gate-crest > p:last-child { margin: 12px 0 0; color: rgba(255,255,255,.74); font-family: system-ui, sans-serif; font-size: .68rem; }
.jungle-gate__date { position: absolute; z-index: 7; bottom: calc(22px + env(safe-area-inset-bottom)); margin: 0; font-size: .7rem; font-weight: 900; letter-spacing: .28em; transition: .3s ease; }

.music-control { position: fixed; z-index: 100; right: max(16px, env(safe-area-inset-right)); bottom: max(16px, env(safe-area-inset-bottom)); display: flex; align-items: center; gap: 8px; min-height: 46px; padding: 9px 13px; border: 1px solid rgba(255,255,255,.45); border-radius: 99px; background: rgba(3,55,48,.9); color: white; box-shadow: 0 12px 30px rgba(1,36,31,.25); backdrop-filter: blur(10px); cursor: pointer; }
.music-control[hidden] { display: none; }
.music-control > span:last-child { font-size: .68rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.music-control__bars { display: flex; align-items: center; gap: 2px; height: 20px; }
.music-control__bars i { display: block; width: 3px; border-radius: 4px; background: var(--sun); animation: bar .8s ease-in-out infinite alternate; }
.music-control__bars i:nth-child(1) { height: 8px; }.music-control__bars i:nth-child(2) { height: 17px; animation-delay: -.3s; }.music-control__bars i:nth-child(3) { height: 12px; animation-delay: -.5s; }.music-control__bars i:nth-child(4) { height: 19px; animation-delay: -.15s; }
.music-control.is-paused .music-control__bars i { height: 4px; animation-play-state: paused; }

/* Main hero */
.hero { position: relative; min-height: 760px; overflow: hidden; background: var(--cream); }
.nav { position: relative; z-index: 5; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; width: min(1240px, calc(100% - 42px)); min-height: 70px; margin-inline: auto; border-bottom: 1px solid var(--line); font-size: .66rem; font-weight: 900; letter-spacing: .13em; text-transform: uppercase; }
.nav a { text-decoration: none; }.nav > a:last-child { justify-self: end; }.nav p { margin: 0; color: var(--muted); }.nav__mark { font-size: 1.12rem; letter-spacing: -.02em; }.nav__mark span { color: var(--coral); }
.hero__content { position: relative; z-index: 2; display: grid; grid-template-columns: minmax(0,1fr) 340px; align-items: center; gap: clamp(58px,9vw,125px); padding: 76px 0 96px; }
.hero__copy { max-width: 650px; }
.hero__copy h1 { margin: 0 0 22px; color: var(--forest); font-size: clamp(4.2rem,8vw,7.2rem); letter-spacing: -.08em; }
.hero__copy h1 em { color: var(--rio-dark); font-family: Georgia, serif; font-weight: 500; }
.hero__statement { display: flex; align-items: center; gap: 18px; margin: 0 0 21px; font-size: 1.05rem; font-weight: 900; line-height: 1.25; }
.hero__statement strong { color: var(--coral); font-size: 4.9rem; line-height: .8; }.hero__statement span { padding-left: 18px; border-left: 1px solid var(--line); }
.hero__text { max-width: 530px; margin-bottom: 27px; color: var(--muted); font-family: system-ui, sans-serif; font-size: 1.02rem; }
.quiet-link { color: var(--forest); font-size: .72rem; font-weight: 900; letter-spacing: .09em; text-decoration-thickness: 2px; text-underline-offset: 5px; text-transform: uppercase; }
.video-card { width: 100%; padding: 13px; border: 1px solid var(--line); border-radius: 26px; background: var(--paper); box-shadow: var(--shadow); transform: rotate(1.2deg); }
.video-card__top { display: flex; align-items: center; gap: 8px; padding: 4px 6px 11px; color: var(--rio-dark); font-size: .68rem; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }.video-card__top span { width: 8px; height: 8px; border-radius: 50%; background: var(--coral); }
.video-card video { width: 100%; aspect-ratio: 9/15.2; border-radius: 18px; background: var(--forest-dark); object-fit: cover; }
.video-card > p { margin: 10px 5px 2px; color: var(--muted); font-family: system-ui,sans-serif; font-size: .67rem; line-height: 1.45; }
.hero__flora { position: absolute; width: 330px; height: 440px; border-radius: 100% 0 100% 0; background: var(--forest-soft); opacity: .1; }.hero__flora--left { top: -230px; left: -120px; transform: rotate(35deg); }.hero__flora--right { right: -190px; bottom: -250px; background: var(--rio); transform: rotate(205deg); }

/* Countdown */
.countdown { position: relative; padding: 82px 0; overflow: hidden; background: var(--sky); color: white; }
.countdown::before, .countdown::after { content: ""; position: absolute; width: 280px; height: 360px; border-radius: 100% 0 100% 0; background: var(--forest-soft); opacity: .13; }
.countdown::before { top: -210px; left: -80px; transform: rotate(38deg); }
.countdown::after { right: -100px; bottom: -230px; background: var(--rio); transform: rotate(210deg); }
.countdown__inner { position: relative; z-index: 1; display: grid; grid-template-columns: 1fr 190px 205px; align-items: center; gap: clamp(28px,5vw,58px); padding: 36px 42px; border-radius: 34px; background: var(--forest); box-shadow: 0 24px 60px rgba(3,45,41,.18); }
.countdown__intro h2 { max-width: 500px; margin: 0 0 13px; font-size: clamp(2.35rem,4.4vw,4rem); }.countdown__intro > p:last-child { margin: 0; color: #d7eee9; font-family: system-ui,sans-serif; }
.countdown__number { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 174px; height: 174px; border: 7px solid rgba(255,255,255,.46); border-radius: 50%; background: var(--sun); color: var(--forest-dark); box-shadow: 0 16px 36px rgba(2,31,28,.24); }.countdown__number strong { font-size: 5.4rem; letter-spacing: -.08em; line-height: .76; }.countdown__number span { margin-top: 11px; color: var(--coral); font-size: .72rem; font-weight: 900; letter-spacing: .15em; text-transform: uppercase; }
.countdown__date { padding: 21px 18px; border: 1px solid rgba(255,255,255,.18); border-radius: 20px; background: rgba(255,255,255,.1); text-align: center; }.countdown__date > span, .countdown__date small { display: block; color: #c9efea; font-size: .62rem; font-weight: 900; letter-spacing: .13em; text-transform: uppercase; }.countdown__date strong { display: block; margin: 4px 0 -1px; color: var(--sun); font-size: 3.8rem; line-height: 1; }.countdown__date p { margin: 0 0 9px; font-size: .72rem; font-weight: 900; text-transform: uppercase; }

/* Story */
.story { background: var(--paper); }
.story__grid { display: grid; grid-template-columns: 260px 1fr; align-items: center; gap: clamp(50px,8vw,105px); }
.framed-photo { position: relative; width: 100%; max-width: 340px; margin: 0; }.framed-photo::before { content: ""; position: absolute; z-index: 0; inset: -16px 18px 20px -16px; border-radius: 26px; background: var(--sun); transform: rotate(-4deg); }.framed-photo picture { position: relative; z-index: 1; display: block; overflow: hidden; border: 8px solid white; border-radius: 25px; box-shadow: var(--shadow); }.framed-photo img { width: 100%; aspect-ratio: 9/13.5; object-fit: cover; }.framed-photo figcaption { position: relative; z-index: 2; width: max-content; margin: -18px auto 0; padding: 9px 14px; border-radius: 99px; background: var(--coral); color: white; font-size: .67rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.framed-photo--story { max-width: 250px; }.framed-photo--story img { aspect-ratio: 4/5; object-position: center 35%; }
.story__copy { max-width: 660px; }.story__copy h2 { color: var(--forest); }.story__copy > p:not(.kicker) { max-width: 620px; color: var(--muted); font-family: system-ui,sans-serif; font-size: 1.08rem; }
.story__signature { margin-top: 34px; padding-top: 22px; border-top: 1px solid var(--line); }.story__signature span { display: block; color: var(--muted); font-family: Georgia,serif; font-style: italic; }.story__signature strong { color: var(--coral); font-family: Georgia,serif; font-size: 1.8rem; font-style: italic; font-weight: 500; }

/* Details */
.details { background: var(--forest); color: white; }
.section-title { max-width: 780px; margin-bottom: 42px; }.section-title h2 { margin: 0; }.section-title--ink h2 { color: var(--forest); }
.details__row { display: grid; grid-template-columns: repeat(3,1fr); gap: 18px; }
.info-card { position: relative; min-height: 270px; padding: 25px; overflow: hidden; border: 1px solid rgba(255,255,255,.18); border-radius: 21px; background: rgba(255,255,255,.065); }.info-card--coral { background: var(--coral); }.info-card__index { position: absolute; top: 20px; right: 22px; color: rgba(255,255,255,.44); font-size: .65rem; font-weight: 900; letter-spacing: .15em; }.info-card svg { width: 31px; height: 31px; margin-bottom: 46px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.6; }.info-card p { margin: 0 0 8px; color: #bfe5dd; font-size: .65rem; font-weight: 900; letter-spacing: .13em; text-transform: uppercase; }.info-card--coral p { color: #fff0ed; }.info-card h3 { margin: 0 0 6px; font-size: 1.75rem; }.info-card strong { color: #d9f0eb; font-family: system-ui,sans-serif; font-size: .82rem; font-weight: 500; }.info-card a { display: inline-block; margin-top: 12px; font-size: .69rem; font-weight: 900; letter-spacing: .06em; text-underline-offset: 4px; text-transform: uppercase; }

/* Surprises */
.surprises { background: var(--cream); }
.surprises__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.surprise-card { display: grid; grid-template-columns: 205px 1fr; min-height: 295px; overflow: hidden; border: 1px solid var(--line); border-radius: 24px; background: var(--paper); box-shadow: 0 16px 42px rgba(4,49,44,.09); }.surprise-card picture { height: 100%; overflow: hidden; }.surprise-card img { width: 100%; height: 100%; object-fit: cover; object-position: center; }.surprise-card > div { display: flex; flex-direction: column; justify-content: center; padding: 28px; }.surprise-card span { color: var(--coral); font-size: .64rem; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }.surprise-card h3 { margin: 12px 0; color: var(--forest); font-size: clamp(1.55rem,2.2vw,2.15rem); }.surprise-card p { margin: 0; color: var(--muted); font-family: system-ui,sans-serif; font-size: .88rem; }.surprise-card--blue { background: var(--sky); }.surprise-card--blue span { color: var(--rio-dark); }

/* Location */
.location { background: var(--forest-dark); color: white; }
.location__grid { display: grid; grid-template-columns: minmax(0,1.1fr) minmax(360px,.8fr); align-items: center; gap: clamp(58px,9vw,115px); }
.map-art { position: relative; max-width: 590px; padding: 20px; border: 1px solid rgba(255,255,255,.16); border-radius: 28px; background: #e2efe7; box-shadow: 0 25px 60px rgba(0,20,18,.25); transform: rotate(-1.5deg); }.map-art svg { width: 100%; height: auto; }.map-art__road { fill: none; stroke: white; stroke-width: 24; stroke-linecap: round; }.map-art__road--small { stroke-width: 14; }.map-art circle:not(.map-art__pin-center) { fill: rgba(8,155,179,.12); }.map-art__pin { fill: var(--coral); }.map-art__pin-center { fill: var(--sun); }.map-art__trees circle { fill: var(--forest-soft)!important; }.map-art__tag { position: absolute; right: 28px; bottom: 25px; padding: 9px 14px; border-radius: 99px; background: var(--forest); color: white; font-size: .65rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.location__copy h2 { font-size: clamp(2.7rem,5vw,4.7rem); }.location__place { margin: 30px 0 27px; padding: 20px 0; border-top: 1px solid rgba(255,255,255,.17); border-bottom: 1px solid rgba(255,255,255,.17); }.location__place span { display: block; color: #a8d8d0; font-size: .65rem; font-weight: 900; letter-spacing: .14em; text-transform: uppercase; }.location__place strong { display: block; margin: 5px 0; color: var(--sun); font-family: Georgia,serif; font-size: 1.7rem; font-style: italic; font-weight: 500; }.location__place p { margin: 0; color: #c8ded9; font-family: system-ui,sans-serif; font-size: .86rem; }

/* Gallery */
.gallery { overflow: hidden; background: var(--paper); }
.gallery__heading { display: grid; grid-template-columns: 1fr .7fr; align-items: end; gap: 55px; margin-bottom: 38px; }.gallery__heading h2 { margin: 0; color: var(--forest); }.gallery__heading > p { max-width: 420px; margin: 0; color: var(--muted); font-family: system-ui,sans-serif; font-size: .91rem; }
.album-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.album-card { min-width: 0; margin: 0; }
.album-card__button { display: block; width: 100%; padding: 0; overflow: hidden; border: 1px solid var(--line); border-radius: 18px; background: var(--cream); box-shadow: 0 12px 28px rgba(4,49,44,.09); cursor: zoom-in; transition: transform .2s ease, box-shadow .2s ease; }
.album-card__button:hover { transform: translateY(-3px); box-shadow: 0 17px 34px rgba(4,49,44,.14); }
.album-card__button picture { display: block; overflow: hidden; }
.album-card__button img { width: 100%; aspect-ratio: 4/5; object-fit: cover; }
.album-card:nth-child(1) img { object-position: center 48%; }.album-card:nth-child(2) img { object-position: center 38%; }.album-card:nth-child(3) img { object-position: center 39%; }.album-card:nth-child(4) img { object-position: center 35%; }.album-card:nth-child(5) img { object-position: center 42%; }.album-card:nth-child(6) img { object-position: center 37%; }.album-card:nth-child(7) img { object-position: center 39%; }.album-card:nth-child(8) img { object-position: center 48%; }
.album-card figcaption { display: grid; grid-template-columns: 26px 1fr; align-items: center; min-height: 52px; padding: 9px 12px; color: var(--forest); font-size: .68rem; text-align: left; }
.album-card figcaption b { color: var(--coral); font-size: .6rem; letter-spacing: .08em; }

/* RSVP and footer */
.rsvp { background: var(--rio-dark); color: white; }.rsvp__grid { display: grid; grid-template-columns: 150px 1fr; align-items: center; gap: clamp(38px,7vw,82px); }.rsvp__avatar { width: 140px; margin: 0; text-align: center; }.rsvp__avatar picture { display: block; width: 140px; height: 140px; overflow: hidden; border: 6px solid rgba(255,255,255,.9); border-radius: 50%; box-shadow: 0 16px 38px rgba(2,40,43,.26); }.rsvp__avatar img { width: 100%; height: 100%; object-fit: cover; object-position: center 30%; }.rsvp__avatar figcaption { margin-top: 10px; color: #d4eeee; font-size: .62rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }.rsvp__copy { max-width: 680px; }.rsvp__copy h2 { margin-bottom: 18px; font-size: clamp(3rem,6vw,5.5rem); }.rsvp__copy > p:not(.kicker) { max-width: 560px; margin-bottom: 30px; color: #d5eeee; font-family: system-ui,sans-serif; }.rsvp__copy .button svg { fill: none; stroke: currentColor; }
.footer { position: relative; padding: 74px 0 28px; background: var(--forest); color: white; }.footer__inner { display: grid; grid-template-columns: 1fr 110px; align-items: center; gap: 50px; }.footer h2 { margin: 0 0 8px; font-size: clamp(3.3rem,7vw,6.5rem); }.footer h2 span { color: var(--sun); }.footer__inner > div > p:last-child { color: #c1ded8; font-size: .75rem; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; }.footer__seal { display: grid; place-items: center; width: 96px; height: 96px; justify-self: end; border: 1px solid rgba(246,203,84,.72); border-radius: 50%; color: var(--sun); font-family: Georgia,serif; font-size: 2rem; font-style: italic; }.footer__top { display: block; width: max-content; margin: 42px auto 0; font-size: .67rem; font-weight: 900; letter-spacing: .1em; text-underline-offset: 5px; text-transform: uppercase; }

.lightbox { width: min(540px, calc(100% - 28px)); max-height: calc(100dvh - 28px); padding: 10px; overflow: hidden; border: 0; border-radius: 22px; background: var(--forest-dark); color: white; box-shadow: 0 30px 100px rgba(0,20,18,.6); }.lightbox::backdrop { background: rgba(1,29,26,.82); backdrop-filter: blur(7px); }.lightbox img { width: 100%; max-height: calc(100dvh - 94px); border-radius: 15px; object-fit: contain; }.lightbox p { margin: 8px 48px 0 6px; font-size: .72rem; font-weight: 900; }.lightbox__close { position: absolute; z-index: 2; top: 17px; right: 17px; display: grid; place-items: center; width: 40px; height: 40px; padding: 0; border: 1px solid rgba(255,255,255,.55); border-radius: 50%; background: rgba(3,45,41,.85); color: white; font-size: 1.4rem; cursor: pointer; }
.noscript-message { position: fixed; z-index: 300; right: 12px; bottom: 12px; left: 12px; padding: 13px; border-radius: 12px; background: var(--sun); color: var(--forest-dark); text-align: center; }
.reveal { opacity: 0; transform: translateY(23px); transition: opacity .7s ease, transform .7s cubic-bezier(.22,.84,.26,1); }.reveal.is-visible { opacity: 1; transform: none; }

@keyframes gateFade { to { opacity: 0; visibility: hidden; pointer-events: none; } }
@keyframes bar { to { height: 5px; } }

@media (max-width: 900px) {
  .hero__content { grid-template-columns: 1fr 300px; gap: 55px; }
  .countdown__inner { grid-template-columns: 1fr 170px 180px; gap: 25px; padding: 32px; }.countdown__number { width: 160px; height: 160px; }.countdown__number strong { font-size: 4.9rem; }
  .surprise-card { grid-template-columns: 160px 1fr; }.surprise-card > div { padding: 22px; }
  .location__grid { grid-template-columns: 1fr 350px; gap: 50px; }
}

@media (max-width: 720px) {
  :root { --wrap: min(100% - 28px, 600px); }
  .section { padding: 78px 0; }
  h2 { font-size: clamp(2.45rem,12vw,4rem); }
  .jungle-door { background-size: auto 100vh; }.jungle-door--left { background-position: 42% center; }.jungle-door--right { background-position: 58% center; }
  .jungle-door::before { inset: 8px; }.jungle-door__vine { opacity: .6; }
  .gate-crest { width: calc(100% - 38px); padding: 25px 18px 22px; }.gate-crest__monogram { width: 60px; height: 60px; font-size: 1.5rem; }.gate-crest h1 { font-size: clamp(3.2rem,17vw,4.9rem); }
  .nav { grid-template-columns: 1fr 1fr; width: calc(100% - 28px); min-height: 62px; }.nav p { display: none; }
  .hero { min-height: auto; }.hero__content { grid-template-columns: 1fr; gap: 52px; padding: 72px 0 92px; }.hero__copy h1 { font-size: clamp(4rem,19vw,6.2rem); }.hero__statement strong { font-size: 4.3rem; }.hero__text { font-size: .96rem; }.video-card { width: min(78vw, 310px); margin-inline: auto; }
  .countdown { padding: 58px 0; }.countdown__inner { grid-template-columns: 132px 1fr; gap: 18px; padding: 27px 20px; text-align: center; }.countdown__intro { grid-column: 1 / -1; }.countdown__intro h2 { max-width: 340px; margin-inline: auto; font-size: clamp(2.35rem,11vw,3.45rem); }.countdown__number { width: 126px; height: 126px; border-width: 5px; }.countdown__number strong { font-size: 4rem; }.countdown__number span { margin-top: 7px; font-size: .6rem; }.countdown__date { min-height: 126px; padding: 13px 11px; }.countdown__date strong { font-size: 3rem; }.countdown__date p { font-size: .63rem; }
  .story__grid { grid-template-columns: 1fr; gap: 42px; }.framed-photo--story { width: 210px; margin-inline: auto; }.framed-photo--story img { aspect-ratio: 4/5; }.story__copy { text-align: center; }.story__signature { text-align: left; }
  .details__row { grid-template-columns: 1fr; }.info-card { min-height: 235px; }.info-card svg { margin-bottom: 33px; }
  .surprises__grid { grid-template-columns: 1fr; }.surprise-card { grid-template-columns: 130px 1fr; min-height: 245px; }.surprise-card > div { padding: 22px 18px; }.surprise-card h3 { font-size: 1.5rem; }.surprise-card p { font-size: .81rem; }
  .location__grid { grid-template-columns: 1fr; gap: 55px; }.map-art { width: min(100%, 520px); }.location__copy { text-align: center; }.location__place { text-align: left; }.location__copy .button { width: 100%; }
  .gallery__heading { grid-template-columns: 1fr; gap: 18px; }.album-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }.album-card__button { border-radius: 14px; }.album-card figcaption { grid-template-columns: 22px 1fr; min-height: 47px; padding: 7px 9px; font-size: .6rem; }
  .rsvp__grid { grid-template-columns: 88px 1fr; gap: 22px; }.rsvp__avatar, .rsvp__avatar picture { width: 82px; height: 82px; }.rsvp__avatar figcaption { font-size: .5rem; }.rsvp__copy { text-align: left; }.rsvp__copy h2 { font-size: clamp(2.45rem,11vw,3.7rem); }.rsvp__copy > p:not(.kicker) { font-size: .86rem; }.rsvp__copy .button { width: 100%; }
  .footer__inner { grid-template-columns: 1fr; text-align: center; }.footer__seal { width: 72px; height: 72px; justify-self: center; font-size: 1.55rem; }.footer h2 { font-size: clamp(3.2rem,15vw,5rem); }
  .music-control { width: 46px; justify-content: center; padding: 8px; }.music-control > span:last-child { display: none; }
}

@media (max-width: 430px) {
  .surprise-card { grid-template-columns: 1fr; }.surprise-card picture { height: 220px; }.surprise-card > div { padding: 24px; }.surprise-card h3 { font-size: 1.75rem; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms!important; animation-iteration-count: 1!important; transition-duration: .01ms!important; scroll-behavior: auto!important; }
  .reveal { opacity: 1; transform: none; }
}