:root{
--safe-left:env(safe-area-inset-left, 0px);
--safe-right:env(safe-area-inset-right, 0px);
--page-gutter:max(20px, var(--safe-left), var(--safe-right));
--content-width:26.25rem;
--panel-width:var(--content-width);
--panel-padding-block:clamp(26px,5.5vw,34px);
--panel-padding-inline:clamp(20px,4.5vw,28px);
--panel-glass-bg:rgba(255,255,255,.14);
--panel-glass-bg-fallback:rgba(255,255,255,.26);
--panel-glass-border:rgba(255,255,255,.46);
--panel-glass-edge:rgba(42,38,35,.07);
--panel-glass-blur:18px;
--panel-glass-saturate:1.22;
--panel-glass-shadow:0 12px 42px rgba(42,38,35,.08);
--panel-glass-highlight:inset 0 1px 0 rgba(255,255,255,.58);
--silk-base:#f6f5f3;
--silk-page:#faf9f7;
--silk-shadow:rgba(48,44,40,.1);
--silk-shadow-deep:rgba(35,32,28,.18);
--silk-shadow-ambient:rgba(42,38,35,.12);
--silk-ridge:rgba(255,255,255,.62);
--silk-highlight:rgba(255,255,255,.55);
--silk-pearl:rgba(255,252,248,.35);
--silk-gleam:rgba(255,255,255,.65);
--text:#000;
--text-muted:#000;
--text-soft:#000;
--line:rgba(42,38,35,.28);
--surface:rgba(255,255,255,.82);
--text-shadow-soft:none;
--text-shadow-title:none;
--accent:#000;
--accent-dark:#000;
--ease:cubic-bezier(.22,1,.36,1);
--font-serif:'AGGaramond Cyr',Georgia,'Times New Roman',serif;
--font-sans:var(--font-serif);
--font-script:var(--font-serif);
--font-names:var(--font-serif);
--font-hero-lead:var(--font-serif);
--font-accent:var(--font-serif);
--font-main:var(--font-serif);
--text-body:1rem;
--text-heading:var(--text-body);
--text-lead:var(--text-body);
--text-label:var(--text-body);
--text-small:var(--text-body);
--text-hero-intro:var(--text-body);
--text-accent-sm:clamp(1.25rem,3.2vw,1.625rem);
--text-accent-md:clamp(1.75rem,5vw,2.375rem);
--text-accent-lg:clamp(2.125rem,7vw,3.25rem);
--text-accent-xl:clamp(2.5rem,8.5vw,3.75rem);
--type-weight:300;
--type-style:normal;
--type-transform:none;
--type-tracking:0.02em;
--type-leading:1.65;
--type-leading-heading:1.2;
--leading-tight:var(--type-leading-heading);
--leading-snug:var(--type-leading-heading);
--leading-body:var(--type-leading);
--leading-relaxed:var(--type-leading);
--weight-body:var(--type-weight);
--weight-caps:var(--type-weight);
--weight-display:var(--type-weight);
--tracking-body:var(--type-tracking);
--tracking-caps:var(--type-tracking);
--tracking-script:var(--type-tracking);
--tracking-label:var(--type-tracking);
--tracking-time:var(--type-tracking);
}

@font-face{
font-family:'AGGaramond Cyr';
src:url('../fonts/aggaramondcyr-light/aggaramondcyr-light.woff2') format('woff2'),
url('../fonts/aggaramondcyr-light/aggaramondcyr-light.ttf') format('truetype');
font-weight:300;
font-style:normal;
font-display:swap;
}

.intro-caption,
.site,
.site :where(p,span,time,label,button,input,textarea,select,form,a,footer,h1,h2,h3,h4){
font-family:var(--font-serif);
font-weight:var(--type-weight);
font-style:var(--type-style);
text-transform:var(--type-transform);
letter-spacing:var(--type-tracking);
line-height:var(--type-leading);
}

.site :is(
h2,h3,h4,h5,h6,
.script-title,
.date-big,
.venue-name,
.timeline-name,
.timeline-time,
.dresscode-tag,
.countdown-heading
){
font-family:var(--font-serif);
font-size:var(--text-heading);
font-weight:var(--type-weight);
font-style:var(--type-style);
text-transform:var(--type-transform);
letter-spacing:var(--type-tracking);
line-height:var(--type-leading-heading);
}

.intro-screen.hidden{
opacity:0;
visibility:hidden;
pointer-events:none;
transition:opacity .5s ease, visibility 0s linear .5s;
}

.intro-screen.is-opening{
pointer-events:none;
}
/* ========== INTRO SCREEN ========== */

.intro-screen{
position:fixed;
inset:0;
display:flex;
flex-direction:column;
justify-content:center;
align-items:center;
overflow:hidden;
width:100%;
max-width:100%;
z-index:9999;
background:#fafaf8;
opacity:1;
}

.finger-intro{
position:relative;
z-index:5;
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
text-align:center;
width:100%;
max-width:32rem;
margin:0 auto;
padding-left:max(16px, env(safe-area-inset-left));
padding-right:max(16px, env(safe-area-inset-right));
box-sizing:border-box;
overflow:hidden;
opacity:1;
transition:opacity 1s cubic-bezier(.4,0,.2,1);
}

.silk-background{
position:absolute;
inset:0;
overflow:hidden;
z-index:0;
background:#f6f5f3;
transition:
opacity .9s ease,
transform 1.1s ease;
}

.silk-background__texture{
position:absolute;
inset:0;
width:100%;
height:100%;
object-fit:cover;
object-position:center center;
image-rendering:-webkit-optimize-contrast;
backface-visibility:hidden;
transform:translateZ(0);

filter:
contrast(1.06)
saturate(1.02)
brightness(1.01);

animation:silkFlow 18s ease-in-out infinite;
}

.silk-background__veil{
position:absolute;
inset:0;
pointer-events:none;
background:
linear-gradient(180deg, rgba(255,255,255,.12) 0%, transparent 42%, rgba(248,246,243,.1) 100%);
}

.silk-background__sheen{
position:absolute;
inset:0;
pointer-events:none;
background:
radial-gradient(ellipse 40% 26% at 24% 22%, rgba(255,255,255,.5), transparent 58%),
radial-gradient(ellipse 34% 22% at 74% 18%, rgba(255,255,255,.32), transparent 55%),
linear-gradient(118deg, transparent 38%, rgba(255,255,255,.22) 50%, transparent 62%);
opacity:.56;
animation:silkSheenSoft 11s ease-in-out infinite;
}

.intro-caption-track{
width:100%;
overflow:visible;
display:flex;
justify-content:center;
}

/* INTRO CAPTIONS */

.intro-caption{
font-family:var(--font-serif);
font-size:var(--text-body);
color:#000;
text-align:center;
margin:0 auto;
padding:0 28px;
max-width:34em;
text-wrap:balance;
}

.intro-caption--top{
display:flex;
flex-direction:column;
align-items:stretch;
gap:clamp(0px,0.6vw,4px);
margin-bottom:64px;
transform:none;
overflow:visible;
padding-inline:0;
}

