:root{--olive:#656831;--deep:#353d26;--cream:#faf7ef;--blue:#afbed2;--line:#d5d5c5;--serif: 'Baskerville','Palatino Linotype','Book Antiqua',Georgia,serif}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:80px}body{margin:0;background:var(--cream);color:var(--deep);font:17px/1.7 Arial,sans-serif}a{color:inherit}button{font:inherit}a,button{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible{outline:3px solid var(--blue);outline-offset:7px}h1,h2,h3,p{margin:0}h1,h2,h3{font-family:var(--serif);font-weight:400}h2{font-size:clamp(2.8rem,6vw,5rem);line-height:1.1;letter-spacing:-.04em}h3{font-size:2rem;line-height:1.25}.eyebrow{font-size:13px;letter-spacing:.17em;text-transform:uppercase}.small{font-size:14px}.italic{font-style:italic}.button{display:inline-flex;justify-content:center;align-items:center;min-height:52px;padding:12px 26px;border:1px solid currentColor;background:none;text-decoration:none;cursor:pointer;transition:background .25s,color .25s;gap:22px}.button:hover{background:var(--deep);color:var(--cream)}.button:hover *{color:var(--cream)!important}.button .canva-text{color:inherit!important}.button.solid{background:var(--deep);border-color:var(--deep);color:var(--cream)}.button.solid:hover{background:var(--olive)}.button[aria-disabled=true]{cursor:default;opacity:.6}.button[aria-disabled=true]:hover{background:none;color:inherit}.rule{height:1px;background:currentColor;opacity:.25}.section{padding:100px max(6vw,24px)}
header{height:76px;display:flex;justify-content:space-between;align-items:center;padding:0 5vw;background:var(--cream);border-bottom:1px solid var(--line)}.monogram{font-family:var(--serif);font-size:27px;text-decoration:none}.monogram i{font-size:21px;margin:0 8px}nav{display:flex;gap:30px}nav a{font-size:14px;text-decoration:none}nav a:hover{text-decoration:underline;text-underline-offset:7px}
.cover{background:var(--olive);color:var(--cream);min-height:calc(100svh - 76px);display:grid;grid-template-columns:1.05fr 1fr;position:relative;overflow:hidden}.cover-copy{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding:70px 7vw}.cover h1{font-size:clamp(4.5rem,8.7vw,9.5rem);line-height:.91;letter-spacing:-.055em;margin:35px 0}.amp{font-style:italic;font-size:.65em;color:var(--blue);display:inline-block;margin:8px 0}.cover-date{margin:5px 0 30px}.cover .button:hover{background:var(--cream);color:var(--deep)}.cover .button:hover *{color:var(--deep)!important}.cover-art{min-width:0;display:flex;align-items:center;justify-content:center;padding:42px 5vw 42px 0}.cover-art img{width:100%;max-width:420px;max-height:75svh;object-fit:contain;display:block;transform:rotate(3deg);box-shadow:0 20px 50px #26301225;animation:arrive 1.4s ease both}.cover-copy>*{animation:arrive 1.1s ease both}.cover .location{margin-top:38px;font-size:13px;letter-spacing:.13em}
.invitation{text-align:center;max-width:930px;margin:auto;padding-top:110px;padding-bottom:110px}.invitation h2{margin:28px 0}.invitation .guest{font-family:var(--serif);font-size:clamp(1.7rem,4vw,2.6rem);margin:30px 0 14px}.seats{display:inline-block;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:17px 24px;margin-top:22px}.opening-flourish{font-family:var(--serif);font-style:italic;font-size:50px;color:var(--olive)}
.day{display:grid;grid-template-columns:.9fr 1.1fr;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:0}.date-panel{background:var(--blue);padding:80px 7vw;text-align:center;display:flex;flex-direction:column;justify-content:center}.date-number{font-family:var(--serif);font-size:clamp(7rem,15vw,14rem);line-height:1;letter-spacing:-.09em;padding-right:.09em;margin:22px 0}.date-panel .month{font-family:var(--serif);font-size:35px;font-style:italic}.day-details{padding:85px 7vw}.day-details h2{margin:18px 0 38px}.event{display:grid;grid-template-columns:75px 1fr;gap:24px;margin:32px 0}.event-label{font-size:13px;text-transform:uppercase;letter-spacing:.12em;padding-top:7px}.event p{margin-top:8px}.pending{font-size:14px;margin-top:12px;color:#62664e}
.dress{display:grid;grid-template-columns:1fr 1fr;gap:7vw;align-items:center}.dress h2{margin-top:20px}.dress-detail{padding:36px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.dress-detail p{margin-top:16px}.gifts{background:#eeeee3;display:grid;grid-template-columns:1fr 1fr;gap:7vw}.gifts h2{margin-top:20px}.gifts p{margin-bottom:28px;max-width:420px}
.rsvp{background:var(--deep);color:var(--cream);text-align:center;padding-top:110px;padding-bottom:110px}.rsvp h2{max-width:650px;margin:25px auto 30px}.rsvp .button{margin-top:30px;border-color:var(--blue);color:var(--cream)}.rsvp .button[aria-disabled=true]:hover{color:var(--cream)}.rsvp .pending{color:#d0d3bf}.rsvp .deadline{font-size:14px;margin-top:22px}.footer{padding:35px 6vw;display:flex;justify-content:space-between;align-items:center;gap:22px}.footer p{font-family:var(--serif);font-size:25px}.footer span{font-size:13px;letter-spacing:.1em}
@keyframes arrive{from{opacity:0;translate:0 22px}to{opacity:1;translate:0 0}}.revealed{animation:arrive .9s ease both}
@media(max-width:700px){header{height:68px;padding:0 24px}nav{gap:18px}nav a{font-size:13px}nav .desktop{display:none}.cover{grid-template-columns:1fr;min-height:0}.cover-copy{padding:58px 28px 25px;align-items:center;text-align:center}.cover h1{font-size:clamp(4.6rem,17vw,7rem);margin:28px 0}.cover h1 br{display:none}.cover h1 .amp{display:block;font-size:.55em;margin:15px 0}.cover .location{margin-top:25px}.cover-art{padding:20px 60px 60px}.cover-art img{max-width:300px;max-height:none}.section{padding:72px 25px}.day{grid-template-columns:1fr;padding:0}.date-panel{padding:50px 25px}.date-number{font-size:8rem;margin:12px 0}.day-details{padding:60px 25px}.dress,.gifts{grid-template-columns:1fr;gap:32px}.invitation .guest{overflow-wrap:anywhere}.seats{padding:15px 0;font-size:16px}.footer{flex-direction:column;text-align:center}.event{grid-template-columns:60px 1fr;gap:20px}.button{max-width:100%;font-size:16px}.cover-date{margin-bottom:24px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}

/* Full-screen photographic opening. The couple stays centered in every crop. */
header{position:absolute;top:0;left:0;right:0;z-index:3;background:transparent;border:0;color:var(--cream)}
.cover{display:block;height:100svh;min-height:680px;isolation:isolate;background:#263126}
.cover-art{position:absolute;inset:0;padding:0;display:block;z-index:-2}
.cover-art img{width:100%;height:100%;max-width:none;max-height:none;object-fit:cover;object-position:50% 56%;transform:none;box-shadow:none;animation:none}
.cover:after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(8,17,10,.4),transparent 36%,transparent 70%,rgba(8,17,10,.68))}
.cover-copy{height:100%;padding:105px 24px 35px;align-items:center;text-align:center;justify-content:flex-start}
.cover h1{font-size:clamp(3rem,6.5vw,7rem);line-height:1.08;letter-spacing:-.045em;margin:12px 0 8px;text-shadow:0 2px 16px #0003}
.cover h1 .amp{display:inline;font-size:.8em;margin:0 .12em;color:var(--cream)}
.cover-date{margin:0;font-size:16px;letter-spacing:.04em}
.cover .button{margin-top:auto;background:#18221830;backdrop-filter:blur(3px)}
.cover .location{margin-top:18px}
@media(max-width:700px){
.cover{height:100svh;min-height:600px}
.cover-copy{padding:92px 18px max(24px,env(safe-area-inset-bottom));align-items:center}
.cover h1{font-size:clamp(2.6rem,9.5vw,4.5rem);margin:15px 0 8px}
.cover h1 .amp{display:inline;font-size:.78em;margin:0 .08em}
.cover-art{padding:0}.cover-art img{max-width:none;max-height:none;object-position:50% 52%}
.cover-date{font-size:14px;margin-bottom:0}.cover .location{font-size:12px;margin-top:16px;letter-spacing:.08em}
}
@media(max-height:600px) and (min-width:701px){.cover{min-height:540px}.cover-copy{padding-top:82px;padding-bottom:20px}.cover h1{font-size:3.6rem}.cover .location{margin-top:10px}}


.transfer-option{grid-column:1 / -1;border-top:1px solid var(--line);padding-top:36px;margin-top:5px}
.gifts .transfer-option>p{max-width:660px;margin-bottom:20px}
.bank-details summary{display:flex;align-items:center;justify-content:space-between;gap:22px;cursor:pointer;list-style:none;padding:18px 0;border-bottom:1px solid var(--line);font-size:17px}
.bank-details summary::-webkit-details-marker{display:none}
.bank-details summary:focus-visible{outline:3px solid var(--olive);outline-offset:5px}
.bank-details summary .bank-icon{font-size:26px;transition:transform .2s}.bank-details summary .bank-label{font-size:17px;transform:none!important;transition:none!important}
.bank-details[open] summary .bank-icon{transform:rotate(45deg)}.bank-details[open] summary .bank-label{transform:none!important}
.bank-accounts{display:grid;grid-template-columns:1fr 1fr;gap:50px;padding-top:34px}
.bank-account{min-width:0}.bank-account+.bank-account{border-left:1px solid var(--line);padding-left:50px}
.gifts .bank-account .eyebrow{margin-bottom:7px}.bank-account h3{margin-bottom:24px}
.bank-account dl{margin:0}.bank-account dt{font-size:14px;margin-top:18px;color:#575d46}
.bank-account dd{margin:4px 0 0;overflow-wrap:anywhere;font-size:17px}
@media(max-width:700px){.bank-accounts{grid-template-columns:1fr;gap:32px}.bank-account+.bank-account{border-left:0;padding-left:0;border-top:1px solid var(--line);padding-top:30px}.transfer-option{margin-top:0;padding-top:28px}}

.story{text-align:center;max-width:920px;margin:auto}.story h2,.faq h2{margin-bottom:36px}.story>p:not(.eyebrow){max-width:650px;margin:24px auto}.story blockquote{margin:44px 0 0;font-family:var(--serif);font-style:italic;font-size:26px}.story cite{font:14px Arial,sans-serif}.story .eyebrow{margin-bottom:20px}#dress-note h3{font-size:25px;margin-top:30px}.faq{max-width:1040px;margin:auto}.faq details{border-bottom:1px solid var(--line);padding:22px 0}.faq summary{cursor:pointer;font-family:var(--serif);font-size:25px}.faq details p{margin-top:16px;max-width:780px}.footer{flex-wrap:wrap}.footer .closing-message{flex-basis:100%;text-align:center;padding:30px 0;font-size:clamp(1.5rem,3vw,2.3rem)}
/* Full names supplied by Natalia. */
.cover h1{font-size:clamp(1.75rem,3.5vw,3.25rem);line-height:1.15;letter-spacing:-.025em;margin:0 0 16px;max-width:950px}
.cover h1 .full-name{display:block;text-wrap:balance}
.cover h1 .amp{display:block;font-size:.65em;line-height:1;margin:6px 0}
@media(max-width:700px){.cover-copy{padding-top:82px}.cover h1{font-size:clamp(1.5rem,6.3vw,2.5rem);max-width:100%;margin:0 0 14px}.cover h1 .amp{display:block;margin:5px 0}}

header{height:auto;min-height:82px;gap:28px;align-items:center;padding:22px 4vw;background:linear-gradient(180deg,#14201688,transparent)}
header nav{flex:1;display:flex;justify-content:flex-end;gap:clamp(14px,2vw,30px)}header nav a{font-size:14px;line-height:1.4;text-align:center}header .monogram{flex-shrink:0}
.cover-copy{padding-top:125px}
.registry-heading{margin-bottom:18px}.gifts #registry-link{width:100%;justify-content:space-between}.gifts .transfer-option{border:0;padding:0;margin:14px 0 0}.bank-details summary{background:var(--deep);color:var(--cream);padding:16px 22px;border:1px solid var(--deep);min-height:56px}.bank-details summary:hover{background:var(--olive)}.gifts .transfer-intro{margin:24px 0 0}.bank-accounts{grid-template-columns:1fr;gap:26px}.bank-account+.bank-account{padding:26px 0 0;border-left:0;border-top:1px solid var(--line)}
.rsvp .deadline{font-size:17px;max-width:620px;margin:24px auto 0}.dress-gallery{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin-top:24px}.dress-gallery figure{margin:0}.dress-gallery img{display:block;width:100%;height:auto;aspect-ratio:2/3;object-fit:contain;background:#f7f5ed}
@media(max-width:1100px){header{align-items:flex-start}header nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px 20px}.cover-copy{padding-top:150px}}
@media(max-width:700px){header{padding:18px 20px;gap:16px}header nav{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 14px}header nav a{font-size:14px;text-align:left}.cover-copy{padding-top:205px}.cover{min-height:780px}.dress-gallery{grid-template-columns:1fr;gap:20px}.dress-gallery figure{max-width:440px;margin:auto;width:100%}}

/* Pre-wedding photograph behind their story. */
.story{max-width:none;margin:0;position:relative;isolation:isolate;min-height:820px;color:var(--cream);background-color:#08150e;background-image:url("assets/images/story-background.jpg");background-position:center;background-size:cover;background-repeat:no-repeat;padding-top:78px;padding-bottom:210px}
.story:before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(3,12,7,.62),rgba(3,12,7,.32) 52%,rgba(3,12,7,.12))}
.story h2{margin-bottom:28px}.story>p:not(.eyebrow){max-width:660px;margin:20px auto}.story blockquote{margin-top:28px}.story cite{display:block;margin-top:8px}
@media(max-width:700px){.story{min-height:0;background-size:100% auto;background-position:center bottom;padding:64px 25px clamp(235px,65vw,380px)}.story:before{background:linear-gradient(180deg,#08150e 0%,rgba(8,21,14,.92) 48%,rgba(8,21,14,0) 78%)}.story>p:not(.eyebrow){max-width:540px}}

.wedding-countdown{margin-top:auto;width:min(100%,540px);padding:24px 24px 18px;color:var(--cream);background:rgba(9,22,13,.42);border-top:1px solid rgba(247,246,237,.55);backdrop-filter:blur(4px)}
.wedding-countdown[hidden]{display:none}.countdown-units{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}.countdown-unit{display:flex;flex-direction:column;align-items:center;gap:8px}.countdown-number{font-family:var(--serif);font-size:clamp(2rem,4vw,3.5rem);font-variant-numeric:tabular-nums;line-height:1}.countdown-label{font-size:14px;line-height:1.5}.wedding-countdown #countdown-finished{margin-top:18px;font-family:var(--serif);font-size:24px}.countdown-noscript{margin-top:auto;font-size:14px}
@media(max-width:700px){.wedding-countdown{padding:20px 12px 16px}.countdown-units{gap:8px}.countdown-number{font-size:clamp(1.8rem,8vw,2.7rem)}.countdown-label{font-size:14px}}

/* Final static-site interaction fixes */
.button { color: var(--deep); }
.button > * { color: inherit !important; }
.button:hover { background: var(--deep); color: var(--cream) !important; }
.button:hover > * { color: inherit !important; }
.cover .button { color: var(--cream); }
.cover .button:hover { background: var(--cream); color: var(--deep) !important; }
.rsvp .button { color: var(--cream); }
.rsvp .button:hover { background: var(--olive); color: var(--cream) !important; }
.bank-details summary .bank-label { transform: none !important; transition: none !important; }
.bank-details summary .bank-icon { display:inline-block; transform: rotate(0deg); transition: transform .2s; }
.bank-details[open] summary .bank-label { transform: none !important; }
.bank-details[open] summary .bank-icon { transform: rotate(45deg); }

/* Decorative labels retain heading semantics; they are not interactive. */
#dress-note > h3 {
  display: table;
  min-width: 88px;
  padding: 9px 22px;
  border-radius: 2px;
  background: var(--deep);
  color: var(--cream) !important;
  text-align: center;
  line-height: 1.2;
}

/* A true light weight for the three story paragraphs. */
.story > p:not(.eyebrow) {
  font-family: "Helvetica Neue", system-ui, sans-serif;
  font-weight: 300;
}

/* Mobile and portrait tablets only. Original desktop rules above stay intact.
   !important is limited to sizes exported as inline styles in index.html. */
@media (max-width: 900px) {
  html {
    scroll-padding-top: 24px;
  }

  body {
    --mobile-gutter: clamp(24px, 6vw, 44px);
    font-size: 16px;
    line-height: 1.75;
  }

  header {
    min-height: 80px;
    padding: 18px var(--mobile-gutter);
    align-items: center;
    gap: 16px;
  }

  header .monogram {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
  }

  /* Without JavaScript, the original links remain available above the cover. */
  header:not([data-mobile-navigation]) {
    position: relative;
    flex-wrap: wrap;
    background: #263126;
  }

  header:not([data-mobile-navigation]) nav {
    flex-basis: 100%;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 4px 16px;
  }

  header:not([data-mobile-navigation]) nav a {
    display: flex;
    align-items: center;
    min-height: 44px;
    text-align: left;
  }

  .mobile-nav-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    min-width: 102px;
    min-height: 44px;
    padding: 8px 14px;
    border: 1px solid rgb(250 247 239 / 45%);
    border-radius: 2px;
    background: rgb(9 22 13 / 22%);
    color: var(--cream);
    font-size: 14px;
    line-height: 1;
    cursor: pointer;
  }

  .mobile-nav-icon {
    position: relative;
    width: 18px;
    height: 12px;
    flex: 0 0 18px;
  }

  .mobile-nav-icon::before,
  .mobile-nav-icon::after {
    content: "";
    position: absolute;
    left: 0;
    width: 18px;
    height: 1px;
    background: currentColor;
    transition: transform .2s;
  }

  .mobile-nav-icon::before { top: 3px; }
  .mobile-nav-icon::after { bottom: 3px; }

  .mobile-nav-toggle[aria-expanded="true"] .mobile-nav-icon::before {
    transform: translateY(2.5px) rotate(45deg);
  }

  .mobile-nav-toggle[aria-expanded="true"] .mobile-nav-icon::after {
    transform: translateY(-2.5px) rotate(-45deg);
  }

  header[data-mobile-navigation] nav {
    display: none;
    position: absolute;
    top: calc(100% + 4px);
    left: var(--mobile-gutter);
    right: var(--mobile-gutter);
    max-height: calc(100svh - 112px);
    overflow-y: auto;
    overscroll-behavior-y: contain;
    padding: 12px 22px;
    border: 1px solid rgb(250 247 239 / 22%);
    background: #263126;
    box-shadow: 0 16px 40px rgb(0 0 0 / 22%);
  }

  header[data-navigation-open] nav {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
  }

  header[data-mobile-navigation] nav a {
    display: flex;
    align-items: center;
    min-height: 54px;
    padding: 12px 0;
    text-align: left;
    font-size: 16px !important;
    line-height: 1.45;
  }

  header[data-mobile-navigation] nav a + a {
    border-top: 1px solid rgb(250 247 239 / 16%);
  }

  .cover {
    height: 100svh;
    min-height: 600px;
  }

  .cover-copy {
    padding: clamp(108px, 14svh, 138px) var(--mobile-gutter)
      max(24px, env(safe-area-inset-bottom));
    justify-content: flex-start;
  }

  .cover h1 {
    max-width: 100%;
    margin: 0 0 18px;
    font-size: clamp(1.375rem, 6.25vw, 2.5rem) !important;
    line-height: 1.22;
    letter-spacing: -.025em;
  }

  .cover h1 .amp {
    margin: 9px 0;
    font-size: .8em !important;
    line-height: 1;
  }

  .cover-date {
    margin: 0;
    font-size: 14px !important;
    line-height: 1.6;
    letter-spacing: .065em;
  }

  .cover-art img {
    object-position: 50% 52%;
  }

  .cover::after {
    background: linear-gradient(180deg, rgb(8 17 10 / 58%),
      rgb(8 17 10 / 16%) 32%, transparent 55%, rgb(8 17 10 / 65%));
  }

  .wedding-countdown {
    width: min(100%, 440px);
    margin-top: auto;
    padding: 19px 8px 16px;
  }

  .countdown-units { gap: 0; }
  .countdown-unit { min-width: 0; gap: 8px; }

  .countdown-unit + .countdown-unit {
    border-left: 1px solid rgb(250 247 239 / 20%);
  }

  .countdown-number {
    font-size: clamp(1.875rem, 8vw, 2.75rem) !important;
    line-height: 1;
  }

  .countdown-label {
    font-size: 12px !important;
    line-height: 1.5;
  }

  .section {
    padding: 72px var(--mobile-gutter);
  }

  .section h2,
  .day h2 {
    font-size: clamp(2.25rem, 9.5vw, 3.625rem) !important;
    line-height: 1.12;
    letter-spacing: -.035em;
    text-wrap: balance;
  }

  .section h2 > span {
    font-size: inherit !important;
  }

  .eyebrow {
    font-size: 12px !important;
    line-height: 1.6;
    letter-spacing: .16em;
  }

  .day {
    grid-template-columns: minmax(0, 1fr);
  }

  .date-panel {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr);
    grid-template-rows: auto auto auto;
    align-items: center;
    column-gap: 24px;
    padding: 40px var(--mobile-gutter);
    text-align: left;
  }

  .date-panel .date-number {
    grid-column: 1;
    grid-row: 1 / 4;
    justify-self: center;
    margin: 0;
    padding: 0 .04em 0 0;
    font-size: clamp(6rem, 25vw, 9rem) !important;
    line-height: .95;
    letter-spacing: -.065em;
  }

  .date-panel > .eyebrow:first-child {
    grid-column: 2;
    grid-row: 1;
    align-self: end;
  }

  .date-panel .month {
    grid-column: 2;
    grid-row: 2;
    font-size: clamp(1.75rem, 7vw, 2.25rem) !important;
    line-height: 1.35;
  }

  .date-panel > .eyebrow:last-child {
    grid-column: 2;
    grid-row: 3;
    align-self: start;
  }

  .day-details {
    width: 100%;
    max-width: 640px;
    margin-inline: auto;
    padding: 56px var(--mobile-gutter) 64px;
  }

  .day-details h2 { margin: 12px 0 28px; }

  .event {
    grid-template-columns: 54px minmax(0, 1fr);
    gap: 16px;
    margin: 26px 0;
  }

  .event .event-label {
    margin-top: 0;
    padding-top: 5px;
    font-size: 12px !important;
  }

  .event h3 {
    font-size: clamp(1.5rem, 6.4vw, 1.875rem) !important;
  }

  #venue-address {
    white-space: pre-line;
    line-height: 1.65;
    margin-top: 12px;
  }

  .button {
    width: 100%;
    min-height: 56px;
    padding: 15px 18px;
    justify-content: space-between;
    gap: 12px;
    font-size: 16px;
    line-height: 1.5;
    text-align: left;
  }

  .button > [aria-hidden="true"] { flex-shrink: 0; }

  .story {
    min-height: 0;
    padding-bottom: calc(66.667vw + 16px);
    background-size: 100% auto;
    background-position: center bottom;
  }

  .story::before {
    inset: auto 0 0;
    height: 66.667vw;
    background: linear-gradient(180deg, #08150e,
      rgb(8 21 14 / 25%) 32%, transparent 70%);
  }

  .story .eyebrow { margin-bottom: 18px; }
  .story h2 { margin-bottom: 26px; }

  .story > p:not(.eyebrow) {
    max-width: 34em;
    margin: 18px auto;
    text-wrap: pretty;
  }

  .story blockquote {
    margin: 30px auto 0;
    max-width: 22em;
    font-size: clamp(1.375rem, 5.8vw, 1.75rem) !important;
    line-height: 1.4;
  }

  .story cite { margin-top: 12px; }

  .dress,
  .gifts {
    grid-template-columns: minmax(0, 1fr);
    gap: 30px;
  }

  .dress > *,
  .gifts > * { min-width: 0; }
  .dress h2,
  .gifts h2 { margin-top: 14px; }

  .dress-detail {
    padding: 28px 0;
  }

  #dress-code,
  .registry-heading,
  .bank-account h3 {
    font-size: 28px !important;
  }

  #dress-note h3 {
    margin-top: 26px;
    font-size: 24px !important;
  }

  .dress-detail p { margin-top: 12px; text-wrap: pretty; }

  .dress-gallery {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    min-width: 0;
    margin-top: 2px;
  }

  .dress-gallery figure {
    width: 100%;
    max-width: none;
    margin: 0;
  }

  .gifts p { max-width: none; margin-bottom: 24px; }
  .registry-heading { margin-bottom: 16px; }

  .bank-details summary {
    min-height: 56px;
    padding: 15px 18px;
    gap: 12px;
    line-height: 1.5;
  }

  .bank-details summary .bank-label { font-size: 16px !important; }
  .bank-details summary .bank-icon { flex-shrink: 0; }
  .bank-accounts { gap: 24px; padding-top: 28px; }
  .bank-account h3 { margin-bottom: 18px; }
  .bank-account dd { font-size: 16px !important; }

  .faq h2 {
    max-width: 12em;
    margin-bottom: 28px;
  }

  .faq details { padding: 0; }

  .faq summary {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 16px;
    min-height: 68px;
    padding: 21px 0;
    list-style: none;
    font-size: clamp(1.25rem, 5.2vw, 1.5rem) !important;
    line-height: 1.35;
  }

  .faq summary::-webkit-details-marker { display: none; }
  .faq summary::marker { content: ""; }

  .faq summary::after {
    content: "+";
    flex: 0 0 20px;
    text-align: center;
    font: 22px/1 Arial, sans-serif;
  }

  .faq details[open] > summary::after { content: "−"; }
  .faq details p { margin: 0 0 16px; }
  .faq details p:last-child { margin-bottom: 24px; }

  .faq summary:focus-visible {
    outline: 3px solid var(--blue);
    outline-offset: 4px;
  }

  .rsvp h2 { margin: 20px auto 26px; }
  .rsvp > p:not(.eyebrow) { max-width: 34em; margin-inline: auto; }
  .rsvp .button { max-width: 420px; margin-top: 28px; }

  .rsvp .deadline {
    max-width: 32em;
    margin-top: 24px;
    font-size: 16px !important;
    line-height: 1.65;
  }

  .footer {
    flex-direction: column;
    gap: 16px;
    padding: 54px var(--mobile-gutter) max(30px, env(safe-area-inset-bottom));
    text-align: center;
  }

  .footer .closing-message {
    max-width: 18em;
    margin: 0 0 14px;
    padding: 0;
    font-size: clamp(1.625rem, 6.7vw, 2rem) !important;
    line-height: 1.35;
    text-wrap: balance;
  }

  .footer > span { font-size: 12px !important; }
  .footer > a { display: inline-flex; align-items: center; min-height: 44px; }
}

@media (max-width: 600px) {
  /* The next photograph stays in view as a cue to swipe. */
  .dress-gallery {
    display: flex;
    gap: 14px;
    margin: 2px calc(-1 * var(--mobile-gutter)) 0;
    padding: 0 var(--mobile-gutter) 16px;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scroll-snap-type: x mandatory;
    scroll-padding-inline: var(--mobile-gutter);
    scrollbar-width: thin;
    scrollbar-color: var(--blue) transparent;
  }

  .dress-gallery figure {
    flex: 0 0 78%;
    width: auto;
    max-width: 340px;
    scroll-snap-align: start;
  }
}

@media (max-width: 900px) and (max-height: 500px) and (orientation: landscape) {
  .cover { min-height: 540px; }
  .cover-copy { padding-top: 98px; }
  .cover h1 { font-size: 28px !important; }
}