/* Gamze & Samed V2: blush floral stationery, clear type and continuous motion. */
@font-face{font-family:Allura;src:url('assets/allura.woff2') format('woff2');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:Cormorant;src:url('assets/cormorant.woff2') format('woff2');font-style:normal;font-weight:300 700;font-display:swap}
@font-face{font-family:Cormorant;src:url('assets/cormorant-italic.woff2') format('woff2');font-style:italic;font-weight:300 700;font-display:swap}
:root{--ink:#513d39;--rose:#7c4d5a;--paper:#f2e8de;--sage:#707765;--ease:cubic-bezier(.19,1,.22,1);--envelope-scale:.39}
body{font-family:Cormorant,Georgia,serif;font-weight:500}
.script,.family-names{font-family:Allura,cursive}
.quote{font-family:Cormorant,Georgia,serif;font-weight:500;font-size:37px;line-height:1.3}
.ambient{background:linear-gradient(135deg,#f4e5dfbd,#e7dfd1b8),url('assets/stationery.png') center/cover;filter:blur(24px)}
.book{z-index:4;scroll-behavior:auto}
.canvas:before{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(145deg,#f7d9da14,transparent 50%,#d7bfcc0c);z-index:0}
.card{z-index:1}
.couple{margin-top:22px;margin-bottom:20px}
.couple .script{font-size:170px;line-height:.98;color:var(--rose);padding:0 30px}
.couple .amp{font-family:Cormorant,serif;font-weight:400;font-size:56px;line-height:.85;margin:6px 0 4px;color:var(--sage)}
.cover-card .eyebrow{font-size:30px;letter-spacing:3.5px;margin-top:27px}
.cover-card .date{font-size:64px;line-height:1.2;margin-top:25px}
.cover-card .small-caps{font-size:28px;letter-spacing:5px;margin-top:7px}
.cover-card .time{font-size:46px;margin-top:7px}
.cover-card .venue-line{font-size:39px;margin-top:12px}
.heart{color:#956574}
.fine-rule{width:210px;background:linear-gradient(90deg,transparent,#9a7d737a,transparent)}
.section-title{color:var(--rose)}
.calendar-card .section-title{font-size:113px;line-height:1.1;margin-bottom:6px}
.calendar-card .month{font-size:60px;line-height:1.2}
.month span{font-size:42px;color:var(--sage)}
.calendar span{font-size:39px;font-weight:500}
.calendar .weekday{font-size:27px;color:var(--sage);font-weight:600}
.calendar .event-day{color:var(--rose)}
.calendar .event-day>span{font-weight:600}
.calendar-card .calendar-note{font-size:40px;margin-top:19px}
.calendar-card .time{font-size:42px;margin-top:5px}
.action{font-family:Cormorant,Georgia,serif;font-size:35px;font-weight:600;letter-spacing:2px;min-height:114px;border-radius:5px;background:#80535f;color:#fff8ed;border-color:#80535f;box-shadow:0 8px 24px #7c4d5a15;position:relative;overflow:hidden}
.action:after{content:'';position:absolute;top:-60%;bottom:-60%;left:-70%;width:45%;background:linear-gradient(90deg,transparent,#fff4e92b,transparent);transform:skewX(-20deg);transition:left 1s var(--ease);pointer-events:none}
.action:hover:after,.action:focus-visible:after{left:130%}
.action:hover{background:#704551}
.calendar-card .action{margin-top:25px}
.family-title{font-size:142px;line-height:1.02;color:var(--rose);margin-top:25px}
.families-card>.eyebrow{font-size:29px;letter-spacing:3px;margin-top:25px;color:var(--sage)}
.families{margin-top:45px;gap:14px}
.family-names{font-size:63px;line-height:1.35}
.surname{font-size:44px;color:var(--rose);letter-spacing:1px}
.phone{font-family:Cormorant,Georgia,serif;font-size:34px;font-weight:600;gap:8px;min-height:115px}
.phone svg{width:29px;height:29px;color:var(--sage)}
.family-signature{font-size:103px;color:var(--rose);line-height:1.3;margin-top:25px}
.venue-card .eyebrow{font-size:30px;letter-spacing:3px;color:var(--sage)}
.venue-heading{font-size:104px;font-weight:500;line-height:1.05;color:var(--rose);margin-top:26px}
.city{font-size:34px;color:var(--sage);letter-spacing:9px;margin-top:24px}
.venue-date{font-size:53px;margin-top:25px}
.venue-card .small-caps{font-size:28px;letter-spacing:4px}
.venue-card .time{font-size:49px;margin-top:9px}
.venue-card .action{margin-top:29px}
.text-action{font-size:34px;padding:14px 8px 8px;margin-top:8px;min-height:80px;letter-spacing:1px}
.countdown-card .section-title{font-size:132px;line-height:1.1;margin-top:29px}
.countdown-card .eyebrow{font-size:29px;letter-spacing:3px;color:var(--sage);margin-top:23px}
.countdown{margin-top:30px;margin-bottom:32px}
.countdown b{font-family:Cormorant,serif;font-size:80px;font-weight:500;color:var(--rose);line-height:1.1}
.countdown span{font-size:27px;letter-spacing:1.5px;color:var(--sage)}
.closing-names{font-size:150px;line-height:.98;color:var(--rose);margin-top:29px}
.closing-names span{font-family:Cormorant,serif;font-size:73px;color:var(--sage)}
.countdown-card>.quote{font-size:35px;margin-top:26px}
.closing-date{font-size:28px;letter-spacing:2px;color:var(--sage);margin-top:17px}

/* The two front panels share one unaltered image; the wax seal is a separate asset. */
.envelope{background:transparent;isolation:isolate;transition:opacity .7s var(--ease),visibility .7s;overflow:hidden}
.envelope-matte{position:absolute;inset:0;background:linear-gradient(135deg,#f3e7dfd9,#eaddd9c9),url('assets/stationery.png') center/cover;transition:opacity 1.2s var(--ease) .3s}
.envelope-stage{position:absolute;left:50%;top:50%;width:1000px;height:1778px;transform:translate(-50%,-50%) scale(var(--envelope-scale));transform-origin:center;perspective:2200px;perspective-origin:50% 48%;filter:drop-shadow(0 12px 45px #664c3c22)}
.gate{position:absolute;top:0;bottom:0;width:50%;background-image:url('assets/envelope-floral-v2.png');background-size:200% 100%;background-repeat:no-repeat;backface-visibility:hidden;-webkit-backface-visibility:hidden;transform-style:preserve-3d;transition:transform 1.95s cubic-bezier(.22,.68,.15,1) .3s,filter 1.7s ease .3s;will-change:transform;z-index:1}
.gate-left{left:0;background-position:left center;transform-origin:left center;box-shadow:inset -1px 0 1px #9d7c6526}
.gate-right{right:0;background-position:right center;transform-origin:right center;box-shadow:inset 1px 0 1px #fff6e8a6;transition-delay:.37s}
.envelope-copy{position:absolute;left:17%;right:17%;top:19.5%;z-index:3;text-align:center;color:var(--rose);transition:opacity .42s ease,transform .8s var(--ease);pointer-events:none}
.opening-eyebrow{font-family:Cormorant,serif;font-weight:600;font-size:31px;letter-spacing:5px;color:#6b6860;line-height:1.4}
.opening-names{font-family:Allura,cursive;font-size:166px;line-height:1.02;display:flex;align-items:center;flex-direction:column;margin-top:22px;font-weight:400}
.opening-names em{font-family:Cormorant,serif;font-size:58px;line-height:.8;font-weight:400;color:#9b7481;margin:4px 0 6px}
.seal-wrap{position:absolute;left:50%;top:54%;width:228px;height:228px;transform:translate(-50%,-50%);z-index:5;filter:drop-shadow(0 9px 10px #74505435);pointer-events:none;will-change:transform,opacity}
.wax-seal{display:block;width:100%;height:100%;object-fit:contain;animation:seal-breathe 5s ease-in-out infinite}
.envelope-instructions{position:absolute;left:20%;right:20%;top:66%;z-index:4;text-align:center;color:var(--ink);transition:opacity .4s ease,transform .7s var(--ease)}
.opening-date{font-size:48px;font-weight:500;line-height:1.1}
.opening-city{font-size:28px;letter-spacing:8px;line-height:1.4;color:var(--sage);margin-top:11px}
.open-envelope{position:relative;inset:auto;display:flex;flex-direction:row;align-items:center;justify-content:center;gap:34px;border:1px solid #9c748184;border-radius:5px;width:100%;height:122px;padding:14px 20px;margin-top:30px;background:#fff6e5a1;box-shadow:0 7px 24px #89596110;color:#694350;font-family:Cormorant,serif;font-size:44px;font-weight:600;letter-spacing:1px;transition:background .4s,box-shadow .4s,transform .4s}
.open-envelope svg{width:46px;height:46px;stroke-width:1.25;transition:transform .5s var(--ease)}
.open-envelope:hover{background:#fff7ec;box-shadow:0 10px 35px #8959611c}
.open-envelope:hover svg{transform:translateX(8px)}
.open-envelope:focus-visible{outline:3px solid var(--rose);outline-offset:8px}
.opening-hint{font-family:Cormorant,serif;font-size:32px;font-style:italic;line-height:1.3;margin-top:25px;color:#79645f}
.envelope.opening .envelope-matte{opacity:0}
.envelope.opening .envelope-copy{opacity:0;transform:translateY(-12px)}
.envelope.opening .envelope-instructions{opacity:0;transform:translateY(14px);pointer-events:none}
.envelope.opening .gate-left{transform:rotateY(-106deg);filter:brightness(.92)}
.envelope.opening .gate-right{transform:rotateY(106deg);filter:brightness(.95)}
.envelope.opening .seal-wrap{animation:unseal .95s cubic-bezier(.22,.68,.15,1) both}
.envelope.opening .wax-seal{animation:none}
.envelope.resetting *{animation:none!important;transition:none!important}
.envelope.is-gone{opacity:0;visibility:hidden;pointer-events:none}
@keyframes seal-breathe{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-3px) rotate(1deg)}}
@keyframes unseal{0%{opacity:1;transform:translate(-50%,-50%) scale(1) rotate(0)}32%{opacity:1;transform:translate(-50%,-67%) scale(1.12) rotate(-9deg)}100%{opacity:0;transform:translate(-50%,8%) scale(.89) rotate(13deg)}}

.js .reveal{transform:translateY(22px);transition:opacity 1.4s var(--ease),transform 1.65s var(--ease);transition-delay:var(--delay,0s)}
.js .write{transform:translateY(10px);transition:clip-path 1.7s var(--ease),-webkit-clip-path 1.7s var(--ease),opacity 1.05s ease,transform 1.8s var(--ease);transition-delay:var(--delay,0s)}
.js .is-visible .write{transform:none}
.js .book{transition:opacity 1.1s ease}
.next-page{font-size:12px;letter-spacing:.12em;line-height:1.3;min-height:52px;font-weight:600;color:#6a4d51;transition:opacity 1.1s 1.8s}
.next-page svg{animation:bob 3.4s ease-in-out infinite}
.toolbar{gap:19px;background:linear-gradient(transparent,#f2e8def0 55%)}
.toolbar button{font-size:13px;font-weight:600;min-height:44px;color:#674c50}
.page-count{font-size:12px;color:#776d60;font-weight:500;margin-right:7px}
.page-nav{right:5px}
.page-nav button{width:38px;height:44px}
.page-nav button:before{width:5px;height:5px;background:#90796980}
.page-nav button[aria-current=page]:before{background:#9b6877;transform:scale(1.7)}
dialog{background:#f6ece3;border-color:#bb939057}
dialog h2{font-family:Allura,cursive;font-size:43px;line-height:1.1;color:var(--rose)}
dialog p{font-size:16px;line-height:1.5}
.dialog-links a{font-size:17px;font-weight:600}
.petals{position:fixed;inset:0;pointer-events:none;z-index:2;overflow:hidden}
.petals i{position:absolute;top:-10%;width:13px;height:20px;border-radius:80% 0 80% 10%;background:linear-gradient(120deg,#d7afb0aa,#f3ddd888);box-shadow:inset 1px 1px 3px #fff6;opacity:0;animation:petal-drift 24s linear infinite}
.petals i:nth-child(1){left:3%;animation-delay:-4s}.petals i:nth-child(2){left:9%;animation-delay:-13s;animation-duration:29s;width:10px;height:15px}.petals i:nth-child(3){left:14%;animation-delay:-22s;animation-duration:32s}.petals i:nth-child(4){right:3%;animation-delay:-18s;animation-duration:27s}.petals i:nth-child(5){right:9%;animation-delay:-8s;width:9px;height:14px}.petals i:nth-child(6){right:15%;animation-delay:-25s;animation-duration:34s}
@keyframes petal-drift{0%{opacity:0;transform:translate3d(0,-5vh,0) rotate(10deg)}8%{opacity:.45}50%{transform:translate3d(22px,52vh,0) rotate(190deg);opacity:.35}92%{opacity:.3}100%{opacity:0;transform:translate3d(-8px,112vh,0) rotate(355deg)}}
@media(min-width:700px){.page-nav{right:calc(50% - 286px)}.toolbar button{font-size:14px}.page-count,.next-page{font-size:12px}}
@media(max-height:680px){.next-page{font-size:10px;min-height:42px;bottom:42px}.toolbar button{font-size:12px;min-height:36px}.page-count{font-size:11px}}
@media(prefers-reduced-motion:reduce){.petals{display:none}.gate,.envelope-copy,.envelope-instructions,.envelope-matte{transition:none!important}.wax-seal{animation:none!important}.js .write{transform:none}.envelope.opening .seal-wrap{animation:none!important;opacity:0}}
.open-envelope{height:140px}.envelope-stage{cursor:pointer}
.envelope-stage{filter:none}.gate{box-shadow:0 10px 30px #664c3c1c}
.families{grid-template-columns:minmax(0,1fr) minmax(0,1fr);margin-top:38px}.family{min-width:0}.family-names{font-size:52px}.family-signature{font-size:90px;white-space:nowrap;line-height:1.25;margin-top:18px}
.countdown-card .section-title{font-size:118px}
/* Render live opening typography at its final size, independently of the 3D paper. */
.envelope-stage{width:calc(1000px * var(--envelope-scale));height:calc(1778px * var(--envelope-scale));transform:translate(-50%,-50%);perspective:calc(2200px * var(--envelope-scale))}
.gate{transition-duration:2.35s;transition-timing-function:cubic-bezier(.42,0,.2,1);box-shadow:0 5px 15px #664c3c1c}
.opening-eyebrow{font-size:max(12px,calc(35px * var(--envelope-scale)));letter-spacing:calc(4px * var(--envelope-scale));color:#685652}
.opening-names{font-size:calc(166px * var(--envelope-scale));margin-top:calc(22px * var(--envelope-scale))}
.opening-names em{font-size:calc(58px * var(--envelope-scale));margin:calc(4px * var(--envelope-scale)) 0 calc(6px * var(--envelope-scale))}
.seal-wrap{width:calc(228px * var(--envelope-scale));height:calc(228px * var(--envelope-scale));filter:drop-shadow(0 4px 5px #74505435)}
.opening-date{font-size:calc(48px * var(--envelope-scale))}
.opening-city{font-size:max(11px,calc(28px * var(--envelope-scale)));letter-spacing:calc(8px * var(--envelope-scale));margin-top:calc(11px * var(--envelope-scale))}
.open-envelope{height:max(44px,calc(140px * var(--envelope-scale)));font-size:max(15px,calc(44px * var(--envelope-scale)));gap:calc(34px * var(--envelope-scale));padding:calc(14px * var(--envelope-scale)) calc(20px * var(--envelope-scale));margin-top:calc(30px * var(--envelope-scale));border-radius:3px;letter-spacing:.3px;box-shadow:0 3px 12px #89596110}
.open-envelope svg{width:calc(46px * var(--envelope-scale));height:calc(46px * var(--envelope-scale))}
.opening-hint{font-size:max(12px,calc(32px * var(--envelope-scale)));margin-top:calc(25px * var(--envelope-scale))}