.intro-caption__pre{
display:block;
width:100%;
box-sizing:border-box;
text-align:center;
font-family:var(--font-serif);
font-size:clamp(1.5rem,5.2vw,2.25rem);
font-weight:var(--type-weight);
font-style:var(--type-style);
letter-spacing:var(--type-tracking);
line-height:var(--type-leading-heading);
text-transform:uppercase;
margin-inline:0;
padding-inline:0;
margin-bottom:clamp(-6px,-0.8vw,-2px);
opacity:0;
transform:translate3d(-80%,0,0);
transition:
transform 1.1s cubic-bezier(.22,1,.36,1),
opacity .95s ease;
}

.intro-caption__line{
display:block;
width:min(100%, 22rem);
height:auto;
margin-inline:auto;
object-fit:contain;
object-position:center;
background:transparent;
mix-blend-mode:multiply;
opacity:0;
transform:translate3d(-80%,0,0);
transition:
transform 1.1s cubic-bezier(.22,1,.36,1),
opacity .95s ease;
}

.intro-caption__line--invite{
align-self:center;
width:min(96%, clamp(20rem, 52vw, 28rem));
max-height:none;
overflow:visible;
margin-top:clamp(-18px,-2.2vw,-8px);
margin-inline:auto;
image-rendering:auto;
}

.intro-caption--bottom{
margin-top:52px;
}

/* 1) Сначала сердце */
.intro-screen .finger-heart-btn{
opacity:0;
transition:opacity 1.15s cubic-bezier(.22,1,.36,1);
transition-delay:.2s;
}

.intro-screen .heart-stage{
transform:scale(.86);
transition:transform 1.2s cubic-bezier(.22,1,.36,1);
transition-delay:.2s;
}

.intro-screen.is-ready .finger-heart-btn{
opacity:1;
}

.intro-screen.is-ready .heart-stage{
transform:none;
animation:heartFloat 6s ease-in-out 1.35s infinite;
}

/* 2) Потом текст — слева за экраном к центру */
.intro-screen .intro-caption-track .intro-caption{
opacity:1;
width:auto;
max-width:34em;
transform:translate3d(-120%,0,0);
filter:none;
transition:transform 1.2s cubic-bezier(.22,1,.36,1);
}

.intro-screen.is-ready .intro-caption-track--top .intro-caption{
transform:none;
}

.intro-screen.is-ready .intro-caption__pre{
opacity:1;
transform:translate3d(0,0,0);
transition-delay:1.15s;
}

.intro-screen.is-ready .intro-caption__line--invite{
opacity:1;
transform:translate3d(0,0,0);
transition-delay:1.65s;
}

.intro-screen.is-ready .intro-caption-track--bottom .intro-caption{
transform:translate3d(0,0,0);
transition-delay:2.15s;
}

.intro-screen.is-opening .intro-caption-track .intro-caption,
.intro-screen.is-opening .intro-caption__pre,
.intro-screen.is-opening .intro-caption__line{
transform:translate3d(0,0,0);
opacity:0;
transition:opacity 1.1s cubic-bezier(.4,0,.2,1);
}

.intro-screen.is-opening .finger-heart-btn{
animation:none !important;
transform:none !important;
transition:none !important;
}

.intro-screen.is-opening .heart-stage{
animation:none !important;
overflow:visible;
}

.intro-screen.is-opening .heart-fingerprint{
transition:none !important;
}

.intro-screen.is-opening .finger-intro{
opacity:0;
overflow:visible;
transition:opacity 1.1s cubic-bezier(.4,0,.2,1) .35s;
}

.intro-screen.is-opening .silk-background{
opacity:0;
transform:scale(1.05);
transition:
opacity 1.4s cubic-bezier(.4,0,.2,1) .55s,
transform 1.6s cubic-bezier(.22,1,.36,1) .4s;
}

.intro-screen.is-opening{
opacity:0;
transition:opacity 1.25s cubic-bezier(.22,1,.36,1) .95s;
}

/* HEART */

.finger-heart-btn{
margin:0;
cursor:pointer;
border:none;
padding:0;
background:transparent;
-webkit-tap-highlight-color:transparent;
font:inherit;
color:inherit;
outline:none;
box-shadow:none;
appearance:none;
-webkit-appearance:none;
overflow:visible;

display:block;
}

.finger-heart-btn:focus{
outline:none;
}

.finger-heart-btn:focus-visible{
outline:2px solid rgba(63,58,54,.25);
outline-offset:8px;
border-radius:50%;
}

.heart-stage{
display:block;
width:min(320px,72vw);
height:min(320px,72vw);
overflow:visible;
transform-origin:center center;
}

.heart-fingerprint{
display:block;
width:100%;
height:100%;
object-fit:contain;
pointer-events:none;
transform-origin:center center;
mix-blend-mode:screen;
filter:
grayscale(100%)
brightness(.42)
contrast(1.55);
transition:none;
}

.silk-filters{
position:absolute;
width:0;
height:0;
overflow:hidden;
pointer-events:none;
}

/* ANIMATIONS */



@keyframes heartFloat{

0%{
transform:translate3d(0,0,0);
}

50%{
transform:translate3d(0,-10px,0);
}

100%{
transform:translate3d(0,0,0);
}

}

@media (prefers-reduced-motion: reduce){

.silk-background__texture{
animation:none !important;
filter:contrast(1.04) brightness(1);
}

.intro-screen .intro-caption-track .intro-caption,
.intro-screen .finger-heart-btn,
.intro-screen.is-opening .heart-fingerprint,
.intro-screen.is-opening .silk-background,
.intro-screen.is-opening{
transition-duration:.2s !important;
transition-delay:0s !important;
}

.intro-screen.is-ready .intro-caption-track .intro-caption,
.intro-screen.is-ready .intro-caption__pre,
.intro-screen.is-ready .intro-caption__line,
.intro-screen.is-ready .finger-heart-btn{
transform:none;
opacity:1;
}

.intro-screen.is-opening .heart-fingerprint{
filter:grayscale(100%) brightness(.42) contrast(1.55);
}

}

/* MOBILE */

@media(max-width:900px){

.intro-caption{
padding:0 20px;
}

.intro-caption--top{
margin-bottom:44px;
}

.intro-caption--bottom{
margin-top:36px;
}

.heart-stage{
width:min(240px,68vw);
height:min(240px,68vw);
}

.finger-intro h1{
display:none;
}
}

/* MOBILE */

@media(max-width:900px){

.finger-heart-btn{
margin:28px auto 22px;
}

}

/* ANIMATION */

.finger-intro h1{
font-family:var(--font-serif);
font-size:82px;
font-weight:var(--type-weight);
color:#000;
margin-top:20px;
margin-bottom:50px;
}

@media(max-width:900px){

.finger-intro h1{
font-size:40px;
line-height:.95;
padding:0 20px;
}

}  
/* INFO CARDS ANIMATION */
/* ENVELOPE */




/* OPEN STATE */

/* OPEN ANIMATION */



/* MOBILE */
@media(max-width:900px){

.intro-caption--top{
margin-bottom:28px;
}

.intro-text{
font-size:var(--text-body);
max-width:240px;
margin-bottom:0;
}
}

/* ========== MAIN SITE — light silk (как во вступлении) ========== */

*{
margin:0;
padding:0;
box-sizing:border-box;
}

html{
scroll-behavior:smooth;
width:100%;
max-width:100%;
overflow-x:hidden;
overflow-x:clip;
overscroll-behavior-x:none;
}

