/* Three different compositions; names and details remain live, selectable text. */
body:is([data-layout=suite],[data-layout=journal],[data-layout=social]) .stationery-scene{min-height:0;padding:0;container-type:inline-size;align-self:center}
body:is([data-layout=suite],[data-layout=journal],[data-layout=social]) .main{padding-bottom:64px}
body:is([data-layout=suite],[data-layout=journal],[data-layout=social]) .invitation-card{position:relative;inset:auto;margin:0;z-index:2}
.stationery-suite{position:relative;min-height:670px;padding:60px 21% 175px 5%;isolation:isolate}
body[data-layout=suite]{background:linear-gradient(#eeeadeee,#eeeadeee),url('../assets/tactile-openings/linen.webp') center/650px}
body[data-layout=suite] .invitation-page{grid-template-columns:1.3fr 1fr;gap:54px}
body[data-layout=suite] .invitation-card{width:100%;max-width:none;background:#414a32;color:#fff8e9;border:1px solid #bdb792;box-shadow:0 12px 22px #33332222;padding:54px 27px 42px;transform:rotate(-4deg);min-height:470px}
body[data-layout=suite] .invitation-card h2{font-size:clamp(43px,10cqw,68px);font-weight:400;line-height:.93}
body[data-layout=suite] .card-kicker{color:#f5ecda;font-size:12px}
body[data-layout=suite] .card-script{font-size:25px;color:#e8d4c4}
body[data-layout=suite] .card-date,body[data-layout=suite] .card-time{display:none}
body[data-layout=suite] .card-venue{font-size:24px;line-height:1.1;margin-top:34px}
body[data-layout=suite] .card-closing{display:none}
.suite-florals{position:absolute;left:-4%;top:-4%;width:95%;height:100%;object-fit:contain;z-index:4;pointer-events:none;object-position:left bottom}
.suite-date{position:absolute;right:0;top:22px;width:34%;min-height:265px;background:#fffaf0 url('../assets/tactile-openings/cotton-paper.webp') center/cover;border:1px solid #d3c6ae;outline:1px solid #dbcfbc;outline-offset:-9px;padding:26px 17px;z-index:5;box-shadow:0 10px 16px #38241922;transform:rotate(5deg);text-align:center;color:#414a32}
.suite-date .eyebrow{font-size:11px;letter-spacing:.12em;margin:0 0 10px;color:#666546}
.suite-date strong{display:block;font:56px/1 var(--serif)}.suite-date em{display:block;font:32px/1.25 var(--serif);margin:6px 0}.suite-year{font:22px var(--serif)}.suite-location{font-size:13px;line-height:1.4;margin:16px 0 0;overflow-wrap:anywhere}
.suite-details{position:absolute;right:0;bottom:120px;width:146px;height:146px;z-index:6;border:1px solid #6c3b45;border-radius:50%;background:#592332;color:#fff6e8;box-shadow:0 9px 20px #59233222;font:19px/1.15 var(--serif);transition:rotate .3s,scale .3s}.suite-details em{font-size:25px}.suite-details span{display:block;font:23px var(--sans);margin-top:8px}.suite-details:hover{rotate:5deg;scale:1.03}
.suite-reply{position:absolute;bottom:22px;left:28%;width:47%;background:#fff9ed;color:#592332;border:1px solid #d7bcb4;box-shadow:0 9px 14px #38241922;padding:19px;z-index:5;transform:rotate(4deg);display:grid;text-align:center}.suite-reply>span{font:italic 23px var(--serif)}.suite-reply strong{font:44px/1.15 var(--serif)}.suite-reply small{font-size:13px}
body[data-layout=suite] .welcome-copy{padding:0 0 35px;border-bottom:1px solid #b7b29e}
body[data-layout=suite] .welcome-copy h1{font-size:clamp(46px,4.4vw,65px);font-style:italic;color:#592332}
body[data-layout=suite] .countdown{border-top:1px solid #b7b29e;border-bottom:1px solid #b7b29e;padding:22px 0}
body[data-layout=suite] .details-layout{grid-template-columns:1.2fr 1fr;gap:35px}
body[data-layout=suite] .venue-card,body[data-layout=suite] .day,body[data-layout=suite] #studio-menu{background:#fffaf1;box-shadow:4px 7px 0 #ded8c9;border:1px solid #d7cdb9;padding:24px}
body[data-layout=suite] .details-secondary{padding:32px;background:#592332;color:#fff5e7}
body[data-layout=suite] .details-secondary .dress-note{background:none;color:inherit;border:0;padding:0}
body[data-layout=suite] .details-secondary .eyebrow{color:#d5c3ad}
body[data-layout=suite] .details-secondary small,body[data-layout=suite] .details-secondary .questions p,body[data-layout=suite] .details-secondary .dress-note>p{color:#f5e3d5}
body[data-layout=suite] .questions{border-color:#946874}
body[data-layout=suite] .rsvp-paper{background:#fffaf1;outline:1px solid #b4aa8a;outline-offset:-12px;border:1px solid #b4aa8a}
/* A full-width photographic cover and a newspaper-like information spread. */
body[data-layout=journal] .invitation-page{display:block;max-width:1120px;margin:auto}
.photo-journal{position:relative;display:grid;grid-template-columns:1.1fr 1fr;padding-top:62px;min-height:630px;border-top:2px solid #262b29;border-bottom:2px solid #262b29;gap:24px}
.journal-masthead{position:absolute;top:14px;left:0;right:0;display:flex;justify-content:space-between;align-items:center;font:13px var(--sans);letter-spacing:.16em}
.journal-masthead .suite-year{font:13px var(--sans)}
.journal-portrait{margin:0 0 30px;padding:0;align-self:stretch;min-width:0;grid-row:1/3}
.journal-image{width:100%;height:500px;object-fit:cover}.journal-portrait figcaption{font:italic 18px var(--serif);padding:14px 0}
body[data-layout=journal] .invitation-card{width:100%;padding:65px 0 12px;text-align:left;max-width:none;min-width:0}
body[data-layout=journal] .invitation-card h2{font-size:clamp(50px,7cqw,95px);letter-spacing:-.06em;font-weight:500;line-height:.89;text-align:left}
body[data-layout=journal] .invitation-card h2 span{display:block;margin:8px 0;font-size:.5em;color:#ac492e}
body[data-layout=journal] .card-kicker{max-width:none;margin:0 0 28px;font-size:12px;letter-spacing:.16em}
body[data-layout=journal] .card-script{font-size:23px;margin-top:26px}.photo-journal .card-rule{margin:25px 0}
body[data-layout=journal] .card-date{font-weight:600;letter-spacing:0;font-size:17px}
body[data-layout=journal] .card-venue{font-size:28px}.photo-journal .card-closing{display:none}
.journal-note{position:static;grid-column:2;grid-row:2;align-self:end;margin:0 0 30px;border:0;border-top:1px solid #adb0a8;background:transparent;padding:17px 0 0;text-align:left;font:28px var(--serif);width:100%}.journal-note span{font:14px var(--sans)}
body[data-layout=journal] .welcome-copy{padding:45px 0;display:grid;grid-template-columns:1fr 1fr;gap:0 45px}
body[data-layout=journal] .welcome-copy>.eyebrow,body[data-layout=journal] .welcome-copy>h1,body[data-layout=journal] .welcome-copy>.welcome-note{grid-column:1}
body[data-layout=journal] .welcome-copy>h1{font-size:48px}
body[data-layout=journal] .event-essentials{grid-column:2;grid-row:1/4;margin:0}
body[data-layout=journal] .welcome-actions,body[data-layout=journal] .countdown{grid-column:1/-1}
body[data-layout=journal] .details-layout{grid-template-columns:1.35fr 1fr;gap:64px}
body[data-layout=journal] .venue-card{background:transparent;border:0;border-top:3px solid #252a26;padding:25px 0}
body[data-layout=journal] .details-secondary{border-left:1px solid #b7b9b1;padding-left:35px}
body[data-layout=journal] .rsvp-aside h1{font-size:80px}
body[data-layout=journal] .rsvp-paper{border:0;border-top:3px solid #252a26;border-bottom:1px solid #252a26;background:transparent;box-shadow:none}
/* An invitation as a bold, typeset evening poster. */
body[data-layout=social] .invitation-page{grid-template-columns:1.1fr 1fr;gap:60px}
.social-poster{background:#2d2447;color:#fff0d7;border:1px solid #b4a092;padding:28px;position:relative;min-height:700px;display:grid;grid-template-columns:1fr 1fr;gap:24px}
.social-poster>header{grid-column:1/-1;display:flex;justify-content:space-between;align-items:center;font-size:11px;letter-spacing:.12em;border-bottom:1px solid #8e7c91;padding-bottom:14px}.social-poster>header .suite-year{font-size:16px}
body[data-layout=social] .invitation-card{padding:12px 0 0;grid-column:1/-1;width:100%;max-width:none;text-align:left}
body[data-layout=social] .invitation-card h2{font-family:var(--sans);font-weight:650;text-transform:uppercase;letter-spacing:-.075em;text-align:left;font-size:clamp(39px,10cqw,76px);line-height:.97}
body[data-layout=social] .invitation-card h2 span{display:inline;font-size:.5em;margin:0 10px;color:#ffb18c}
body[data-layout=social] .card-kicker{display:none}body[data-layout=social] .card-script{font-family:var(--serif);font-size:28px;margin-top:22px}
body[data-layout=social] .card-rule{display:none}body[data-layout=social] .card-date{font-size:16px;margin-top:30px;letter-spacing:0}
body[data-layout=social] .card-venue{font-family:var(--sans);text-transform:uppercase;font-size:21px}
body[data-layout=social] .card-time,body[data-layout=social] .card-closing{display:none}
.social-still{grid-column:1/-1;display:grid;grid-template-columns:1.2fr 1fr;align-items:center;min-height:145px}.social-still img{width:100%;height:180px;object-fit:contain}.social-still p{font-size:14px;line-height:1.8;letter-spacing:.06em;margin:0;color:#ffb18c}
.social-admit{grid-column:1/-1;background:#ffb18c;color:#2d2447;border:0;border-radius:0;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;padding:19px;text-align:left}.social-admit span:first-child{width:100%;font-size:11px;letter-spacing:.12em}.social-admit strong{font-family:var(--serif);font-weight:500;font-size:25px}.social-admit>span:last-child{font-size:25px}
body[data-layout=social] .welcome-copy h1{font-family:var(--sans);font-weight:650;letter-spacing:-.06em;font-size:clamp(40px,4.5vw,61px)}
body[data-layout=social] .countdown{background:#2d2447;color:#fff0d7;padding:25px 20px;gap:20px}
body[data-layout=social] .countdown small,body[data-layout=social] .countdown p{color:#ffc7a2}
body[data-layout=social] .details-layout{grid-template-columns:1fr 1fr;gap:24px}
body[data-layout=social] .venue-card,body[data-layout=social] .dress-note{border-radius:0;border:0;background:#fff0d7;padding:28px}
body[data-layout=social] .day{border-top:2px solid #2d2447;border-bottom:1px solid #2d2447}
body[data-layout=social] .day-name strong{font-family:var(--sans);letter-spacing:-.05em;font-weight:600}
body[data-layout=social] .rsvp-aside{background:#2d2447;color:#fff0d7;padding:40px}
body[data-layout=social] .rsvp-aside .eyebrow{color:#ffb18c}
body[data-layout=social] .rsvp-aside>p,body[data-layout=social] .rsvp-aside .rsvp-date{color:#fff0d7}
body[data-layout=social] .rsvp-paper{box-shadow:10px 10px 0 #2d2447;border:2px solid #2d2447;border-radius:0}
@media(max-width:900px){
 body:is([data-layout=suite],[data-layout=journal],[data-layout=social]) .main{padding:25px 20px 70px}
 body:is([data-layout=suite],[data-layout=social]) .invitation-page{grid-template-columns:1fr;gap:25px;max-width:610px;margin:auto}
 body:is([data-layout=suite],[data-layout=social]) .stationery-scene{width:100%}
 body:is([data-layout=suite],[data-layout=journal],[data-layout=social]) .welcome-copy{display:block;padding-top:25px}
 body:is([data-layout=suite],[data-layout=journal],[data-layout=social]) .details-layout{grid-template-columns:1fr;gap:24px}
 body[data-layout=journal] .details-secondary{padding-left:0;border-left:0}
 body:is([data-layout=suite],[data-layout=journal],[data-layout=social]) .rsvp-aside h1{font-size:55px}
}
@media(max-width:600px){
 .stationery-suite{min-height:625px;padding-top:128px;padding-left:2%;padding-right:18%;padding-bottom:155px}
 body[data-layout=suite] .invitation-card{padding:44px 26px 36px;min-height:428px}
 body[data-layout=suite] .invitation-card h2{font-size:clamp(42px,13cqw,65px)}
 body[data-layout=suite] .card-kicker{max-width:180px;font-size:11px;letter-spacing:.1em}
 .suite-date{width:56%;top:0;min-height:136px;padding:20px 13px;display:grid;grid-template-columns:.65fr 1fr;gap:0 5px}.suite-date .eyebrow{grid-column:1/-1;margin-bottom:8px;font-size:10px}.suite-date strong{font-size:44px;grid-column:1;grid-row:2/4;align-self:center}.suite-date em{font-size:22px;grid-column:2;margin:0}.suite-date .suite-year{font-size:18px;grid-column:2}.suite-date .suite-location{display:none}
 .suite-details{width:125px;height:125px;bottom:105px;font-size:17px}.suite-details em{font-size:22px}.suite-reply{bottom:15px;padding:15px;left:17%;width:55%}.suite-reply strong{font-size:38px}
 .suite-florals{width:108%;left:-12%;top:0;opacity:.97}
 body[data-layout=suite] .details-secondary{padding:25px}
 .photo-journal{grid-template-columns:1fr;gap:0;padding-top:54px}
 .journal-portrait{margin:0;grid-row:auto}.journal-image{height:390px;max-height:105vw}.journal-portrait figcaption{font-size:16px;padding:10px 0}
 body[data-layout=journal] .invitation-card{padding:25px 0 18px}
 body[data-layout=journal] .invitation-card h2{font-size:clamp(54px,17cqw,80px)}
 .journal-note{grid-column:1;grid-row:auto;margin-bottom:24px;font-size:25px}.photo-journal .card-kicker{font-size:11px;margin-bottom:20px}
 .social-poster{padding:22px;min-height:630px;gap:18px}
 body[data-layout=social] .invitation-card h2{font-size:clamp(39px,12cqw,68px)}
 .social-still img{height:150px}.social-still p{font-size:12px}.social-poster>header{font-size:10px;letter-spacing:.06em}
 body[data-layout=social] .rsvp-aside{padding:28px}.social-admit strong{font-size:23px}
}