@font-face {
  font-family:"The Nautigal";
  src:url('/fonts/TheNautigal-Regular.ttf') format('truetype');
  font-weight:400;
  font-style:normal;
  font-display:swap;
}
:root {
  --ivory:#f6f2e9; --paper:#fbf9f4; --cream:#ede5d8; --ink:#302923;
  --muted:#74695f; --olive:#59604a; --gold:#b99d76; --line:rgba(48,41,35,.2);
  --display:"Cormorant Garamond","Iowan Old Style",Baskerville,Georgia,serif;
  --sans:"DM Sans",-apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,sans-serif;
  --thai:"Prompt","Noto Sans Thai",Tahoma,sans-serif;
  --signature:"The Nautigal","Snell Roundhand","Segoe Script","Apple Chancery",cursive;
  color:var(--ink); background:var(--ivory);
  font-family:var(--sans);
  font-synthesis:none;
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; min-width:320px; overflow-x:hidden; background:var(--ivory); font-weight:300; letter-spacing:.008em; }
body.landing-active { overflow:hidden; }
img { display:block; max-width:100%; }
a { color:inherit; text-decoration:none; }
button,input,select,textarea { font:inherit; color:inherit; }
.skip-link { position:fixed; z-index:1000; top:-80px; left:1rem; padding:.8rem 1rem; background:#fff; }
.skip-link:focus { top:1rem; }
.eyebrow { margin:0; font-size:.72rem; font-weight:500; letter-spacing:.23em; line-height:1.5; text-transform:uppercase; }
.ink-muted { color:var(--muted); }
.script { margin:0 0 1rem; color:#8a7159; font:italic 300 1.45rem/1 var(--display); }
.section { padding:clamp(5rem,10vw,9rem) max(6vw,1.35rem); }
.button { display:inline-flex; min-height:46px; align-items:center; justify-content:center; padding:.8rem 1.35rem; border:1px solid currentColor; border-radius:999px; font-size:.72rem; font-weight:500; letter-spacing:.16em; text-transform:uppercase; }
.button--light { color:#fffaf2; background:rgba(18,14,11,.2); backdrop-filter:blur(8px); }
.button--dark { color:#fff; border-color:var(--olive); background:var(--olive); }
.text-link { padding:.5rem 0; border-bottom:1px solid currentColor; font-size:.7rem; letter-spacing:.12em; text-transform:uppercase; }

.cover { position:fixed; z-index:100; inset:0; display:grid; height:100svh; place-items:center; overflow:hidden; color:#fffaf2; background:#171310; transition:visibility 0s 1.95s,background-color .3s .25s; }
.cover__image { position:absolute; inset:-3%; width:106%; max-width:none; height:106%; object-fit:cover; object-position:center 56%; animation:openingDrift 14s ease-out both; }
.cover__shade { position:absolute; inset:0; background:linear-gradient(180deg,rgba(13,9,7,.42),rgba(13,9,7,.16) 44%,rgba(13,9,7,.76)); }
.cover__shade::before { content:""; position:absolute; inset:-25%; background:linear-gradient(112deg,transparent 38%,rgba(255,246,226,.02) 44%,rgba(255,246,226,.24) 50%,rgba(255,246,226,.03) 57%,transparent 63%); mix-blend-mode:screen; transform:translateX(-65%); animation:openingLustre 8s 2.2s ease-in-out infinite; }
.cover__frame { position:absolute; z-index:4; inset:14px; border:1px solid rgba(255,255,255,.28); pointer-events:none; }
.cover__content { position:relative; z-index:3; width:min(92%,980px); padding:2rem; text-align:center; }
.cover__heading { position:relative; top:clamp(-4.75rem,-9svh,-2.25rem); }
.cover__heading>.eyebrow { opacity:0; animation:riseIn 1s .2s forwards; }
@media(max-height:600px) { .cover__heading { top:-1.5rem; } }
.cover__names { display:grid; justify-items:center; gap:.32rem; margin:1.35rem 0; overflow:visible; font-family:var(--display); opacity:0; animation:riseIn 1.1s .35s forwards; text-shadow:0 2px 24px rgba(96,58,13,.28),0 0 30px rgba(222,178,93,.1); }
.cover__names span { display:block; overflow:visible; padding:0 .06em .1em; color:transparent; background:linear-gradient(105deg,#f8e6b9 14%,#c99546 38%,#fff1bd 50%,#b77b2f 61%,#efd59d 82%); background-size:260% 100%; background-clip:text; -webkit-background-clip:text; font-size:clamp(4.15rem,13vw,8rem); font-weight:300; line-height:.82; letter-spacing:-.045em; animation:wordmarkSheen 7s 1.5s ease-in-out infinite; }
.cover__names i { display:grid; width:min(240px,68%); grid-template-columns:1fr auto 1fr; align-items:center; gap:1rem; margin:.08rem 0; color:#dfcfb8; font:italic 300 1.9rem/1 var(--display); transform:translateY(.1em); }
.cover__names i::before,.cover__names i::after { content:""; height:1px; background:currentColor; opacity:.55; }
.cover__date { margin:2rem 0 2.4rem; font-size:.74rem; letter-spacing:.34em; text-transform:uppercase; opacity:0; animation:riseIn 1s .85s forwards; }
.cover .button { position:relative; overflow:hidden; opacity:0; animation:riseIn 1s 1.05s forwards; }
.cover .button::before { content:""; position:absolute; inset:7px -45%; background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.72) 49%,transparent 63%); transform:translateX(-85%); transition:transform .9s cubic-bezier(.22,1,.36,1); }
.cover .button:hover::before,.cover .button:focus-visible::before { transform:translateX(85%); }
.cover__edition { position:absolute; bottom:max(1.8rem,env(safe-area-inset-bottom)); font-size:.56rem; letter-spacing:.22em; text-transform:uppercase; opacity:.75; }
.portal-doors { position:absolute; z-index:8; inset:0; overflow:hidden; opacity:0; perspective:1300px; pointer-events:none; }
.portal-doors::before { content:""; position:absolute; z-index:10; top:-12%; bottom:-12%; left:50%; width:2px; background:linear-gradient(transparent,#fff5c9 20%,#ffd27d 50%,#fff8d9 80%,transparent); box-shadow:0 0 24px 8px rgba(255,220,143,.78),0 0 80px 24px rgba(255,245,205,.38); opacity:0; transform:translateX(-50%) scaleX(1); }
.portal-door { position:absolute; top:0; bottom:0; width:50.1%; overflow:hidden; backface-visibility:hidden; transform-style:preserve-3d; }
.portal-door::before { content:""; position:absolute; top:0; bottom:0; width:100vw; background:url('/images/hero.jpg') center 56%/cover no-repeat; }
.portal-door::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(13,9,7,.43),rgba(13,9,7,.17) 44%,rgba(13,9,7,.76)); }
.portal-door--left { left:0; transform-origin:left center; }
.portal-door--left::before { left:0; }
.portal-door--left::after { border-right:1px solid rgba(255,225,163,.44); }
.portal-door--right { right:0; transform-origin:right center; }
.portal-door--right::before { right:0; }
.portal-door--right::after { border-left:1px solid rgba(255,225,163,.44); }
.cover--departing { visibility:hidden; background:transparent; }
.cover--departing .portal-doors { opacity:1; }
.cover--departing .portal-doors::before { animation:portalLight 1.55s cubic-bezier(.2,.72,.25,1) forwards; }
.cover--departing .portal-door--left { animation:portalLeft 1.8s .08s cubic-bezier(.72,0,.18,1) forwards; }
.cover--departing .portal-door--right { animation:portalRight 1.8s .08s cubic-bezier(.72,0,.18,1) forwards; }
.cover--departing .cover__image,.cover--departing .cover__shade { opacity:0; transition:opacity .18s .06s; }
.cover--departing .cover__content,.cover--departing .cover__frame { opacity:0; transform:scale(.96); transition:opacity .3s,transform .55s cubic-bezier(.4,0,.2,1); }
body:has(#hero:target) .cover:not(.cover--departing) { visibility:hidden; opacity:0; pointer-events:none; }

.light-atmosphere { position:fixed; z-index:105; inset:0; overflow:hidden; opacity:.78; pointer-events:none; transition:opacity 1.3s ease,z-index 0s 1.3s; }
.light-atmosphere--open { z-index:85; opacity:.46; }
.light-atmosphere__glow { position:absolute; inset:0; background:radial-gradient(420px circle at var(--light-x,50vw) var(--light-y,38vh),rgba(255,240,207,.22),rgba(255,246,228,.07) 38%,transparent 72%); mix-blend-mode:screen; transition:opacity .45s ease; }
.light-atmosphere__motes span { position:absolute; width:7px; height:7px; opacity:0; filter:drop-shadow(0 0 5px rgba(255,236,196,.95)); animation:moteGlint 7s ease-in-out infinite; }
.light-atmosphere__motes span::before,.light-atmosphere__motes span::after { content:""; position:absolute; top:50%; left:50%; border-radius:999px; background:rgba(255,248,230,.92); transform:translate(-50%,-50%); }
.light-atmosphere__motes span::before { width:100%; height:1px; }
.light-atmosphere__motes span::after { width:1px; height:100%; }
.light-atmosphere__motes span:nth-child(1) { top:13%; left:9%; animation-delay:.4s; }
.light-atmosphere__motes span:nth-child(2) { top:24%; left:78%; width:10px; height:10px; animation-delay:2.1s; }
.light-atmosphere__motes span:nth-child(3) { top:47%; left:21%; width:5px; height:5px; animation-delay:4.3s; }
.light-atmosphere__motes span:nth-child(4) { top:67%; left:88%; animation-delay:1.2s; }
.light-atmosphere__motes span:nth-child(5) { top:82%; left:13%; width:9px; height:9px; animation-delay:5.2s; }
.light-atmosphere__motes span:nth-child(6) { top:76%; left:62%; width:5px; height:5px; animation-delay:3.2s; }
.light-atmosphere__motes span:nth-child(7) { top:36%; left:93%; width:6px; height:6px; animation-delay:6.1s; }
.light-atmosphere__motes span:nth-child(8) { top:9%; left:51%; width:5px; height:5px; animation-delay:3.8s; }
.light-atmosphere__burst { --burst-x:0px; --burst-y:0px; --burst-delay:0ms; position:fixed; width:4px; height:4px; border-radius:50%; background:#fff6dc; box-shadow:0 0 8px #ffe6ab,0 0 16px rgba(255,224,164,.55); transform:translate(-50%,-50%); animation:sparkleBurst .72s var(--burst-delay) cubic-bezier(.2,.75,.25,1) forwards; }

@keyframes riseIn { from { opacity:0; transform:translateY(18px); } to { opacity:1; transform:none; } }
@keyframes openingDrift { from { transform:scale(1.07); } to { transform:scale(1); } }
@keyframes portalLeft { 0% { transform:perspective(1300px) rotateY(0); } 20% { transform:perspective(1300px) rotateY(-5deg); } 100% { transform:perspective(1300px) rotateY(-89deg) translateX(-8%); } }
@keyframes portalRight { 0% { transform:perspective(1300px) rotateY(0); } 20% { transform:perspective(1300px) rotateY(5deg); } 100% { transform:perspective(1300px) rotateY(89deg) translateX(8%); } }
@keyframes portalLight { 0% { opacity:0; transform:translateX(-50%) scaleX(.2); } 18% { opacity:1; } 58% { opacity:.94; transform:translateX(-50%) scaleX(36); } 100% { opacity:0; transform:translateX(-50%) scaleX(130); } }
@keyframes worldArrival { from { filter:brightness(1.18) saturate(1.08); transform:scale(1.09); } to { filter:none; transform:scale(1); } }
@keyframes worldCopy { from { opacity:0; transform:translateY(24px); } to { opacity:1; transform:none; } }
@keyframes wordmarkSheen { 0%,18% { background-position:100% 50%; } 52%,100% { background-position:0% 50%; } }
@keyframes openingLustre { 0%,24% { transform:translateX(-65%); opacity:0; } 42% { opacity:.8; } 63%,100% { transform:translateX(65%); opacity:0; } }
@keyframes moteGlint { 0%,72%,100% { opacity:0; transform:scale(.35) rotate(0); } 80% { opacity:.95; transform:scale(1) rotate(45deg); } 88% { opacity:.15; transform:scale(.55) rotate(85deg); } }
@keyframes sparkleBurst { 0% { opacity:0; transform:translate(-50%,-50%) scale(.25); } 25% { opacity:1; } 100% { opacity:0; transform:translate(calc(-50% + var(--burst-x)),calc(-50% + var(--burst-y))) scale(.05); } }

.hero { position:relative; min-height:100svh; overflow:hidden; color:#fffaf2; background:#243130; }
.hero__image { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:56% center; }
.hero__shade { position:absolute; inset:0; background:linear-gradient(180deg,rgba(12,21,23,.48),rgba(12,21,23,.12) 54%,rgba(12,21,23,.28)); }
.invitation-open .hero__image { animation:worldArrival 2.15s cubic-bezier(.18,.7,.2,1) both; }
.invitation-open .hero__copy { animation:worldCopy 1.05s .65s cubic-bezier(.22,1,.36,1) both; }
.hero__topline { position:absolute; z-index:2; top:max(1rem,env(safe-area-inset-top)); right:1.2rem; left:1.2rem; display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:.75rem; font-size:.68rem; font-weight:500; letter-spacing:.16em; text-transform:uppercase; }
.monogram { display:grid; width:40px; height:46px; place-items:center; border:1px solid rgba(255,250,242,.7); border-radius:50% 50% 45% 45%; font:300 1rem/1 var(--display); }
.hero__copy { position:absolute; z-index:2; top:max(4rem,calc(env(safe-area-inset-top) + 3rem)); right:1.25rem; left:1.25rem; }
.hero__kicker { display:flex; align-items:center; gap:.7rem; margin:0 0 1rem; font:italic 300 1.05rem/1 var(--display); letter-spacing:.04em; text-shadow:0 2px 14px rgba(0,0,0,.5); }
.hero__kicker::after { content:""; width:54px; height:1px; background:rgba(255,255,255,.7); }
.hero__headline { margin:0; font-family:var(--display); isolation:isolate; }
.hero__headline>span { display:block; color:rgba(255,250,242,.96); font-size:clamp(3.55rem,16vw,5.25rem); font-weight:300; line-height:.82; letter-spacing:.07em; text-shadow:0 3px 22px rgba(0,0,0,.34); }
.hero__headline em { display:block; margin:.08em 0 0 clamp(.65rem,4vw,2.1rem); color:#fffaf2; font-size:clamp(3.45rem,15.5vw,5.15rem); font-weight:300; line-height:.76; letter-spacing:-.035em; text-shadow:0 3px 22px rgba(0,0,0,.42); }
.hero__date { display:inline-block; margin:1.15rem 0 0; padding:.65rem 0; border-top:1px solid rgba(255,255,255,.65); border-bottom:1px solid rgba(255,255,255,.65); font-size:.7rem; font-weight:500; letter-spacing:.23em; text-transform:uppercase; text-shadow:0 2px 12px rgba(0,0,0,.55); }

.invitation { text-align:center; background:var(--paper); }
.name-lockup { display:grid; max-width:1100px; margin:3.2rem auto; align-items:center; justify-content:center; gap:.4rem; font-family:var(--display); }
.name-lockup span { font-size:clamp(3.8rem,12vw,7rem); font-weight:300; line-height:.86; letter-spacing:-.045em; }
.name-lockup i { color:var(--gold); font-size:1.7rem; font-weight:400; transform:translateY(.16em); }
.invitation__copy { font:300 1.35rem/1.65 var(--display); }
.countdown { max-width:700px; margin:7rem auto 0; padding-top:3rem; border-top:1px solid var(--line); }
.countdown__grid { display:grid; grid-template-columns:repeat(4,1fr); align-items:stretch; margin-top:2.5rem; }
.countdown__grid>div { display:flex; min-width:0; flex-direction:column; align-items:center; justify-content:center; padding:1rem .5rem; border-right:1px solid var(--line); }
.countdown__grid>div:last-child { border:0; }
.countdown strong { display:block; min-width:2ch; font:300 clamp(2.6rem,9vw,4.25rem)/.9 var(--display); font-variant-numeric:lining-nums tabular-nums; font-feature-settings:"lnum" 1,"tnum" 1; letter-spacing:-.035em; text-align:center; }
.countdown span { display:block; margin-top:.6rem; font-size:.54rem; letter-spacing:.14em; text-transform:uppercase; }
.lake-divider { position:relative; height:clamp(190px,28vw,320px); overflow:hidden; background:linear-gradient(to bottom,var(--paper) 0%,var(--paper) 28%,var(--cream) 100%); }
.lake-divider__mountain { position:absolute; bottom:0; left:50%; width:min(1100px,112%); height:100%; max-width:none; object-fit:contain; opacity:1; transform:translateX(-50%); }
.lake-divider__boat { position:absolute; bottom:5%; left:50%; width:clamp(90px,14vw,125px); opacity:1; transform:translateX(-50%) rotate(-2deg); }

.details { background:var(--cream); }
.section-title { max-width:900px; margin-bottom:5rem; }
.section-title>span { display:block; margin-bottom:1.5rem; color:#938577; font-size:.76rem; letter-spacing:.18em; text-transform:uppercase; }
.section-title h2 { margin:1rem 0 0; font:300 clamp(3.5rem,10vw,7.2rem)/.88 var(--display); letter-spacing:-.04em; }
.details__grid { display:grid; max-width:1120px; margin:auto; gap:5rem; }
.date-card { text-align:center; }
.date-card__day,.date-card__month { margin:.25rem 0; font:300 2rem/1 var(--display); }
.date-card>strong { display:block; margin:-.1em 0; font:300 clamp(8rem,32vw,13rem)/.9 var(--display); letter-spacing:-.065em; }
.date-card__rule { display:block; width:1px; height:55px; margin:2.2rem auto; background:#aa9c8e; }
.schedule { max-width:390px; margin:auto; border-top:1px solid rgba(89,96,74,.28); }
.schedule p { display:grid; grid-template-columns:minmax(100px,.9fr) 1.5fr; gap:1rem; align-items:baseline; margin:0; padding:.9rem .2rem; border-bottom:1px solid rgba(89,96,74,.28); text-align:left; }
.schedule time { color:var(--olive); font-size:.78rem; font-weight:500; letter-spacing:.1em; }
.schedule span { font-size:.78rem; font-weight:300; letter-spacing:.07em; text-transform:uppercase; }
.schedule span[lang="th"] { font-family:var(--thai); font-size:.82rem; font-weight:300; letter-spacing:.01em; line-height:1.65; text-transform:none; }
.venue>h3 { margin:1.7rem 0 2.6rem; font:300 clamp(3rem,9vw,5.8rem)/.9 var(--display); letter-spacing:-.035em; }
.venue__image { position:relative; margin:0 0 2rem; overflow:hidden; border:1px solid rgba(89,96,74,.2); border-radius:80px 80px 10px 10px; }
.venue__image img { width:100%; height:clamp(230px,42vw,340px); object-fit:cover; object-position:center 58%; }
.venue__image::after { content:""; position:absolute; inset:9px; border:1px solid rgba(255,255,255,.65); border-radius:70px 70px 7px 7px; }
.venue__image figcaption { position:absolute; z-index:1; right:0; bottom:0; left:0; display:flex; align-items:end; justify-content:space-between; padding:3rem 1.2rem 1rem; color:#fff; background:linear-gradient(transparent,rgba(20,18,16,.65)); text-transform:uppercase; }
.venue__image figcaption span { font:300 1.65rem/1 var(--display); letter-spacing:.12em; }
.venue__image figcaption small { max-width:150px; font-size:.52rem; letter-spacing:.12em; text-align:right; }
.venue h4 { margin:0 0 .7rem; font:300 2rem/1.1 var(--display); }
.venue>p { max-width:600px; margin:.25rem 0; color:#655d55; font-size:.92rem; font-weight:300; line-height:1.75; }
.venue>p[lang="th"] { font-family:var(--thai); font-weight:300; letter-spacing:.005em; line-height:1.9; }
.venue__actions { display:flex; flex-wrap:wrap; align-items:center; gap:1.2rem 2rem; margin-top:2rem; }
.calendar-row { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:1rem 2rem; max-width:800px; margin:5rem auto 0; padding-top:2rem; border-top:1px solid var(--line); font-size:.68rem; letter-spacing:.11em; text-transform:uppercase; }
.calendar-row>span { width:100%; color:var(--muted); text-align:center; }
.calendar-row a { padding:.7rem 1rem; border:1px solid var(--olive); border-radius:999px; }

.dress {
  padding-top:clamp(3rem,6vw,4.5rem);
  /* Begin with the venue's exact cream, then ease into the stationery paper. */
  background:
    linear-gradient(to bottom,var(--cream) 0%,#f3ede3 48%,var(--paper) 100%)
      top / 100% clamp(140px,25vw,220px) no-repeat,
    var(--paper);
}
.dress__panel { display:grid; max-width:980px; margin:auto; padding:clamp(2.5rem,6vw,5rem); border:1px solid rgba(89,96,74,.2); border-radius:85px 85px 14px 14px; background:linear-gradient(125deg,#f0eee5,#faf7f0); box-shadow:0 24px 70px rgba(48,42,38,.06); text-align:center; }
.dress__copy h2 { margin:1.3rem 0 2rem; font:300 clamp(4rem,14vw,7rem)/.82 var(--display); letter-spacing:-.04em; }
.dress__copy>p:not(.eyebrow) { margin:0 0 .7rem; font:300 1.45rem/1.2 var(--display); }
.dress__copy>span { color:var(--muted); font-size:.92rem; font-weight:300; }
.dress__illustration { width:100%; margin:1rem auto 0; }
.dress__illustration img { width:85%; max-width:400px; margin-inline:auto; }
.swatches { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:.7rem; width:100%; margin-top:2rem; }
.swatches span { min-width:0; font-size:.54rem; letter-spacing:.06em; text-align:center; text-transform:uppercase; }
.swatches i { display:block; width:35px; height:35px; margin:0 auto .65rem; border:3px solid #fff; border-radius:50%; background:var(--swatch); box-shadow:0 0 0 1px rgba(48,41,35,.16); }

.photo-pause { padding:3rem 0 9rem; background:var(--ivory); }
.photo-pause>img { width:100%; height:min(78svh,900px); object-fit:cover; object-position:center 42%; }
.photo-pause__copy { margin:4rem max(7vw,1.4rem) 0; }
.photo-pause__copy span,.photo-pause__copy small { display:block; color:var(--muted); font-size:.58rem; letter-spacing:.2em; text-transform:uppercase; }
.photo-pause__copy p { margin:1.3rem 0 2rem; font:300 clamp(3.3rem,11vw,7.2rem)/.9 var(--display); letter-spacing:-.04em; }

.rsvp { display:grid; background:var(--ivory); }
.rsvp__intro { min-height:560px; padding:6rem max(6vw,1.4rem); color:#fff; background:linear-gradient(rgba(22,18,15,.45),rgba(22,18,15,.72)),url('/images/story-detail.jpg') center/cover; }
.rsvp__intro h2 { margin:2rem 0; font:300 clamp(4.5rem,16vw,8rem)/.82 var(--display); letter-spacing:-.045em; }
.rsvp__intro>p:last-child { max-width:420px; font-size:.92rem; font-weight:300; line-height:1.8; }
.rsvp__form-wrap { display:grid; align-items:center; padding:5rem max(6vw,1.4rem); }
#rsvp-form { display:grid; grid-template-columns:1fr 1fr; gap:2rem 1.2rem; max-width:760px; margin:auto; }
.field.field--message { gap:.35rem; margin-top:-.5rem; }
.field.field--message textarea { min-height:64px; padding:.35rem 0; line-height:1.45; resize:vertical; }
.form-note { grid-column:1/-1; margin:0; padding-bottom:1rem; color:var(--muted); border-bottom:1px solid var(--line); font-size:.75rem; }
.field { display:flex; min-width:0; flex-direction:column; gap:.6rem; margin:0; padding:0; border:0; }
.field--full { grid-column:1/-1; }
.field>span,.field legend { font-size:.72rem; font-weight:500; letter-spacing:.12em; text-transform:uppercase; }
.field__help { margin-top:-.2rem; color:var(--muted); font-size:.72rem; font-weight:300; line-height:1.5; }
.field input:not([type="radio"]),.field select,.field textarea { width:100%; min-height:48px; padding:.65rem 0; border:0; border-bottom:1px solid #978b7d; border-radius:0; outline:none; background:transparent; font-size:1rem; }
.field input:not([type="radio"]):focus,.field select:focus,.field textarea:focus { border-color:var(--ink); }
.radio-row { display:flex; flex-wrap:wrap; align-items:center; gap:.55rem; }
.radio-row label { display:inline-flex; width:auto; min-height:38px; align-items:center; gap:.5rem; padding:.48rem .78rem; border:1px solid rgba(89,96,74,.28); border-radius:999px; background:rgba(255,255,255,.26); font:300 .8rem/1.15 var(--sans); transition:border-color .2s ease,background .2s ease; }
.radio-row label:has(input:checked) { border-color:var(--olive); background:rgba(89,96,74,.08); }
.radio-row input[type="radio"] { width:15px; height:15px; min-width:15px; margin:0; padding:0; border:0; accent-color:var(--olive); }
.submit { grid-column:1/-1; min-height:52px; margin-top:1rem; border:1px solid var(--olive); border-radius:999px; color:#fff; background:var(--olive); font-size:.72rem; font-weight:500; letter-spacing:.16em; text-transform:uppercase; }
.rsvp-success { max-width:560px; margin:auto; text-align:center; }
.rsvp-success>span { display:grid; width:56px; height:56px; margin:0 auto 2rem; place-items:center; border:1px solid var(--olive); border-radius:50%; }
.rsvp-success h3 { margin:1rem 0; font:300 4.5rem/1 var(--display); }
.rsvp-success[hidden] { display:none; }

.closing { position:relative; display:grid; height:clamp(460px,66svh,680px); min-height:0; place-items:start center; overflow:hidden; color:#fff; background:#18282f; }
.closing>img { position:absolute; inset:-2%; width:104%; max-width:none; height:104%; object-fit:cover; object-position:center 69%; filter:saturate(.86) contrast(1.06) brightness(.94); transform:scale(1.13); transform-origin:center 69%; }
.closing__shade { position:absolute; inset:0; background:linear-gradient(180deg,rgba(12,22,27,.62) 0%,rgba(12,20,23,.22) 48%,rgba(17,14,12,.5) 100%),linear-gradient(105deg,rgba(14,22,24,.2),transparent 62%); }
.closing__copy { position:relative; z-index:1; width:100%; padding:clamp(1.4rem,4vw,2.8rem) 1rem 1rem; text-align:center; text-shadow:0 3px 22px rgba(9,13,14,.35); }
.closing__copy>p { margin:.45rem 0 .75rem; font-size:.9rem; letter-spacing:.06em; }
.closing__copy>span { font:italic 300 1.4rem/1 var(--display); }
.closing__copy h2 { margin:.65rem auto 0; padding-bottom:.2em; font:400 clamp(2.5rem,12vw,6rem)/1.1 var(--signature); letter-spacing:0; white-space:nowrap; }
.closing__names { display:flex; align-items:baseline; justify-content:center; gap:0; width:max-content; max-width:100%; }
.closing__names>span { display:block; color:#dfcfb8; }
.closing__copy h2 i { display:block; width:auto; margin:0 .16em 0 .42em; color:#dfcfb8; font:400 .5em/1 var(--display); transform:translateY(-.08em); }

.motion-ready .scroll-reveal { opacity:0; transform:translateY(30px); transition:opacity .9s ease,transform 1s cubic-bezier(.22,1,.36,1); transition-delay:var(--reveal-delay,0ms); }
.motion-ready .scroll-reveal.reveal-left { transform:translateX(-28px); }
.motion-ready .scroll-reveal.reveal-right { transform:translateX(28px); }
.motion-ready .scroll-reveal.reveal-soft { transform:translateY(18px) scale(.985); }
.motion-ready .scroll-reveal.is-visible { opacity:1; transform:none; }
.motion-ready .scroll-image { clip-path:inset(0 0 100% 0); transform:scale(1.025); transition:clip-path 1.15s cubic-bezier(.65,0,.2,1),transform 1.5s cubic-bezier(.22,1,.36,1); transition-delay:var(--reveal-delay,0ms); }
.motion-ready .scroll-image.is-visible { clip-path:inset(0); transform:none; }
.lake-divider__boat { transform:translateX(calc(-50% + var(--boat-drift,0px))) translateY(var(--boat-bob,0px)) rotate(-2deg); transition:transform .15s linear; }

@media (min-width:760px) {
  .cover__frame { inset:24px; }
  .hero { display:grid; min-height:900px; padding:2.5rem 4vw 5rem; grid-template-columns:repeat(12,1fr); grid-template-rows:auto 1fr; color:var(--ink); background:var(--ivory); }
  .hero__image { position:relative; grid-column:8/13; grid-row:1/3; width:100%; height:calc(100% - 2rem); margin:1rem 0; object-position:58% center; }
  .hero__shade { display:none; }
  .hero__topline { position:relative; top:auto; right:auto; left:auto; grid-column:1/7; grid-row:1; }
  .hero__copy { position:relative; top:auto; right:auto; left:auto; grid-column:1/8; grid-row:2; align-self:center; }
  .hero__kicker { color:#8a7159; text-shadow:none; }
  .hero__kicker::after { background:rgba(89,96,74,.55); }
  .hero__headline>span { color:var(--olive); text-shadow:none; }
  .hero__headline em { color:var(--ink); text-shadow:none; }
  .hero__date { color:var(--olive); border-color:rgba(89,96,74,.55); text-shadow:none; }
  .name-lockup { grid-template-columns:max-content 80px max-content; gap:.3rem; }
  .name-lockup i { display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:.7rem; }
  .name-lockup i::before,.name-lockup i::after { content:""; height:1px; background:currentColor; }
  .details__grid { grid-template-columns:1fr 1fr; gap:7vw; }
  .date-card { padding-right:5vw; border-right:1px solid var(--line); }
  .dress__panel { grid-template-columns:minmax(280px,.85fr) minmax(360px,1.15fr); align-items:center; gap:1rem 3rem; text-align:left; }
  .dress__illustration { margin:0; }
  .swatches { grid-column:1/-1; }
  .photo-pause { padding:5rem 0 13rem; }
  .photo-pause>img { width:72vw; height:min(88vh,980px); margin-left:auto; }
  .photo-pause__copy { width:60vw; margin:-6rem 0 0 7vw; padding:4rem; background:rgba(246,242,233,.95); }
  .rsvp { grid-template-columns:minmax(320px,42%) 1fr; min-height:900px; }
  .rsvp__intro { min-height:100vh; padding:8rem 5vw; }
  .rsvp__form-wrap { padding:7rem 5vw; }
}
@media (max-width:520px) {
  .hero__topline>span:nth-child(2) { display:none; }
  .countdown__grid { grid-template-columns:1fr 1fr; }
  .countdown__grid>div { border-bottom:1px solid var(--line); }
  .countdown__grid>div:nth-child(2) { border-right:0; }
  .countdown__grid>div:nth-child(n+3) { border-bottom:0; }
  .countdown strong { font-size:clamp(3.2rem,15vw,4.1rem); }
  .dress { padding-right:.8rem; padding-left:.8rem; }
  .dress__panel { padding:2.7rem .85rem 3.1rem; }
  .swatches { gap:.38rem; }
  .swatches span { font-size:.46rem; letter-spacing:.025em; }
  .swatches i { width:30px; height:30px; border-width:2px; }
  #rsvp-form { grid-template-columns:1fr; }
  #rsvp-form>* { grid-column:1!important; }
}
@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  .cover__image,.cover__shade::before,.cover__heading>.eyebrow,.cover__names,.cover__names span,.cover__date,.cover .button,.light-atmosphere__motes span { animation:none; }
  .cover__heading>.eyebrow,.cover__names,.cover__date,.cover .button { opacity:1; }
  .light-atmosphere { display:none; }
  .cover--departing { display:none; }
  .invitation-open .hero__image,.invitation-open .hero__copy { animation:none; }
  .motion-ready .scroll-reveal,.motion-ready .scroll-image { opacity:1; clip-path:none; transform:none; transition:none; }
}

/* Watercolor agenda, inspired by the supplied printed invitation. */
.agenda { position:relative; display:grid; grid-template-columns:1fr 1fr; grid-template-rows:repeat(4,150px); width:min(100%,430px); margin:1rem auto; }
.agenda__trail { position:absolute; inset:0; width:100%; height:100%; overflow:visible; pointer-events:none; }
.agenda__trail path { fill:none; stroke:#7e846c; stroke-width:1.2; stroke-linecap:round; opacity:.55; }
.agenda__trail .agenda__glimmer { stroke:#f6dba5; stroke-width:2.1; stroke-dasharray:1.8 98.2; opacity:0; filter:drop-shadow(0 0 3px rgba(226,183,101,.65)); animation:agendaLustre 12s linear infinite; animation-play-state:paused; }
.agenda__trail .agenda__glimmer--second { animation-delay:-6s; }
.agenda__trail .agenda__sparkle { fill:#f8e8c8; stroke:#d8b774; stroke-width:.35; opacity:0; filter:drop-shadow(0 0 3px rgba(218,171,83,.6)); transform-box:fill-box; transform-origin:center; animation:agendaSparkle 7s ease-in-out infinite; animation-play-state:paused; }
.agenda__trail .agenda__sparkle--two { animation-delay:-1.8s; }
.agenda__trail .agenda__sparkle--three { animation-delay:-3.6s; }
.agenda--lit .agenda__glimmer,.agenda--lit .agenda__sparkle { animation-play-state:running; }
@keyframes agendaLustre { 0% { stroke-dashoffset:0; opacity:0; } 12% { opacity:.8; } 82% { opacity:.8; } 100% { stroke-dashoffset:-100; opacity:0; } }
@keyframes agendaSparkle { 0%,45%,100% { opacity:0; transform:scale(.55); } 58% { opacity:.85; transform:scale(1); } 70% { opacity:.15; transform:scale(.7); } }
@media(prefers-reduced-motion:reduce) { .agenda__trail .agenda__glimmer,.agenda__trail .agenda__sparkle { display:none; animation:none; } }
.agenda__item { position:relative; z-index:1; display:flex; flex-direction:column; align-items:center; justify-content:center; min-width:0; text-align:center; }
.agenda__copy { position:relative; z-index:2; max-width:100%; padding:.25rem .4rem; border-radius:.5rem; background:var(--cream); }
.agenda__item--morning { grid-column:1; grid-row:1; }
.agenda__item--rings { grid-column:2; grid-row:2; }
.agenda__item--photos { grid-column:1; grid-row:3; }
.agenda__item--celebrate { grid-column:2; grid-row:4; }
.agenda__icon { display:block; flex-shrink:0; width:96px; height:96px; background-image:url('/images/agenda-watercolor-v26.png'); background-size:300% 100%; background-repeat:no-repeat; }
.agenda__icon--rings { background-position:0% center; }
.agenda__icon--photos { background-position:50% center; }
.agenda__icon--celebrate { background-position:100% center; }
.agenda__icon--water { background-image:url('/images/agenda-water-blessing-v31.png'); background-size:contain; background-position:center; }
.agenda time { display:block; margin:.3rem 0 .4rem; color:var(--olive); font:400 1.6rem/1 var(--display); font-variant-numeric:lining-nums tabular-nums; letter-spacing:.07em; }
.agenda h3 { margin:0; font:300 .9rem/1.6 var(--thai); letter-spacing:0; }
.agenda p { margin:.2rem 0 0; color:var(--muted); font:300 .67rem/1.5 var(--sans); letter-spacing:.01em; }
.date-card__rule { height:30px; }
.field[hidden],.rsvp-success[hidden],#rsvp-form[hidden] { display:none; }
.rsvp-honeypot { position:absolute; left:-10000px; width:1px; height:1px; overflow:hidden; }
.rsvp-status { grid-column:1/-1; margin:0; color:var(--olive); font:.82rem/1.7 var(--thai); }
.rsvp-status:empty { display:none; }
.rsvp-status--error { color:#984936; }
.submit:disabled { opacity:.58; cursor:not-allowed; }
.form-note[lang='th'],.rsvp-success p[lang='th'] { font-family:var(--thai); font-weight:300; line-height:1.8; letter-spacing:0; }
/* Thai form copy uses the same Prompt family and light weight as the agenda. */
.rsvp .rsvp-thai { display:block; margin-top:.25rem; font:300 .82rem/1.6 var(--thai); letter-spacing:0; text-transform:none; }
.rsvp .field :is(input,select,textarea),.rsvp .submit { font-family:"DM Sans",var(--thai); }
.rsvp .field select { font-size:.9rem; }
.rsvp .radio-row { gap:.7rem; margin-top:.6rem; }
.rsvp .radio-row label { padding:.65rem .85rem; border-radius:1rem; }
.rsvp .radio-row .rsvp-thai { margin-top:.2rem; font-size:.75rem; }
.rsvp .field__help .rsvp-thai { font-size:.72rem; }
.rsvp .submit { padding:.8rem 1rem; line-height:1.6; letter-spacing:.05em; }
@media(max-width:380px) {
  .agenda { grid-template-rows:repeat(4,140px); }
  .agenda__icon { width:86px; height:86px; }
  .agenda time { font-size:1.4rem; }
  .agenda h3 { font-size:.81rem; }
  .agenda p { font-size:.6rem; }
}

/* The reference's handwritten names and airy watercolor stationery layout. */
.hero.hero--stationery {
  display:flex;
  flex-direction:column;
  align-items:center;
  min-height:0;
  padding:3.25rem 1rem 3rem;
  color:var(--olive);
  background:var(--paper);
  text-align:center;
}
.stationery-hero__heading { position:relative; z-index:1; width:100%; }
.stationery-hero__heading>.eyebrow { font:400 .8rem/1.5 var(--display); letter-spacing:.18em; }
.stationery-hero__names { display:grid; justify-items:center; gap:.1rem; max-width:1000px; margin:1.3rem auto .5rem; font-weight:400; }
.stationery-hero__names>span { max-width:100%; padding:0 .08em .14em; color:#62695d; font:400 clamp(2.5rem,13vw,6.5rem)/1.05 var(--signature); letter-spacing:0; white-space:nowrap; }
.stationery-hero__names>i { color:var(--gold); font:400 clamp(1.5rem,5vw,2.2rem)/1 var(--display); }
.stationery-hero__announcement { margin:.65rem 0 .35rem; }
.stationery-hero__announcement>span { display:block; font:400 clamp(.75rem,2.5vw,1rem)/1.5 var(--display); letter-spacing:.25em; text-transform:uppercase; }
.stationery-hero__announcement>span+span { margin-top:.15rem; }
.stationery-hero__ornament { display:block; width:44px; height:1px; margin:.35rem auto .8rem; background:var(--gold); }
.stationery-hero__art {
  position:relative;
  width:min(100%,900px);
  aspect-ratio:1067/885;
  margin:0 auto;
  overflow:hidden;
  mix-blend-mode:multiply;
  -webkit-mask-image:url('/images/watercolor-top-edge-v30.svg');
  mask-image:url('/images/watercolor-top-edge-v30.svg');
  -webkit-mask-size:100% 100%;
  mask-size:100% 100%;
  -webkit-mask-repeat:no-repeat;
  mask-repeat:no-repeat;
}
.stationery-hero__art::before {
  content:"";
  position:absolute;
  top:0;
  left:3%;
  width:94%;
  height:24%;
  background:url('/images/hero-sky-extension-v32.png') center / 100% 100% no-repeat;
  pointer-events:none;
}
/* Keep the original couple untouched; extend sky above the cropped card artwork. */
.stationery-hero__art>img {
  position:absolute;
  top:-49.15%;
  left:0;
  width:100%;
  height:auto;
  max-width:none;
  -webkit-mask-image:linear-gradient(to bottom,transparent 34.94%,#000 38%,#000);
  mask-image:linear-gradient(to bottom,transparent 34.94%,#000 38%,#000);
}
.stationery-hero__date { margin:1.7rem 0 0; font:400 clamp(.82rem,3.3vw,1.1rem)/1.5 var(--display); font-variant-numeric:lining-nums proportional-nums; font-feature-settings:"lnum" 1,"onum" 0; letter-spacing:.18em; text-transform:uppercase; }
.stationery-hero__note { margin:1rem 0 0; font:300 clamp(1.1rem,4.2vw,1.7rem)/1.45 var(--display); }
.name-lockup.name-lockup--signature { display:grid; grid-template-columns:1fr; justify-items:center; gap:.45rem; width:100%; max-width:1000px; margin:2.5rem auto; }
.name-lockup--signature>span { max-width:100%; padding:0 .1em .18em; color:#62695d; font:400 clamp(2.5rem,13vw,6.5rem)/1.1 var(--signature); letter-spacing:0; white-space:nowrap; }
.name-lockup--signature>i { display:block; width:auto; margin:0; color:var(--gold); font:400 1.8rem/1 var(--display); transform:none; }
.name-lockup--signature>i::before,.name-lockup--signature>i::after { display:none; }
@media(min-width:760px) {
  .hero.hero--stationery { padding-top:4rem; padding-bottom:4rem; }
  .stationery-hero__names { margin-top:1.75rem; }
  .stationery-hero__art { max-width:820px; }
  .name-lockup--signature>span { font-size:6.5rem; }
}

/* A single sheet of paper carries the card, live date and countdown. The last
   3.2% of the image is blank paper, below the supplied caption, not the art. */
.stationery-intro {
  background:
    linear-gradient(to bottom,transparent calc(100% - 48px),var(--paper) 100%),
    url('/images/stationery-paper-v42.svg') repeat #f7f3ee;
}
.hero.hero--stationery.hero--card { padding:0; background:transparent; }
.stationery-hero__card { width:min(100%,760px); margin:0 auto; }
.stationery-hero__artwork {
  position:relative;
  -webkit-mask-image:linear-gradient(to bottom,#000 96.8%,transparent 100%);
  mask-image:linear-gradient(to bottom,#000 96.8%,transparent 100%);
}
.stationery-hero__artwork>img { display:block; width:100%; height:auto; }
/* Use only the repaired paper over the dash; preserve every other original pixel. */
.stationery-hero__artwork>.stationery-hero__quote-repair {
  position:absolute;
  inset:0;
  pointer-events:none;
  clip-path:polygon(72.9% 91.9%,76% 91.9%,76% 93.1%,72.9% 93.1%);
}
.hero--card .stationery-hero__date {
  margin:0;
  padding:.15rem 1rem 1.6rem;
  color:#6b5842;
}
.stationery-intro .invitation.invitation--compact { background:transparent; }
.stationery-intro .countdown { border-top:0; }
.visually-hidden {
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}

/* A compact four-column countdown on mobile as well as desktop. */
.invitation.invitation--compact { padding:0 max(6vw,1rem) 1.25rem; overflow:hidden; }
.invitation--compact .countdown { position:relative; max-width:520px; margin:0 auto; padding-top:1.4rem; }
.invitation--compact .countdown>.eyebrow { font-size:clamp(.55rem,1.9vw,.68rem); }
.invitation--compact .countdown__grid { grid-template-columns:repeat(4,minmax(0,1fr)); margin-top:1.1rem; }
.invitation--compact .countdown__grid>div { padding:.6rem .2rem; border-bottom:0; border-right:1px solid var(--line); }
.invitation--compact .countdown__grid>div:last-child { border-right:0; }
.invitation--compact .countdown strong { font-size:clamp(2rem,8.5vw,3.2rem); }
.invitation--compact .countdown span { margin-top:.45rem; font-size:clamp(.43rem,1.4vw,.53rem); letter-spacing:.1em; }