body,
button,
input,
textarea,
select{
font-family:var(--font-serif);
font-weight:var(--weight-body);
}

body{
background:#fafaf8;
font-size:var(--text-body);
font-weight:var(--type-weight);
font-style:var(--type-style);
line-height:var(--type-leading);
letter-spacing:var(--type-tracking);
text-transform:var(--type-transform);
color:var(--text);
overflow-x:hidden;
overflow-x:clip;
width:100%;
max-width:100%;
min-height:100vh;
margin:0;
padding:0;
touch-action:pan-y pinch-zoom;
-webkit-font-smoothing:antialiased;
-moz-osx-font-smoothing:grayscale;
text-rendering:optimizeLegibility;
}

img,
svg,
video{
max-width:100%;
height:auto;
}

.intro-screen,
.site,
.site-bg{
max-width:100%;
}

.site-bg{
position:fixed;
inset:0;
z-index:0;
pointer-events:none;
overflow:hidden;
width:100%;
max-width:100%;
background:#f6f5f3;
contain:paint;
}

.site-bg__photo{
position:absolute;
inset:0;
width:100%;
height:100%;
object-fit:cover;
object-position:center center;
opacity:1;
filter:contrast(1.06) saturate(1.02) brightness(1.01);
transform:translateZ(0);
backface-visibility:hidden;
image-rendering:-webkit-optimize-contrast;
}

.site-bg__base,
.site-bg__depth,
.site-bg__folds,
.site-bg__wind,
.site-bg__gleam{
display:none;
}

.site-bg__motion{
position:absolute;
inset:0;
width:100%;
height:100%;
overflow:hidden;
pointer-events:none;
}

.site-bg__soft{
position:absolute;
inset:0;
pointer-events:none;
background:
linear-gradient(180deg, rgba(255,255,255,.12) 0%, transparent 42%, rgba(248,246,243,.1) 100%),
radial-gradient(ellipse 40% 26% at 24% 22%, rgba(255,255,255,.5), transparent 58%),
radial-gradient(ellipse 34% 22% at 74% 18%, rgba(255,255,255,.32), transparent 55%),
linear-gradient(118deg, transparent 38%, rgba(255,255,255,.22) 50%, transparent 62%);
opacity:.58;
}

html:not(.perf-lite) .site-bg__photo{
animation:silkFlow 16s ease-in-out infinite;
will-change:transform;
}

html:not(.perf-lite) .site-bg__soft{
animation:silkSheenSoft 11s ease-in-out infinite;
will-change:transform, opacity;
}

html:not(.perf-lite) .site-bg__motion{
animation:none;
}

.site{
--content-width:26.25rem;
--panel-width:var(--content-width);
--text-body:1.125rem;
--text-heading:calc(1.3125rem + 2pt);
--text-lead:var(--text-body);
--text-label:var(--text-body);
--text-small:var(--text-body);
--text-hero-intro:var(--text-body);
--type-leading:1.62;
--type-leading-heading:1.22;
position:relative;
z-index:1;
display:flex;
flex-direction:column;
align-items:center;
width:100%;
max-width:100%;
margin:0 auto;
padding-inline:var(--page-gutter);
box-sizing:border-box;
overflow-x:hidden;
overflow-x:clip;
opacity:0;
transform:translate3d(0,20px,0);
transition:opacity 1.2s var(--ease), transform 1.2s var(--ease);
color:var(--text);
font-family:var(--font-serif);
font-size:var(--text-body);
font-weight:var(--weight-body);
letter-spacing:var(--tracking-body);
line-height:var(--type-leading);
text-align:center;
}

.site .script-title,
.site .hero-names,
.site .date-big,
.site .venue-name,
.site .dresscode-tag,
.site .timeline-time,
.site .timeline-name,
.site .time-box span{
color:var(--text);
text-shadow:var(--text-shadow-title);
}

.site .calendar-days span.is-muted{
color:var(--text);
}

.site section{
display:flex;
flex-direction:column;
align-items:center;
width:100%;
max-width:100%;
box-sizing:border-box;
padding-top:clamp(72px,12vw,110px);
padding-bottom:clamp(72px,12vw,110px);
padding-inline:0;
position:relative;
}

.content-column{
display:flex;
flex-direction:column;
align-items:center;
width:100%;
max-width:var(--content-width);
margin-inline:auto;
padding-inline:var(--page-gutter);
box-sizing:border-box;
text-align:center;
}

.content-column > *:not(.btn-map){
width:100%;
max-width:100%;
margin-inline:auto;
box-sizing:border-box;
}

.content-column > .btn-map{
width:auto;
max-width:100%;
flex-shrink:0;
}

.content-column--calendar,
.content-column--countdown,
.content-column--wide{
max-width:var(--content-width);
}

.site section > .content-column,
.site section > .content-column--calendar,
.site section > .content-column--countdown,
.site section > .content-column--wide{
max-width:var(--content-width);
}

.site section > *:not(.deco-heart):not(.content-column){
width:100%;
max-width:var(--content-width);
margin-inline:auto;
box-sizing:border-box;
}

.site section > .deco-heart{
width:auto;
max-width:none;
}

.hero-panel,
.section-panel,
.details-list,
.calendar,
.countdown,
.rsvp-form,
.timeline,
.countdown-heading{
position:relative;
z-index:1;
box-sizing:border-box;
width:100%;
margin-inline:auto;
padding-inline:0;
}

.hero-panel,
.section-panel,
.details-list,
.rsvp-form{
width:100%;
max-width:100%;
}

.countdown{
max-width:100%;
}

.script-title--solo{
margin-bottom:clamp(28px,6vw,40px);
}

.script-title--solo::after{
content:'';
display:block;
width:52px;
height:1px;
margin:18px auto 0;
background:linear-gradient(90deg, transparent, var(--line) 20%, var(--line) 80%, transparent);
}

.hero{
padding-top:clamp(88px,14vw,120px);
text-align:center;
display:flex;
flex-direction:column;
align-items:center;
overflow:visible;
}

.hero-panel{
align-items:center;
text-align:center;
}

.hero-intro{
display:flex;
flex-direction:column;
align-items:center;
width:100%;
overflow:visible;
}

.hero-lead{
color:var(--text);
max-width:min(28rem,92vw);
margin-inline:auto;
padding:0 clamp(4px,2vw,12px);
text-align:center;
text-wrap:balance;
hyphens:none;
font-feature-settings:'liga' 1,'kern' 1;
}

.hero-intro > .hero-lead:first-child{
margin:0 auto clamp(24px,5vw,36px);
}

.hero-intro > .hero-names + .hero-lead{
margin:clamp(24px,5vw,36px) auto 0;
}

.hero-intro .hero-lead + .hero-lead{
margin-top:clamp(14px,3vw,20px);
}

.hero-names{
display:flex;
flex-direction:column;
justify-content:center;
align-items:center;
margin:0 auto;
padding:0 clamp(8px,3vw,20px);
max-width:100%;
overflow:visible;
}

.hero-names::after{
content:'';
display:block;
width:min(7.5rem,42vw);
height:1px;
margin:clamp(18px,3.5vw,24px) auto 0;
background:linear-gradient(90deg, transparent, var(--line) 18%, var(--line) 82%, transparent);
}

