/* One illustrated Friday programme, followed by Saturday's invitation. */
.events,.details,.venue{--serif:InvitationSerif,Georgia,serif}
.events{padding:80px 24px 90px;background:#ede4d4;color:#4e222a}
.events:before{content:'';position:absolute;inset:0;pointer-events:none;background:url('assets/invitation-paper.webp') center/140% 140% no-repeat;opacity:.38;mix-blend-mode:multiply}
.events-inner{position:relative;max-width:1000px}
.events-intro{text-align:center;border:0;padding:0 0 44px}
.events-intro p{font-size:10px;letter-spacing:.23em;color:#856247}
.events-intro h2{font-size:clamp(44px,calc(var(--invitation-vw,1vw)*6),72px);line-height:.93;margin:18px 0 0;letter-spacing:-.045em}
.events-intro h2 i{color:#916b5b}
.celebration-composition{display:grid;grid-template-columns:1fr 1fr;align-items:stretch}
.celebration-art{position:relative;min-height:660px;isolation:isolate}
.celebration-art-visual{display:block;position:absolute;inset:0;width:100%;height:100%;z-index:-1}
.celebration-date{position:absolute;top:30%;left:17%;right:17%;display:flex;align-items:center;flex-direction:column;color:#55232b;text-shadow:0 1px 12px #f6e5c7}
.celebration-date span{font:500 11px/1.4 var(--sans);letter-spacing:.19em;text-transform:uppercase}
.celebration-date strong{font:400 clamp(86px,calc(var(--invitation-vw,1vw)*10),130px)/.95 var(--serif);letter-spacing:-.09em;margin:4px 0 12px;padding-right:.06em}
.celebration-art-caption{position:absolute;left:10%;right:10%;bottom:38px;text-align:center;font:italic 25px/1.15 var(--serif);color:#ffefce;text-shadow:0 2px 10px #210d14}
.celebration-program{position:relative;align-self:end;padding:36px 36px 32px;background:#48202b;color:#f4e7d1;border:1px solid #86634d66;box-shadow:inset 0 0 0 7px #48202b,inset 0 0 0 8px #bca17c33}
.celebration-program-label{display:flex;align-items:center;justify-content:center;gap:13px;margin:0 0 34px;font:500 9px/1.4 var(--sans);letter-spacing:.21em;text-transform:uppercase;color:#d1b991;white-space:nowrap}
.celebration-program-label span{height:1px;flex:1;background:#bc9b704d}
.celebration-timeline{position:relative}
.celebration-timeline:before{content:'';position:absolute;left:16px;top:24px;bottom:54px;width:1px;background:linear-gradient(#c4a46b99,#c4a46b33)}
.celebration-event{position:relative;display:grid;grid-template-columns:34px 1fr;column-gap:18px;padding:0 0 30px}
.celebration-event+.celebration-event{padding:0 0 30px}
.celebration-symbol{position:relative;z-index:1;background:#48202b;color:#c9aa78;width:34px;height:40px;display:grid;place-items:center}
.celebration-symbol svg{width:26px;height:26px;stroke:currentColor;stroke-width:1.15}
.celebration-moment{display:block;color:#c7aa86;font:400 9px/1.4 var(--sans);letter-spacing:.19em;text-transform:uppercase;margin:3px 0 7px}
.celebration-event h3{position:relative;z-index:1;font:400 clamp(40px,calc(var(--invitation-vw,1vw)*4.8),58px)/.95 var(--serif);letter-spacing:-.035em;margin:0 0 12px;color:#f6e6ca}
.celebration-time{display:inline-block;margin:0;font:400 16px/1.3 var(--serif);color:#e1c8a3;letter-spacing:.01em}
.celebration-number{position:absolute;right:0;top:10px;color:#f2d2ac0d;font:400 76px/1 var(--serif);pointer-events:none}
.celebration-location{border-top:1px solid #ceb18444;padding-top:24px;text-align:center}
.celebration-location-label{display:block;margin:auto;max-width:230px;font:400 9px/1.65 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:#cbb28e}
.celebration-location h4{font:400 35px/1 var(--serif);margin:13px 0 6px;letter-spacing:-.025em;color:#f5e7d3}
.celebration-location p{font:400 16px var(--serif);margin:0;color:#ddc8ae}
.celebration-directions{display:flex;align-items:center;justify-content:space-between;gap:25px;width:min(100%,230px);margin:24px auto 0;padding:15px 19px;background:#d2b78d;color:#3e1a25;border:1px solid #e1c9a4;text-decoration:none;font:500 9px/1 var(--sans);letter-spacing:.17em;text-transform:uppercase;transition:background .2s}
.celebration-directions svg{width:19px;height:19px;flex:none;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.celebration-directions:hover{background:#ecdbbf}
.details{min-height:0;padding:64px 28px 26px;color:#f4e7d1}
.details,.venue{background-color:#421b25;background-image:linear-gradient(90deg,transparent,#421b25b8 27%,#421b25b8 73%,transparent),url('assets/mughal-ivory.svg?v=3');background-position:center,center top;background-size:100% 100%,180px 220px}
.details:before{display:none}
.details-inner{max-width:1000px}
.details-main{margin:0;gap:50px;align-items:center}
.details h2{font-size:clamp(44px,calc(var(--invitation-vw,1vw)*6),68px);line-height:.94;margin:0 0 18px}
.details h2 i{color:#d2b78d}
.details-heading p{font-size:19px;line-height:1.4;color:#e0cbb7;margin:0;max-width:340px}
.ceremony-date{position:relative;width:100%;padding:58px 20px 32px;text-align:center;border:0;background:url('assets/ceremony-arch.svg?v=3') center/100% 100% no-repeat}
.ceremony-day,.ceremony-year,.ceremony-time{display:block;font:500 10px/1.5 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:#d8be98}
.ceremony-date time{display:block}
.ceremony-date-line{display:block;margin:12px 0 8px;font:400 clamp(37px,calc(var(--invitation-vw,1vw)*4.7),53px)/1.1 var(--serif);font-variant-numeric:lining-nums;letter-spacing:-.035em;color:#f4e7d1;white-space:nowrap}
.ceremony-time{width:fit-content;margin:20px auto 0;padding:16px 20px 0;border-top:1px solid #c4a57955;letter-spacing:.14em}
.details .countdown{display:flex;flex-direction:column;align-items:center;gap:14px;margin-top:30px;padding-top:0;border:0;letter-spacing:.14em;font-size:8px;color:#d8be98;text-align:center}
.details .countdown strong{display:flex;justify-content:center;width:min(100%,360px);font-size:30px;color:#f4e7d1;gap:0}
.countdown-unit{flex:1;display:flex;flex-direction:column;gap:7px;font-variant-numeric:lining-nums tabular-nums}
.countdown-unit+.countdown-unit{border-left:1px solid #c4a5794d}
.countdown-unit small{font:500 8px/1.4 var(--sans);letter-spacing:.15em;text-transform:uppercase;color:#d8be98}
.venue{min-height:0;padding:10px 28px 55px;color:#f4e7d1}
.venue:before,.venue:after{display:none}
.venue-inner{width:min(100%,1000px);border-top:1px solid #c4a5794d;padding-top:32px}
.venue h2{font-size:36px;line-height:.95}
.venue h2 i{color:#d2b78d}
.venue-name{font-size:19px;margin:22px auto}
.venue-name strong{display:inline-block;font-size:32px;margin:4px 0}
.venue .directions{background:#d2b78d;color:#3e1a25;border-color:#e1c9a4;min-width:210px;font-size:9px;padding:16px 22px}
@media all{
  html{scroll-behavior:auto}
  .families{min-height:calc(var(--mobile-vh,1svh)*85)}
  .blessing{min-height:calc(var(--mobile-vh,1svh)*100)}
  .families h2.reveal.is-visible,.blessing-copy.reveal.is-visible{transform:none}
  .blessing-art{transform:none}
  .scene .reveal{transform:none;transition:opacity .6s ease}
  .letter{--serif:InvitationSerif,Georgia,serif;min-height:0;padding:48px 28px 52px}
  .letter:before{display:none}
  .letter-inner{max-width:440px}
  .letter-inner.reveal.is-visible{transform:none}
  .letter-salutation{font-size:18px;margin:0 0 18px}
  .letter h2{font-size:clamp(35px,calc(var(--invitation-vw,1vw)*10),44px);line-height:.98;margin:0 0 22px;letter-spacing:-.04em}
  .letter-body{font-size:20px;line-height:1.4;max-width:34ch}
  .letter-signoff{font-size:18px;line-height:1.3;margin-top:20px}
  .events{padding:58px 20px 64px}
  .events-intro{padding-bottom:30px}
  .events-intro h2{font-size:46px}
  .events-intro p{font-size:9px}
  .celebration-composition{display:block;max-width:440px;margin:auto}
  .celebration-art{min-height:0;height:390px}
  .celebration-date{top:28%}
  .celebration-date strong{font-size:92px;margin-bottom:7px}
  .celebration-date span{font-size:9px}
  .celebration-art-caption{font-size:20px;bottom:48px}
  .celebration-program{margin:-25px 9px 0;padding:28px 23px 30px}
  .celebration-program-label{font-size:8px;gap:9px;margin-bottom:27px}
  .celebration-event{column-gap:13px;padding-bottom:27px}
  .celebration-event h3{font-size:43px}
  .celebration-moment{font-size:8px}
  .celebration-location-label{font-size:8px}
  .celebration-location h4{font-size:33px}
  .details{padding:48px 24px 26px}
  .details-main{display:block}
  .details-heading{text-align:center}
  .details h2{font-size:44px;margin-inline:auto;max-width:320px}
  .details-heading p{font-size:18px;max-width:290px;margin-inline:auto}
  .ceremony-date{margin-top:22px;padding:54px 14px 30px}
  .details .countdown{gap:14px;margin-top:26px}
  .details .countdown strong{font-size:30px}
  .venue{padding:10px 28px 55px}
  .venue-inner{padding-top:28px}
  .venue h2{font-size:34px}
}
@media(max-width:350px){
  .events{padding-inline:14px}
  .celebration-program{margin-inline:6px;padding-inline:18px}
  .celebration-event{column-gap:9px}
  .celebration-event h3{font-size:38px}
  .celebration-art{height:355px}
}

.celebration-event .celebration-location{margin-top:18px;padding-top:16px;text-align:left}
.celebration-event .celebration-location-label{margin:0}
.celebration-event .celebration-location h4{font-size:28px}
.celebration-event .celebration-location p{font-size:16px;line-height:1.4}
.celebration-event .celebration-directions{margin:18px 0 0;gap:12px;letter-spacing:.1em;padding:13px 12px;box-sizing:border-box}
.celebration-event:last-child{padding-bottom:0}
