@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;1,400;1,500&family=Great+Vibes&family=Mrs+Saint+Delafield&family=Manrope:wght@400;500;600&display=swap');
:root{--paper:#f8f7f2;--ink:#424d3b;--sage:#87917b;--line:#d8dbd0;--disc:min(43vw,530px)}
*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:'Cormorant Garamond',Georgia,serif}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:2px solid #536745;outline-offset:7px}header,footer{display:flex;align-items:center;justify-content:space-between;margin:0 5vw}header{height:94px;border-bottom:1px solid var(--line)}header a{text-decoration:none;color:inherit;font-size:26px;letter-spacing:.12em}header a span{color:#a1a895;margin:0 8px}.header-end{display:flex;align-items:center;gap:16px;font:12px Manrope,sans-serif;letter-spacing:.2em}.language-switch{display:flex;gap:5px;padding-left:14px;border-left:1px solid var(--line)}.language-switch button{display:grid;place-items:center;width:27px;height:27px;padding:0;border:1px solid transparent;border-radius:50%;background:transparent;font-size:16px;filter:grayscale(1);opacity:.5;transition:filter .2s,opacity .2s,border-color .2s}.language-switch button[aria-pressed=true]{filter:none;opacity:1;border-color:#aeb6a2}.intro{text-align:center;padding:30px 15px 20px}.intro>p{font-family:Manrope,sans-serif;font-size:11px;letter-spacing:.26em;margin:0 0 10px;color:#737d69}h1{font-weight:400;font-style:italic;font-size:clamp(26px,3vw,40px);margin:0}.experience{padding:0 20px 25px;overflow:hidden}.album{position:relative;width:var(--disc);height:var(--disc);margin:18px auto 36px;isolation:isolate;transition:width 1.2s cubic-bezier(.22,.68,.1,1)}.cover{position:absolute;inset:0 auto auto 0;width:var(--disc);height:var(--disc);border:1px solid #e3e1d8;background:#fffefa url('assets/cover.png') center/cover no-repeat;box-shadow:0 14px 28px #3d40221c,0 2px 5px #3d402211;z-index:3;text-align:center;transition:transform 1.2s cubic-bezier(.22,.68,.1,1),box-shadow .4s;overflow:hidden}.cover:hover{box-shadow:0 20px 40px #3d40222a;transform:translateY(-4px) rotate(-.6deg)}.catalog{position:absolute;top:5%;left:5%;font-size:12px;letter-spacing:.16em}.cover-names{position:absolute;top:13%;left:5%;right:5%;font-family:'Great Vibes',cursive;font-size:clamp(40px,5.6vw,70px);line-height:1.06;font-weight:400}.cover-names i{font-size:.7em;font-style:normal}.cover-date{position:absolute;top:38%;left:0;right:0;font-size:clamp(10px,1.1vw,13px);letter-spacing:.27em}.cover-place{position:absolute;bottom:4.5%;right:5%;font-size:10px;letter-spacing:.14em}.record-shell{position:absolute;top:1%;left:1%;width:98%;height:98%;width:calc(var(--disc)*.98);height:calc(var(--disc)*.98);z-index:1;perspective:1500px;transition:transform 1.3s cubic-bezier(.22,.68,.1,1);filter:drop-shadow(8px 15px 13px #171d1826)}.record{width:100%;height:100%;position:relative;transform-style:preserve-3d;transition:transform 1s cubic-bezier(.2,.7,.2,1)}.face{position:absolute;inset:0;border-radius:50%;background:#171817 url('assets/record.png') center/106% 106% no-repeat;backface-visibility:hidden;-webkit-backface-visibility:hidden;display:flex;align-items:center;justify-content:center;overflow:hidden}.back{transform:rotateY(180deg)}.record.is-b{transform:rotateY(180deg)}.label{position:relative;border-radius:50%;width:75%;height:75%;background:#fbfaf3;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:6% 3%;overflow:hidden}.label:before{content:'';position:absolute;inset:55% 0 0;background:url('assets/cover.png') center bottom/100% auto no-repeat;opacity:.22;z-index:0}.label>*{position:relative;z-index:1}.side-tag{font-family:Manrope,sans-serif;font-size:clamp(8px,.8vw,10px);letter-spacing:.12em;margin-bottom:4%}.label h2{font-family:'Great Vibes',cursive;font-size:clamp(31px,3.9vw,49px);line-height:1.02;font-weight:400;margin:0 0 2%}.label h2 i{font-size:.7em;font-style:normal}.spindle{display:block;flex-shrink:0;width:13px;height:13px;border-radius:50%;background:#dedbd0;box-shadow:inset 1px 2px 3px #0004;margin:2% 0}.label p{margin:1% 0;font-size:clamp(12px,1.35vw,17px);line-height:1.15}.label .promise{font-size:clamp(12px,1.25vw,16px);font-style:italic;margin:2% 0}.rule{width:16%;height:1px;background:#8b967c;margin:2% 0}.label .date{font-weight:600}.label .church{margin-top:3%;font-size:clamp(12px,1.3vw,16px)}.church strong{font-weight:500}.label .reception{font-size:clamp(14px,1.5vw,19px);line-height:1.45;margin:3% 0}.label .signature{font-style:italic;margin-top:5%}.album.open{width:calc(var(--disc)*1.85)}.album.open .record-shell{transform:translateX(88%)}.album.open .cover{transform:rotate(-2deg) scale(.94);transform-origin:left center}.controls{text-align:center;min-height:95px}.open-button{border:1px solid #bdc5b3;background:transparent;border-radius:50px;padding:13px 25px;font-family:Manrope,sans-serif;font-size:14px;display:inline-flex;align-items:center;gap:11px;transition:background .2s}.open-button:hover{background:#e8ecdf}.mini-disc{font-size:23px;line-height:18px}.sides{display:inline-flex;border:1px solid #c6cdbc;border-radius:40px;padding:4px;gap:4px}.sides button{border:none;background:transparent;border-radius:30px;padding:10px 22px;font-size:19px;transition:background .25s,color .25s}.sides button span{font-family:Manrope,sans-serif;font-size:12px;display:block;margin-top:2px}.sides button[aria-pressed=true]{background:var(--ink);color:#fff}.close-button{display:block;margin:13px auto 0;background:none;border:none;border-bottom:1px solid #b5beaa;font-family:Manrope,sans-serif;font-size:12px;padding:3px 0}footer{padding:24px 0;border-top:1px solid var(--line);font:10px Manrope,sans-serif;letter-spacing:.16em}.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}[hidden]{display:none!important}
@media(min-width:1400px){:root{--disc:550px}}
@media(max-width:700px){:root{--disc:min(84vw,440px)}header{height:74px}.header-end{gap:8px;font-size:9px;letter-spacing:.1em}.language-switch{gap:2px;padding-left:7px}.language-switch button{width:24px;height:24px;font-size:14px}.intro{padding-top:25px}.intro>p{font-size:10px}h1{font-size:28px}.experience{padding:0 8px 20px}.album{margin:20px auto 27px}.cover-names{font-size:clamp(42px,11vw,64px)}.cover-date{font-size:11px}.cover-place{font-size:9px}.album.open{width:var(--disc);height:calc(var(--disc)*1.2)}.album.open .cover{transform:translateY(-2%) rotate(-7deg) scale(.85);opacity:.65}.album.open .record-shell{transform:translateY(23%);z-index:4}.label h2{font-size:clamp(36px,9.5vw,50px)}.side-tag{font-size:8px}.label p{font-size:14px}.label .promise{font-size:13px}.label .church{font-size:13px}.label .reception{font-size:16px}.label{width:79%;height:79%}.sides button{padding:10px 26px}footer{justify-content:center;padding:19px 0}footer span:last-child{display:none}}
.cover-names,.front .label h2{font-family:'Mrs Saint Delafield','Great Vibes',cursive;background:none;color:var(--ink);font-weight:400}
/* Show the supplied cover itself: no regenerated artwork or replacement lettering. */
.cover{background-image:url('assets/user-reference.jpeg');background-color:#eee5d5;background-size:192.02% 151.86%;background-position:30.97% 27.59%;border:0;filter:brightness(1.16) saturate(.78);box-shadow:0 12px 26px #3d402214,0 2px 5px #3d40220d}
.cover>.cover-names,.cover>.cover-date,.cover>.cover-place{opacity:0}
.label{background:#f8f4e9;color:#4f5947;padding:4% 3%}
.label:before{inset:57% 0 0;background-image:url('assets/user-reference.jpeg');background-size:192.02% 391.67%;background-position:30.97% 59.28%;opacity:.55;filter:brightness(1.16) saturate(.78);mask-image:linear-gradient(transparent,#000 48%);-webkit-mask-image:linear-gradient(transparent,#000 48%)}
.label h2,.front .label h2{font-family:'Mrs Saint Delafield','Great Vibes',cursive;color:#4f5947;font-weight:400;font-size:clamp(28px,3.3vw,42px);line-height:.95;margin:0}
.label .side-tag{font-family:'Cormorant Garamond',Georgia,serif;letter-spacing:.19em;margin-bottom:1%}
.label .rule{background:#a3ac94;margin:1% 0}
.label .spindle{width:9px;height:9px;margin:1% 0;background:#e7e2d8;box-shadow:inset 1px 2px 3px #0003}
.label p{margin:.5% 0}
.label .promise,.label .church{margin:1% 0}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;animation:none!important}}
.label .original-names{width:65%;flex-shrink:0;line-height:0;margin:1% 0}.original-names svg{display:block;width:100%;height:auto;aspect-ratio:435/208;overflow:hidden}
.music{max-width:480px;margin:25px auto 10px;border-top:1px solid var(--line);padding:24px 8px 0}.music h2{text-align:center;font-size:23px;font-weight:400;margin:0 0 15px}.track-list{list-style:none;margin:0 0 16px;padding:0}.track-list button{display:grid;grid-template-columns:26px 1fr 20px;align-items:center;gap:9px;text-align:left;width:100%;background:transparent;border:0;border-bottom:1px solid #d8dbd080;padding:10px 12px;font-family:Manrope,sans-serif;font-size:14px;border-radius:3px}.track-list button:hover{background:#eef0e7}.track-list button[aria-pressed=true]{background:#e5eadc}.track-number{font-size:12px;color:#77816e}.track-title{display:block;font-weight:500}.track-artist{display:block;font-size:12px;color:#66725d;margin-top:3px}.track-play{font-size:13px}.spotify-player{min-height:152px}.spotify-player iframe{display:block;width:100%;height:152px;border:0;border-radius:12px}.spotify-link{display:block;text-align:right;font:12px Manrope,sans-serif;color:var(--ink);margin-top:10px;text-underline-offset:3px}
.side-intro{max-width:480px;margin:23px auto 0;padding:20px 15px;border:1px solid #d8dbd0;background:#f3f4eb;text-align:center}.side-intro p:first-child{margin:0 0 7px;font:11px Manrope,sans-serif;letter-spacing:.18em;color:#758069}.side-intro h2{margin:0;font-size:30px;font-weight:400;font-style:italic}.side-intro p:last-child{margin:7px 0 0;font:14px/1.55 Manrope,sans-serif;color:#536047}
.venue{max-width:480px;margin:30px auto 10px;padding:26px 8px 0;border-top:1px solid var(--line);text-align:center}.venue-eyebrow{font:11px Manrope,sans-serif;letter-spacing:.2em;color:#77816e;margin:0 0 8px;text-transform:uppercase}.venue h2{font-size:29px;font-weight:400;font-style:italic;margin:0 0 14px}.venue-name{font-size:20px;font-weight:500;margin:0}.venue-address{font:14px Manrope,sans-serif;color:#66725d;margin:5px 0 12px}.venue-time{font:15px Manrope,sans-serif;font-weight:600;color:#4f5947;margin:0 0 18px}.venue iframe{display:block;width:100%;height:265px;border:0;border-radius:10px;filter:saturate(.72) sepia(.08)}.directions{display:inline-block;margin-top:12px;font:12px Manrope,sans-serif;color:var(--ink);text-underline-offset:3px}
.rsvp{position:relative;overflow:hidden;max-width:820px;margin:42px auto 35px;padding:45px clamp(24px,6vw,70px);background:#f5f1e7;border:1px solid #ded9cc;box-shadow:0 12px 24px #343b2910}.rsvp-art{position:absolute;inset:0;background:url('assets/user-reference.jpeg') 30% 100%/180% auto no-repeat;opacity:.1;filter:saturate(.65);pointer-events:none}.rsvp-copy,.rsvp-form{position:relative}.rsvp-copy{text-align:center}.rsvp-copy>p:first-child{margin:0 0 9px;font:11px Manrope,sans-serif;letter-spacing:.28em;color:#758069}.rsvp-copy h2{font-size:clamp(34px,5vw,49px);font-style:italic;font-weight:400;margin:0}.rsvp-copy>p:last-child{margin:5px 0 30px;font-size:20px;font-style:italic}.rsvp-form{max-width:570px;margin:auto;display:grid;gap:18px}.rsvp-form label,.rsvp-choice>span{display:grid;gap:7px;font:13px Manrope,sans-serif;letter-spacing:.02em;color:#536047}.rsvp-form input:not([type=radio]):not([type=checkbox]),.rsvp-form textarea,.rsvp-form select{width:100%;border:0;border-bottom:1px solid #abb4a0;border-radius:0;background:#fbfaf5cc;padding:12px 11px;color:#424d3b;font:16px 'Cormorant Garamond',Georgia,serif;outline:none}.rsvp-form textarea{resize:vertical;min-height:74px}.rsvp-form input:focus,.rsvp-form textarea:focus,.rsvp-form select:focus{border-color:#556548;box-shadow:0 2px 0 #87917b}.rsvp-choice{display:grid;gap:9px}.attendance-options{display:flex;gap:10px;flex-wrap:wrap}.attendance-options label{display:flex;align-items:center;gap:8px;padding:10px 15px;border:1px solid #bfc7b5;background:#fbfaf5a8;cursor:pointer}.attendance-options input{accent-color:#667558}.form-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:18px}.additional-guests{display:grid;gap:18px}.optional{font-size:11px;color:#7c8574}.consent{grid-template-columns:17px 1fr;align-items:start;line-height:1.45}.consent input{margin:2px 0 0;accent-color:#667558}.rsvp-submit{justify-self:center;border:1px solid #536047;background:#536047;color:#fff;padding:13px 27px;font:13px Manrope,sans-serif;letter-spacing:.06em;transition:transform .2s,background .2s}.rsvp-submit:hover{background:#68775a;transform:translateY(-2px)}.rsvp-submit span{font-size:17px;margin-left:8px}.rsvp-status{min-height:1.3em;margin:0;text-align:center;font-size:15px;font-style:italic}.rsvp:has(input[name=attendance][value='Non potrò esserci']:checked) #guestCount,.rsvp:has(input[name=attendance][value='Non potrò esserci']:checked) #additionalGuests{opacity:.45;pointer-events:none}@media(max-width:560px){.rsvp{margin:32px 8px 26px;padding:36px 21px}.form-grid{grid-template-columns:1fr}.rsvp-copy>p:last-child{font-size:18px}.attendance-options{display:grid;grid-template-columns:1fr}.rsvp-submit{width:100%}}
.gift{margin:8px 0 4px;padding:23px 22px;border:1px solid #c7cfbc;background:#eef0e7d9;text-align:center}.gift>p:first-child{max-width:440px;margin:0 auto 18px;font-size:17px;line-height:1.3;font-style:italic}.gift-details{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:11px;padding:11px;border-top:1px solid #cbd2c1;border-bottom:1px solid #cbd2c1;font:11px Manrope,sans-serif;letter-spacing:.12em;color:#66725d}.gift-details strong{font:16px 'Cormorant Garamond',Georgia,serif;letter-spacing:.08em;color:#3f4b38;white-space:nowrap}.gift-details button{border:0;background:transparent;padding:3px 0;border-bottom:1px solid #87917b;font:11px Manrope,sans-serif;color:#4e5e42}.gift-reason{margin:12px 0 0;font:12px/1.5 Manrope,sans-serif;color:#66725d}.gift-reason span{display:block;letter-spacing:.12em;text-transform:uppercase;font-size:10px}.gift-reason strong{font-weight:500;color:#4f5947}.iban-status{min-height:1.2em;margin:7px 0 0;font-size:14px;font-style:italic;color:#536047}@media(max-width:560px){.gift{padding:21px 14px}.gift-details{grid-template-columns:1fr;gap:5px}.gift-details strong{font-size:14px;letter-spacing:.04em}.gift-details button{justify-self:center;margin-top:3px}}
.rsvp:has(input[name=attendance][value='no']:checked) #guestCount,.rsvp:has(input[name=attendance][value='no']:checked) #additionalGuests{opacity:.45;pointer-events:none}

/* Il conto alla rovescia riprende il ritmo tipografico di un'etichetta discografica. */
.countdown{max-width:620px;margin:0 auto 22px;text-align:center;padding:13px 22px 20px}.countdown>p{margin:0 0 11px;font:10px Manrope,sans-serif;letter-spacing:.26em;color:#77816e}.countdown-grid{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.countdown-grid div{padding:14px 8px 12px;position:relative}.countdown-grid div+div:before{content:'';position:absolute;left:0;top:22%;height:56%;width:1px;background:var(--line)}.countdown-grid strong{display:block;font-size:clamp(27px,4vw,43px);font-weight:400;font-variant-numeric:tabular-nums;line-height:1}.countdown-grid span{display:block;margin-top:6px;font:9px Manrope,sans-serif;letter-spacing:.16em;text-transform:uppercase;color:#7b8473}

/* L'etichetta del disco resta pulita: le informazioni dei lati vivono nei controlli. */
.label-reception{gap:1%}.label-reception .label-kicker{font:clamp(8px,.8vw,10px) Manrope,sans-serif;letter-spacing:.2em;margin:0 0 2%}.label-reception .vinyl-iban{max-width:88%;font:600 clamp(9px,1.05vw,13px) Manrope,sans-serif;letter-spacing:.055em;overflow-wrap:anywhere;line-height:1.3}.label-reception .reception{font-size:clamp(11px,1.25vw,16px);line-height:1.25}.label-reception .promise{font-size:clamp(10px,1.1vw,14px)}

/* RSVP a fisarmonica */
.rsvp{padding:0}.rsvp-toggle{position:relative;z-index:1;width:100%;border:0;background:transparent;padding:42px clamp(24px,6vw,70px);display:grid;grid-template-columns:1fr auto;align-items:center;text-align:center}.rsvp-toggle:hover{background:#eef0e759}.rsvp-copy{display:block}.rsvp-copy>span{display:block;margin:0 0 9px;font:11px Manrope,sans-serif;letter-spacing:.28em;color:#758069}.rsvp-copy>strong{display:block;font-size:clamp(34px,5vw,49px);font-style:italic;font-weight:400}.rsvp-copy>em{display:block;margin-top:5px;font-size:20px;font-weight:400}.rsvp-toggle-mark{font:300 34px Manrope,sans-serif;transition:transform .3s}.rsvp-toggle[aria-expanded=true] .rsvp-toggle-mark{transform:rotate(45deg)}.rsvp-panel{position:relative;z-index:1;padding:0 clamp(24px,6vw,70px) 45px}.rsvp-form{padding-top:28px;border-top:1px solid #d6d5c9}
.gift-standalone{max-width:820px;margin:0 auto 54px;padding:32px clamp(22px,6vw,68px);background:#eef0e7;border-color:#c7cfbc;box-shadow:0 10px 24px #343b290c}.gift-standalone>p:first-child{font-size:20px;max-width:560px}

/* Mini guida per trasformare il matrimonio in un weekend nel Sud. */
.journeys{max-width:1020px;margin:62px auto 70px;padding:0 22px}.journeys-copy{text-align:center;max-width:680px;margin:0 auto 28px}.journeys-copy>p:first-child,.memories>p:first-of-type{margin:0 0 10px;font:10px Manrope,sans-serif;letter-spacing:.25em;color:#77816e}.journeys-copy h2,.memories h2{font-size:clamp(32px,4.8vw,52px);font-weight:400;font-style:italic;line-height:1.05;margin:0}.journeys-copy>p:last-child{font-size:19px;font-style:italic;line-height:1.45;margin:13px auto 0}.route-tabs{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid #cbd1c3;background:#f2f3eb}.route-tab{border:0;border-right:1px solid #cbd1c3;background:transparent;padding:13px 8px;font-size:17px}.route-tab:last-child{border-right:0}.route-tab span{display:block;margin-top:3px;font:9px Manrope,sans-serif;letter-spacing:.04em;color:#727d69}.route-tab.active{background:#536047;color:#fff}.route-tab.active span{color:#e5eadf}.journey-map-wrap{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(280px,.75fr);min-height:390px;background:#ebeade;border:1px solid #cbd1c3;border-top:0}.journey-map-wrap iframe{width:100%;height:100%;min-height:390px;border:0;filter:saturate(.65) sepia(.08)}.journey-card{padding:clamp(28px,5vw,52px);display:flex;flex-direction:column;justify-content:center;background:linear-gradient(135deg,#f6f3e9eb,#e8ebdfeb),url('assets/user-reference.jpeg') center/cover}.journey-card>p:first-child{font:10px Manrope,sans-serif;letter-spacing:.18em;color:#76806c;margin:0 0 12px}.journey-card h3{font-size:30px;font-weight:400;font-style:italic;line-height:1.08;margin:0}.journey-card>p:not(:first-child){font-size:17px;line-height:1.45;margin:14px 0 22px}.journey-card a{align-self:flex-start;color:inherit;font:12px Manrope,sans-serif;text-underline-offset:5px}

.memories{position:relative;overflow:hidden;max-width:820px;margin:0 auto 65px;padding:58px 30px;text-align:center;border:1px solid #d9d7cb;background:#f6f3ea}.memories:before{content:'';position:absolute;inset:48% 0 0;background:url('assets/user-reference.jpeg') 30% 100%/180% auto no-repeat;opacity:.08;filter:saturate(.6)}.memories>*{position:relative}.memories-disc{width:42px;height:42px;border:10px solid #454a42;border-radius:50%;margin:0 auto 18px;box-shadow:inset 0 0 0 5px #f6f3ea,0 0 0 1px #343933}.memories>p:last-of-type{font-size:18px;font-style:italic;margin:13px auto 24px;max-width:520px}.memories button{border:1px solid #aeb6a3;background:#e8eadf;color:#77806e;padding:12px 25px;font:12px Manrope,sans-serif;letter-spacing:.08em;cursor:not-allowed}

@media(max-width:700px){.countdown{padding-left:11px;padding-right:11px}.countdown-grid strong{font-size:28px}.countdown-grid span{font-size:8px;letter-spacing:.07em}.label-reception .vinyl-iban{font-size:10px}.rsvp-toggle{padding:34px 24px;grid-template-columns:1fr}.rsvp-toggle-mark{margin-top:12px}.rsvp-panel{padding:0 21px 34px}.gift-standalone{margin:0 8px 44px}.route-tabs{grid-template-columns:1fr 1fr}.route-tab:nth-child(2){border-right:0}.route-tab:nth-child(-n+2){border-bottom:1px solid #cbd1c3}.journey-map-wrap{grid-template-columns:1fr}.journey-map-wrap iframe{min-height:300px}.journey-card{padding:32px 26px}.journeys{margin:48px auto 55px;padding:0 8px}.memories{margin:0 8px 42px;padding:45px 23px}}

/* A compact invitation first; the guest opens the practical details. */
:root{--disc:min(43vw,420px,calc(100svh - 325px))}
header{height:64px}.intro{padding:18px 16px 10px}.intro h1{font-size:clamp(21px,2.7vw,32px);text-transform:none;letter-spacing:.045em;font-style:normal;max-width:720px;margin:auto}
.countdown{max-width:440px;margin:0 auto 6px;padding:4px 16px 8px}.countdown-grid div{padding:7px}.countdown-grid strong{font-size:27px}.countdown-grid span{margin-top:3px}
.album{margin:10px auto 18px}.controls{min-height:0}.open-button{display:none}.sides button{padding:8px 24px}.sides button .side-name{font-size:12px;letter-spacing:.1em}.sides button span:last-child{font:22px 'Cormorant Garamond',Georgia,serif}
.close-button{margin-top:8px}.details-control{text-align:center;padding:14px 0 6px}.details-toggle{display:inline-flex;align-items:center;gap:22px;padding:13px 24px;border:1px solid #536047;border-radius:30px;background:#536047;color:#fff;font:14px Manrope,sans-serif}.details-toggle:hover{background:#68775a}.details-toggle>span:last-child{font-size:20px;line-height:1}
.label-reception{padding:8% 7%;gap:0;justify-content:center}.label-reception .label-kicker{font-size:clamp(8px,.85vw,11px);text-transform:uppercase;margin:1% 0;letter-spacing:.16em}.label-reception .reception-invite{font-size:clamp(10px,1.1vw,14px);max-width:90%;line-height:1.2;margin:2% 0}.label-reception h2.reception-name{font-family:'Cormorant Garamond',Georgia,serif;font-style:italic;font-size:clamp(25px,3vw,37px);line-height:1.05;margin:1% 0}.label-reception .reception-address{font-size:clamp(10px,1vw,13px);line-height:1.25}.label-reception .spindle{margin:4% 0}.label-reception .vinyl-gift{font-size:clamp(10px,1.1vw,14px);font-style:italic;line-height:1.25;margin:0 0 2%;max-width:95%}.label-reception .vinyl-iban{font-size:clamp(8px,.87vw,11px);letter-spacing:.02em;max-width:100%}.front .label .promise{max-width:85%}
@media(max-width:700px){:root{--disc:min(80vw,360px,calc(100svh - 310px))}header{height:54px}.intro{padding:13px 12px 8px}.intro>p{margin-bottom:5px}.intro h1{font-size:20px}.countdown-grid strong{font-size:24px}.album.open{height:calc(var(--disc)*1.09)}.album.open .record-shell{transform:translateY(12%)}.album.open .cover{transform:translateY(-2%) rotate(-7deg) scale(.85)}.label-reception .vinyl-iban{font-size:9px}.label-reception .vinyl-gift{font-size:11px}.label-reception .reception-invite,.label-reception .reception-address{font-size:11px}.label-reception h2.reception-name{font-size:29px}.sides button{padding:7px 23px}.details-control{padding-top:12px}}
@media(max-height:620px){:root{--disc:min(72vw,300px)}}
@media(max-width:700px) and (min-height:621px){:root{--disc:min(80vw,360px,calc(100svh - 390px))}}
.intro h1 span{display:block;white-space:nowrap}.intro h1{font-size:clamp(18px,4.5vw,30px);line-height:1.22}
/* Keep the reception copy inside the safe central area of the circular label. */
.label-reception{width:84%;height:84%;container-type:inline-size;padding:12% 9%;flex-shrink:0;gap:0}
.label-reception>*{flex-shrink:0;max-width:100%}
.label-reception .label-kicker{font-size:3.3cqw;line-height:1.2;letter-spacing:.1em;margin:0 0 2cqw}
.label-reception .reception-invite{font-size:4.4cqw;line-height:1.12;max-width:90%;margin:0 0 1cqw}
.label-reception h2.reception-name{font-size:10cqw;line-height:1.05;margin:0 0 2cqw}
.label-reception .reception-address{font-size:4.5cqw;line-height:1.15;margin:0}
.label-reception .spindle{width:6px;height:6px;margin:3cqw 0}
.label-reception .vinyl-gift{font-size:4.5cqw;line-height:1.15;margin:0 0 2cqw;max-width:94%}
.label-reception .vinyl-iban{font-size:3.65cqw;line-height:1.2;letter-spacing:0;white-space:nowrap;margin:0;max-width:100%}
@media(max-width:700px){.album.open{--disc:min(90vw,390px);margin-top:16px}.label-reception:before{opacity:.22}}
.side-help{max-width:430px;margin:0 auto 10px;font:12px/1.45 Manrope,sans-serif;color:#66725d;text-align:center;padding:0 8px}
.sides{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);max-width:480px;margin:auto;border:0;border-radius:0;padding:0;gap:10px}.sides button{min-width:0;border:1px solid #bfc7b5;border-radius:12px;padding:11px 8px;background:#f3f3eb}.sides button span:nth-child(2){font:23px/1.2 'Cormorant Garamond',Georgia,serif;margin:4px 0}.sides button small{display:block;font:11px/1.4 Manrope,sans-serif;white-space:normal}.details-toggle{max-width:100%;white-space:normal;text-align:center;line-height:1.4}.details-toggle>span:first-child{min-width:0}.details-control{max-width:480px;margin:auto}.intro h1{font-size:clamp(16px,4.4vw,30px)}
.front .label{container-type:inline-size;width:84%;height:84%;padding:10% 8%;gap:0}.front .label .original-names{width:65%;margin:0 0 2cqw}.front .label p{font-size:4.8cqw;line-height:1.2}.front .label .promise{font-size:4.6cqw;line-height:1.15}.front .label .church{font-size:4.8cqw;line-height:1.2}.front .label .spindle{margin:2cqw 0}.front .label .rule{margin:2cqw 0}
@media(max-width:700px){.sides{max-width:390px;gap:8px}.sides button{padding:9px 5px}.sides button small{font-size:10px}.side-help{font-size:11px;max-width:320px}.details-toggle{font-size:12px;padding:11px 16px;gap:12px}:root{--disc:min(76vw,340px,max(190px,calc(100svh - 435px)))}.album.open{margin-bottom:28px}.gift-details strong{white-space:normal;overflow-wrap:anywhere}.header-end{letter-spacing:.06em}}


/* An editorial table of contents, on a single softly textured sheet. */
.intro h1{font-family:'Cormorant Garamond',Georgia,serif;font-style:italic;font-weight:400;letter-spacing:.015em;font-size:clamp(17px,4.8vw,34px)}
.intro>p{font-size:11px;letter-spacing:.2em}
.album-menu{position:relative;isolation:isolate;max-width:820px;margin:32px auto 42px;padding:30px 42px 34px 54px;border:1px solid #dfded2;background:#f5f3eacc;box-shadow:5px 7px 0 -2px #f8f7f2,5px 7px 0 -1px #deded0,0 14px 30px #424d3b0c;scroll-margin-top:24px}
.album-menu:before{content:'';position:absolute;left:29px;top:0;bottom:0;width:1px;background:#d2d8c7;pointer-events:none}
.album-menu:after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(115deg,#faf8f0,#f2f1e7);pointer-events:none}
.menu-heading{font:italic 30px/1.15 'Cormorant Garamond',Georgia,serif;margin:0 0 24px;color:#78816d}
.album-menu-card{position:relative;display:grid;grid-template-columns:32px minmax(0,1fr) minmax(100px,180px) 22px;align-items:center;gap:18px;width:100%;min-width:0;text-align:left;padding:21px 12px;border:0;border-top:1px solid #d9ddcf;border-radius:0;background:transparent;color:var(--ink);box-shadow:none;transition:background .25s,padding .25s}
.album-menu-card:last-child{border-bottom:1px solid #d9ddcf}
.menu-number{font:12px/1 Manrope,sans-serif;letter-spacing:.08em;color:#939a86}
.album-menu-card strong{font:italic 31px/1.1 'Cormorant Garamond',Georgia,serif;font-weight:400;min-width:0}
.menu-caption{font:12px/1.45 Manrope,sans-serif;color:#77816c;min-width:0}
.album-menu-card:after{content:'↗';font:20px/1 Georgia,serif;color:#8b957d;justify-self:end;transition:transform .2s}
.album-menu-card:hover{background:#e9edde77}.album-menu-card:hover:after{transform:translate(2px,-2px)}
.album-menu-card[aria-pressed=true]{background:#e5eadc99}
.album-menu-card[aria-pressed=true]:before{content:'';position:absolute;left:-25px;top:20px;bottom:20px;width:4px;background:#69795a;border-radius:0 2px 2px 0}
.album-menu-card[aria-pressed=true] .menu-number,.album-menu-card[aria-pressed=true] .menu-caption{color:#4f6042}
.album-menu-card[aria-pressed=true]:after{content:'—';color:#536047}
#selectedContent{padding:0 12px 20px;min-width:0;outline:none}
#selectedContent>.rsvp,#selectedContent>.memories,#selectedContent>.journeys{margin-top:12px}
#selectedContent .side-intro{display:none}#selectedContent .venue{margin-top:0;padding-top:16px}
#selectedContent .gift-standalone{margin-top:30px}
.sides{max-width:380px}.sides button{padding:8px 12px}.side-help{margin-bottom:8px}
@media(max-width:700px){
 .album-menu{margin:24px 16px 36px;padding:25px 16px 25px 29px}
 .album-menu:before{left:15px}
 .menu-heading{font-size:26px;margin-bottom:21px}
 .album-menu-card{grid-template-columns:23px minmax(0,1fr) 18px;gap:5px 10px;padding:16px 8px}
 .album-menu-card strong{font-size:28px;grid-column:2;grid-row:1}
 .menu-number{grid-column:1;grid-row:1;font-size:10px}
 .menu-caption{grid-column:2;grid-row:2;font-size:11px}
 .album-menu-card:after{grid-column:3;grid-row:1/3;font-size:19px}
 .album-menu-card[aria-pressed=true]:before{left:-14px;top:15px;bottom:15px;width:3px}
 .intro h1{font-size:clamp(16px,4.8vw,26px)}
 .sides button span:nth-child(2){font-size:22px}
 .label-reception .vinyl-iban{max-width:100%}
}
.intro h1{text-transform:none}
/* ───────────────────────────────────────────────────────────────
   Menu "Tracklist": cinque dischi su un'unica riga, uniti da un solco.
   La sezione attiva diventa un vinile che gira e la sua icona si disegna a mano.
   ─────────────────────────────────────────────────────────────── */
.album-menu{--disc-size:78px;padding:30px clamp(14px,3vw,34px) 30px}
.album-menu:before{content:none}
.menu-heading{display:flex;align-items:center;gap:18px;justify-content:center;text-align:center;font:italic 27px/1.15 'Cormorant Garamond',Georgia,serif;margin:0 0 28px;color:#78816d}
.menu-heading:before,.menu-heading:after{content:'';flex:1;max-width:120px;height:1px;background:linear-gradient(90deg,transparent,#c9cfbd)}
.menu-heading:after{background:linear-gradient(270deg,transparent,#c9cfbd)}
.menu-track{position:relative;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));align-items:start}
/* il solco tratteggiato che collega i dischi */
.menu-track:before,.menu-track:after{content:'';position:absolute;top:calc(var(--disc-size)/2);left:8.333%;height:1px;z-index:0;pointer-events:none}
.menu-track:before{right:8.333%;background:repeating-linear-gradient(90deg,#c3cab7 0 5px,transparent 5px 10px)}
/* la parte già "ascoltata" del solco */
.menu-track:after{height:2px;margin-top:-.5px;width:calc(var(--active,0)*16.666%);background:linear-gradient(90deg,#aab39d,#536047);border-radius:2px;transition:width .9s cubic-bezier(.22,.68,.1,1)}

.album-menu .album-menu-card{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:0;text-align:center;width:auto;padding:0 6px 4px;border:0;background:transparent;box-shadow:none;transition:none}
.album-menu .album-menu-card:last-child{border:0}
.album-menu .album-menu-card:before,.album-menu .album-menu-card:after,.album-menu .album-menu-card[aria-pressed=true]:before,.album-menu .album-menu-card[aria-pressed=true]:after{content:none}
.album-menu .album-menu-card:hover,.album-menu .album-menu-card[aria-pressed=true]{background:transparent}
.album-menu .album-menu-card:focus-visible{outline:none}
.album-menu .album-menu-card:focus-visible .menu-disc{outline:2px solid #536047;outline-offset:5px}

/* il disco: vinile nascosto sotto un'etichetta crema */
.menu-disc{position:relative;display:block;width:var(--disc-size);height:var(--disc-size);border-radius:50%;margin-bottom:14px;transition:transform .45s cubic-bezier(.22,.68,.1,1),filter .45s}
.menu-disc:before{content:'';position:absolute;inset:0;border-radius:50%;opacity:0;transform:scale(.72) rotate(0deg);
 background:
  conic-gradient(from 20deg,transparent 0 25deg,#ffffff2e 45deg,transparent 70deg 200deg,#ffffff1f 222deg,transparent 245deg),
  radial-gradient(circle,transparent 0 44%,#11120f 45% 46%,transparent 47%),
  repeating-radial-gradient(circle,#1c1e1b 0 1.4px,#2b2e29 1.4px 2.8px);
 box-shadow:0 8px 16px #1f241c30;transition:opacity .45s,transform .6s cubic-bezier(.22,.68,.1,1)}
.menu-plate{position:absolute;inset:0;display:grid;place-items:center;border-radius:50%;background:#fbfaf4;border:1px solid #cdd3c2;box-shadow:inset 0 0 0 4px #fbfaf4,inset 0 0 0 5px #e4e7dc;color:#7d8872;transition:inset .55s cubic-bezier(.22,.68,.1,1),background .4s,color .4s,box-shadow .4s,border-color .4s}
.menu-plate svg{width:58%;height:58%;fill:none;stroke:currentColor;stroke-width:1.55;stroke-linecap:round;stroke-linejoin:round;overflow:visible;transition:width .55s cubic-bezier(.22,.68,.1,1),height .55s cubic-bezier(.22,.68,.1,1)}
.menu-plate svg [pathLength]{stroke-dasharray:1;stroke-dashoffset:0}
.menu-plate .menu-fill{fill:currentColor;fill-opacity:0;transition:fill-opacity .5s .2s}
.menu-plate .menu-trail{stroke-dasharray:1.4 3;opacity:.75}

/* passaggio del mouse: il vinile fa capolino */
.album-menu-card:hover .menu-disc{transform:translateY(-3px)}
.album-menu-card:hover .menu-disc:before{opacity:1;transform:scale(1) rotate(35deg)}
.album-menu-card:hover .menu-plate{inset:10px;border-color:#f3efe3;color:#536047}

/* sezione attiva: il disco gira, l'icona si disegna */
.album-menu-card[aria-pressed=true] .menu-disc:before{opacity:1;transform:scale(1);animation:menu-spin 3.6s linear infinite}
.album-menu-card[aria-pressed=true] .menu-plate{inset:14px;background:#f8f4e9;border-color:#f8f4e9;box-shadow:inset 0 0 0 2px #f8f4e9,inset 0 0 0 3px #b8c1ab;color:#3f4a38}
.album-menu-card[aria-pressed=true] .menu-plate svg{width:66%;height:66%}
.album-menu-card[aria-pressed=true] .menu-plate svg [pathLength]{animation:menu-draw 1.4s cubic-bezier(.6,.1,.2,1) both}
.album-menu-card[aria-pressed=true] .menu-plate svg [pathLength]:nth-child(2){animation-delay:.12s}
.album-menu-card[aria-pressed=true] .menu-plate svg [pathLength]:nth-child(3){animation-delay:.24s}
.album-menu-card[aria-pressed=true] .menu-plate svg [pathLength]:nth-child(4){animation-delay:.36s}
.album-menu-card[aria-pressed=true] .menu-plate .menu-fill{fill-opacity:.9;transition-delay:1s}
.album-menu-card[aria-pressed=true] .menu-plate .menu-trail{animation:menu-trail 1.2s linear infinite}

/* testi */
.album-menu .menu-number{font:10px/1 Manrope,sans-serif;letter-spacing:.24em;color:#9aa18e;margin:0 0 7px;transition:color .3s}
.album-menu .album-menu-card strong{position:relative;display:block;font:italic 23px/1.08 'Cormorant Garamond',Georgia,serif;font-weight:400;color:#56614d;padding-bottom:9px;text-wrap:balance;transition:color .3s}
.album-menu .album-menu-card strong:after{content:'';position:absolute;left:50%;bottom:0;width:0;height:1px;background:#536047;transform:translateX(-50%);transition:width .5s cubic-bezier(.22,.68,.1,1)}
.album-menu .menu-caption{display:block;margin-top:7px;font:11px/1.4 Manrope,sans-serif;letter-spacing:.02em;color:#8a937e;max-width:15ch}
.album-menu-card:hover strong{color:var(--ink)}
.album-menu-card[aria-pressed=true] strong{color:#34402e}
.album-menu-card[aria-pressed=true] strong:after{width:26px}
.album-menu-card[aria-pressed=true] .menu-number{color:#536047}
.album-menu-card[aria-pressed=true] .menu-caption{color:#4f6042}

@keyframes menu-spin{to{transform:scale(1) rotate(360deg)}}
@keyframes menu-draw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@keyframes menu-trail{to{stroke-dashoffset:-4.4}}

/* sempre una sola riga, anche sul telefono */
@media(max-width:700px){
 .album-menu{--disc-size:54px;margin:22px 10px 32px;padding:22px 6px 20px}
 .menu-heading{font-size:22px;gap:12px;margin-bottom:20px}
 .menu-heading:before,.menu-heading:after{max-width:48px}
 .album-menu .album-menu-card{padding:0 2px 2px}
 .menu-disc{margin-bottom:9px}
 .album-menu-card:hover .menu-plate{inset:7px}
 .album-menu-card[aria-pressed=true] .menu-plate{inset:10px}
 .menu-plate{box-shadow:inset 0 0 0 3px #fbfaf4,inset 0 0 0 4px #e4e7dc}
 .menu-plate svg{stroke-width:1.8}
 .album-menu .menu-number{font-size:8.5px;letter-spacing:.16em;margin-bottom:5px}
 .album-menu .album-menu-card strong{font-size:clamp(12.5px,3.7vw,16px);line-height:1.08;padding-bottom:7px;hyphens:auto}
 .album-menu-card[aria-pressed=true] strong:after{width:18px}
 .album-menu .menu-caption{display:none}
}
@media(max-width:360px){.album-menu{--disc-size:48px}.album-menu .album-menu-card strong{font-size:12px}}

/* Personal paper keepsakes sit on the sleeve, never on the record label. */
.couple-memory{position:absolute;z-index:5;left:calc(var(--disc)*.08);bottom:calc(var(--disc)*-.07);width:calc(var(--disc)*.72);height:calc(var(--disc)*.64);pointer-events:none;display:block}
.couple-cutout{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(2px 7px 4px #31372728);transform-origin:50% 85%;animation:paper-arrive .7s ease-out both,paper-sway 4.8s ease-in-out .7s infinite}
#couplePhotoB{animation-name:paper-arrive,paper-sway-b}
@keyframes paper-arrive{from{opacity:0;transform:translateY(18px) rotate(-7deg) scale(.94)}to{opacity:1;transform:translateY(0) rotate(-2deg) scale(1)}}
@keyframes paper-sway{0%,100%{transform:rotate(-2deg)}50%{transform:rotate(2deg)}}
@keyframes paper-sway-b{0%,100%{transform:rotate(2deg)}50%{transform:rotate(-2deg)}}
@media(max-width:700px){
 .album.open{height:calc(var(--disc)*1.12 + 175px);margin-bottom:18px}
 .couple-memory{left:50%;bottom:0;transform:translateX(-50%);width:min(76vw,250px);height:160px}
}
@media(prefers-reduced-motion:reduce){.couple-cutout,.menu-disc:before,.menu-plate svg *{animation:none!important;transition:none!important}}

/* The web record has a wider groove area; print proportions are independent. */
.front .label,.label-reception{width:66%;height:66%;padding:6% 5%}
.label-reception{padding:6%}
.album.open{height:calc(var(--disc) + 185px);margin-bottom:18px}
.couple-memory{left:50%;bottom:0;transform:translateX(-50%);width:min(76vw,250px);height:160px}
@media(max-width:700px){.album.open{height:calc(var(--disc)*1.12 + 175px)}}

/* The game opens as the sixth record in the invitation index. */
.wedding-game{max-width:1040px;margin:12px auto 58px;padding:0 12px;scroll-margin-top:18px}
.game-heading{text-align:center;max-width:720px;margin:0 auto 24px}
.game-heading>p:first-child{margin:0 0 9px;font:10px Manrope,sans-serif;letter-spacing:.24em;color:#77816e}
.game-heading h2{font:italic 400 clamp(34px,5vw,56px)/1.04 'Cormorant Garamond',Georgia,serif;margin:0;text-wrap:balance}
.game-heading>p:last-child{font-size:18px;font-style:italic;line-height:1.45;margin:13px auto 0;max-width:590px}
.wedding-game iframe{display:block;width:100%;height:min(760px,92dvh);min-height:360px;border:1px solid #cbd1c3;border-radius:18px;background:#8fd3f4;box-shadow:0 18px 42px #30382a24;overflow:hidden}
@media(max-width:700px){
 .album-menu{overflow-x:auto;overscroll-behavior-inline:contain;scrollbar-width:none}
 .album-menu::-webkit-scrollbar{display:none}
 .menu-track{min-width:330px}
 .wedding-game{padding:0 6px;margin-bottom:38px}
 .game-heading{margin-bottom:17px;padding:0 10px}
 .game-heading h2{font-size:clamp(31px,10vw,44px)}
 .game-heading>p:last-child{font-size:16px}
 .wedding-game iframe{height:min(620px,72dvh);min-height:480px;border-radius:12px}
}
@media(max-width:700px) and (orientation:landscape){.wedding-game iframe{height:92dvh;min-height:340px}}
@media(max-width:360px){.menu-track{min-width:306px}.album-menu .album-menu-card strong{font-size:11.5px}}

/* Safari iOS can composite both 3D faces even with backface-visibility hidden.
   Keep the disc texture on both faces, but expose only the active paper label. */
.face{
 -webkit-transform-style:preserve-3d;
 transform-style:preserve-3d;
 -webkit-backface-visibility:hidden!important;
 backface-visibility:hidden!important;
}
.front{transform:rotateY(0deg) translateZ(1px)}
.back{transform:rotateY(180deg) translateZ(1px)}
.face .label{transition:opacity .12s linear;will-change:opacity}
.record:not(.is-b) .back .label,
.record.is-b .front .label{opacity:0;visibility:hidden}
.record:not(.is-b) .front .label,
.record.is-b .back .label{opacity:1;visibility:visible}

/* A quieter masthead brings the invitation higher in the first screen. */
.details-hint{margin:0 0 9px;color:#657459;font:italic 18px/1.3 'Cormorant Garamond',Georgia,serif;text-align:center}
.details-arrow{display:block;font:30px/1.2 Georgia,serif;margin:3px auto 0;animation:details-nudge 1.8s ease-in-out 3}
@media all{
 .details-control:has(#detailsHint:not([hidden])){position:fixed;z-index:20;left:12px;right:12px;bottom:max(10px,env(safe-area-inset-bottom));max-width:420px;padding:10px 14px 12px;background:#f8f7f2f5;border:1px solid #d8dbd0;border-radius:18px;box-shadow:0 4px 24px #424d3b24;backdrop-filter:blur(8px)}
 .details-control:has(#detailsHint:not([hidden])) .details-hint{display:flex;align-items:center;justify-content:center;gap:10px;margin:0 0 7px;font-size:16px}
 .details-control:has(#detailsHint:not([hidden])) .details-arrow{display:inline-block;margin:0;font-size:26px}
 .details-control:has(#detailsHint:not([hidden])) .details-toggle{width:100%;justify-content:center;font-size:14px;min-height:44px}
 .experience:has(.album.open):has(#detailsToggle[aria-expanded=false]){padding-bottom:130px}
}
@keyframes details-nudge{0%,100%{transform:translateY(-3px)}50%{transform:translateY(4px)}}
@media(prefers-reduced-motion:reduce){.details-arrow{animation:none}}
header{height:48px}
header a{font-size:21px;letter-spacing:.09em}
header a span{margin:0 6px}
.header-end{font-size:10px;letter-spacing:.12em;gap:12px}
@media(max-width:700px){
 header{height:42px}
 header a{font-size:19px}
 header a span{margin:0 4px}
 .header-end{font-size:8px;letter-spacing:.04em;gap:7px}
}