.hero-names__image{
display:block;
width:min(100%, 20rem);
height:auto;
max-height:min(58vh, 28rem);
margin-inline:auto;
object-fit:contain;
object-position:center center;
background:transparent;
mix-blend-mode:multiply;
opacity:1;
}

.site.is-visible{
opacity:1;
transform:translate3d(0,0,0);
}

.reveal{
opacity:0;
transform:translate3d(0,18px,0);
transition:
opacity .95s var(--ease),
transform .95s var(--ease);
will-change:opacity, transform;
}

.reveal.show{
opacity:1;
transform:translate3d(0,0,0);
will-change:auto;
}

.reveal:has(.section-panel),
.reveal:has(.details-list),
.reveal:has(.rsvp-form){
opacity:1;
transform:none;
}

.section-intro{
opacity:0;
transform:translate3d(0,12px,0);
transition:
opacity .8s var(--ease),
transform .85s var(--ease);
}

.section-intro.is-visible{
opacity:1;
transform:none;
}

.script-title{
color:var(--text);
text-align:center;
margin-bottom:clamp(20px,4vw,28px);
width:100%;
max-width:100%;
margin-inline:auto;
padding-inline:0;
}

.content-column .script-title{
max-width:100%;
}

.section-kicker{
color:var(--text);
text-align:center;
margin-bottom:10px;
}

.section-block{
max-width:520px;
margin:0 auto;
text-align:center;
}

/* HERO */

/* SECTION PANELS */

.section-panel,
.details-list,
.rsvp-form{
width:100%;
max-width:100%;
margin-inline:auto;
padding:var(--panel-padding-block) var(--panel-padding-inline);
text-align:center;
background:var(--panel-glass-bg-fallback);
border:1px solid var(--panel-glass-border);
border-radius:6px;
box-shadow:var(--panel-glass-highlight), var(--panel-glass-shadow);
box-sizing:border-box;
isolation:isolate;
opacity:0;
transform:translate3d(0,18px,0) scale(0.988);
transition:
opacity .95s var(--ease),
transform 1s var(--ease);
}

.section-panel.is-frame-visible,
.details-list.is-frame-visible,
.rsvp-form.is-frame-visible{
opacity:1;
transform:none;
}

@supports ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){

.section-panel,
.details-list,
.rsvp-form{
background:var(--panel-glass-bg);
-webkit-backdrop-filter:blur(var(--panel-glass-blur)) saturate(var(--panel-glass-saturate));
backdrop-filter:blur(var(--panel-glass-blur)) saturate(var(--panel-glass-saturate));
}

}

html.perf-lite .section-panel,
html.perf-lite .details-list,
html.perf-lite .rsvp-form{
background:rgba(255,255,255,.22);
-webkit-backdrop-filter:blur(10px) saturate(1.12);
backdrop-filter:blur(10px) saturate(1.12);
}

.panel-piece{
opacity:0;
transform:translate3d(0,14px,0);
transition:
opacity .75s var(--ease),
transform .8s var(--ease);
}

.section-panel:not(.is-content-visible) .panel-piece,
.details-list:not(.is-content-visible) .panel-piece,
.rsvp-form:not(.is-content-visible) .panel-piece{
opacity:0;
transform:translate3d(0,12px,0);
}

.panel-piece.is-visible{
opacity:1;
transform:translate3d(0,0,0);
}

@media (max-width:900px){

.reveal{
transform:translate3d(0,12px,0);
transition:
opacity 1s var(--ease),
transform 1.05s var(--ease);
}

.section-panel,
.details-list,
.rsvp-form{
transform:translate3d(0,14px,0);
transition:
opacity .95s var(--ease),
transform 1s var(--ease);
}

.section-panel.is-frame-visible,
.details-list.is-frame-visible,
.rsvp-form.is-frame-visible{
transform:none;
}

.panel-piece{
opacity:0;
transform:translate3d(0,10px,0);
transition:
opacity .9s var(--ease),
transform .95s var(--ease);
}

.section-panel:not(.is-content-visible) .panel-piece,
.details-list:not(.is-content-visible) .panel-piece,
.rsvp-form:not(.is-content-visible) .panel-piece{
opacity:0;
transform:translate3d(0,10px,0);
}

.section-intro{
transform:translate3d(0,10px,0);
transition:
opacity .9s var(--ease),
transform .95s var(--ease);
}

.reveal:has(.section-panel):not(.show) .section-panel,
.reveal:has(.details-list):not(.show) .details-list,
.reveal:has(.rsvp-form):not(.show) .rsvp-form,
.reveal:has(.section-panel):not(.show) .section-intro,
.reveal:has(.details-list):not(.show) .section-intro,
.reveal:has(.rsvp-form):not(.show) .section-intro,
.reveal:has(.section-panel):not(.show) .panel-piece,
.reveal:has(.details-list):not(.show) .panel-piece,
.reveal:has(.rsvp-form):not(.show) .panel-piece{
opacity:0;
visibility:hidden;
}

.reveal:has(.section-panel):not(.show) .section-panel,
.reveal:has(.details-list):not(.show) .details-list,
.reveal:has(.rsvp-form):not(.show) .rsvp-form,
.reveal:has(.section-panel):not(.show) .section-intro,
.reveal:has(.details-list):not(.show) .section-intro,
.reveal:has(.rsvp-form):not(.show) .section-intro{
transform:translate3d(0,12px,0);
}

.reveal.show:has(.section-panel) .section-intro,
.reveal.show:has(.details-list) .section-intro,
.reveal.show:has(.rsvp-form) .section-intro,
.reveal.show:has(.section-panel) .panel-piece,
.reveal.show:has(.details-list) .panel-piece,
.reveal.show:has(.rsvp-form) .panel-piece{
visibility:visible;
}

.reveal.show:has(.section-panel) .section-intro.is-visible,
.reveal.show:has(.details-list) .section-intro.is-visible,
.reveal.show:has(.rsvp-form) .section-intro.is-visible,
.reveal.show:has(.section-panel) .panel-piece.is-visible,
.reveal.show:has(.details-list) .panel-piece.is-visible,
.reveal.show:has(.rsvp-form) .panel-piece.is-visible{
visibility:visible;
}

}

/* INVITE */

.invite{
text-align:center;
display:flex;
flex-direction:column;
align-items:center;
}

.invite-panel{
display:flex;
flex-direction:column;
align-items:center;
padding-block:clamp(28px,6vw,38px);
}

.invite-panel__title{
margin-bottom:clamp(18px,4vw,24px);
width:100%;
}

.invite-panel__title.script-title--solo::after{
margin-top:14px;
}

.invite .invite-block{
position:relative;
width:100%;
margin:0;
padding:clamp(14px,3.2vw,18px) 0;
border:none;
text-align:center;
}

.invite .invite-block:not(:last-of-type)::after{
content:'';
display:block;
width:min(4.5rem,42%);
height:1px;
margin:clamp(14px,3.2vw,18px) auto 0;
background:linear-gradient(90deg, transparent, var(--line) 22%, var(--line) 78%, transparent);
}

.invite .invite-block::before{
display:none;
}

.invite .invite-block:last-of-type{
padding-bottom:clamp(4px,1vw,6px);
}

