:root{--paper:#ffffff;--blue:#245e94;--ink:var(--blue);--muted:var(--blue);--line:#245e9430;--serif:'Cormorant Garamond',Georgia,serif;--sans:'DM Sans',Arial,sans-serif;--hand:'Caveat',cursive;--ease:cubic-bezier(.22,1,.36,1)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:40px}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.8;-webkit-font-smoothing:antialiased}::selection{background:#d8e4ed;color:var(--blue)}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}a:focus-visible,button:focus-visible{outline:2px solid var(--blue);outline-offset:7px}button[hidden],a[hidden],[hidden]{display:none!important}.skip-link{position:fixed;top:-100px;left:20px;background:var(--blue);color:white;padding:10px 20px;z-index:10}.skip-link:focus{top:10px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.site-header{max-width:1320px;margin:auto;padding:27px 64px;display:flex;align-items:center;justify-content:space-between}.brand{font-family:var(--hand);font-size:32px;font-weight:700;line-height:1.2;transform:rotate(-4deg);transition:transform .5s var(--ease)}.brand:hover{transform:rotate(0)}.brand span{font-size:23px;margin:0 5px}.site-header nav{display:flex;gap:38px;font-size:14px}.site-header nav a,.site-footer a{position:relative}.site-header nav a:after,.site-footer a:not(.back-top):after{content:'';position:absolute;left:0;right:0;bottom:-4px;height:1px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .4s var(--ease)}.site-header nav a:hover:after,.site-footer a:hover:after{transform:scaleX(1)}
.hero{text-align:center;padding-top:54px;overflow:hidden}.eyebrow{font-size:12px;letter-spacing:.16em;text-transform:uppercase;font-weight:500;line-height:1.7;margin:0 0 24px}.hero h1{font-family:var(--hand);font-size:clamp(80px,9.7vw,142px);font-weight:700;letter-spacing:-.045em;line-height:1.12;color:var(--blue);margin:0 20px 22px}.plus{display:inline-block;font-size:.7em;font-weight:600;vertical-align:6%;margin:0 .06em;transform:rotate(-8deg)}.hero-details{display:flex;align-items:center;justify-content:center;gap:20px}.handwritten{font-family:var(--hand);font-weight:600}.save-label{font-size:30px;line-height:1.2;margin:0;transform:rotate(-5deg)}.little-rule{height:1px;width:30px;background:var(--blue);opacity:.6}.hero-date{font-size:14px;letter-spacing:.04em;margin:0}.hero-date span{margin:0 9px}.garden-scene{width:min(960px,94%);margin:30px auto 0;line-height:0}.garden-scene img{width:100%;height:auto;display:block}.scroll-note{display:inline-flex;align-items:center;gap:14px;font-size:11px;letter-spacing:.12em;text-transform:uppercase;margin:22px 0 0}.scroll-line{width:1px;height:24px;display:block;background:var(--blue);opacity:.5;transition:transform .4s var(--ease)}.scroll-note:hover .scroll-line{transform:translateY(4px)}
.section-space{padding:118px 28px}.invitation{text-align:center}.invitation h2,.little-more h2,.contact-section h2{font-family:var(--serif);font-size:clamp(42px,4.7vw,62px);font-weight:400;letter-spacing:-.025em;line-height:1.1;margin:0 0 30px}h2 em{font-weight:400}.intro-copy{line-height:1.95;margin:0 auto;color:var(--muted);max-width:560px}.date-location{display:flex;align-items:center;justify-content:center;gap:50px;margin:58px auto 36px}.small-label{font-size:12px;text-transform:uppercase;letter-spacing:.13em;margin:0 0 6px}.big-date{font-family:var(--serif);font-size:49px;font-weight:500;line-height:1.2;margin:0;letter-spacing:-.025em}.big-date span{margin:0 .02em}.location-divider{height:64px;width:1px;background:var(--line)}.location-block{text-align:left}.location-name{font-family:var(--serif);font-size:32px;line-height:1.2;margin:0 0 9px}.location-region{font-size:13px;color:var(--muted);margin:0}.button{display:inline-flex;align-items:center;justify-content:center;gap:13px;border:1px solid var(--blue);background:transparent;padding:14px 23px;font-size:14px;line-height:1.5;position:relative;transition:background .4s var(--ease),color .4s var(--ease),transform .4s var(--ease);min-height:52px;border-radius:2px}.button:hover{background:var(--blue);color:var(--paper);transform:translateY(-2px)}.button:active{transform:translateY(0)}.button svg{width:20px;height:20px}.button-plus{font-size:22px;margin-left:11px;line-height:1;transition:transform .5s var(--ease)}.button:hover .button-plus{transform:rotate(90deg)}.calendar-note{font-size:12px;color:var(--muted);margin:15px 0 0}
.little-more{max-width:890px;margin:0 auto;text-align:center;border-top:1px solid var(--line);border-bottom:1px solid var(--line);position:relative;padding-top:89px;padding-bottom:85px}.section-number{font-family:var(--hand);font-size:25px;position:absolute;top:-23px;left:50%;transform:translateX(-50%) rotate(-6deg);background:var(--paper);padding:0 24px}.little-more h2{font-size:clamp(46px,5vw,66px)}.little-more>p:not(.closing-note){color:var(--muted);line-height:1.95;margin:0}.closing-note{font-size:29px;line-height:1.2;margin:32px 0 0;transform:rotate(-3deg)}.contact-section{text-align:center;padding-bottom:80px}.contact-section h2{font-size:clamp(38px,4vw,54px);margin-bottom:23px}.contact-section>p:not(.eyebrow):not(.signature){color:var(--muted)}.text-button{border:0;border-bottom:1px solid var(--blue);background:none;padding:10px 0 7px;font-size:15px;display:inline-flex;gap:30px;transition:gap .4s var(--ease)}.text-button span{display:inline-block;transition:transform .4s var(--ease)}.text-button:hover{gap:38px}.text-button:hover span{transform:translate(2px,-2px)}.signature{font-size:40px;line-height:1.3;transform:rotate(-4deg);margin:55px 0 0}.site-footer{max-width:1192px;margin:0 auto;padding:27px 0 30px;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:24px;color:var(--muted);font-size:12px}.site-footer p{margin:0}.site-footer>div{display:flex;align-items:center;gap:28px}.back-top{font-size:20px;padding:0 6px;transition:transform .4s var(--ease)}.back-top:hover{transform:translateY(-4px)}
.contact-dialog{background:var(--paper);color:var(--ink);border:1px solid var(--line);padding:58px 44px 42px;width:min(500px,calc(100% - 32px));max-height:85vh;overflow:auto;text-align:center;box-shadow:0 20px 80px #12304c15}.contact-dialog::backdrop{background:#1a354956;backdrop-filter:blur(4px)}.contact-dialog[open]{animation:dialog-in .35s var(--ease)}.contact-dialog h2{font-family:var(--serif);font-size:48px;font-weight:400;line-height:1.15;margin:0 0 24px}.contact-dialog p{overflow-wrap:anywhere}.contact-dialog .eyebrow{margin-bottom:16px}.dialog-close{position:absolute;right:15px;top:10px;border:0;background:none;width:40px;height:40px;font-size:28px}.dialog-footnote{font-size:12px;color:var(--muted)}body:has(dialog[open]){overflow:hidden}
.hero-intro{animation:arrive .9s var(--ease) both}.hero h1{animation:arrive 1.1s .08s var(--ease) both}.hero-details{animation:arrive 1.1s .17s var(--ease) both}.garden-scene{animation:arrive 1.3s .24s var(--ease) both}.will-reveal{opacity:0;transform:translateY(22px);transition:opacity .9s var(--ease),transform .9s var(--ease)}.will-reveal.is-visible{opacity:1;transform:none}@keyframes arrive{from{opacity:0;transform:translateY(13px)}to{opacity:1;transform:translateY(0)}}@keyframes dialog-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
.legal-main{max-width:760px;margin:60px auto 110px;padding:0 28px}.legal-main h1{font-family:var(--serif);font-weight:400;font-size:clamp(48px,6vw,72px);line-height:1.1;margin:20px 0 28px;letter-spacing:-.025em}.legal-main h2{font-family:var(--serif);font-size:31px;font-weight:500;line-height:1.25;margin:40px 0 12px}.legal-main p,.legal-main li{color:var(--muted)}.legal-main a{text-decoration:underline;text-underline-offset:4px}.legal-kicker{font-family:var(--hand);font-size:30px;color:var(--blue)!important}.draft-notice{padding:18px 22px;border:1px solid var(--line);font-size:14px;background:#eef1f145}.legal-back{font-size:14px;display:inline-block;margin-bottom:24px}.legal-main address{font-style:normal;color:var(--muted)}
@media(min-width:1600px){.hero{padding-top:75px}.garden-scene{width:1040px}}
@media(max-width:1250px){.site-footer{margin:0 40px}.site-header{padding-left:40px;padding-right:40px}}
@media(max-width:700px){.site-header{padding:23px 24px}.site-header nav{gap:25px;font-size:13px}.brand{font-size:28px}.hero{padding-top:42px}.eyebrow{font-size:11px;letter-spacing:.12em}.hero h1{font-size:clamp(54px,12.8vw,86px);margin:4px 8px 22px;letter-spacing:-.04em;white-space:nowrap}.hero-details{gap:13px}.save-label{font-size:26px}.hero-date{font-size:12px;letter-spacing:0}.hero-date span{margin:0 3px}.little-rule{width:16px}.garden-scene{width:100%;max-width:560px;margin:38px auto 0}.scroll-note{font-size:9px;margin-top:24px;letter-spacing:.09em}.section-space{padding:82px 24px}.invitation h2{font-size:42px}.intro-copy{font-size:15px}.desktop-break{display:none}.date-location{flex-direction:column;gap:24px;margin:40px auto 30px}.location-divider{width:36px;height:1px}.location-block{text-align:center}.big-date{font-size:50px}.location-name{font-size:30px}.button{font-size:13px}.calendar-note{font-size:11px}.little-more{margin:0 28px;padding:72px 4px}.little-more h2{font-size:46px}.little-more>p:not(.closing-note){font-size:15px}.closing-note{font-size:28px}.contact-section h2{font-size:38px}.contact-section>p:not(.signature){font-size:14px}.signature{font-size:36px}.site-footer{margin:0 24px;flex-direction:column;gap:12px;padding:26px 0;font-size:11px}.site-footer>div{gap:25px}.contact-dialog{padding:52px 25px 30px}.legal-main{margin-top:30px}.legal-main h2{font-size:29px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.will-reveal{opacity:1;transform:none}}
@media print{.site-header,.scroll-note,.button,.contact-section,.site-footer{display:none}.hero{padding-top:0}.hero h1{font-size:64px}.garden-scene{width:70%}.section-space{padding:30px}.will-reveal{opacity:1;transform:none}}

/* Save-the-date editorial layout */
.hero .hero-intro{margin:0 0 24px;animation-delay:0s}
.invitation h2{font-family:var(--hand);font-size:clamp(64px,7vw,88px);font-weight:700;line-height:1.1;margin-bottom:30px;letter-spacing:-.025em}
.date-location{flex-direction:column;gap:25px;margin-top:44px}
.location-block{text-align:center}
.big-date{font-family:var(--sans);font-size:clamp(38px,4vw,48px);font-weight:400;letter-spacing:.025em;font-variant-numeric:lining-nums tabular-nums;line-height:1.4}
.calendar-confetti{position:absolute;left:50%;top:5px;width:5px;height:8px;background:var(--blue);border-radius:2px;pointer-events:none;opacity:0}
.calendar-confetti:nth-child(2n){width:5px;height:5px;border-radius:50%}
.calendar-confetti:nth-child(3n){background:#8caeca}
@media(max-width:700px){.hero .hero-intro{margin:0 0 24px}.invitation h2{font-size:62px}.date-location{gap:23px}}

/* Hand-drawn interludes in place of straight section rules. */
.little-more{border:0;padding-top:0;padding-bottom:60px}
.floral-divider{display:block;width:min(340px,85%);height:auto;margin:0 auto 12px}
.section-number{position:static;display:block;transform:rotate(-6deg);padding:0;margin:0 0 30px;background:transparent}
.contact-section{padding-top:85px;padding-bottom:42px}
.footer-landscape{width:min(1120px,94%);margin:0 auto 22px;line-height:0}
.footer-landscape img{display:block;width:100%;height:auto}
.site-footer{border-top:0}
@media(max-width:700px){.little-more{padding-top:0;padding-bottom:40px}.floral-divider{width:270px;max-width:100%}.contact-section{padding-top:65px;padding-bottom:35px}.footer-landscape{width:100%;margin-bottom:12px}}

/* One shared section for anticipation, updates and contact. */
.contact-inline{margin:38px auto 0;scroll-margin-top:70px}
.contact-inline p{color:var(--muted);margin:0 0 8px;font-size:15px}
.little-more>p.signature{color:var(--blue);font-size:40px;line-height:1.3;margin:34px 0 0}
@media(max-width:700px){.contact-inline{margin-top:30px}.contact-inline p{font-size:14px}.little-more>p.signature{font-size:36px}}

/* Compact date and venue directly below the invitation. */
.invitation.section-space{padding-top:64px;padding-bottom:54px}
.invitation h2{margin-bottom:22px}
.invitation .intro-copy{line-height:1.75}
.invitation .date-location{gap:8px;margin:22px auto 0}
.invitation .big-date{font-size:clamp(28px,3.2vw,38px);line-height:1.3;letter-spacing:.01em}
.invitation .location-name{font-size:clamp(25px,2.5vw,32px);margin:0}
@media(max-width:700px){.invitation.section-space{padding-top:42px;padding-bottom:36px}.invitation .date-location{margin-top:18px;gap:7px}}

/* Quiet single-page layout with direct contact details. */
.hero{padding-top:64px;padding-bottom:80px}
.hero h1{margin-bottom:12px}
.hero-event{margin:0 20px;font-size:16px;line-height:1.6;letter-spacing:.025em}
.hero-event span{margin:0 8px}
.hero .garden-scene{width:min(960px,94%,calc((100svh - 420px)*1.5));margin-top:32px}
.wedding-copy{text-align:center;max-width:640px;margin:0 auto;padding:0 28px 64px;color:var(--muted);line-height:1.8}
.welcome-copy{font-size:20px;margin:0 0 32px;color:var(--blue)}
.updates-copy{max-width:470px;margin:0 auto 36px}
.simple-contact>p{margin:0 0 22px}
.contact-details{display:grid;grid-template-columns:1fr 1fr;gap:32px}
.contact-details p{margin:0;font-size:15px;line-height:1.8}
.contact-details .contact-name{font-family:var(--hand);font-size:30px;color:var(--blue);line-height:1.2;margin-bottom:0}
.simple-contact .placeholder-note{font-size:11px;margin:18px 0 0;opacity:.75}
@media(max-width:700px){.hero{padding-top:44px;padding-bottom:44px}.hero h1{margin-bottom:12px}.hero-event{font-size:12px;letter-spacing:0;margin:0 12px}.hero-event span{margin:0 3px}.hero .garden-scene{width:100%;max-width:560px;margin-top:26px}.wedding-copy{padding:0 24px 40px}.welcome-copy{font-size:18px;margin-bottom:26px}.updates-copy{font-size:15px;margin-bottom:28px}.simple-contact>p{font-size:15px}.contact-details{gap:18px}.contact-details p{font-size:13px}}

/* More prominent event details below the names. */
.hero-event{font-size:22px;line-height:1.6}
@media(max-width:700px){.hero-event{font-size:17px;line-height:1.6}}

/* Bring the footer text closer to the vineyard illustration. */
.footer-landscape{margin-bottom:0}
.footer-landscape + .site-footer{padding-top:4px}

/* Larger mobile hero with a gentle crop at either side. */
@media(max-width:700px){
  .hero{padding-top:68px;padding-bottom:48px}
  .hero h1{font-size:clamp(52px,15vw,100px);margin:0 8px 14px}
  .hero .garden-scene{width:124%;max-width:none;margin:28px 0 0 -12%}
}

/* Desktop opening occupies the first screen before the welcome copy. */
@media(min-width:701px){
  .hero{min-height:100svh;padding-top:96px;padding-bottom:72px}
  .hero-event{font-size:24px}
  .hero .garden-scene{width:min(960px,94%,max(420px,calc((100svh - 460px)*1.5)));margin-top:32px}
  .wedding-copy{padding-top:32px}
}

/* Keep the text closer to both illustrations. */
.wedding-copy{padding-top:0;padding-bottom:12px}
@media(min-width:701px){
  .hero{padding-bottom:24px}
  /* Match the footer width, then grow gently on larger desktop screens. */
  .hero .garden-scene{width:min(94%,clamp(1120px,80vw,1280px))}
}
@media(max-width:700px){.hero{padding-bottom:20px}.wedding-copy{padding-bottom:8px}}

/* Handwritten event details follow the welcome sentence. */
.welcome-copy{margin-bottom:16px}
.event-details{font-family:var(--hand);font-weight:700;font-size:40px;line-height:1.25;color:var(--blue);margin:0 0 32px}
@media(max-width:700px){.event-details{font-size:34px;margin-bottom:28px}}

/* Dedicated portrait artwork for phones. */
.garden-scene picture{display:block}
@media(max-width:700px){
  .hero .garden-scene{width:100%;max-width:540px;margin:22px auto 0}
  .garden-scene img{aspect-ratio:2/3;width:100%;height:auto}
}

/* Display the supplied cutout above the contact names. */

/* Give the vineyard depth and a generous close-up on phones. */
.footer-landscape{margin-top:24px}
@media(max-width:700px){
  .footer-landscape{height:clamp(320px,50svh,560px);overflow:hidden;margin-top:28px}
  .footer-landscape img{height:100%;object-fit:cover;object-position:50% 50%}
}

/* Almost still: a small, staggered entrance for each piece of content. */
.hero h1{animation:arrive .85s .04s var(--ease) both}
.garden-scene{animation:arrive 1.1s .24s var(--ease) both}
@keyframes arrive{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
.will-reveal{opacity:0;transform:translateY(6px);transition:opacity .75s var(--ease),transform .75s var(--ease);transition-delay:var(--reveal-delay,0ms)}
.will-reveal.is-visible{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){
  .hero h1,.garden-scene{animation:none}
  .will-reveal{opacity:1;transform:none;transition:none}
}
@media print{.will-reveal{opacity:1;transform:none}}

/* Tuck the desktop artwork's white top margin under the heading. */
@media screen and (min-width:701px){
  .hero{padding-top:clamp(32px,6svh,64px)}
  .hero h1{margin-bottom:0;position:relative;z-index:1}
  .hero .garden-scene{
    width:min(94%,1240px,max(420px,calc((100svh - 200px)*1.5)));
    margin-top:-56px;
  }
}

/* A quiet vineyard panorama across almost the full desktop width. */
@media screen and (min-width:701px){
  .footer-landscape{width:96%;height:auto;overflow:visible}
  .footer-landscape img{height:auto;max-height:33svh;object-fit:contain;object-position:center}
}

/* Quiet subheadings on the hidden detail page, matching the imprint. */
.detail-page h2,.detail-page .legal-kicker{font-family:var(--sans);font-size:16px;font-weight:600;line-height:1.5;margin:30px 0 8px}

/* Equal outer columns keep the footer note centered on the page. */
.site-footer{display:grid;grid-template-columns:1fr auto 1fr}
.site-footer>div{justify-self:end}
.footer-note{text-align:center}
@media(max-width:700px){
  .site-footer{grid-template-columns:auto auto;justify-content:space-between;gap:14px 8px;margin-inline:16px;font-size:13px;text-align:left}
  .site-footer .footer-note{grid-column:1 / -1;grid-row:1;text-align:center}
  .site-footer .footer-copyright{grid-column:1;grid-row:2;white-space:nowrap}
  .site-footer>div{grid-column:2;grid-row:2;justify-self:end;gap:12px;white-space:nowrap}
}

/* Keep the hero names and illustration immediately visible. */
.hero h1,.hero .garden-scene{animation:none}
.hero-signature{display:inline-block;white-space:nowrap;padding-inline:.12em;margin-inline:-.12em}