/* Stationery panels are cropped from the closed covers. The actual card sits below. */
.invitation-page[data-design=heirloom] {--wrap-ink:#371824;--wrap-text:#fff8ef;--opening-art:url("/opening-heirloom.webp");--section-paper:#f3e5dc}
.invitation-page[data-design=blue-note] {--wrap-ink:#dce1e7;--wrap-text:#263b59;--opening-art:url("/opening-blue-note.webp");--section-paper:#ecf0f5}
.invitation-page[data-design=garden] {--wrap-ink:#353e31;--wrap-text:#fff9ef;--opening-art:url("/opening-garden.webp");--section-paper:#ecede3}
.invitation-page[data-design=registry] {--wrap-ink:#171f30;--wrap-text:#fff8ef;--opening-art:url("/opening-registry.webp");--section-paper:#f1eee8}
.invitation-page[data-design] .cover {background:var(--wrap-ink);color:var(--wrap-text);transition:background-color .45s .28s}
.invitation-page[data-design] .cover.is-open {background:transparent;animation:none;pointer-events:none}
.invitation-page[data-design] .opening-scene {
  display:grid;
  position:relative;
  width:min(100%,510px);
  height:auto;
  min-height:0;
  align-content:center;
  justify-items:center;
  gap:.55rem;
  padding:1.25rem;
  box-shadow:none;
  background:transparent;
}
.invitation-page[data-design] .opening-paper {
  position:relative;
  width:min(72vw,350px,42svh);
  aspect-ratio:5/7;
  isolation:isolate;
  perspective:1000px;
  margin-bottom:.6rem;
  filter:drop-shadow(0 12px 25px #10071055);
}
.paper-piece {
  position:absolute;
  inset:0;
  background:var(--opening-art) center/100% 100% no-repeat;
  transition:transform .92s cubic-bezier(.25,.7,.25,1),opacity .42s .42s;
}
[data-motion=fold] .piece-one {clip-path:inset(0 0 50%);transform-origin:top}
[data-motion=fold] .piece-two {clip-path:inset(50% 0 0);transform-origin:bottom}
[data-motion=fold].is-open .piece-one {transform:translateY(-30%) rotateX(79deg)}
[data-motion=fold].is-open .piece-two {transform:translateY(30%) rotateX(-79deg)}
[data-motion=flap] .piece-one {clip-path:polygon(0 0,100% 0,50% 56%);transform-origin:top}
[data-motion=flap] .piece-two {clip-path:polygon(0 0,50% 56%,100% 0,100% 100%,0 100%);transition-delay:.18s,.55s}
[data-motion=flap].is-open .piece-one {transform:rotateX(107deg) translateY(-12%)}
[data-motion=flap].is-open .piece-two {transform:translateY(38%)}
[data-motion=gatefold] .piece-one {clip-path:inset(0 50% 0 0);transform-origin:left}
[data-motion=gatefold] .piece-two {clip-path:inset(0 0 0 50%);transform-origin:right}
[data-motion=gatefold].is-open .piece-one {transform:translateX(-25%) rotateY(-82deg)}
[data-motion=gatefold].is-open .piece-two {transform:translateX(25%) rotateY(82deg)}
[data-motion=sleeve] .piece-two {display:none}
[data-motion=sleeve].is-open .piece-one {transform:translateY(54%) rotate(-5deg)}
.is-open .paper-piece {opacity:0}
.invitation-page[data-design] .cover :is(.guest-address,.opening-action,.skip-opening) {position:static;translate:none;visibility:visible;transition:opacity .18s}
.invitation-page[data-design] .cover :is(.guest-address,.skip-opening) {color:var(--wrap-text)}
.invitation-page[data-design] .cover .opening-action {background:#fff8ef;color:#371824;border-color:#dfcbb3}
.invitation-page[data-design] .cover.is-open :is(.guest-address,.opening-action,.skip-opening) {opacity:0;pointer-events:none}
.invitation-page[data-design]:has(.cover:not([hidden])) .revealed-stationery {
  position:fixed;
  inset:0;
  z-index:9;
}
.invitation-page[data-design] #invitation {background:var(--section-paper)}
.invitation-page[data-design] .revealed-stationery .stationery-card {width:min(100%,490px)}
.invitation-page[data-design] .card-letter {background:var(--cover-paper);padding:clamp(1rem,4vw,2rem);overflow-wrap:anywhere}
.invitation-page[data-design] .story {
  width:min(100% - 2rem,880px);max-width:none;min-height:0;
  margin:clamp(3rem,10vw,7rem) auto;
  padding:0;gap:0;
  grid-template-columns:1fr;
  color:var(--cover-ink);background:var(--cover-paper);
  border-radius:14px;overflow:hidden;
}
.invitation-page[data-design] .story::before {content:none}
.invitation-page[data-design] .story-art {display:block;min-height:clamp(95px,25vw,175px);background:var(--wrap-ink) var(--opening-art) center 16%/cover no-repeat}
.invitation-page[data-design] .story-copy {padding:clamp(1.5rem,6vw,4rem);overflow-wrap:anywhere}
.invitation-page[data-design] .story-copy h2 {margin:0 0 .55em}
.invitation-page[data-design] .schedule {min-height:0;padding-block:clamp(3.25rem,9vw,7rem);text-align:left}
.invitation-page[data-design] .events {gap:clamp(1rem,3.5vw,2rem)}
.invitation-page[data-design] .events article {padding:clamp(1rem,4vw,1.65rem);border:1px solid #bba88d73;border-radius:12px;background:#fffdf7;color:#2e2526;text-align:left}
.invitation-page[data-design] .events a {min-height:44px;align-content:center}
.invitation-page[data-design] .photo-carousel {padding-block:clamp(3.25rem,9vw,7rem)}
.invitation-page[data-design] .rsvp {min-height:0;padding-block:clamp(3.25rem,9vw,7rem)}
.invitation-page[data-design=blue-note] .rsvp {background:#263b59}
.invitation-page[data-design=garden] .rsvp {background:#353e31}
.invitation-page[data-design=registry] .rsvp {background:#171f30}
@media (min-width:720px) {
  .invitation-page[data-design] .story {grid-template-columns:.76fr 1.24fr}
  .invitation-page[data-design=registry] .story-copy {grid-column:1;grid-row:1}
  .invitation-page[data-design=registry] .story-art {grid-column:2;grid-row:1}
}
@media (prefers-reduced-motion:reduce) {
  .invitation-page[data-design] .cover,.paper-piece {transition:none!important}
}
.invitation-page[data-design] .cover .opening-scene {background:transparent;box-shadow:none}
.invitation-page[data-design] .cover .skip-opening {min-height:44px}
.invitation-page[data-design=blue-note] .revealed-stationery {background:#dce1e7}
.invitation-page[data-design=garden] .schedule {background:#f8f8f0}
.invitation-page[data-design=blue-note] .schedule {background:#f5f7fa}
.invitation-page[data-design=registry] .schedule {background:#faf7f0}