.invite .invite-block p{
color:var(--text);
margin:0 auto;
max-width:20rem;
text-align:center;
text-wrap:balance;
line-height:var(--type-leading);
}

.invite-date,
.invite-countdown{
position:relative;
width:100%;
margin-top:clamp(18px,4vw,24px);
padding-top:clamp(18px,4vw,24px);
border-top:none;
text-align:center;
}

.invite-date::before,
.invite-countdown::before{
content:'';
position:absolute;
top:0;
left:50%;
transform:translateX(-50%);
width:min(4.5rem,42%);
height:1px;
background:linear-gradient(90deg, transparent, var(--line) 22%, var(--line) 78%, transparent);
}

.invite-date .date-big{
color:var(--text);
margin:0 0 clamp(18px,4vw,22px);
width:100%;
font-size:clamp(1.12rem,3vw,1.3rem);
letter-spacing:0.04em;
text-align:center;
}

.invite-date .date-big::after{
display:none;
}

.invite-date .calendar--strip{
width:100%;
max-width:18.5rem;
margin-inline:auto;
}

.calendar--strip{
width:100%;
max-width:18.5rem;
margin-inline:auto;
}

.calendar-weekdays--strip,
.calendar-days--strip{
display:grid;
grid-template-columns:repeat(5, minmax(0, 1fr));
align-items:end;
width:100%;
text-align:center;
}

.calendar-weekdays--strip{
margin-bottom:clamp(10px,2.5vw,14px);
}

.calendar-weekdays--strip span{
color:var(--text);
font-size:clamp(0.72rem,1.9vw,0.82rem);
letter-spacing:0.1em;
line-height:1;
}

.calendar-days--strip .calendar-day{
display:flex;
align-items:center;
justify-content:center;
min-height:2.75rem;
font-variant-numeric:tabular-nums;
color:var(--text);
font-size:clamp(1.05rem,2.8vw,1.28rem);
line-height:1;
}

.calendar-days--strip .calendar-day.is-wedding{
position:relative;
min-height:3.1rem;
}

.calendar-day__heart{
position:absolute;
left:50%;
top:50%;
width:2.65em;
height:2.65em;
transform:translate(-50%, -52%);
background-color:#6d3b3b;
-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath fill='%23000' d='M16 27s-8-5.8-8-11.2C8 12.5 10.5 10 13.2 10c1.5 0 2.8.8 2.8 2.2 0-1.4 1.3-2.2 2.8-2.2 2.7 0 5.2 2.3 5.2 5.8C24 21.2 16 27 16 27z'/%3E%3C/svg%3E");
mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath fill='%23000' d='M16 27s-8-5.8-8-11.2C8 12.5 10.5 10 13.2 10c1.5 0 2.8.8 2.8 2.2 0-1.4 1.3-2.2 2.8-2.2 2.7 0 5.2 2.3 5.2 5.8C24 21.2 16 27 16 27z'/%3E%3C/svg%3E");
-webkit-mask-repeat:no-repeat;
mask-repeat:no-repeat;
-webkit-mask-position:center;
mask-position:center;
-webkit-mask-size:contain;
mask-size:contain;
pointer-events:none;
}

.calendar-day__num{
position:relative;
z-index:1;
color:#fff;
font-style:normal;
font-weight:300;
font-size:1.08em;
letter-spacing:0.02em;
transform:translateY(-0.04em);
}

.invite-countdown .countdown-heading{
display:block;
color:var(--text);
margin:0 0 clamp(16px,3.8vw,22px);
text-align:center;
text-wrap:balance;
}

.invite-panel .countdown{
display:grid;
grid-template-columns:repeat(4, minmax(0, 1fr));
justify-items:center;
align-items:start;
gap:clamp(8px,2.2vw,18px);
width:100%;
max-width:18.5rem;
margin:0 auto;
padding:0;
}

.invite-panel .time-box{
min-width:0;
width:100%;
}

.invite-panel .time-box span{
font-size:clamp(1.28rem,3.6vw,1.55rem);
font-weight:300;
letter-spacing:0.02em;
line-height:1;
}

.invite-panel .time-box span::after{
width:18px;
margin-top:8px;
opacity:.35;
}

.invite-panel .time-box p{
margin-top:8px;
font-size:clamp(0.76rem,1.9vw,0.86rem);
letter-spacing:0.05em;
opacity:.9;
}

/* COUNTDOWN */

.countdown-heading{
display:inline-block;
color:var(--text);
margin-inline:auto;
text-align:center;
}

.countdown-panel .countdown,
.countdown{
display:grid;
grid-template-columns:repeat(4, minmax(0, 1fr));
justify-items:center;
align-items:start;
gap:clamp(16px,4vw,36px);
width:100%;
margin:0 auto;
padding:0;
}

.time-box{
min-width:64px;
text-align:center;
position:relative;
}

.time-box span{
display:block;
font-variant-numeric:tabular-nums;
color:var(--text);
}

.time-box span::after{
content:'';
display:block;
width:24px;
height:1px;
margin:10px auto 0;
background:var(--line);
opacity:.5;
}

.time-box p{
color:var(--text);
margin-top:10px;
}

/* LOCATION */

.location{
text-align:center;
}



.location-panel .venue-name{
margin:0 0 clamp(20px,4vw,26px);
color:var(--text);
width:100%;
text-align:center;
}

.venue-name{
color:var(--text);
width:100%;
text-align:center;
}

.location-panel .venue-photo{
width:100%;
max-width:100%;
aspect-ratio:16 / 9;
height:auto;
object-fit:cover;
object-position:center center;
border-radius:12px;
box-shadow:0 12px 28px rgba(42,38,35,.1);
margin:0 auto clamp(22px,4vw,28px);
display:block;
}

.venue-photo{
width:100%;
max-width:100%;
height:auto;
object-fit:contain;
object-position:center;
border-radius:20px;
box-shadow:0 18px 50px rgba(42,38,35,.1);
margin:0 auto 28px;
display:block;
}

.location-panel .venue-address{
color:var(--text);
margin:0 auto clamp(24px,4vw,30px);
max-width:22rem;
text-align:center;
text-wrap:balance;
line-height:var(--type-leading);
}

.venue-address{
color:var(--text);
max-width:100%;
margin-inline:auto;
text-align:center;
text-wrap:balance;
}

.location-panel .btn-map{
margin:0 auto;
}

.btn-map{
display:inline-flex;
align-items:center;
justify-content:center;
gap:0.35em;
width:auto;
min-width:min(100%, 12.5rem);
max-width:100%;
margin-inline:auto;
padding:13px 28px;
border:1px solid var(--panel-glass-border);
border-radius:6px;
background:var(--panel-glass-bg-fallback);
color:var(--text);
font:inherit;
letter-spacing:0.05em;
text-decoration:none;
box-shadow:var(--panel-glass-highlight), 0 10px 28px rgba(42,38,35,.07);
transition:
background .35s var(--ease),
border-color .35s var(--ease),
box-shadow .35s var(--ease),
transform .35s var(--ease);
}

@supports ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){

.btn-map{
background:var(--panel-glass-bg);
-webkit-backdrop-filter:blur(14px) saturate(1.18);
backdrop-filter:blur(14px) saturate(1.18);
}

}

