/* A still clearing, a living foreground. No element changes scroll geometry. */
#invitation-page #home {
  height:100svh; min-height:560px; color:#fff3dc; background:#25372d;
  isolation:isolate; overflow:hidden;
}
#invitation-page #home .hero-art { inset:0; filter:none; }
#invitation-page #home .hero-art .hero-garden {
  object-fit:cover; object-position:center 61%; filter:none; transform:none; animation:none;
}
#invitation-page #home.has-autumn-scene .hero-art .hero-garden {
  transform-origin:50% 67%; animation:autumn-scene-breath 24s ease-in-out infinite alternate paused;
}
#invitation-page #home.is-hero-living .hero-art .hero-garden { animation-play-state:running; }
#invitation-page #home::after {
  z-index:1; pointer-events:none;
  background:linear-gradient(180deg,rgb(20 30 24/.06),rgb(20 30 24/.1) 38%,transparent 61%,rgb(37 55 45/.05) 85%,#25372d);
}
#invitation-page #home .hero-copy {
  position:absolute; z-index:4; top:18%; left:12%; right:12%;
  text-align:center; color:#fff3dc; text-shadow:0 2px 12px rgb(15 25 18/.25);
}
#invitation-page #home .hero-blessing {
  max-width:18rem; margin:0 auto 1.3rem; font-size:clamp(.78rem,3.2vw,.96rem);
  font-family:'Lora',Georgia,serif; line-height:1.75; font-style:italic; letter-spacing:0; text-transform:none; color:#f2e1be;
}
#invitation-page #home #hero-title {
  margin:0 auto; width:100%; font-family:'Bodoni Moda',Georgia,serif;
  font-size:clamp(3.8rem,17.6vw,7.1rem); line-height:.96;
  font-weight:400; letter-spacing:-.055em; font-style:italic; text-wrap:balance;
  text-shadow:0 2px 10px rgb(14 23 18/.18);
}
#invitation-page #home #hero-title>span { display:block; padding-inline:.06em; text-align:center; }
#invitation-page #home #hero-title>em { display:block; font-size:.35em; line-height:1.55; font-weight:400; color:#d7b37b; }
#invitation-page #home .hero-date {
  margin:1.5rem auto .35rem; font-size:clamp(.82rem,3.45vw,1.02rem); line-height:1.6; letter-spacing:.02em;
  color:#fff0d2; text-transform:none;
}
#invitation-page #home .hero-venue {
  max-width:23rem; margin:0 auto; font-size:clamp(.74rem,3.1vw,.9rem); line-height:1.8; letter-spacing:0;
  color:#eee1c9; font-style:italic; text-transform:none; text-wrap:balance;
}
#invitation-page #home .hero-canopy-scene { position:absolute; inset:0; z-index:2; pointer-events:none; overflow:hidden; }
#invitation-page #home .hero-canopy-scene[hidden] { display:none; }
#invitation-page #home .hero-canopy { position:absolute; top:-3%; left:-13%; width:72%; max-width:670px; opacity:.88; transform:rotate(-13deg); transform-origin:0 0; animation:autumn-canopy-near 11s ease-in-out infinite alternate paused; }
#invitation-page #home .hero-canopy img { width:100%; height:auto; display:block; filter:saturate(.75) brightness(.88); }
#invitation-page #home .hero-canopy--far { width:52%; top:-2%; left:auto; right:-20%; opacity:.68; transform:scaleX(-1) rotate(-20deg); transform-origin:50% 0; animation-name:autumn-canopy-far; animation-duration:13.7s; animation-delay:-5s; }
#invitation-page #home.is-hero-living .hero-canopy { animation-play-state:running; }
/* Real brass cutouts hang from their own chain ends, outside the reading area. */
#invitation-page #home .hero-lantern-scene { position:absolute; inset:0; z-index:2; overflow:hidden; pointer-events:none; }
#invitation-page #home .hero-lantern-scene[hidden] { display:none; }
#invitation-page #home .hero-lantern {
  position:absolute; top:-13px; left:calc(11% - clamp(54px,18vw,81px));
  width:clamp(108px,36vw,162px); transform-origin:50% 0;
  animation:autumn-lantern-left 3.9s ease-in-out infinite alternate paused;
}
#invitation-page #home .hero-lantern[hidden] { display:none; }
#invitation-page #home .hero-lantern img { display:block; width:100%; height:auto; filter:saturate(.78) brightness(.93); }
#invitation-page #home .hero-lantern--right {
  left:auto; right:calc(10% - clamp(47px,15.5vw,70px)); top:-19px;
  width:clamp(94px,31vw,140px); animation-name:autumn-lantern-right; animation-duration:5.2s; animation-delay:-1.55s;
}
#invitation-page #home .hero-candle-warmth {
  position:absolute; left:39%; top:71%; width:22%; height:15%; border-radius:50%;
  background:radial-gradient(ellipse,rgb(255 210 109/.19),rgb(255 173 65/.05) 55%,transparent 75%);
  mix-blend-mode:screen; animation:autumn-candle-breath 4.6s ease-in-out infinite alternate paused;
}
#invitation-page #home .hero-lantern--right .hero-candle-warmth { animation-duration:5.7s; animation-delay:-2.2s; }
/* Rooted foreground saplings continue the photographed garden at the edges. */
#invitation-page #home .hero-sapling {
  position:absolute; width:clamp(130px,38vw,220px); bottom:-35px; left:-57px;
  transform-origin:61% 100%; opacity:.9; transform:rotate(8deg);
  animation:autumn-sapling-left 5.2s ease-in-out infinite alternate paused;
}
#invitation-page #home .hero-sapling img { display:block; width:100%; height:auto; filter:saturate(.68) brightness(.73); }
#invitation-page #home .hero-sapling--right {
  width:clamp(115px,33vw,188px); bottom:-25px; left:auto; right:-48px;
  transform:scaleX(-1) rotate(7deg); transform-origin:45% 100%; opacity:.82;
  animation-name:autumn-sapling-right; animation-duration:6.8s; animation-delay:-2.4s;
}
#invitation-page #home.is-hero-living :is(.hero-lantern,.hero-candle-warmth,.hero-sapling) { animation-play-state:running; }
/* Climbing ivory roses continue the flowers already growing on the stone pillars. */
#invitation-page #home .hero-flowers {
  position:absolute; top:54%; left:-18px; width:clamp(78px,24vw,112px);
  transform-origin:12% 98%; transform:rotate(-3deg);
  animation:autumn-roses-left 4.6s ease-in-out -1.2s infinite alternate paused;
}
#invitation-page #home .hero-flowers[hidden] { display:none; }
#invitation-page #home .hero-flowers img {
  display:block; width:100%; height:auto; filter:saturate(.78) brightness(.83);
}
#invitation-page #home .hero-flowers--right {
  top:56%; bottom:auto; left:auto; right:-18px;
  transform-origin:88% 98%; transform:rotate(3deg);
  animation-name:autumn-roses-right; animation-duration:5.5s; animation-delay:-3.4s;
}
#invitation-page #home .hero-flowers--right img { transform:scaleX(-1); filter:saturate(.78) brightness(.83); }
#invitation-page #home.is-hero-living .hero-flowers { animation-play-state:running; }
#invitation-page #home .hero-sunlight {
  position:absolute; left:-38%; top:-25%; width:91%; height:112%; transform:rotate(-29deg); transform-origin:50% 0;
  background:linear-gradient(90deg,transparent 36%,rgb(250 230 175/.055) 46%,rgb(250 230 175/.1) 50%,transparent 62%);
  animation:autumn-light-breath 14s ease-in-out infinite alternate paused; mix-blend-mode:screen;
}
#invitation-page #home.is-hero-living .hero-sunlight { animation-play-state:running; }
#invitation-page #home #falling-leaves {
  z-index:3; mask-image:radial-gradient(ellipse 34% 20% at 50% 35%,transparent 35%,#000 140%);
  -webkit-mask-image:radial-gradient(ellipse 34% 20% at 50% 35%,transparent 35%,#000 140%);
}
#invitation-page #home .hero-scroll {
  position:absolute; display:grid; place-items:center; width:44px; height:44px; min-height:44px; margin:0;
  z-index:5; left:calc(50% - 22px); right:auto; bottom:max(3.8rem,7svh); padding:0;
  border:1px solid rgb(242 221 182/.45); border-radius:50%; color:#f3e5c8; background:rgb(25 40 31/.2); box-shadow:none; text-shadow:none;
}
#invitation-page #home .hero-scroll svg { width:21px; height:21px; }
#invitation-page #home .hero-scroll::before { content:''; position:absolute; left:21px; bottom:calc(100% + 13px); width:1px; height:30px; background:linear-gradient(transparent,rgb(246 224 179/.6)); }
#invitation-page #home .hero-scroll:focus-visible { outline:2px solid #f1dcad; outline-offset:6px; }
body:has(#home.is-hero-present) #menu-button { display:none; }
body:has(#home.is-hero-present) #music-button {
  width:44px; min-height:44px; padding:0; display:grid; place-items:center; background:rgb(24 39 31/.2);
  border:1px solid rgb(246 224 179/.45); border-radius:50%; color:#f3e5c8; font-size:0; box-shadow:none;
  backdrop-filter:none; -webkit-backdrop-filter:none;
}
body:has(#home.is-hero-present) #music-button::before { content:'♫'; font-size:18px; }
body:has(#home.is-hero-present) #music-button .music-orb { display:none; }
@keyframes autumn-scene-breath { from { transform:scale(1.012); } to { transform:scale(1.042); } }
@keyframes autumn-light-breath { from { opacity:.48; } to { opacity:.9; } }
@keyframes autumn-canopy-near { from { transform:rotate(-13deg); } to { transform:rotate(-10deg); } }
@keyframes autumn-canopy-far { from { transform:scaleX(-1) rotate(-20deg); } to { transform:scaleX(-1) rotate(-23deg); } }
@keyframes autumn-lantern-left { from { transform:rotate(-2deg); } to { transform:rotate(2.3deg); } }
@keyframes autumn-lantern-right { from { transform:rotate(1.9deg); } to { transform:rotate(-2.1deg); } }
@keyframes autumn-candle-breath { 0%,100% { opacity:.47; } 37% { opacity:.78; } 69% { opacity:.59; } }
@keyframes autumn-sapling-left { from { transform:rotate(8deg) translateY(0); } to { transform:rotate(5.5deg) translateY(-2px); } }
@keyframes autumn-sapling-right { from { transform:scaleX(-1) rotate(7deg); } to { transform:scaleX(-1) rotate(9deg) translateY(2px); } }
@keyframes autumn-roses-left { from { transform:rotate(-6deg); } to { transform:rotate(1.8deg); } }
@keyframes autumn-roses-right { from { transform:rotate(6deg); } to { transform:rotate(-1.8deg); } }
@media(min-width:760px), (orientation:landscape) {
  #invitation-page #home .hero-art .hero-garden { object-position:center 65%; }
  #invitation-page #home .hero-copy { top:15%; left:14%; right:14%; }
  #invitation-page #home #hero-title { display:flex; justify-content:center; align-items:center; gap:.27em; font-size:clamp(3.5rem,8.8vw,8.2rem); }
  #invitation-page #home #hero-title>span { min-width:0; }
  #invitation-page #home #hero-title>em { font-size:.34em; flex-shrink:0; }
  #invitation-page #home .hero-blessing { margin-bottom:1.4rem; max-width:30rem; }
  #invitation-page #home .hero-date { margin-top:1.7rem; }
  #invitation-page #home .hero-canopy { width:43%; left:-12%; top:-5%; }
  #invitation-page #home .hero-canopy--far { width:35%; left:auto; right:-14%; }
  #invitation-page #home .hero-lantern { width:clamp(135px,24svh,210px); left:calc(12% - clamp(67.5px,12svh,105px)); top:-14px; }
  #invitation-page #home .hero-lantern--right { width:clamp(115px,20svh,180px); left:auto; right:calc(12% - clamp(57.5px,10svh,90px)); top:-21px; }
  #invitation-page #home .hero-sapling { width:clamp(190px,23vw,330px); left:-50px; bottom:-50px; }
  #invitation-page #home .hero-sapling--right { width:clamp(155px,19vw,275px); left:auto; right:-50px; bottom:-15px; }
  #invitation-page #home .hero-flowers { top:49%; left:-24px; width:clamp(112px,11.2vw,150px); }
  #invitation-page #home .hero-flowers--right { top:51%; left:auto; right:-24px; }
}
@media(max-height:700px) and (orientation:portrait) {
  #invitation-page #home .hero-lantern { width:min(32vw,115px); left:calc(11% - min(16vw,57.5px)); top:-24px; }
  #invitation-page #home .hero-lantern--right { width:min(28vw,105px); left:auto; right:calc(10% - min(14vw,52.5px)); top:-28px; }
  #invitation-page #home .hero-copy { top:17%; }
  #invitation-page #home #hero-title { font-size:min(17.4vw,10svh); }
  #invitation-page #home .hero-blessing { margin-bottom:.85rem; }
  #invitation-page #home .hero-date { margin-top:1rem; }
  #invitation-page #home .hero-flowers { top:54%; width:min(24vw,93px); left:-16px; }
  #invitation-page #home .hero-flowers--right { top:56%; left:auto; right:-16px; }
}
@media(max-height:600px) and (orientation:landscape) {
  #invitation-page #home { min-height:360px; }
  #invitation-page #home .hero-copy { top:14%; }
  #invitation-page #home #hero-title { font-size:17svh; }
  #invitation-page #home .hero-blessing { margin-bottom:.6rem; }
  #invitation-page #home .hero-date { margin-top:.7rem; }
  #invitation-page #home .hero-scroll { bottom:1.5rem; }
  #invitation-page #home .hero-scroll::before { display:none; }
  #invitation-page #home .hero-lantern { width:24svh; left:calc(11% - 12svh); }
  #invitation-page #home .hero-lantern--right { width:21svh; left:auto; right:calc(11% - 10.5svh); }
  #invitation-page #home .hero-sapling { width:32svh; left:-24px; bottom:-30px; }
  #invitation-page #home .hero-sapling--right { width:29svh; left:auto; right:-23px; bottom:-20px; }
  #invitation-page #home .hero-flowers { top:49%; width:21.5svh; left:-14px; }
  #invitation-page #home .hero-flowers--right { top:52%; left:auto; right:-14px; }
}
@media(prefers-reduced-motion:reduce) {
  #invitation-page #home *,#invitation-page #home *::before { animation:none!important; }
  #invitation-page #home .hero-art .hero-garden { transform:none; }
}
.card-preview #invitation-page #home .hero-scroll { display:none; }