/* The full veranda begins behind the homepage navigation. */
body:has(.opening-header){--opening-header-height:92px}
.opening-header .site-header{
  height:var(--opening-header-height);
  background:linear-gradient(180deg,#101a15bf,#101a158c 55%,transparent);
}
.festival-hero {
  --opening-gutter:clamp(18px,6vw,96px);
  --opening-ground:#17261f;
  --opening-ink:#fff4e4;
  --opening-gold:#f4c998;
  --opening-line:#fff0d44f;
  min-height:0;
  margin-top:calc(-1 * var(--opening-header-height));
  padding:0 var(--opening-gutter) 38px;
  isolation:isolate;
  background:var(--opening-ground);
  color:var(--opening-ink);
}
.festival-stage {
  display:grid;
  grid-template-areas:"scene";
  margin-inline:calc(-1 * var(--opening-gutter));
}
.festival-hero .hero-poster {
  grid-area:scene;
  position:relative;
  inset:auto;
  width:100%;
  aspect-ratio:3/2;
  align-self:start;
  isolation:isolate;
  overflow:hidden;
  background:none;
}
.festival-hero .hero-poster img{display:block;width:100%;height:auto}
.festival-hero .hero-poster:after{
  background:
    linear-gradient(0deg,var(--opening-ground),#17261fc0 23%,#17261f40 65%,transparent)
      bottom / 100% clamp(62px,15vw,200px) no-repeat,
    linear-gradient(90deg,var(--veranda-copy-shade,#14201888),transparent 55%);
  pointer-events:none;
}
.veranda-light {
  --light:var(--veranda-progress,0);
  position:absolute;
  /* The SVG and photo share the same uncropped 3:2 frame. */
  inset:0;
  width:100%;
  height:100%;
  mix-blend-mode:screen;
  pointer-events:none;
}
.veranda-sweep{opacity:calc(.72 * var(--light));transform:translateY(calc(245px * var(--light)))}
.veranda-lamps{opacity:calc(.88 * var(--light))}
.veranda-reflection{opacity:clamp(0,calc((var(--light) - .14) * 1.12),.9);transform:translateY(calc(96px * var(--light)))}
.veranda-jasmine use {
  --fall:clamp(0,calc((var(--light) - var(--delay)) * 1.16),1);
  opacity:clamp(0,min(calc(5 * var(--fall)),calc(3 * (1 - var(--fall)))),.88);
  transform:translate(calc(var(--drift) * var(--fall)),calc(var(--drop) * var(--fall))) rotate(calc(var(--tilt) + 135deg * var(--fall)));
}
.festival-hero .hero-content{
  grid-area:scene;
  align-self:start;
  width:min(44%,450px);
  max-width:none;
  min-width:0;
  margin:calc(var(--opening-header-height) + clamp(48px,12svh,132px)) var(--opening-gutter) 30px;
  padding:0;
  pointer-events:auto;
}
.festival-hero .festival-eyebrow{display:flex;align-items:center;gap:10px;color:var(--opening-gold);font-size:10px;letter-spacing:.17em;line-height:1.5}
.festival-eyebrow span{display:grid;place-items:center;width:34px;height:34px;flex:0 0 34px;border:1px solid var(--opening-line);border-radius:50%;letter-spacing:.07em}
.festival-eyebrow:after{content:'';width:30px;height:1px;background:var(--opening-line)}
.festival-hero .festival-title{max-width:none;margin:15px 0 14px;font-size:clamp(46px,5.9vw,88px);line-height:1.01;letter-spacing:-.05em;white-space:normal;overflow-wrap:anywhere}
.festival-title em{color:var(--opening-gold)}
.festival-title .title-line{display:block}
.festival-hero .hero-content>.festival-intro{max-width:34ch;color:var(--opening-ink);font-size:clamp(14px,1.25vw,17px);line-height:1.6}
.festival-hero .hero-content .actions{margin-top:20px;gap:10px 14px}
.festival-cta{min-width:88px;border-radius:3px;color:#2d211b;background:#f8ebd7;border-color:#f8ebd7}
.festival-cta:hover{background:#fff7e9}
.festival-hero :is(a,button):focus-visible{outline-color:var(--opening-gold)}
.festival-keepsakes {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  align-items:center;
  gap:30px 6vw;
  margin-top:clamp(40px,6vw,96px);
}
.keepsakes-intro .eyebrow{color:var(--opening-gold)}
.keepsakes-intro h2{margin:14px 0 12px;font-size:clamp(36px,4.1vw,60px);line-height:1.05}
.keepsakes-intro h2 em{color:var(--opening-gold)}
.keepsakes-intro p{font-size:14px}
.hero-deck{position:relative;align-self:center;justify-self:center;width:min(94%,410px);height:414px;margin:0}
.deck-orbit{position:absolute;width:108%;height:80%;border:1px solid #f6d2a546;border-radius:50%;top:35px;left:-4%;transform:rotate(-32deg)}
.deck-photo{position:absolute;width:72%;height:322px;left:9%;top:31px;border:7px solid #fff2db;box-shadow:0 16px 33px #080e0a54;background:#f2efdf;overflow:hidden;will-change:transform}
.deck-photo>img{width:100%;height:100%;object-fit:cover;object-position:65% 50%;display:block}
.deck-back{pointer-events:none}
.back-two{transform:rotate(14deg);left:22%;top:30px;animation:postcard-two 9s ease-in-out infinite}
.back-one{transform:rotate(-12deg);left:4%;top:15px;animation:postcard-one 7s ease-in-out infinite}
.deck-front{transform:rotate(-4deg);top:45px;left:11%;z-index:2;animation:postcard-front 8s ease-in-out infinite;transition:box-shadow .3s}
.deck-front:hover{box-shadow:0 21px 40px #080e0a9c}
.deck-front:hover strong{text-decoration:underline;text-underline-offset:5px}
.deck-front:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#14251ad9,transparent 52%);pointer-events:none}
.deck-photo-label{position:absolute;z-index:1;left:19px;right:15px;bottom:17px;display:flex;gap:12px;align-items:end;justify-content:space-between;color:#fff7e7;text-shadow:0 1px 8px #18261655}
.deck-photo-label small{display:block;font-size:8px;letter-spacing:.15em;margin-bottom:8px}
.deck-photo-label strong{display:block;font-family:Georgia,serif;font-size:29px;font-weight:400;line-height:1.02;letter-spacing:-.045em;overflow-wrap:anywhere}
.hero-date-seal{position:absolute;right:-8px;top:-15px;z-index:3;width:135px;height:135px;display:grid;place-items:center;border-radius:50%;background:#e4e8d5ed;box-shadow:0 4px 18px #263c1720;border:1px solid #b9c3a6;color:#4e6545;transform:rotate(10deg)}
.hero-date-seal svg{position:absolute;inset:0;width:100%;height:100%;fill:#506744;font-size:9.6px;letter-spacing:2.1px;animation:seal-turn 32s linear infinite}
.hero-date-seal>span{font-family:Georgia,serif;font-size:48px;letter-spacing:-.08em;line-height:.9;text-align:center}
.hero-date-seal small{display:block;font-family:Arial,sans-serif;font-size:8px;letter-spacing:.14em;margin-top:10px}
.deck-controls{position:absolute;left:0;right:0;bottom:0;display:flex;align-items:center;justify-content:space-between;gap:12px;color:var(--opening-ink);font-size:11px}
.deck-next{display:inline-flex;gap:10px;align-items:center;background:transparent;border:0;border-bottom:1px solid var(--opening-line);border-radius:0;min-height:44px;padding:8px 0;font-size:11px;white-space:nowrap}
.deck-next>span{font-size:21px;transition:transform .4s}.deck-next:hover>span{transform:rotate(50deg)}
.wedding-countdown{max-width:380px;margin-top:24px;padding-top:13px;border-top:1px solid var(--opening-line)}
.countdown-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:9px;color:var(--opening-gold)}
.countdown-heading>.eyebrow{color:inherit;font-size:9px;letter-spacing:.12em;line-height:1.5}
.countdown-heading time{font-size:10px;letter-spacing:.09em;text-align:right;color:var(--opening-ink)}
.countdown-heading time small{display:block;margin-top:3px;font-size:inherit}
.countdown-units{display:flex;align-items:start;gap:0}
.countdown-unit{position:relative;flex:1;min-width:0;padding-left:18px;border-left:1px solid var(--opening-line)}
.countdown-unit:first-child{padding-left:0;border-left:0;flex:1.25}
.countdown-value{display:block;font-family:Georgia,serif;font-variant-numeric:tabular-nums;font-size:clamp(35px,3.35vw,50px);line-height:1;letter-spacing:-.045em}
.countdown-label{display:block;font-size:9px;letter-spacing:.13em;text-transform:uppercase;margin-top:7px;color:var(--opening-ink)}
.festival-hero .hero-content>.festival-location{margin-top:13px;color:var(--opening-gold);font-size:10px;letter-spacing:.12em;text-transform:uppercase}
.festival-hero .petal-button{display:inline-flex;align-items:center;gap:9px;background:#fce9cf10;border:1px solid var(--opening-line);padding:6px 12px;min-height:44px;font-size:11px;border-radius:999px;color:var(--opening-ink)}
.petal-button-flower{font-size:22px;line-height:1;color:var(--opening-gold);transition:transform .5s}.petal-button:hover .petal-button-flower{transform:rotate(90deg)}
.festival-hero .petal-button:hover{background:#fce9cf22}
.hero-petals{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:8}
.hero-petals>i{position:absolute;top:-45px;left:var(--start);width:13px;height:22px;background:var(--petal-colour);border-radius:80% 8% 70% 10%;opacity:0;box-shadow:inset 2px 0 5px #ffffff44;animation:petal-shower 2.7s cubic-bezier(.25,.45,.4,1) both}
.celebration-ribbon{position:relative;overflow:hidden;background:#344b36;color:#ecebdc;padding:20px 0;border-top:1px solid #344b36;border-bottom:1px solid #344b36}
.ribbon-track{display:flex;width:max-content;animation:ribbon-drift 52s linear infinite;will-change:transform}
.ribbon-track>div{display:flex;align-items:center;flex-shrink:0;gap:28px;padding-right:28px}
.ribbon-track span{font-family:Georgia,serif;font-size:27px;font-style:italic;letter-spacing:-.035em;white-space:nowrap}
.ribbon-track i{font-size:16px;color:#b6c19f;font-style:normal}
.home-energy .moments-heading h2{font-size:clamp(43px,5.1vw,70px);letter-spacing:-.055em}
.home-energy .preview-option>.text-link{flex-shrink:0}
.home-energy .home-reveal{opacity:0;transform:translateY(28px);transition:opacity .75s var(--reveal-delay,0ms),transform .85s cubic-bezier(.2,.7,.2,1) var(--reveal-delay,0ms)}
.home-energy .home-reveal.home-revealed{opacity:1;transform:none}
.home-away *,.hero-away *{animation-play-state:paused!important}
@keyframes postcard-front{0%,100%{transform:translateY(0) rotate(-4deg)}50%{transform:translateY(-11px) rotate(-2deg)}}
@keyframes postcard-one{0%,100%{transform:translateY(0) rotate(-12deg)}50%{transform:translateY(6px) rotate(-15deg)}}
@keyframes postcard-two{0%,100%{transform:translateY(0) rotate(14deg)}50%{transform:translateY(-8px) rotate(17deg)}}
@keyframes seal-turn{to{transform:rotate(360deg)}}
@keyframes ribbon-drift{to{transform:translateX(-50%)}}
@keyframes petal-shower{0%{opacity:0;transform:translate(0,-20px) rotate(0)}8%{opacity:.9}85%{opacity:.85}100%{opacity:0;transform:translate(var(--drift),1000px) rotate(var(--turn))}}
@media (min-width:1600px) {
  .festival-hero{--opening-gutter:max(7vw,calc((100vw - 1450px)/2))}
  .hero-deck{width:430px;height:445px}
  .deck-photo{height:351px}
}
@media (max-width:1100px) {
  .hero-deck{height:390px;margin-right:6px}
  .deck-photo{height:302px}
  .hero-date-seal{width:115px;height:115px;right:-4px}
  .hero-date-seal>span{font-size:40px}
  .deck-photo-label strong{font-size:26px}
}
@media (max-width:850px) {
  .festival-stage{grid-template-areas:"scene" "copy";gap:26px}
  .festival-hero .hero-poster{--veranda-copy-shade:transparent}
  .festival-hero .hero-content{grid-area:copy;width:min(530px,calc(100% - 2 * var(--opening-gutter)));margin:0;justify-self:center}
  .hero-deck{justify-self:center;width:370px;max-width:92%;height:400px;margin:0}
  .deck-photo{height:312px}
  .countdown-unit{padding-left:12px}
  .countdown-heading{align-items:start}
}
@media (max-width:760px) {
  body:has(.opening-header){--opening-header-height:80px}
  .festival-stage{gap:18px}
  .festival-hero .festival-title{font-size:clamp(36px,8vw,55px);margin-block:11px}
  .festival-hero .hero-content .actions{margin-top:17px}
  .festival-hero .festival-eyebrow{font-size:9px}
  .festival-eyebrow span{width:29px;height:29px;flex-basis:29px}
  .wedding-countdown{margin-top:21px}
  .countdown-heading>.eyebrow,.countdown-heading time{font-size:8px}
  .countdown-value{font-size:clamp(34px,9vw,45px)}
  .countdown-label{font-size:8px}
  .festival-keepsakes{grid-template-columns:minmax(0,1fr);max-width:530px;margin-inline:auto}
  .hero-deck{width:320px;height:373px}
  .deck-photo{height:286px;border-width:6px}
  .hero-date-seal{width:104px;height:104px;right:-3px;top:-6px}
  .hero-date-seal>span{font-size:36px}
  .hero-date-seal small{font-size:6px;margin-top:8px}
  .deck-photo-label{left:14px;right:12px;bottom:15px}
  .deck-photo-label strong{font-size:25px}
  .deck-photo-label small{font-size:8px}
  .deck-controls{padding-right:32px}
  .celebration-ribbon{padding:17px 0}
  .ribbon-track span{font-size:24px}
  .ribbon-track>div{gap:23px;padding-right:23px}
  .ribbon-track i{font-size:13px}
  .home-energy .moments-heading h2{font-size:44px}
  .hero-petals>i{width:10px;height:17px}
}
@media (max-width:420px) {
  .countdown-units{padding-right:42px}
  .hero-date-seal{right:28px}
}
@media (max-width:360px) {
  .hero-deck{height:337px}
  .deck-photo{height:251px}
  .deck-photo-label strong{font-size:22px}
  .hero-date-seal{width:95px;height:95px}
}
@media (prefers-reduced-motion:reduce) {
  .deck-photo,.hero-date-seal svg,.ribbon-track{animation:none}
  .veranda-light{display:none}
  .home-energy .home-reveal{opacity:1;transform:none;transition:none}
  .hero-petals{display:none}
  .petal-button-flower,.deck-next>span{transition:none}
}