.btn-map:hover{
background:rgba(255,255,255,.34);
border-color:rgba(255,255,255,.58);
box-shadow:var(--panel-glass-highlight), 0 14px 32px rgba(42,38,35,.1);
transform:translateY(-1px);
}

.btn-map:focus-visible{
outline:none;
border-color:rgba(42,38,35,.35);
box-shadow:var(--panel-glass-highlight), 0 0 0 3px rgba(255,255,255,.42);
}

/* DRESS CODE */

.dresscode{
text-align:center;
}


.dresscode-panel{
overflow:visible;
}

.dresscode-panel .dresscode-desc{
color:var(--text);
max-width:22rem;
margin:0 auto clamp(20px,4vw,24px);
text-align:center;
text-wrap:balance;
line-height:var(--type-leading);
}

.dresscode-desc{
color:var(--text);
max-width:100%;
margin:0 auto 28px;
text-align:center;
text-wrap:balance;
}

.dresscode-panel .dress-colors{
--swatch-size:72px;
--swatch-hover-scale:1.12;
display:flex;
flex-direction:column;
align-items:center;
gap:0;
width:100%;
max-width:100%;
margin:0 auto clamp(24px,5vw,32px);
padding:0;
overflow:visible;
}

.dresscode-panel .dress-colors-row{
display:grid;
grid-template-columns:repeat(3, minmax(0, 1fr));
align-items:start;
column-gap:clamp(14px,3.5vw,24px);
width:100%;
overflow:visible;
}

.dresscode-panel .dress-colors-row--top{
position:relative;
z-index:1;
margin-bottom:clamp(32px,6vw,48px);
}

.dresscode-panel .dress-colors-row--bottom{
position:relative;
z-index:2;
}

.dress-colors{
display:flex;
justify-content:center;
gap:16px;
flex-wrap:wrap;
margin-bottom:12px;
}

.color-item{
display:flex;
flex-direction:column;
align-items:center;
justify-content:flex-start;
gap:clamp(8px,2vw,10px);
width:100%;
overflow:visible;
}

.color-label{
display:block;
width:100%;
max-width:6rem;
min-height:2.75em;
margin:0 auto;
padding:0 2px;
color:var(--text);
font-family:var(--font-serif);
font-size:clamp(0.68rem,1.85vw,0.78rem);
font-weight:300;
letter-spacing:0.08em;
line-height:1.3;
text-align:center;
text-transform:uppercase;
transition:opacity .35s var(--ease);
}

.color-item:hover .color-label{
opacity:.88;
}

.color-swatch-frame{
display:block;
width:var(--swatch-size);
height:var(--swatch-size);
flex:0 0 var(--swatch-size);
border-radius:50%;
overflow:hidden;
}

.dresscode-panel .color-swatch{
display:block;
width:100%;
height:100%;
max-width:none;
border-radius:50%;
border:none;
box-shadow:none;
object-fit:cover;
object-position:center;
transition:transform .4s var(--ease);
transform-origin:center center;
cursor:default;
}

.color-item:hover .color-swatch{
transform:scale(var(--swatch-hover-scale));
}

@media (max-width:520px){

.dresscode-panel .dress-colors{
--swatch-size:64px;
--swatch-hover-scale:1.08;
}

.dresscode-panel .dress-colors-row{
column-gap:clamp(10px,2.8vw,16px);
}

.dresscode-panel .dress-colors-row--top{
margin-bottom:clamp(28px,5.5vw,42px);
}

.color-label{
max-width:5.25rem;
min-height:2.75em;
font-size:0.62rem;
letter-spacing:0.07em;
}

}

.dresscode-panel .dresscode-note{
color:var(--text);
margin:clamp(10px,2.5vw,16px) auto 0;
max-width:22rem;
text-align:center;
text-wrap:balance;
line-height:var(--type-leading);
}

.dresscode-note{
color:var(--text);
margin-top:20px;
text-align:center;
text-wrap:balance;
}

/* PROGRAM TIMELINE */

.program,
.details{
text-align:center;
}


.program-panel .timeline{
width:100%;
max-width:100%;
margin-inline:auto;
padding:0;
text-align:center;
}

.timeline{
width:100%;
max-width:100%;
margin-inline:auto;
padding:4px 0;
text-align:center;
}

.program-panel .timeline-item,
.timeline-item{
display:block;
width:100%;
margin:0 auto clamp(28px,6vw,40px);
text-align:center;
}

.program-panel .timeline-item:last-child,
.timeline-item:last-child{
margin-bottom:0;
}

.timeline-head{
display:block;
width:100%;
margin:0 auto;
text-align:center;
}

.timeline-time,
.timeline-name{
display:inline;
color:var(--text);
text-align:center;
}

.timeline-time{
font-variant-numeric:tabular-nums;
white-space:nowrap;
}

.timeline-time::after{
content:'\00a0\00a0';
}

.timeline-name{
margin:0;
}

.timeline-desc{
color:var(--text);
width:100%;
max-width:100%;
margin:clamp(10px,2.5vw,14px) auto 0;
padding:0;
text-align:center;
line-height:var(--type-leading);
}

.program .content-column{
max-width:min(100%, 28rem);
}

.program-panel{
padding-block:clamp(30px,6.5vw,38px);
}

@media (max-width:520px){

.program .content-column{
max-width:100%;
padding-inline:clamp(10px,2.5vw,14px);
}

.program-panel{
padding-block:clamp(32px,7vw,40px);
padding-inline:clamp(16px,4vw,22px);
}

.program-panel .timeline-item,
.timeline-item{
margin-bottom:clamp(30px,6.5vw,42px);
}

.program-panel .timeline-desc{
line-height:1.5;
}

}

/* DETAILS */


.details .details-item{
position:relative;
width:100%;
margin:0;
padding:clamp(18px,4vw,22px) 0;
border:none;
text-align:center;
}

.details .details-item:not(:last-child)::after{
content:'';
display:block;
width:min(4.5rem,42%);
height:1px;
margin:clamp(18px,4vw,22px) auto 0;
background:linear-gradient(90deg, transparent, var(--line) 22%, var(--line) 78%, transparent);
}

.details .details-item::before{
display:none;
}

.details .details-item:last-child{
padding-bottom:0;
}

.details .details-item p{
color:var(--text);
margin:0 auto;
max-width:22rem;
text-align:center;
text-wrap:balance;
line-height:var(--type-leading);
}

/* RSVP */

.rsvp,
.rsvp-form,
.rsvp-deadline,
.rsvp-form :is(.form-label,.form-control,.option-card,button,.rsvp-form-status){
font-family:var(--font-serif);
font-size:var(--text-body);
font-weight:var(--type-weight);
font-style:var(--type-style);
text-transform:var(--type-transform);
letter-spacing:var(--type-tracking);
line-height:var(--type-leading);
}

.rsvp{
text-align:center;
padding-bottom:clamp(88px,14vw,120px);
}

.rsvp-deadline{
color:var(--text);
margin-bottom:clamp(32px,7vw,44px);
max-width:22rem;
margin-inline:auto;
text-align:center;
text-wrap:balance;
line-height:var(--type-leading);
}

.rsvp-form{
display:flex;
flex-direction:column;
gap:0;
}

