/* Mobile-first invitation: the same intimate composition at every screen size. */
html{background:#041c20}body{max-width:500px;margin:0 auto;background:#f6f0e4;color:#394c48;box-shadow:0 0 100px #0008;position:relative;--soft:#69766b}.prototype{display:none}.nav{display:none}.hero{height:100svh;min-height:680px;max-height:980px}.hero-picture{object-position:center center;filter:none}.hero-shade{background:linear-gradient(180deg,#03283118,#03283111 52%,#082b3000 72%,#082b30 100%)}.hero-copy{top:24%;color:#fff4d9}.hero-copy .eyebrow{font-size:8px;letter-spacing:.19em;margin-bottom:22px;color:#f0d7a4}.hero-copy h1{font-size:98px}.hero-copy h1 i{font-size:30px;margin:9px}.hero-copy .hero-date{margin-top:24px;gap:13px}.hero-date b{font-size:8px}.hero-date>span:first-child{font-size:33px}.hero-line{font-size:16px;margin-top:21px}.scroll-cue{color:#f6ebd5;bottom:35px;font-size:8px}.side-label{display:none}.wrap{width:calc(100% - 52px)}.section{padding-block:65px}.story,.program,.details-section{display:flex;flex-direction:column;gap:42px}.story{position:relative;text-align:center}.story h2{font-size:47px;line-height:1.14}.story h2 em{color:#a8894d}.eyebrow{font-size:8px;letter-spacing:.18em;color:#9a7e43}.story-copy>p:not(.eyebrow):not(.signature){font-size:14px;line-height:1.95;max-width:330px;margin-inline:auto}.story .ornament{color:#b79b59;margin:0 0 17px;font-size:34px}.signature{margin-top:28px;color:#8b8b76}.signature span{font-size:38px;color:#9e7c40}.story-image{width:88%;max-width:340px;margin:auto;border-color:#b8a67977}.story-image img{height:auto;aspect-ratio:3/4;object-fit:cover}.story-image figcaption{font-size:7px;color:#8d773f;letter-spacing:.13em}.image-orbit{display:none}.count-section{background:#0c3539;color:#f6ecdb;padding:62px 0;overflow:hidden}.count-section .wrap{width:calc(100% - 32px)}.count-section .eyebrow{color:#d2b779}.count-section h2{font-size:37px}.count-section h2 em{color:#dcc28d}.countdown{gap:9px;margin:35px 0 24px}.countdown strong{font-size:45px;min-width:57px}.countdown span{font-size:8px;color:#d2c5a6}.countdown i{font-size:20px;color:#c9b888}.count-section #count-label{font-size:11px;color:#c7cdbb}.outline{font-size:11px;padding:13px 20px}.program-title{position:static;text-align:center;align-self:center}.program-title h2{font-size:46px}.program-title h2 em{color:#a8894d}.program-title p:not(.eyebrow){font-size:13px;margin-top:22px}.program-star{display:none}.timeline{width:100%}.timeline article{grid-template-columns:53px 15px 1fr;gap:9px;padding:20px 0 30px}.timeline:before{left:72px;background:linear-gradient(transparent,#a68d5666 10%,#a68d5666 90%,transparent)}.timeline time{font-size:19px;color:#94773a}.timeline .dot{background:#aa8c4f}.timeline h3{font-size:24px;margin-bottom:9px}.timeline p{font-size:12px;line-height:1.85}.panorama{height:590px}.panorama>img{object-position:43% center}.panorama>div:last-child{bottom:60px;color:#fff0d8}.panorama h2{font-size:48px}.panorama .eyebrow{font-size:8px;color:#e2c894}.panorama p:not(.eyebrow){font-size:12px}.panorama h2 em{color:#e8cc91}.venue-note{font-size:9px}.details-section{align-items:stretch;gap:38px}.dress{text-align:center}.dress h2{font-size:42px}.dress h2 em{color:#a8894d}.dress>p:not(.eyebrow){font-size:13px;margin-top:22px}.swatches{justify-content:center;gap:25px}.swatches>div{font-size:9px;color:#77765f}.swatches span{width:45px;height:45px}.dress .small{color:#918d79!important}.practical{border-top:1px solid #b9a77777;padding-top:30px}.practical .eyebrow{text-align:center}.practical details{border-color:#b5a77544}.practical summary{font-size:18px;line-height:1.5}.practical details p{font-size:12px}.rsvp-section{padding:40px 24px 65px;background:#0b3034;color:#f5ecd9}.rsvp-arch{padding:65px 20px 35px;max-width:400px}.rsvp-arch h2{font-size:48px}.rsvp-arch .eyebrow{font-size:7px;color:#ddc188}.rsvp-arch p:not(.eyebrow){color:#c5cabb;font-size:12px}.rsvp-arch .ornament{font-size:42px}.gold-button{font-size:11px;padding:16px 20px;gap:18px}footer{background:#0b3034;color:#d9ccb1;padding-bottom:115px}footer>.signature{font-size:41px}footer .small{max-width:280px;margin-inline:auto}.controls{left:50%;right:auto;transform:translateX(-50%);bottom:16px;width:min(360px,calc(100% - 28px));display:flex;justify-content:center;gap:7px;opacity:0;pointer-events:none;transition:opacity .3s}.entered .controls{opacity:1;pointer-events:auto}.controls button{font-size:9px;padding:9px 12px;min-height:44px;border-radius:24px;box-shadow:0 2px 15px #0002;white-space:nowrap}.controls .reply-thumb{background:#d7bf87;color:#133639;font-size:12px;padding-inline:24px;font-weight:600;border-color:#e5cda1}.controls #motion{font-size:8px;padding-inline:9px}#rsvp-dialog{width:min(470px,calc(100% - 28px));color:#f5ecd9}#rsvp-dialog .eyebrow{color:#d2b779}#rsvp-dialog form .form-note,#rsvp-dialog #confirmation p{color:#c5cabb}#rsvp-dialog h2{font-size:42px}.small{font-size:9px!important}
/* Four layers share one photograph: stationary architecture + two hinged leaves + courtyard. */
#entrance{width:min(500px,100%);max-width:500px;height:100svh;max-height:100svh;inset:0;margin:auto;background:#082b30;overflow:hidden;perspective:1200px}#entrance::backdrop{background:#041c20}.portal{position:absolute;inset:0;perspective:1200px;transform-style:preserve-3d;transition:transform 1.5s .9s cubic-bezier(.22,.6,.3,1),opacity .7s 1.9s}.portal-view{position:absolute;inset:0;background-position:center center;background-size:cover;background-repeat:no-repeat;transform:scale(1.07);filter:brightness(.75);transition:filter 1.4s,transform 2s}.door-leaf,.portal-frame{position:absolute;inset:0;background:url('porte.webp') center/100% 100% no-repeat;backface-visibility:hidden}.door-leaf{z-index:2;transition:transform 1.9s .2s cubic-bezier(.42,0,.18,1),filter 1.9s;will-change:transform}.leaf-left{clip-path:polygon(21% 90%,21% 27%,25% 20%,34% 13%,50.1% 5%,50.1% 90%);transform-origin:21% 55%}.leaf-right{clip-path:polygon(49.9% 5%,66% 13%,75% 20%,79% 27%,79% 90%,49.9% 90%);transform-origin:79% 55%}.portal-frame{z-index:3;clip-path:polygon(evenodd,0 0,100% 0,100% 100%,0 100%,0 0,21% 90%,79% 90%,79% 27%,75% 20%,66% 13%,50% 5%,34% 13%,25% 20%,21% 27%,21% 90%);pointer-events:none}.portal-light{position:absolute;z-index:4;left:49%;width:2%;top:8%;bottom:10%;background:#ffdd8c;filter:blur(8px);opacity:.25;pointer-events:none;transition:opacity .6s,transform 1s}.door-caption{position:absolute;z-index:5;top:23%;left:8%;right:8%;text-align:center;color:#f8e8c6;text-shadow:0 2px 12px #00191d;transition:opacity .25s,transform .5s}.door-caption>p{font-size:8px;letter-spacing:.2em;margin-bottom:17px}.door-caption h2{font:52px/1.3 QamarScript;color:#f8e8c6;letter-spacing:0}.door-caption h2 i{font-size:30px;font-style:normal}.door-caption>span{font-size:8px;letter-spacing:.21em}.door-enter{position:absolute;z-index:6;left:50%;top:61%;transform:translate(-50%,-50%);width:235px;padding:12px 16px;background:linear-gradient(135deg,#0b3037f2,#042126f2);border:1px solid #dbc38488;border-radius:60px;color:#efddb4;box-shadow:0 6px 30px #001c2199;display:flex;flex-direction:column;align-items:center;transition:opacity .3s,margin-top .4s;backdrop-filter:blur(3px)}.door-enter>span:not(.enter-ring){font:23px QamarScript}.door-enter small{font-size:6px;letter-spacing:.18em;margin-top:3px}.enter-ring{position:absolute;top:-32px;font:29px Qamar;color:#e3c983;animation:breathe 3s ease-in-out infinite;border-radius:50%;height:36px;width:36px;background:#0b3037;border:1px solid #d6bc74}.door-enter:hover{border-color:#f3dca0;background:#123d40}#skip-intro{position:absolute;z-index:6;bottom:25px;left:50%;transform:translateX(-50%);background:#06282ab3;border:0;color:#eedcba;font-size:10px;letter-spacing:.07em;padding:13px 18px;border-radius:30px;transition:opacity .25s}#entrance.opening .leaf-left{transform:rotateY(-105deg);filter:brightness(.4)}#entrance.opening .leaf-right{transform:rotateY(105deg);filter:brightness(.4)}#entrance.opening .door-caption{opacity:0;transform:translateY(-10px)}#entrance.opening .door-enter,#entrance.opening #skip-intro{opacity:0;pointer-events:none}#entrance.opening .portal-light{opacity:0;transform:scaleX(15)}#entrance.opening .portal-view{filter:brightness(1);transform:scale(1)}#entrance.opening .portal{transform:scale(1.18);opacity:0}#entrance.opening{background:transparent}.entered .hero-copy{animation:welcome 1.3s both}@keyframes welcome{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}body:not(.entered) .controls{display:none}[hidden]{display:none!important}
@media(min-width:700px){body{margin-block:25px}.hero{height:880px;min-height:0}#entrance{height:min(880px,100svh - 40px);border:1px solid #cdb57533}.hero-copy{top:25%}.door-caption h2{font-size:61px}.portal{overflow:hidden}}
@media(max-width:360px){.hero-copy h1{font-size:80px}.hero-copy .eyebrow{font-size:7px}.hero-copy{top:25%}.hero-line{font-size:14px}.wrap{width:calc(100% - 40px)}.story h2{font-size:43px}.countdown strong{font-size:39px;min-width:48px}.countdown{gap:7px}.count-section h2{font-size:33px}.dress h2{font-size:37px}.door-caption h2{font-size:44px}.controls .reply-thumb{padding-inline:17px}.rsvp-arch h2{font-size:42px}.rsvp-arch{padding-inline:15px}.gold-button{font-size:10px}.rsvp-arch .eyebrow{font-size:6px}}
@media(min-width:550px) and (max-height:700px){#entrance{width:min(500px,65svh)}}
@media(prefers-reduced-motion:reduce){.portal,.door-leaf,.portal-light,.portal-view,.door-caption,.door-enter{transition:none!important}.entered .hero-copy{animation:none!important}}

/* --- 3erassiya (14/09/2026) : éléments ajoutés à l'intégration dans le générateur --- */
.hero-date b{text-transform:uppercase}
.timeline{list-style:none;padding:0;margin:0}
.timeline li{display:grid;grid-template-columns:53px 15px 1fr;gap:9px;padding:20px 0 30px}
.dress-lines{font-size:12px;line-height:1.85;color:var(--soft);margin:26px auto 0;max-width:340px}
.dress-lines b{display:block;font-weight:400;letter-spacing:.12em;font-size:9px;margin-top:10px}
.venue-line{font-size:13px!important}
.gps-link{display:inline-block;margin-top:8px;font-size:10px;letter-spacing:.12em}
.practical .gps-link{margin-top:10px}
#rsvp-dialog #rsvpForm{max-width:none;text-align:left;font-family:Arial,sans-serif}
#rsvp-dialog #rsvpForm input[type=text],#rsvp-dialog #rsvpForm select{border-radius:0}
#rsvp-dialog #rsvpForm .radios label{min-width:0}
#rsvp-dialog #rsvpForm .submit{border-radius:0;font-family:inherit;letter-spacing:.05em}
#rsvp-dialog #rsvpForm .hint{opacity:.75}
html[lang=ar] #rsvp-dialog #rsvpForm{text-align:right}

.timeline li .t{grid-column:1;grid-row:1;font:19px Qamar,Georgia,serif;color:#94773a;padding-top:5px}
.timeline li::before{content:'';grid-column:2;grid-row:1;height:7px;width:7px;background:#aa8c4f;transform:rotate(45deg);margin:12px 0 0 6px;box-shadow:0 0 18px #dabd8160}
.timeline li .l{grid-column:3;grid-row:1;font:24px/1.25 Qamar,Georgia,serif}
.dress-lines b{color:#9a7e43}
.gps-link{color:#e8cc91;border-bottom:1px solid #e8cc9166}
.practical .gps-link{color:#9a7e43;border-color:#9a7e4366}
#rsvp-dialog #rsvpForm{color:var(--cream)}
#rsvp-dialog #rsvpForm label,#rsvp-dialog #rsvpForm .radios label{color:var(--cream)}
#rsvp-dialog #rsvpForm input[type=text],#rsvp-dialog #rsvpForm select{background:#06262b;color:var(--cream);border-color:#b69c6266}
#rsvp-dialog #rsvpForm .radios label{background:#06262b;border-color:#b69c6266}
#rsvp-dialog #rsvpForm .submit{background:var(--gold);color:#082b30}
#rsvp-dialog #rsvpForm .done .m{color:var(--gold)}
#rsvp-dialog #rsvpForm .msg{color:#f0b3a8}
