@import none;

:root{--nav-logo-width:clamp(80px,7.65vw,127.5px);--cream:#EDE7DC;--burgundy:#3A1B21;--lavender:#CFC3DB;--orange:#DC6F35}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:"General Sans",Arial,sans-serif}
.site-header{position:fixed;inset:0 0 auto;z-index:100;background:transparent;transition:background .3s ease,box-shadow .3s ease;color:var(--lavender)}
.site-header.scrolled{background:var(--cream);color:#4A481A;box-shadow:0 1px 10px #00000012}
.nav{min-height:80px;display:flex;align-items:center;justify-content:space-between;gap:17px;padding:8.5px clamp(17px,2.55vw,42.5px)}
.nav-links{display:flex;align-items:center;flex-wrap:wrap;gap:clamp(10.2px,1.275vw,23.8px)}
.nav-links a{color:inherit;text-decoration:none;font-size:clamp(11.05px,1.1475vw,17px);font-weight:600;letter-spacing:.065em;white-space:nowrap}
.nav-links a:hover{text-decoration:underline;text-underline-offset:5px}
.logo{position:relative;display:block;width:var(--nav-logo-width);flex:none;aspect-ratio:1.8}
.logo img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;transition:opacity .3s ease}
.logo-scroll{opacity:0}.scrolled .logo-top{opacity:0}.scrolled .logo-scroll{opacity:1}
.hero{min-height:100svh;position:relative;isolation:isolate;overflow:hidden;display:flex;justify-content:center;align-items:center;text-align:center;background:#333;padding:110px 20px 40px}
.hero-photo{position:absolute;inset:-8% 0;z-index:-2;background:none center center/cover no-repeat;transform:translate3d(0,var(--parallax-y,0px),0) scale(1.10);transform-origin:center center;will-change:transform;pointer-events:none}
.hero::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(to bottom,#0004 0%,#0001 45%,#0004 100%)}
.hero-copy{position:relative;z-index:1}.hero h1{font:400 clamp(28px,3.84vw,60px)/1.05 "La Siesta",cursive;color:var(--lavender);margin:0}
.hero p{font-family:"La Siesta",cursive;font-weight:400;font-size:clamp(24px,3.1vw,48px);letter-spacing:.035em;color:var(--cream);margin:0}
.menu-toggle{display:none}
@media(max-width:760px){.nav{min-height:66px}.logo{width:89px}.menu-toggle{display:block;background:none;border:0;color:inherit;font:inherit;font-size:12.75px;cursor:pointer}.nav-links{display:none;position:absolute;top:100%;left:0;right:0;flex-direction:column;align-items:flex-start;padding:19px;background:var(--cream);color:#4A481A;gap:17px}.site-header.menu-open .nav-links{display:flex}.hero{padding:95px 18px 25px}.hero-photo{inset:-6% 0;transform:translate3d(0,var(--parallax-y,0px),0) scale(1.08)}.hero h1{font-size:clamp(27px,6vw,41px)}.hero p{font-size:clamp(21px,5.3vw,32px)}}
@media(prefers-reduced-motion:reduce){.hero-photo{transform:scale(1.10)!important;will-change:auto} *,*::before,*::after{transition:none!important;scroll-behavior:auto!important}}

/* Wedding invitation */
.wedding-intro{background:var(--cream);color:#4A481A;text-align:center;padding:35px 20.4px 55px}
.wedding-intro-inner{max-width:952px;margin:auto}
.wedding-names{display:grid;grid-template-columns:minmax(0,1fr) clamp(58px,7.65vw,119px) minmax(0,1fr);align-items:center;gap:clamp(3px,.7vw,12px);font:400 clamp(25.5px,3.57vw,51px)/1.2 "La Siesta",cursive;margin:0 auto 7.5px;max-width:901px}
.wedding-first-name{text-align:right;white-space:nowrap;align-self:center}.wedding-last-name{text-align:left;white-space:nowrap;align-self:center}
.wedding-ampersand{position:relative;display:grid;place-items:center;width:100%;aspect-ratio:1;justify-self:center}
.wedding-ampersand img{position:absolute;top:50%;left:50%;width:85%;height:85%;transform:translate(-50%,-50%);object-fit:contain;z-index:1}
.ampersand-fallback{font:italic 400 clamp(48px,6vw,90px)/1 Georgia,serif}
.wedding-invite{font:400 clamp(15.3px,1.785vw,23.8px)/1.3 "La Siesta",cursive;margin:0}
.wedding-on{font:400 clamp(17px,1.785vw,23.8px)/1.2 "La Siesta",cursive;margin:23.4px 0}
.wedding-date{font:400 clamp(18.7px,1.785vw,23.8px)/1.35 "La Siesta",cursive;margin:0}
.wedding-date sup{font-size:.55em;vertical-align:super}
.wedding-place{font:400 clamp(22.95px,2.55vw,32.3px)/1.25 "La Siesta",cursive;margin:3.4px 0 0}
.wedding-intro-description{font:400 clamp(18.45px,calc(1.445vw + 4px),22.7px)/1.55 "La Siesta",cursive;max-width:748px;margin:46.75px auto 0}
@media(max-width:760px){.wedding-intro{padding:28px 14px 42px}.wedding-names{grid-template-columns:minmax(0,1fr) clamp(36px,10.2vw,68px) minmax(0,1fr);gap:2px;font-size:clamp(17.85px,4.42vw,32.3px)}.wedding-invite{font-size:clamp(13.6px,3.4vw,21.25px)}.wedding-on{margin:15px 0}.wedding-intro-description{margin-top:30px}}
.site-footer{background:#a8b174;display:flex;justify-content:center;align-items:center;min-height:97.5375px;padding:19.5075px 20px 35.76375px}
.footer-monogram img{display:block;width:calc(var(--nav-logo-width) * .864);height:auto;object-fit:contain}
@media(max-width:760px){.wedding-intro{padding-left:18px;padding-right:18px}.site-footer{min-height:81.28125px;padding:13.005px 20px 29.26125px}.footer-monogram img{width:90.72px}}

/* Keep the navigation monogram the same olive green as the links. */
.site-header .logo{background:var(--lavender);-webkit-mask:none center/contain no-repeat;mask:none center/contain no-repeat}
.site-header.scrolled .logo{background:#4A481A}
.site-header .logo img{opacity:0!important}

/* Gentle character-by-character wave, rising and returning to the baseline. */
.wedding-date .wave-char,.wedding-place .wave-char{display:inline-block;white-space:pre;transform-origin:center bottom;animation:letter-wave 3.8s ease-in-out infinite;animation-delay:calc(var(--char-index) * 65ms)}
@keyframes letter-wave{0%,12%,35%,100%{transform:translateY(0)}21%{transform:translateY(-7px)}28%{transform:translateY(2px)}}
@media(prefers-reduced-motion:reduce){.wedding-date .wave-char,.wedding-place .wave-char{animation:none}}

/* Panoramic wedding countdown */
.countdown-section{position:relative;min-height:clamp(280px,28vw,510px);display:flex;align-items:center;justify-content:center;padding:clamp(35px,5vw,90px) clamp(18px,12.4vw,240px);background:#b9b7b4 none center/cover no-repeat}
.countdown-panel{width:100%;max-width:1456px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-items:center;background:rgba(58,27,33,.54);padding:clamp(20px,3.4vw,55px) clamp(7px,1.7vw,24px);color:var(--lavender)}
.countdown-unit{min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:2px}
.countdown-unit+.countdown-unit{border-left:2px solid var(--lavender)}
.countdown-number{font:400 51px/1.15 "La Siesta",cursive;font-variant-numeric:tabular-nums}
.countdown-label{font:400 23.8px/1.2 "La Siesta",cursive}
@media(max-width:760px){.countdown-section{min-height:310px;padding:32px 14px}.countdown-panel{padding:28px 6px}.countdown-number{font-size:clamp(23px,5.95vw,40.8px)}.countdown-label{font-size:clamp(12.75px,2.975vw,20.4px)}.countdown-unit+.countdown-unit{border-left-width:1px}}

/* Hide the fixed navigation while scrolling down; reveal it when scrolling up. */
.site-header{transition:transform .3s ease,background .3s ease,box-shadow .3s ease}
.site-header.nav-hidden{transform:translateY(-100%)}
.site-header.menu-open{transform:translateY(0)}

/* Translucent anthurium: 776px square, with 20% cropped below the section. */
.wedding-intro{position:relative;isolation:isolate;overflow:hidden}
.wedding-intro-inner{position:relative;z-index:1}
.wedding-intro::before{content:"";position:absolute;z-index:0;left:50%;bottom:-112.4424px;transform:translateX(-50%);width:562.212px;height:562.212px;background:none center/contain no-repeat;opacity:.14;pointer-events:none}
@media(max-width:760px){.wedding-intro::before{width:562.212px;height:562.212px;bottom:-112.4424px}}
 
/* Align both names with the ampersand on the same vertical centerline. */
.wedding-names{align-items:center}
.wedding-first-name,.wedding-last-name{align-self:center;display:block}


/* A gentle, playful wave across the hero lettering. Font size remains unchanged. */
.hero-dance-letter{display:inline-block;white-space:pre;transform-origin:center 80%;animation:hero-dance 4.8s ease-in-out infinite;animation-delay:calc(var(--dance-index) * 95ms)}
@keyframes hero-dance{0%,12%,42%,100%{transform:translateY(0) rotate(0)}21%{transform:translateY(-9px) rotate(-4deg)}30%{transform:translateY(3px) rotate(3deg)}}
/* The background is immediately visible; the burgundy timer fades up over it. */
.countdown-panel.countdown-reveal{opacity:0;transform:translateY(28px);transition:opacity 1.25s ease 0.5s,transform 1.25s ease 0.5s}
.countdown-panel.countdown-reveal.is-visible{opacity:1;transform:translateY(0)}
@media(prefers-reduced-motion:reduce){.hero-dance-letter{animation:none}.countdown-panel.countdown-reveal{opacity:1;transform:none;transition:none}}

/* Olive-green monogram silhouette on pale sage footer. */
.footer-monogram{background:#4A481A;-webkit-mask:none center/contain no-repeat;mask:none center/contain no-repeat}
.footer-monogram img{opacity:0}


/* Navigation in uppercase La Siesta, 2px smaller than the prior labels. */
.nav-links a{font-family:"La Siesta",cursive;font-weight:400;font-size:clamp(9.05px,calc(1.1475vw - 2px),15px);text-transform:uppercase}
/* RSVP call to action uses the same responsive font sizing as the invitation date. */
.wedding-rsvp-cta{display:table;margin:25px auto 0;padding:10px 40px;border:4px solid #4A481A;background:#4A481A;color:#a8b174;font:400 clamp(18.7px,1.785vw,23.8px)/1.35 "La Siesta",cursive;text-transform:uppercase;text-decoration:none;transition:background-color .25s ease,color .25s ease}
.wedding-rsvp-cta:hover,.wedding-rsvp-cta:focus-visible{background:#a8b174;color:#4A481A}
@media(max-width:760px){.wedding-rsvp-cta{margin-top:20px;padding:9px 30px}}

/* Compensate for La Siesta’s high visual baseline in the RSVP button. */
.wedding-rsvp-cta{display:flex;align-items:center;justify-content:center;min-height:64px;box-sizing:border-box}
.wedding-rsvp-cta span{display:block;transform:translateY(5px)}

/* Keep the RSVP CTA content-sized rather than stretched across its container. */
.wedding-rsvp-cta{width:max-content;max-width:100%;}


/* Home countdown now lives on the continuous cream canvas, not a photo section. */
.home-countdown{background:var(--cream);padding:clamp(36px,5vw,70px) clamp(20px,12.4vw,240px) 0;display:flex;justify-content:center}
.home-countdown .countdown-panel{background:#7B3534;color:#3A1B21;max-width:1116px}
.home-countdown .countdown-unit+.countdown-unit{border-color:#3A1B21}
.home-cream-spacer{height:clamp(75px,8vw,155px);background:var(--cream)}
/* Photo emerges from behind the top edge of the footer. */
.footer-photo-stage{position:relative;height:clamp(205px,23vw,300px);background:var(--cream);overflow:hidden;display:flex;justify-content:center;align-items:flex-end}
.footer-photo-wrap{position:relative;width:clamp(260px,32vw,440px);height:100%;transform:translateY(110px);opacity:0;transition:transform 1.6s cubic-bezier(.2,.8,.2,1),opacity 1s ease;display:flex;justify-content:center;align-items:flex-end}
.footer-photo-stage.is-visible .footer-photo-wrap{transform:translateY(0);opacity:1}
.footer-kids-photo{display:block;max-width:100%;max-height:90%;width:auto;height:auto;object-fit:contain;object-position:center bottom}
.footer-arc-text{position:absolute;z-index:2;top:0;left:52%;width:75%;height:auto;overflow:visible;opacity:0;transform:translateY(12px) rotate(2deg);transition:opacity 1s ease .55s,transform 1s ease .55s;pointer-events:none}
.footer-arc-text text{font:400 30px "La Siesta",cursive;fill:#a8b174}
.footer-photo-stage.is-visible .footer-arc-text{opacity:1;transform:translateY(0) rotate(0)}
/* Shared footer: olive monogram left, centered navigation, cream strip below. */
.site-footer{position:relative;z-index:3;background:#a8b174;min-height:135px;padding:18px clamp(17px,2.55vw,42.5px);display:flex;align-items:center;justify-content:center}
.footer-content{width:100%;position:relative;display:flex;align-items:center;justify-content:center;min-height:99px}
.footer-monogram{position:absolute;left:0;top:50%;transform:translateY(-50%);display:block;width:calc(var(--nav-logo-width) * .7);aspect-ratio:1.8;flex:none}
.footer-monogram img{display:block;width:100%;height:100%;opacity:0}
.footer-links{display:flex;justify-content:center;align-items:center;gap:clamp(10px,1.275vw,24px);flex-wrap:wrap;padding:0 calc(var(--nav-logo-width) * .7 + 18px)}
.footer-links a{font:400 clamp(9.05px,calc(1.1475vw - 2px),15px)/1.3 "La Siesta",cursive;text-transform:uppercase;color:#4A481A;text-decoration:none;white-space:nowrap}
.footer-links a:hover{text-decoration:underline;text-underline-offset:5px}
.footer-cream-strip{height:28px;background:var(--cream)}
@media(max-width:760px){.home-countdown{padding:35px 14px 0}.home-cream-spacer{height:65px}.footer-photo-stage{height:215px}.footer-photo-wrap{width:300px}.footer-arc-text{width:65%;left:52%;top:5px}.footer-arc-text text{font-size:28px}.site-footer{min-height:150px;padding:18px}.footer-content{min-height:114px;flex-direction:column;gap:10px}.footer-monogram{position:relative;left:auto;top:auto;transform:none;width:calc(89px * .7)}.footer-links{padding:0;gap:10px 15px}.footer-cream-strip{height:20px}}
@media(prefers-reduced-motion:reduce){.footer-photo-wrap,.footer-arc-text{transition:none;transform:none;opacity:1}}


/* Refinements: tighter invitation-to-countdown spacing and no countdown reveal. */
.home-countdown{padding-top:clamp(18px,2.5vw,35px)}
.home-cream-spacer{height:clamp(31.640625px,3.375vw,65.390625px)}
.home-countdown .countdown-panel,.home-countdown .countdown-panel.countdown-reveal,.home-countdown .countdown-panel.countdown-reveal.is-visible{opacity:1;transform:none;transition:none}
/* Photo rises immediately once the footer scroll threshold is reached. */
.footer-photo-wrap{transition:transform 1.25s cubic-bezier(.2,.8,.2,1),opacity 1s ease}
/* Flatter Canva-style curve, tilted 29 degrees, positioned just above Isabela's head. */
.footer-arc-text{width:58%;left:55%;top:5%;transform:translateY(12px) rotate(29deg);transform-origin:40% 65%;transition:opacity 1s ease .7s,transform 1s ease .7s}
.footer-photo-stage.is-visible .footer-arc-text{transform:translateY(0) rotate(29deg)}
@media(max-width:760px){.home-countdown{padding-top:17.5px}.home-cream-spacer{height:27.421875px}.footer-arc-text{width:58%;left:55%;top:5%}}
@media(prefers-reduced-motion:reduce){.footer-arc-text,.footer-photo-stage.is-visible .footer-arc-text{transform:rotate(29deg);transition:none}}


/* Compact footer: 35% shorter, with logo and links centered in green band. */
.site-footer{height:88px;min-height:0;padding:0 clamp(17px,2.55vw,42.5px);box-sizing:border-box;align-items:center}
.footer-content{height:100%;min-height:0;align-items:center;justify-content:center}
.footer-monogram{top:50%;transform:translateY(-50%)}
.footer-links{align-items:center;justify-content:center}
@media(max-width:760px){.site-footer{height:auto;min-height:97.5px;padding:12px 18px}.footer-content{height:auto;min-height:0;justify-content:center;align-items:center;gap:8px}.footer-monogram{top:auto;transform:none}.footer-links{align-items:center;justify-content:center}}

/* Childhood photo and curved lettering rise into view without fading. */
.footer-photo-wrap,.footer-arc-text{opacity:1;transition-property:transform;transition-delay:0s}
.footer-photo-stage.is-visible .footer-photo-wrap,.footer-photo-stage.is-visible .footer-arc-text{opacity:1}

/* Hide the entire photo below the clipped stage until footer reveal begins. */
.footer-photo-wrap{transform:translateY(100%);opacity:1}
.footer-photo-stage.is-visible .footer-photo-wrap{transform:translateY(0)}

/* Wedding poppy cursor; preserve text selection and native touch cursors. */
@media (pointer:fine) {
 html,body,body * {cursor:none 16 16,auto}
 a,button,[role="button"],input[type="submit"],input[type="button"]{cursor:none 16 16,pointer}
 input[type="text"],input[type="search"],input[type="email"],input[type="tel"],textarea,[contenteditable="true"]{cursor:text}
}

/* Current-page indicator on every site's main navigation. */
.site-header .nav-links a[aria-current="page"]{
 text-decoration:underline;
 text-underline-offset:5px;
 text-decoration-thickness:1px;
}
/* Keep both monograms visibly clickable above surrounding layout. */
.site-header .logo,.site-footer .footer-monogram{
 pointer-events:auto;
 z-index:2;
}

/* Active link: persistent hand-drawn underline; hover: playful pop, no hover underline. */
.site-header .nav-links a{
 display:inline-block;
 position:relative;
 text-decoration:none !important;
 transform-origin:center bottom;
 transition:transform .3s cubic-bezier(.2,1.65,.45,1),filter .3s ease;
}
.site-header .nav-links a::after{
 content:"";
 position:absolute;
 left:0;
 right:0;
 bottom:-5px;
 height:1.5px;
 background:currentColor;
 border-radius:999px;
 transform:scaleX(0);
 transform-origin:center;
 transition:transform .28s cubic-bezier(.2,1.4,.45,1);
}
.site-header .nav-links a[aria-current="page"]::after{
 transform:scaleX(1);
}
@media(hover:hover) and (pointer:fine){
 .site-header .nav-links a:hover{
  text-decoration:none !important;
  transform:translateY(-3px) scale(1.13) rotate(-2deg);
 }
 .site-header .nav-links a:hover::after{
  transform:scaleX(0);
 }
 .site-header .nav-links a[aria-current="page"]:hover::after{
  transform:scaleX(1);
 }
}
@media(prefers-reduced-motion:reduce){
 .site-header .nav-links a{transition:none}
 .site-header .nav-links a:hover{transform:none}
}

/* Minimal wedding countdown: burgundy lettering directly on cream. */
.home-countdown{
 background:var(--cream);
 padding:clamp(45px,6vw,85px) clamp(20px,12.4vw,240px) 0;
}
.home-countdown .countdown-panel{
 background:transparent;
 color:#3A1B21;
 box-shadow:none;
 border:0;
 padding:0;
}
.home-countdown .countdown-number,
.home-countdown .countdown-label{
 color:#3A1B21;
 text-shadow:none;
}
.home-countdown .countdown-unit+.countdown-unit{
 border-color:rgba(58,27,33,.28);
}
@media(max-width:760px){
 .home-countdown{padding:42px 14px 0}
 .home-countdown .countdown-panel{padding:0}
}

/* Homepage floral accents: replace the central anthurium with side illustrations. */
.wedding-intro::before{content:none!important;display:none!important}
.wedding-intro .home-side-flower{
 position:absolute;
 z-index:0;
 display:block;
 width:clamp(120px,14vw,200px);
 height:auto;
 pointer-events:none;
 object-fit:contain;
}
.wedding-intro .home-side-flower-left{
 left:clamp(35px,10vw,180px);
 top:65px;
}
.wedding-intro .home-side-flower-right{
 right:clamp(30px,5vw,90px);
 top:clamp(340px,29vw,450px);
 transform:rotate(15deg);
}
@media(max-width:760px){
 .wedding-intro .home-side-flower{width:clamp(65px,19vw,110px)}
 .wedding-intro .home-side-flower-left{left:-15px;top:65px}
 .wedding-intro .home-side-flower-right{right:-15px;top:320px}
}

/* Homepage invitation typography and balanced CTA breathing room. */
.wedding-intro .wedding-invite,
.wedding-intro .wedding-date{color:#3A1B21}
.wedding-intro .wedding-rsvp-cta{margin-top:35px}
.wedding-intro{padding-bottom:35px}
@media(max-width:760px){
 .wedding-intro .wedding-rsvp-cta{margin-top:30px}
 .wedding-intro{padding-bottom:28px}
}

/* Homepage-only curtain: allow the staggered letter dance to travel across the title, then slide down.
   Keep the real dancing hero heading in place for a seamless reveal. */
html:has(body.home-intro-loading){overflow:hidden}
body.home-intro-loading{overflow:hidden;touch-action:none}
body.home-intro-loading .hero::after{
 content:"";
 position:fixed;
 inset:0;
 background:#3A1B21;
 z-index:5;
 pointer-events:auto;
 transform:translate3d(0,0,0);
 animation:home-curtain-slide 1.65s cubic-bezier(.76,0,.24,1) 2.8s forwards;
}
body.home-intro-loading .hero-copy{z-index:6}
body.home-intro-loading .site-header{
 animation:home-header-reveal .65s ease 3.85s both;
}
@keyframes home-curtain-slide{
 from{transform:translate3d(0,0,0)}
 to{transform:translate3d(0,101%,0)}
}
@keyframes home-header-reveal{
 from{opacity:0}
 to{opacity:1}
}
@media(prefers-reduced-motion:reduce){
 body.home-intro-loading .hero::after{animation:none;transform:translateY(101%)}
 body.home-intro-loading .site-header{animation:none}
}

/* Lavender monogram belongs to the opening curtain, not the permanent hero.
   Anchor it to the actual hero heading so both remain centered together. */
body.home-intro-loading .hero-copy::before{
 content:"";
 position:absolute;
 left:50%;
 bottom:calc(100% + 24px);
 width:calc(var(--nav-logo-width) * 1.38);
 aspect-ratio:1.8;
 background:var(--lavender);
 -webkit-mask:none center/contain no-repeat;
 mask:none center/contain no-repeat;
 transform:translateX(-50%);
 pointer-events:none;
 animation:home-monogram-fade .35s ease 2.3s forwards;
}
@keyframes home-monogram-fade{
 from{opacity:1}
 to{opacity:0}
}
@media(prefers-reduced-motion:reduce){
 body.home-intro-loading .hero-copy::before{display:none;animation:none}
}

/* Give the homepage introduction a half-second still moment before letters dance.
   Shift the curtain and monogram timings together to preserve the full wave. */
body.home-intro-loading .hero-dance-letter{
 animation-delay:calc(.5s + var(--dance-index) * 95ms);
}
body.home-intro-loading .hero::after{
 animation-delay:3.3s;
}
body.home-intro-loading .hero-copy::before{
 animation-delay:2.8s;
}
body.home-intro-loading .site-header{
 animation-delay:4.35s;
}

/* Homepage invitation paragraph uses the legible body typeface. */
.wedding-intro-description{font-family:"General Sans",Arial,sans-serif;font-size:clamp(15px,1.45vw,18px);line-height:1.65;max-width:748px}

/* Tighten homepage introduction copy: less space below location and a wider text block. */
.wedding-intro-description{
 max-width:min(980px,90vw);
 margin:22px auto 0;
}
@media(max-width:760px){
 .wedding-intro-description{
  max-width:94%;
  margin-top:18px;
 }
}

/* Bring the homepage countdown closer to the invitation section. */
.home-countdown{padding-top:24px}
@media(max-width:760px){.home-countdown{padding-top:20px}}

/* Narrow the homepage invitation paragraph for more comfortable reading. */
.wedding-intro-description{max-width:min(680px,90vw)}
@media(max-width:760px){.wedding-intro-description{max-width:90%}}