.form-group{
margin:0;
padding:0;
opacity:1;
transform:none;
width:100%;
display:flex;
flex-direction:column;
align-items:stretch;
text-align:center;
}

.form-group + .form-group{
margin-top:clamp(22px,5vw,28px);
padding-top:clamp(22px,5vw,28px);
border-top:1px solid rgba(42,38,35,.1);
}

.form-label{
display:block;
color:var(--text);
margin:0 0 clamp(10px,2.5vw,12px);
width:100%;
text-align:center;
text-wrap:balance;
}

.form-control{
width:100%;
padding:13px 16px;
background:rgba(255,255,255,.42);
border:1px solid rgba(42,38,35,.18);
border-radius:2px;
color:var(--text);
font:inherit;
text-align:center;
outline:none;
box-shadow:none;
-webkit-appearance:none;
appearance:none;
transition:
border-color .3s ease,
background .3s ease,
box-shadow .3s ease;
}

.form-control::placeholder{
color:var(--text);
opacity:.5;
}

.form-control:focus{
border-color:rgba(42,38,35,.42);
background:rgba(255,255,255,.62);
box-shadow:0 0 0 3px rgba(255,255,255,.35);
}

.form-group--wide .form-control{
min-height:108px;
resize:vertical;
line-height:var(--type-leading);
}

.form-note{
margin:clamp(10px,2.5vw,12px) auto 0;
max-width:22rem;
color:var(--text);
font-size:clamp(0.82rem,2.1vw,0.9rem);
line-height:1.45;
text-align:center;
text-wrap:balance;
opacity:.78;
}

.option-row{
display:flex;
flex-direction:column;
gap:10px;
width:100%;
}

.form-group--attendance .option-row--radio{
display:flex;
flex-direction:column;
gap:10px;
width:100%;
}

.option-card{
display:flex;
align-items:flex-start;
justify-content:flex-start;
gap:12px;
width:100%;
margin:0;
padding:14px 16px;
text-align:left;
color:var(--text);
cursor:pointer;
border:1px solid rgba(42,38,35,.16);
border-radius:2px;
background:rgba(255,255,255,.22);
transition:
border-color .3s ease,
background .3s ease,
box-shadow .3s ease;
}

.option-card span{
flex:1 1 auto;
line-height:var(--type-leading);
}

.option-card:has(:checked){
border-color:rgba(42,38,35,.38);
background:rgba(255,255,255,.55);
box-shadow:0 6px 18px rgba(42,38,35,.06);
}

.option-card input{
flex-shrink:0;
width:1.125rem;
height:1.125rem;
margin:0.15em 0 0;
border:1px solid var(--text);
background:transparent;
accent-color:var(--text);
-webkit-appearance:none;
appearance:none;
cursor:pointer;
}

.option-row--radio .option-card input{
border-radius:50%;
}

.option-row--check .option-card input{
border-radius:2px;
}

.option-row--radio .option-card input:checked{
border-color:var(--text);
background:radial-gradient(circle, var(--text) 38%, transparent 40%);
}

.option-row--check .option-card input:checked{
border-color:var(--text);
background:var(--text);
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 10'%3E%3Cpath fill='%23fff' d='M1 5.2 4.1 8.3 11 1.4' stroke='%23fff' stroke-width='1.2'/%3E%3C/svg%3E");
background-repeat:no-repeat;
background-position:center;
background-size:10px 8px;
}

.rsvp-form__actions{
margin-top:clamp(28px,6vw,34px);
padding-top:clamp(24px,5vw,30px);
border-top:1px solid rgba(42,38,35,.12);
width:100%;
display:flex;
flex-direction:column;
align-items:center;
gap:12px;
}

.btn-submit{
display:inline-flex;
align-items:center;
justify-content:center;
min-width:min(100%, 14rem);
width:auto;
max-width:100%;
margin:0;
padding:15px 36px;
background:rgba(255,255,255,.25);
border:1px solid rgba(42,38,35,.32);
border-radius:2px;
color:var(--text);
font:inherit;
cursor:pointer;
transition:
background .35s ease,
border-color .35s ease,
color .35s ease,
transform .35s var(--ease);
}

.btn-submit:hover{
background:rgba(255,255,255,.5);
border-color:rgba(42,38,35,.48);
color:var(--text);
transform:translateY(-2px);
}

.rsvp .btn-submit{
transition:
background .35s ease,
border-color .35s ease;
}

.photo-ribbon{
position:relative;
z-index:1;
width:100%;
max-width:100%;
box-sizing:border-box;
padding:0;
margin:clamp(18px,4.5vw,28px) auto 0;
}

