:root{
  --emerald:#062f25;
  --emerald-2:#0b4737;
  --emerald-3:#031d17;
  --gold:#d8b365;
  --gold-2:#f4df9c;
  --cream:#fff7df;
  --text:#fff4d4;
  --shadow:rgba(0,0,0,.42);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:
    radial-gradient(circle at 20% 10%, rgba(244,223,156,.12), transparent 25%),
    radial-gradient(circle at 80% 30%, rgba(216,179,101,.10), transparent 25%),
    linear-gradient(135deg, var(--emerald-3), var(--emerald), #01120e);
  color:var(--text);
  font-family:Montserrat, Arial, sans-serif;
  min-height:100vh;
}
.hidden{display:none!important}
.frame-gold{
  border:1.5px solid rgba(244,223,156,.85);
  box-shadow:0 18px 50px var(--shadow), inset 0 0 0 1px rgba(216,179,101,.25);
  position:relative;
}
.frame-gold::before{
  content:"";
  position:absolute;
  inset:8px;
  border:1px solid rgba(216,179,101,.35);
  pointer-events:none;
}

/* Envelope intro */
.intro{
  position:fixed; inset:0; z-index:99;
  display:grid; place-items:center;
  background:
    radial-gradient(circle at center, rgba(216,179,101,.18), transparent 32%),
    linear-gradient(145deg,#031d17,#0a4737 55%,#021510);
  overflow:hidden;
}
.sparkles::before,.sparkles::after{
  content:"✦ ✧ ✦ ✧ ✦";
  position:absolute;
  color:rgba(244,223,156,.42);
  font-size:34px;
  letter-spacing:34px;
  animation:float 5s infinite ease-in-out;
}
.sparkles::before{top:12%; left:6%}
.sparkles::after{bottom:12%; right:4%; animation-delay:1.4s}
@keyframes float{50%{transform:translateY(-20px)}}
.envelope-btn{border:0;background:transparent;cursor:pointer;display:grid;gap:34px;place-items:center;color:var(--gold-2)}
.envelope{
  width:min(420px,82vw); height:min(270px,52vw);
  position:relative; perspective:900px;
  filter:drop-shadow(0 30px 35px rgba(0,0,0,.45));
}
.env-back,.env-left,.env-right,.env-bottom,.env-flap,.env-card,.wax{position:absolute;display:block}
.env-back{inset:0;background:linear-gradient(135deg,#063529,#0c6049);border:2px solid var(--gold);border-radius:12px}
.env-card{
  left:8%; right:8%; bottom:18%; height:75%;
  background:linear-gradient(180deg,var(--cream),#e5d293);
  border:2px solid var(--gold);
  display:grid; place-items:center;
  color:#714e12; transform:translateY(38%);
  transition:transform .9s ease .35s; border-radius:8px;
}
.mini-title{font:48px "Great Vibes", cursive}
.mini-date{font:700 18px Cinzel, serif;letter-spacing:3px}
.env-left{left:0;bottom:0;border-top:135px solid transparent;border-bottom:135px solid transparent;border-left:210px solid #064434}
.env-right{right:0;bottom:0;border-top:135px solid transparent;border-bottom:135px solid transparent;border-right:210px solid #08382d}
.env-bottom{left:0;right:0;bottom:0;border-left:210px solid transparent;border-right:210px solid transparent;border-bottom:150px solid #0b5743}
.env-flap{
  left:0;right:0;top:0;
  transform-origin:top center;
  border-left:210px solid transparent;border-right:210px solid transparent;border-top:150px solid #0d6a51;
  transition:transform 1s ease;
  z-index:3;
}
.wax{
  left:50%; top:52%; transform:translate(-50%,-50%);
  width:76px;height:76px;border-radius:50%;
  background:radial-gradient(circle at 35% 28%,#fff0a8,#d8b365 45%,#8f6317);
  color:#173b2f;font:800 16px Cinzel,serif;display:grid;place-items:center;z-index:5;
  border:2px solid #fff0a8;
}
.tap-text{font:700 clamp(18px,3vw,26px) Cinzel,serif;text-transform:uppercase;letter-spacing:2px;text-align:center}
.envelope-btn.opened .env-flap{transform:rotateX(180deg)}
.envelope-btn.opened .env-card{transform:translateY(-46%)}
.envelope-btn.opened .wax{opacity:0;transition:.25s}
.fade-out{opacity:0;pointer-events:none;transition:opacity .7s ease}

/* Ticket */
.ticket{
  width:min(1180px,100%);
  margin:auto;
  padding:clamp(14px,2vw,26px);
}
.hero{
  min-height:560px;
  display:grid;
  grid-template-columns:1fr 1.12fr;
  gap:clamp(18px,3vw,44px);
  align-items:center;
  padding:clamp(22px,4vw,60px);
  border:1px solid rgba(216,179,101,.65);
  background:
    linear-gradient(120deg, rgba(3,29,23,.28), rgba(3,29,23,.96) 50%),
    radial-gradient(circle at 75% 10%, rgba(244,223,156,.16), transparent 25%);
  overflow:hidden;
}
.hero-photo{min-height:420px;border-radius:34px;overflow:hidden}
.hero-photo img{width:100%;height:100%;object-fit:cover;display:block}
.ribbon,.date{
  display:inline-block;
  background:linear-gradient(90deg,#b8892e,#f4df9c,#b8892e);
  color:#173b2f;
  padding:12px 20px;
  font:800 clamp(14px,2vw,20px) Cinzel,serif;
  letter-spacing:2px;
  border-radius:8px;
  box-shadow:0 12px 25px rgba(0,0,0,.25);
}
.hero h1{margin:22px 0 12px;line-height:.9;color:var(--gold-2);text-shadow:0 3px 0 rgba(0,0,0,.2)}
.hero h1 span{display:block;font:800 clamp(54px,9vw,116px) Cinzel,serif}
.hero h1 em{display:block;font:400 clamp(58px,9vw,120px) "Great Vibes",cursive;color:var(--gold)}
.hero h1 small{display:block;font:700 clamp(28px,4vw,52px) Cinzel,serif;color:var(--gold-2);margin:4px 0}
.subtitle{text-transform:uppercase;color:var(--gold);font:700 clamp(18px,2.5vw,30px) Cinzel,serif;letter-spacing:3px}
.corner{position:absolute;width:160px;height:160px;border-top:3px solid var(--gold);top:14px}
.corner-left{left:14px;border-left:3px solid var(--gold);border-radius:26px 0 0 0}
.corner-right{right:14px;border-right:3px solid var(--gold);border-radius:0 26px 0 0}

/* Slideshow */
.slideshow-wrap{margin-top:18px;position:relative}
.slideshow{height:430px;border-radius:28px;overflow:hidden;background:#041d17}
.slide{position:absolute;inset:0;opacity:0;transition:opacity .8s ease}
.slide.active{opacity:1}
.slide img{width:100%;height:100%;object-fit:cover;object-position:center;display:block}
.slide::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(0,0,0,.32))}
.slide-control{
  position:absolute;top:50%;transform:translateY(-50%);
  width:46px;height:46px;border-radius:50%;
  border:1px solid var(--gold);background:rgba(3,29,23,.72);color:var(--gold-2);
  font-size:34px;z-index:4;cursor:pointer
}
.prev{left:14px}.next{right:14px}
.dots{position:absolute;bottom:16px;left:0;right:0;display:flex;gap:10px;justify-content:center;z-index:5}
.dots button{width:11px;height:11px;border-radius:50%;border:1px solid var(--gold);background:transparent;cursor:pointer}
.dots button.active{background:var(--gold-2)}
.rings{
  position:absolute;left:50%;bottom:-42px;transform:translateX(-50%);
  width:92px;height:92px;border-radius:50%;
  display:grid;place-items:center;font:900 58px Cinzel,serif;
  color:var(--gold-2);background:radial-gradient(circle,#0b4737,#031d17);
  border:2px solid var(--gold);box-shadow:0 20px 45px rgba(0,0,0,.42);
  z-index:8;
}
.quote-card{margin:64px auto 18px;padding:30px;text-align:center;border-radius:20px;background:rgba(8,71,55,.85)}
.quote-card p{font:clamp(20px,3vw,32px) "Great Vibes",cursive;color:var(--gold-2);margin:0 0 10px}
.quote-card strong{font-family:Cinzel,serif;color:var(--gold)}
.quick-nav{
  position:sticky;top:0;z-index:20;
  display:grid;grid-template-columns:repeat(4,1fr);gap:10px;
  padding:10px;margin:18px 0;background:rgba(3,29,23,.82);backdrop-filter:blur(12px);
  border:1px solid rgba(216,179,101,.45);border-radius:18px
}
.quick-nav button,.quick-nav a{
  border:1px solid rgba(216,179,101,.55);background:rgba(11,71,55,.8);color:var(--gold-2);
  min-height:60px;border-radius:14px;text-decoration:none;display:grid;place-items:center;
  font:700 13px Cinzel,serif;cursor:pointer;text-align:center
}
.quick-nav span{display:block;margin-top:4px}
.grid{display:grid;grid-template-columns:1fr 1.45fr 1fr;gap:18px}
.details-row{display:grid;grid-template-columns:1fr 1.45fr;gap:18px;margin-top:18px}
.panel{
  background:linear-gradient(180deg,rgba(6,47,37,.96),rgba(3,29,23,.96));
  border-radius:22px;padding:clamp(22px,3vw,34px);overflow:hidden;
}
.panel h2{
  margin:0 0 18px;color:var(--gold-2);font:800 clamp(24px,3vw,36px) Cinzel,serif;letter-spacing:1px;text-transform:uppercase
}
.panel p{line-height:1.72;margin:0 0 16px}
.program-item{display:grid;grid-template-columns:92px 1fr;gap:12px;margin:22px 0}
.program-item span{font:800 25px Cinzel,serif;color:var(--gold)}
.program-item p{margin:0}
.typed{min-height:520px;font-size:15px}
.typed::after{content:"|";color:var(--gold);animation:blink .75s infinite}
@keyframes blink{50%{opacity:0}}
.small-btn,.gold-link,.submit-btn{
  border:1px solid var(--gold);background:linear-gradient(90deg,#f4df9c,#c79539);
  color:#173b2f;border-radius:12px;padding:12px 16px;text-decoration:none;
  display:inline-flex;justify-content:center;align-items:center;font-weight:800;cursor:pointer
}
.gold-link{margin:6px 8px 6px 0}
.gift-number{margin:20px 0;padding:16px;border:1px dashed var(--gold);border-radius:14px;color:var(--gold-2);font-size:20px}
.rsvp{margin-top:18px;padding:clamp(22px,3vw,38px);border-radius:24px;display:grid;grid-template-columns:.9fr 1.6fr .8fr;gap:22px;background:linear-gradient(120deg,rgba(6,47,37,.98),rgba(3,29,23,.98))}
.rsvp h2{font:800 clamp(38px,6vw,68px) Cinzel,serif;color:var(--gold-2);margin:0}
.choice-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.choice{
  min-height:58px;border:1px solid var(--gold);border-radius:14px;background:rgba(6,47,37,.95);color:var(--gold-2);
  font:700 16px Montserrat,sans-serif;cursor:pointer
}
.choice.selected{background:linear-gradient(90deg,#f4df9c,#c79539);color:#173b2f;box-shadow:0 0 0 3px rgba(244,223,156,.22)}
.field{display:grid;gap:8px;margin-top:14px;color:var(--gold-2);font-weight:700}
input,textarea{
  width:100%;border:1px solid rgba(216,179,101,.6);background:rgba(0,0,0,.18);
  color:var(--cream);border-radius:12px;padding:13px 14px;font:inherit;outline:none
}
input:focus,textarea:focus{border-color:var(--gold-2);box-shadow:0 0 0 3px rgba(216,179,101,.18)}
.guest-field{display:none}
.submit-btn{width:100%;margin-top:16px;font-size:15px}
.counter-box{
  display:grid;place-items:center;text-align:center;border:1px solid rgba(216,179,101,.55);border-radius:18px;padding:16px;background:rgba(0,0,0,.15)
}
.counter-box span{font:700 15px Cinzel,serif;color:var(--gold)}
.counter-box strong{font:900 62px Cinzel,serif;color:var(--gold-2)}
.counter-box small{line-height:1.5;color:rgba(255,244,212,.75)}
.footer{
  margin:18px 0 0;padding:26px;border-radius:22px;display:grid;grid-template-columns:repeat(3,1fr);gap:14px;text-align:center;
  background:rgba(3,29,23,.95);color:var(--gold-2);font:800 18px Cinzel,serif
}
.highlight{animation:pulse 1.6s ease}
@keyframes pulse{50%{box-shadow:0 0 0 8px rgba(244,223,156,.25),0 18px 50px rgba(0,0,0,.42)}}

@media (max-width:920px){
  .hero{grid-template-columns:1fr;min-height:auto}
  .hero-photo{min-height:360px}
  .grid,.rsvp,.details-row{grid-template-columns:1fr}
  .typed{min-height:420px}
}
@media (max-width:620px){
  .ticket{padding:10px}
  .hero{padding:22px;border-radius:0}
  .hero-photo{min-height:310px;border-radius:22px}
  .hero h1 span{font-size:52px}
  .hero h1 em{font-size:58px}
  .ribbon,.date{font-size:12px;padding:10px 12px}
  .slideshow{height:310px;border-radius:18px}
  .quick-nav{grid-template-columns:repeat(2,1fr);position:static}
  .choice-row{grid-template-columns:1fr}
  .footer{grid-template-columns:1fr;font-size:15px}
  .program-item{grid-template-columns:1fr}
  .typed{font-size:14px;min-height:520px}
  .counter-box strong{font-size:46px}
}


/* Modifications demandées : images complètes + icônes représentatives */
.slideshow{
  background:
    radial-gradient(circle at 50% 50%, rgba(244,223,156,.12), transparent 35%),
    linear-gradient(135deg, #021510, #0b4737, #021510);
}
.slide{
  display:grid;
  place-items:center;
  padding:10px;
}
.slide img{
  width:100%;
  height:100%;
  object-fit:contain !important;
  object-position:center center;
  border-radius:18px;
  background:rgba(3,29,23,.55);
  box-shadow:0 10px 35px rgba(0,0,0,.32);
}
.hero-photo img{
  object-position:center center;
}
.nav-ico{
  display:block;
  font-size:26px;
  line-height:1;
  margin-bottom:3px;
  filter:drop-shadow(0 3px 5px rgba(0,0,0,.3));
}
.title-ico{
  display:inline-grid;
  place-items:center;
  width:42px;
  height:42px;
  margin-right:10px;
  border:1px solid rgba(244,223,156,.65);
  border-radius:50%;
  background:rgba(244,223,156,.09);
  font-size:22px;
  vertical-align:middle;
}
.program-item span{
  display:flex;
  align-items:center;
  gap:8px;
}
.program-item span i{
  width:42px;
  height:42px;
  border:1px solid rgba(244,223,156,.65);
  border-radius:50%;
  display:grid;
  place-items:center;
  font-style:normal;
  font-size:21px;
  background:rgba(244,223,156,.08);
  flex:none;
}
.choice{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
}
.choice-ico{
  font-size:20px;
}
.gold-link::before{
  content:"↗";
  display:inline-grid;
  place-items:center;
  margin-right:8px;
  width:22px;
  height:22px;
  border-radius:50%;
  background:rgba(6,47,37,.25);
}
.gift-number::before{content:""}
.counter-box::before{
  content:"👥";
  font-size:34px;
  margin-bottom:6px;
}
.submit-btn::before{
  content:"💬";
  margin-right:8px;
}
@media (max-width:620px){
  .slide{padding:6px}
  .slide img{border-radius:14px}
  .title-ico{width:34px;height:34px;font-size:18px}
  .program-item span i{width:36px;height:36px}
}


/* Dernières modifications demandées */
body{
  background:
    radial-gradient(circle at 18% 8%, rgba(244,223,156,.10), transparent 24%),
    radial-gradient(circle at 88% 28%, rgba(216,179,101,.08), transparent 28%),
    linear-gradient(135deg, #021510, #04271f 38%, #0a3a30 70%, #02120f) !important;
}
.ticket{
  background:rgba(0,0,0,.035);
}
.hero,
.panel,
.rsvp,
.footer,
.quote-card{
  background-color:rgba(3,29,23,.94) !important;
}
.slideshow{
  height:420px;
  background:
    radial-gradient(circle at 50% 50%, rgba(244,223,156,.08), transparent 35%),
    linear-gradient(135deg, #031611, #082b24, #031611) !important;
}
.slide{
  padding:22px !important;
}
.slide img{
  width:100%;
  height:100%;
  max-width:100%;
  max-height:100%;
  object-fit:contain !important;
  object-position:center center !important;
  border-radius:18px;
}
.program-item{
  grid-template-columns:minmax(112px, 135px) minmax(0,1fr) !important;
  column-gap:24px !important;
  align-items:flex-start;
}
.program-item span{
  white-space:nowrap;
  line-height:1.25;
}
.program-item p{
  min-width:0;
  overflow-wrap:break-word;
  padding-top:4px;
}
.dote-ico{
  background:radial-gradient(circle at 35% 30%, #fff7cf, #d8b365 48%, #7b5518) !important;
  color:#173b2f;
}
.dote-panel .gold-link::before{
  content:"☎";
}
.gift-number{
  display:none !important;
}
.story-panel .typed{
  min-height:300px !important;
}
.story-status{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:14px;
  margin:0 0 18px;
  color:var(--gold-2);
  font:700 15px Cinzel,serif;
}
.story-nav{
  width:42px;
  height:42px;
  border-radius:50%;
  border:1px solid var(--gold);
  background:rgba(244,223,156,.08);
  color:var(--gold-2);
  font-size:28px;
  cursor:pointer;
}
.color-bubbles{
  display:flex;
  flex-wrap:wrap;
  gap:16px;
  margin-top:18px;
}
.color-bubbles span{
  display:flex;
  align-items:center;
  gap:8px;
  color:var(--gold-2);
  font-weight:700;
}
.bubble{
  display:inline-block;
  width:30px;
  height:30px;
  border-radius:50%;
  border:2px solid rgba(244,223,156,.85);
  box-shadow:0 8px 20px rgba(0,0,0,.25), inset 0 0 0 2px rgba(255,255,255,.18);
}
.bubble.green{background:#0b4737}
.bubble.white{background:#fffdf2}
.bubble.gold{background:linear-gradient(135deg,#fff0a7,#d8b365,#9b6a1e)}

.petals{
  position:fixed;
  inset:0;
  z-index:3;
  pointer-events:none;
  overflow:hidden;
}
.petals span{
  position:absolute;
  top:-8vh;
  color:rgba(244,223,156,.75);
  text-shadow:0 2px 5px rgba(0,0,0,.35);
  animation-name:petalFall;
  animation-timing-function:linear;
  animation-iteration-count:infinite;
}
@keyframes petalFall{
  0%{transform:translate3d(0,-10vh,0) rotate(0deg)}
  50%{transform:translate3d(32px,52vh,0) rotate(180deg)}
  100%{transform:translate3d(-18px,112vh,0) rotate(360deg)}
}
.intro,.ticket{
  position:relative;
  z-index:5;
}
@media (max-width:920px){
  .program-item{
    grid-template-columns:minmax(104px, 125px) minmax(0,1fr) !important;
    column-gap:18px !important;
  }
}
@media (max-width:620px){
  .slideshow{height:330px}
  .slide{padding:12px !important}
  .program-item{
    grid-template-columns:1fr !important;
    gap:8px !important;
  }
  .story-panel .typed{min-height:430px !important}
  .color-bubbles{gap:12px}
}


/* Modifications finales : histoire au-dessus, enveloppe centrée, alerte délai */
.intro{
  place-items:center !important;
}
.envelope-btn{
  margin:auto !important;
  transform:translateX(0) !important;
}
.story-top{
  margin:18px 0;
}
.story-top .story-panel{
  max-width:100%;
}
.two-columns{
  grid-template-columns:1fr 1fr !important;
}
.program-date{
  display:inline-block;
  margin-top:8px;
  color:var(--gold-2);
  font-family:Cinzel, serif;
  font-size:15px;
  letter-spacing:.5px;
}
.deadline-alert{
  margin:18px 0 0;
  padding:clamp(20px,3vw,32px);
  border-radius:24px;
  display:flex;
  align-items:center;
  gap:18px;
  background:linear-gradient(120deg, rgba(68,21,15,.82), rgba(3,29,23,.96));
}
.deadline-alert .deadline-icon{
  width:72px;
  height:72px;
  border-radius:50%;
  border:1px solid var(--gold);
  display:grid;
  place-items:center;
  font-size:34px;
  background:rgba(244,223,156,.12);
  flex:none;
}
.deadline-alert h2{
  margin:0 0 8px;
  color:var(--gold-2);
  font:800 clamp(22px,3vw,32px) Cinzel,serif;
  text-transform:uppercase;
}
.deadline-alert p{
  margin:0;
  line-height:1.6;
}
.deadline-alert strong{
  color:#fff0a7;
  font-size:1.12em;
}
@media (max-width:920px){
  .two-columns{
    grid-template-columns:1fr !important;
  }
}
@media (max-width:620px){
  .deadline-alert{
    align-items:flex-start;
  }
  .deadline-alert .deadline-icon{
    width:56px;
    height:56px;
    font-size:26px;
  }
}


/* Notifications, confirmation absence et compte à rebours */
.app-toast{
  position:fixed;
  left:50%;
  top:18px;
  transform:translate(-50%, -120%);
  z-index:9999;
  max-width:min(560px, calc(100vw - 24px));
  padding:15px 18px;
  border-radius:16px;
  border:1px solid rgba(244,223,156,.75);
  background:rgba(3,29,23,.96);
  color:var(--cream);
  font-weight:800;
  line-height:1.45;
  text-align:center;
  box-shadow:0 18px 50px rgba(0,0,0,.45);
  opacity:0;
  transition:.35s ease;
}
.app-toast.show{
  opacity:1;
  transform:translate(-50%, 0);
}
.app-toast.success{border-color:#a7ffc8;color:#d9ffe6}
.app-toast.warning{border-color:#fff0a7;color:#fff0a7}
.app-toast.error{border-color:#ffc4c4;color:#ffd1d1}

.confirm-modal{
  position:fixed;
  inset:0;
  z-index:9998;
  display:none;
  place-items:center;
  padding:18px;
  background:rgba(0,0,0,.62);
  backdrop-filter:blur(6px);
}
.confirm-modal.show{display:grid}
.confirm-box{
  width:min(520px,100%);
  border-radius:24px;
  padding:clamp(22px,4vw,34px);
  background:linear-gradient(135deg,rgba(3,29,23,.98),rgba(8,55,44,.98));
  text-align:center;
}
.confirm-box h2{
  margin:0 0 12px;
  color:var(--gold-2);
  font:800 clamp(22px,4vw,34px) Cinzel,serif;
}
.confirm-box p{
  margin:0 0 22px;
  line-height:1.7;
}
.confirm-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}
.confirm-actions button{
  border:1px solid var(--gold);
  border-radius:14px;
  padding:13px 14px;
  cursor:pointer;
  font-weight:800;
}
#cancelAbsent{
  background:linear-gradient(90deg,#f4df9c,#c79539);
  color:#173b2f;
}
#confirmAbsent{
  background:rgba(255,110,110,.12);
  color:#ffd1d1;
  border-color:#ffb0b0;
}

.countdown{
  display:grid;
  grid-template-columns:repeat(4, minmax(72px,1fr));
  gap:10px;
  margin-top:16px;
}
.countdown div{
  border:1px solid rgba(244,223,156,.48);
  border-radius:16px;
  padding:12px 8px;
  text-align:center;
  background:rgba(0,0,0,.16);
}
.countdown strong{
  display:block;
  color:var(--gold-2);
  font:800 clamp(24px,4vw,38px) Cinzel,serif;
}
.countdown span{
  display:block;
  margin-top:4px;
  color:rgba(255,247,223,.82);
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.8px;
}
@media (max-width:620px){
  .confirm-actions{grid-template-columns:1fr}
  .countdown{grid-template-columns:repeat(2,1fr)}
  .app-toast{top:10px}
}


/* Sécurité UX + compte à rebours circulaire fixe */
.countdown{
  display:grid !important;
  place-items:center;
}
.countdown-circle{
  width:clamp(156px, 24vw, 220px);
  height:clamp(156px, 24vw, 220px);
  border-radius:50%;
  margin-top:18px;
  border:2px solid rgba(244,223,156,.9);
  background:
    radial-gradient(circle at center, rgba(244,223,156,.14), rgba(3,29,23,.98) 62%),
    conic-gradient(from 0deg, rgba(244,223,156,.9), rgba(216,179,101,.25), rgba(244,223,156,.9));
  box-shadow:0 18px 45px rgba(0,0,0,.38), inset 0 0 0 8px rgba(3,29,23,.82);
  text-align:center;
  padding:18px;
}
.countdown-circle .countdown-label{
  color:rgba(255,247,223,.78);
  font:700 12px Montserrat, sans-serif;
  text-transform:uppercase;
  letter-spacing:1.2px;
}
.countdown-circle strong{
  display:block;
  margin:8px 0 3px;
  color:var(--gold-2);
  font:800 clamp(22px, 4vw, 34px) Cinzel, serif;
  letter-spacing:1px;
}
.countdown-circle small{
  color:rgba(255,247,223,.72);
  font-size:11px;
  letter-spacing:1px;
}
.countdown-fixed{
  position:fixed;
  right:18px;
  bottom:18px;
  z-index:90;
  width:116px;
  height:116px;
  border-radius:50%;
  display:grid;
  place-items:center;
  text-align:center;
  padding:12px;
  border:2px solid rgba(244,223,156,.88);
  background:radial-gradient(circle at center, rgba(244,223,156,.14), rgba(3,29,23,.96) 65%);
  box-shadow:0 14px 42px rgba(0,0,0,.46), inset 0 0 0 5px rgba(216,179,101,.11);
}
.countdown-fixed span{
  color:rgba(255,247,223,.72);
  font-size:10px;
  font-weight:800;
  text-transform:uppercase;
}
.countdown-fixed strong{
  color:var(--gold-2);
  font:800 16px Cinzel,serif;
  letter-spacing:.5px;
}
@media (max-width:620px){
  .countdown-fixed{
    width:92px;
    height:92px;
    right:10px;
    bottom:10px;
  }
  .countdown-fixed span{font-size:8px}
  .countdown-fixed strong{font-size:13px}
}


/* Corrections demandées : aucun pop-up général, seulement question pour l'absence */
.confirm-modal{
  display:none !important;
}
.absent-question{
  position:fixed;
  inset:auto 12px 150px auto;
  z-index:9998;
  display:none;
  width:min(380px, calc(100vw - 24px));
}
.absent-question.show{
  display:block;
}
.absent-question-box{
  background:linear-gradient(135deg, rgba(3,29,23,.98), rgba(8,55,44,.98));
  border:1px solid rgba(244,223,156,.85);
  border-radius:18px;
  box-shadow:0 18px 50px rgba(0,0,0,.45);
  padding:18px;
  color:var(--cream);
  text-align:center;
}
.absent-question-box p{
  margin:0 0 14px;
  font-weight:800;
  line-height:1.5;
}
.absent-question-box div{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}
.absent-question-box button{
  border:1px solid var(--gold);
  border-radius:12px;
  padding:11px 12px;
  cursor:pointer;
  font-weight:900;
}
#absentNo{
  background:linear-gradient(90deg,#f4df9c,#c79539);
  color:#173b2f;
}
#absentYes{
  background:rgba(255,110,110,.14);
  color:#ffd1d1;
  border-color:#ffb0b0;
}

/* Compte à rebours uniquement en boule fixe, coin inférieur droit */
.countdown:not(.countdown-fixed){
  display:none !important;
}
.countdown-fixed{
  position:fixed !important;
  right:18px !important;
  bottom:18px !important;
  z-index:9990 !important;
  width:132px !important;
  height:132px !important;
  border-radius:50% !important;
  display:grid !important;
  place-items:center !important;
  text-align:center !important;
  padding:14px !important;
  border:2px solid rgba(244,223,156,.95) !important;
  background:
    radial-gradient(circle at 50% 50%, rgba(244,223,156,.18), rgba(3,29,23,.98) 66%),
    conic-gradient(from 0deg, rgba(244,223,156,.92), rgba(216,179,101,.2), rgba(244,223,156,.92)) !important;
  box-shadow:0 14px 44px rgba(0,0,0,.55), inset 0 0 0 6px rgba(3,29,23,.78) !important;
}
.countdown-fixed span{
  color:rgba(255,247,223,.76) !important;
  font-size:10px !important;
  font-weight:900 !important;
  text-transform:uppercase !important;
  letter-spacing:.8px !important;
}
.countdown-fixed strong{
  color:var(--gold-2) !important;
  font:900 18px Cinzel,serif !important;
  letter-spacing:.4px !important;
}
@media (max-width:620px){
  .absent-question{
    inset:auto 10px 112px 10px;
    width:auto;
  }
  .countdown-fixed{
    width:104px !important;
    height:104px !important;
    right:10px !important;
    bottom:10px !important;
  }
  .countdown-fixed span{font-size:8px !important}
  .countdown-fixed strong{font-size:14px !important}
}


/* Rubrique pagne du mariage */
.pagne-section{
  margin:18px 0;
  padding:clamp(20px,3vw,34px);
  border-radius:24px;
  display:grid;
  grid-template-columns:minmax(240px, .9fr) 1.35fr;
  gap:clamp(18px,3vw,34px);
  align-items:center;
  background:linear-gradient(120deg, rgba(3,29,23,.96), rgba(9,54,43,.94));
}
.pagne-image{
  border-radius:22px;
  overflow:hidden;
  border:1px solid rgba(244,223,156,.72);
  background:rgba(0,0,0,.15);
  box-shadow:0 14px 34px rgba(0,0,0,.34);
}
.pagne-image img{
  width:100%;
  height:auto;
  max-height:440px;
  object-fit:contain;
  display:block;
}
.pagne-text h2{
  margin:0 0 14px;
  color:var(--gold-2);
  font:800 clamp(24px,3vw,36px) Cinzel,serif;
  text-transform:uppercase;
}
.pagne-text p{
  line-height:1.8;
  margin:0 0 18px;
  color:rgba(255,247,223,.9);
}
.pagne-whatsapp{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:14px 18px;
  border-radius:14px;
  text-decoration:none;
  color:#173b2f;
  background:linear-gradient(90deg,#f4df9c,#d8b365,#c79539);
  font-weight:900;
  box-shadow:0 12px 28px rgba(0,0,0,.28);
}
.pagne-whatsapp::before{
  content:"💬";
}

/* Correction lisibilité du compte à rebours fixe */
.countdown-fixed{
  row-gap:3px !important;
  grid-template-rows:auto auto !important;
  line-height:1.05 !important;
}
.countdown-fixed span{
  display:block !important;
  margin:0 !important;
}
.countdown-fixed strong{
  display:block !important;
  white-space:nowrap !important;
  margin:0 !important;
}

/* États désactivés après délai ou après confirmation */
.choice.disabled,
.submit-btn:disabled{
  opacity:.55 !important;
  cursor:not-allowed !important;
  filter:grayscale(.3);
}

/* Diaporama enrichi : toutes les photos restent visibles sans déformation */
.slideshow{
  min-height:clamp(320px, 50vw, 560px) !important;
}
.slide img{
  object-fit:contain !important;
  background:rgba(0,0,0,.22);
}

/* Message oui/non pour absence : lisible sur mobile */
.absent-question{
  z-index:9998 !important;
}
.absent-question-box{
  border:1px solid rgba(244,223,156,.9) !important;
  background:linear-gradient(135deg, rgba(3,29,23,.98), rgba(8,55,44,.98)) !important;
}
@media (max-width:820px){
  .pagne-section{
    grid-template-columns:1fr;
  }
  .pagne-image img{
    max-height:360px;
  }
}
@media (max-width:520px){
  .pagne-section{
    padding:18px;
    border-radius:18px;
  }
  .pagne-whatsapp{
    width:100%;
    text-align:center;
  }
}


/* Priorité finale : la boule du compte à rebours reste lisible et fixe */
.countdown-fixed{
  position:fixed !important;
  right:18px !important;
  bottom:18px !important;
  width:136px !important;
  height:136px !important;
  z-index:9990 !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  border-radius:50% !important;
  padding:12px !important;
  border:2px solid rgba(244,223,156,.95) !important;
  background:radial-gradient(circle at center, rgba(244,223,156,.18), rgba(3,29,23,.98) 68%) !important;
  box-shadow:0 18px 44px rgba(0,0,0,.55), inset 0 0 0 7px rgba(3,29,23,.75) !important;
}
.countdown-fixed span{
  font-size:10px !important;
  font-weight:900 !important;
  text-transform:uppercase !important;
  letter-spacing:.6px !important;
  color:rgba(255,247,223,.78) !important;
}
.countdown-fixed strong{
  font:900 18px Cinzel,serif !important;
  color:var(--gold-2) !important;
}
@media (max-width:620px){
  .countdown-fixed{
    right:10px !important;
    bottom:10px !important;
    width:108px !important;
    height:108px !important;
  }
  .countdown-fixed span{font-size:8px !important;}
  .countdown-fixed strong{font-size:14px !important;}
}


/* Modifications finales : RSVP sans message, compte à rebours jours/heures/minutes */
.countdown-fixed strong{
  font-size:16px !important;
  white-space:nowrap !important;
}
@media (max-width:620px){
  .countdown-fixed strong{
    font-size:12px !important;
  }
}