.photo-ribbon__viewport{
position:relative;
width:100%;
overflow:hidden;
overscroll-behavior-x:contain;
scrollbar-width:none;
cursor:grab;
touch-action:pan-y;
padding:clamp(28px, 5vw, 42px) 0 clamp(34px, 6vw, 52px);
perspective:1200px;
perspective-origin:50% 50%;
mask-image:linear-gradient(90deg, transparent 0%, #000 6%, #000 94%, transparent 100%);
-webkit-mask-image:linear-gradient(90deg, transparent 0%, #000 6%, #000 94%, transparent 100%);
}

.photo-ribbon__viewport::-webkit-scrollbar{
display:none;
}

.photo-ribbon__viewport.is-dragging{
cursor:grabbing;
}

.photo-ribbon__marquee{
display:flex;
width:max-content;
gap:24px;
will-change:transform;
transform-style:preserve-3d;
}

.photo-ribbon__viewport.is-dragging .photo-ribbon__item{
transition:none;
}

.photo-ribbon__track{
display:flex;
align-items:center;
gap:24px;
width:max-content;
transform-style:preserve-3d;
}

.photo-ribbon__item{
margin:0;
flex:0 0 auto;
display:flex;
flex-direction:column;
align-items:stretch;
width:416px;
padding:14px 14px 52px;
background:
linear-gradient(180deg, rgba(255,255,255,.55) 0%, rgba(255,255,255,0) 18%),
#faf6ef;
border:1px solid rgba(255,255,255,.92);
box-shadow:
0 1px 1px rgba(42,38,35,.06),
0 10px 22px rgba(42,38,35,.11),
0 22px 44px rgba(42,38,35,.08);
transform-style:preserve-3d;
backface-visibility:hidden;
will-change:transform;
transition:box-shadow .45s var(--ease);
}

.photo-ribbon__img{
width:100%;
height:292px;
flex:0 0 auto;
object-fit:contain;
object-position:center;
display:block;
background:#f1ece4;
border:none;
border-radius:0;
padding:0;
margin:0;
box-shadow:inset 0 0 0 1px rgba(42,38,35,.06);
}

.photo-ribbon__caption{
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
gap:4px;
min-height:52px;
margin:12px 0 0;
padding:0 10px;
background:none;
border:none;
border-radius:0;
box-shadow:none;
color:#3a3530;
text-align:center;
text-wrap:balance;
line-height:1.34;
}

.photo-ribbon__label{
font-size:0.9rem;
letter-spacing:0.01em;
opacity:0.96;
}

.photo-ribbon__item:hover{
box-shadow:
0 2px 2px rgba(42,38,35,.07),
0 16px 30px rgba(42,38,35,.14),
0 28px 52px rgba(42,38,35,.1);
}

@media (min-width:901px){
.photo-ribbon__viewport{
overflow-x:auto;
overflow-y:hidden;
touch-action:auto;
}
}

@media (max-width:520px){
.photo-ribbon__viewport{ padding:22px 0 30px; }
.photo-ribbon__marquee,
.photo-ribbon__track{ gap:18px; }
.photo-ribbon__item{ width:320px; padding:10px 10px 42px; }
.photo-ribbon__img{ height:220px; }
.photo-ribbon__caption{ min-height:44px; margin-top:10px; padding:0 8px; }
.photo-ribbon__label{ font-size:0.84rem; }
}

footer{
position:relative;
z-index:1;
width:100%;
max-width:100%;
box-sizing:border-box;
padding:32px var(--page-gutter) max(48px, calc(32px + env(safe-area-inset-bottom, 0px)));
text-align:center;
color:var(--text);
text-shadow:var(--text-shadow-soft);
opacity:0;
transition:opacity 1s var(--ease) .3s;
}

.btn-submit:disabled{
opacity:.55;
cursor:not-allowed;
transform:none;
}

.btn-submit.is-error{
border-color:#000;
color:#000;
}

.rsvp-form-status{
text-align:center;
margin:0;
min-height:1.4em;
color:var(--text);
text-wrap:balance;
}

.rsvp-form-status.is-error{
color:#000;
}

.site.is-visible footer{
opacity:1;
}

@media (prefers-reduced-motion: reduce){

.site-bg__soft,
.site-bg__photo,
.site-bg__motion,
.silk-background__texture,
.intro-screen.is-ready .heart-stage{
animation:none !important;
opacity:1 !important;
}

.site-bg__photo{
transform:translateZ(0) !important;
}

.site-bg__motion{
transform:translate3d(0,0,0) !important;
}

.site,
.reveal,
.reveal.show,
.reveal > .script-title,
.reveal > .hero-lead,
.reveal > .hero-names,
.invite-block,
.date-big,
.calendar,
.countdown-heading,
.time-box,
.venue-photo,
.section-intro,
.section-panel,
.details-list,
.rsvp-form,
.panel-piece,
.form-group{
transition-duration:.2s !important;
transition-delay:0s !important;
transform:none !important;
opacity:1 !important;
}

.reveal.show .section-panel,
.reveal.show .details-list,
.reveal.show .rsvp-form,
.reveal.show .section-intro,
.reveal.show .panel-piece{
opacity:1 !important;
transform:none !important;
visibility:visible !important;
}

.countdown-section.reveal:not(.show) .countdown,
.countdown-section.reveal:not(.show) .countdown-heading,
.site{
visibility:visible;
opacity:1;
}

}

@media(max-width:900px){

.venue-photo{
border-radius:16px;
}

}

@keyframes silkSheenSoft{

0%,100%{
opacity:.5;
transform:translate3d(0,0,0);
}

50%{
opacity:.66;
transform:translate3d(-1.2%,.8%,0);
}

}

@keyframes silkPhotoWind{

0%{
transform:translate3d(0,0,0) scale(1.02);
}

50%{
transform:translate3d(-.8%,.5%,0) scale(1.03);
}

100%{
transform:translate3d(0,0,0) scale(1.02);
}

}

@keyframes silkMotionDrift{

0%{
transform:translate3d(0,0,0) rotate(0deg) scale(1);
}

50%{
transform:translate3d(.9%,-.6%,0) rotate(.15deg) scale(1.008);
}

100%{
transform:translate3d(0,0,0) rotate(0deg) scale(1);
}

}

@keyframes silkFlow{

0%,100%{
transform:translate3d(0,0,0) scale(1.03);
}

33%{
transform:translate3d(-1.4%,1%,0) scale(1.05);
}

66%{
transform:translate3d(1%,-.7%,0) scale(1.04);
}

}

/* ========== PERFORMANCE ========== */

@media (min-width:901px) and (prefers-reduced-motion:no-preference){

.silk-background__texture{
filter:url(#silk-displace) contrast(1.06) saturate(1.02) brightness(1.01);
}

}

html.perf-lite .silk-background__sheen,
html.perf-lite .silk-background__texture,
html.perf-lite .intro-screen.is-ready .heart-stage,
html.perf-lite .silk-filters{
animation:none !important;
}

html.perf-lite .silk-filters{
display:none;
}

html.perf-lite .reveal.show{
transition-delay:0s !important;
transition-duration:.25s !important;
}

@media (max-width:900px){

html,
body{
overflow-x:hidden;
width:100%;
max-width:100%;
}

.intro-screen{
overflow-x:hidden;
width:100%;
}

.intro-screen .intro-caption-track .intro-caption{
transform:none !important;
}

.intro-screen .intro-caption__pre,
.intro-screen .intro-caption__line{
transform:none !important;
opacity:0;
transition:opacity 1s var(--ease);
}

.intro-screen.is-ready .intro-caption__pre{
opacity:1;
transition-delay:1.15s;
}

.intro-screen.is-ready .intro-caption__line--invite{
opacity:1;
transition-delay:1.65s;
}

.intro-screen.is-ready .intro-caption-track--bottom .intro-caption{
transform:none !important;
opacity:1;
transition-delay:2.15s;
}

.silk-background__texture{
animation:silkFlow 18s ease-in-out infinite;
}

.silk-filters{
display:none;
}

.site-bg{
contain:layout style;
}

.site-bg__photo{
opacity:1;
filter:contrast(1.08) saturate(1.04) brightness(1.02);
will-change:transform;
animation:silkFlow 14s ease-in-out infinite;
}

.site-bg__soft{
opacity:.64;
will-change:transform, opacity;
animation:silkSheenSoft 9s ease-in-out infinite;
}

.site-bg__gleam{
display:block;
position:absolute;
inset:-10%;
pointer-events:none;
background:
radial-gradient(ellipse 52% 38% at 18% 28%, rgba(255,255,255,.48), transparent 62%),
radial-gradient(ellipse 46% 34% at 82% 72%, rgba(255,255,255,.3), transparent 60%),
linear-gradient(118deg, transparent 36%, rgba(255,255,255,.24) 50%, transparent 64%);
opacity:.52;
animation:silkSheenSoft 12s ease-in-out infinite reverse;
mix-blend-mode:soft-light;
}

.form-group + .form-group{
margin-top:20px;
padding-top:20px;
}

.form-control{
padding:12px 14px;
}

.form-group--wide .form-control{
min-height:96px;
}

.option-card{
padding:12px 14px;
}

.site{
--content-width:min(100%, 26.25rem);
}

.countdown{
display:grid;
grid-template-columns:repeat(2, minmax(0, 1fr));
gap:22px 18px;
max-width:100%;
}

.invite-panel .countdown{
grid-template-columns:repeat(2, minmax(0, 1fr));
gap:20px 16px;
max-width:14rem;
}

.time-box{
min-width:0;
width:100%;
}

.countdown-heading{
width:auto;
max-width:100%;
margin-inline:auto;
}

}

@media (min-width:520px) and (max-width:900px){

.countdown,
.invite-panel .countdown{
grid-template-columns:repeat(4, minmax(0, 1fr));
gap:clamp(8px,2.2vw,18px);
max-width:18.5rem;
}

.countdown-heading{
max-width:var(--content-width);
}

}