:root{
  --passion:#EB0603;
  --ember:#F64135;
  --velvet:#800001;
  --noir-rouge:#440004;
  --obsidian:#080714;
  --steel:#303B63;
  --blush:#E89EA1;
  --white:#FFFFFF;
  --ivory:#FBF7F6;

  --ink:#0c0a16;
  --paper:#100b1c;
  --line:rgba(232,158,161,.16);
  --txt:#EDE7EA;
  --txt-soft:#B8AEB8;
  --txt-faint:#7C7388;

  /* jetons de thème (mode sombre = valeurs par défaut, voir [data-theme="light"] plus bas) */
  --bg:var(--obsidian);
  --surface:rgba(255,255,255,.02);
  --nav-bg:rgba(8,7,20,.78);

  /* couleurs fixes pour le texte posé sur les panneaux volontairement sombres
     (hero, CTA finale, bandeau pub, carte Gold, témoignages) — ne changent jamais avec le thème */
  --on-dark:#EDE7EA;
  --on-dark-soft:#B8AEB8;
  --on-dark-faint:#7C7388;

  --serif:"Fraunces",Georgia,serif;
  --sans:"Manrope",system-ui,sans-serif;
  --mono:"Space Grotesk",ui-monospace,monospace;
  --slogan-font:"Josefin Sans",var(--sans);

  --maxw:1180px;
  --r-lg:26px;
  --r-md:16px;
  --r-sm:10px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:var(--bg);color:var(--txt);
  transition:background .25s ease,color .25s ease;
  font-family:var(--sans);line-height:1.6;-webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
[dir="rtl"] body{direction:rtl}
img{max-width:100%;display:block}
a{color:inherit}
button{font-family:inherit}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 28px}
.eyebrow{font-family:var(--mono);font-size:.72rem;letter-spacing:.28em;
  text-transform:uppercase;color:var(--ember);font-weight:500}
[dir="rtl"] .eyebrow{letter-spacing:.06em}
h1,h2,h3{font-family:var(--serif);margin:0;font-weight:600;letter-spacing:-.01em}
.muted{color:var(--txt-soft)}
.faint{color:var(--txt-faint)}
section{padding:112px 0}
@media(max-width:720px){section{padding:72px 0}}

/* ---------- reveal ---------- */
.rv{opacity:0;transform:translateY(22px);transition:opacity .8s ease,transform .8s ease}
.rv.in{opacity:1;transform:none}

/* ---------- nav ---------- */
header.nav{position:fixed;top:0;left:0;right:0;z-index:80;
  backdrop-filter:blur(14px);background:var(--nav-bg);
  border-bottom:1px solid var(--line);transition:background .25s ease,border-color .25s ease}
.nav-inner{max-width:var(--maxw);margin:0 auto;padding:14px 28px;
  display:flex;align-items:center;justify-content:space-between;gap:20px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none}
.brand .mark{width:36px;height:36px;flex:none;border-radius:10px;overflow:hidden;display:block}
.brand .mark img{animation:heartbeat 2.1s ease-in-out infinite;transform-origin:50% 50%}
@keyframes heartbeat{
  0%,38%,100%{transform:scale(1)}
  10%{transform:scale(1.16)}
  20%{transform:scale(1)}
  30%{transform:scale(1.1)}
}
.brand .word{font-family:var(--serif);font-size:1.28rem;font-weight:600;color:var(--txt)}
.brand .word em{font-style:italic;color:var(--ember)}
.age-chip{font-family:var(--mono);font-size:.6rem;font-weight:700;letter-spacing:.04em;color:var(--blush);
  border:1px solid var(--line);border-radius:6px;padding:2px 5px;line-height:1;margin-left:2px;flex:none}
nav.links{display:flex;gap:28px;font-size:.92rem}
nav.links a{text-decoration:none;color:var(--txt-soft);transition:color .2s}
nav.links a:hover{color:var(--txt)}
.nav-right{display:flex;align-items:center;gap:12px}
@media(max-width:980px){nav.links{display:none}}

/* ---------- mobile nav burger + menu ---------- */
.nav-burger{display:none;flex-direction:column;justify-content:center;align-items:center;gap:5px;
  width:38px;height:38px;flex:none;border:1px solid var(--line);border-radius:10px;
  background:rgba(255,255,255,.04);cursor:pointer;padding:0}
.nav-burger span{display:block;width:18px;height:2px;background:var(--txt);
  transition:transform .2s ease,opacity .2s ease}
.nav-burger.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav-burger.open span:nth-child(2){opacity:0}
.nav-burger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
@media(max-width:980px){.nav-burger{display:flex}}

.mobile-menu{display:none;position:absolute;top:100%;left:0;right:0;flex-direction:column;
  background:var(--paper);border-bottom:1px solid var(--line);padding:6px 28px 18px;
  max-height:calc(100vh - 64px);overflow-y:auto}
.mobile-menu.open{display:flex}
.mobile-menu a{text-decoration:none;color:var(--txt-soft);padding:14px 4px;font-size:1rem;
  border-bottom:1px solid var(--line)}
.mobile-menu a:last-child{border-bottom:none}
.mobile-menu a:hover{color:var(--txt)}
.mobile-menu a.mobile-login{color:#fff;font-weight:700;background:linear-gradient(135deg,var(--ember),var(--passion));
  border-radius:12px;border-bottom:none;text-align:center;margin:8px 0 4px;padding:13px 4px}
@media(min-width:981px){.mobile-menu{display:none!important}}

@media(max-width:560px){
  .nav-inner{padding:10px 16px;gap:8px}
  .brand .mark{width:30px;height:30px}
  .brand .word{font-size:1.05rem}
  .nav-right{gap:6px}
  .nav-right .btn-primary{display:none}
  .nav-right .nav-login{display:none}
}

/* ---------- theme toggle ---------- */
.theme-toggle{display:flex;align-items:center;justify-content:center;width:38px;height:38px;flex:none;
  border-radius:50%;border:1px solid var(--line);background:rgba(255,255,255,.04);color:var(--txt);
  cursor:pointer;transition:border-color .2s ease,background .2s ease}
.theme-toggle:hover{border-color:var(--blush)}
.theme-toggle svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.6;
  stroke-linecap:round;stroke-linejoin:round}
.theme-toggle .icon-sun{display:none}
:root[data-theme="light"] .theme-toggle .icon-moon{display:none}
:root[data-theme="light"] .theme-toggle .icon-sun{display:block}
@media(max-width:560px){.theme-toggle{width:32px;height:32px}.theme-toggle svg{width:16px;height:16px}}

/* ---------- language switch ---------- */
.lang-switch{position:relative}
.lang-btn{display:flex;align-items:center;gap:6px;background:rgba(255,255,255,.04);
  border:1px solid var(--line);border-radius:999px;padding:8px 12px;color:var(--txt);
  cursor:pointer;font-family:var(--mono);font-size:.72rem;letter-spacing:.06em}
.lang-btn:hover{border-color:var(--blush)}
.lang-btn .car{font-size:.6rem;color:var(--txt-faint);margin-left:2px}
.lang-menu{position:absolute;top:calc(100% + 10px);right:0;background:var(--paper);
  border:1px solid var(--line);border-radius:var(--r-md);padding:8px;width:230px;
  max-height:340px;overflow-y:auto;display:none;box-shadow:0 30px 60px -20px rgba(0,0,0,.6);z-index:90}
[dir="rtl"] .lang-menu{right:auto;left:0}
.lang-menu.open{display:block}
.lang-menu button{display:flex;align-items:center;gap:10px;width:100%;text-align:left;
  background:none;border:none;color:var(--txt-soft);padding:9px 10px;border-radius:10px;
  cursor:pointer;font-size:.86rem}
[dir="rtl"] .lang-menu button{text-align:right}
.lang-menu button:hover{background:rgba(255,255,255,.05);color:var(--txt)}
.lang-menu button.on{background:rgba(246,65,53,.14);color:var(--txt)}
.lang-menu .flag{flex:none}
.flag{display:block;border-radius:2px;object-fit:cover;flex:none;background:rgba(255,255,255,.08)}
.lang-btn .flag{width:20px;height:15px}

/* ---------- currency switch (same dropdown style as language switch, to save space) ---------- */
.curr-switch{position:relative}
.curr-btn{display:flex;align-items:center;gap:6px;background:rgba(255,255,255,.04);
  border:1px solid var(--line);border-radius:999px;padding:8px 12px;color:var(--txt);
  cursor:pointer;font-family:var(--mono);font-size:.72rem;letter-spacing:.06em}
.curr-btn:hover{border-color:var(--blush)}
.curr-btn .car{font-size:.6rem;color:var(--txt-faint);margin-left:2px}
.curr-menu{position:absolute;top:calc(100% + 10px);right:0;background:var(--paper);
  border:1px solid var(--line);border-radius:var(--r-md);padding:8px;width:190px;
  display:none;box-shadow:0 30px 60px -20px rgba(0,0,0,.6);z-index:90}
[dir="rtl"] .curr-menu{right:auto;left:0}
.curr-menu.open{display:block}
.curr-menu button{display:flex;align-items:center;gap:10px;width:100%;text-align:left;
  background:none;border:none;color:var(--txt-soft);padding:9px 10px;border-radius:10px;
  cursor:pointer;font-size:.86rem}
[dir="rtl"] .curr-menu button{text-align:right}
.curr-menu button:hover{background:rgba(255,255,255,.05);color:var(--txt)}
.curr-menu button.on{background:rgba(246,65,53,.14);color:var(--txt)}
.curr-menu .sym{font-family:var(--mono);width:2.4em;flex:none;color:var(--blush)}
@media(max-width:560px){
  .lang-btn,.curr-btn{padding:6px 8px;font-size:.66rem;gap:4px}
}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;gap:10px;padding:14px 26px;border-radius:999px;
  font-weight:700;font-size:.94rem;text-decoration:none;border:1px solid transparent;
  cursor:pointer;transition:transform .18s ease, box-shadow .18s ease;font-family:var(--sans)}
.btn:active{transform:scale(.97)}
.btn-primary{background:linear-gradient(135deg,var(--ember),var(--passion));color:#fff;
  box-shadow:0 14px 30px -12px rgba(235,6,3,.55)}
.btn-primary:hover{box-shadow:0 18px 38px -12px rgba(235,6,3,.75);transform:translateY(-2px)}
.btn-ghost{background:transparent;border-color:var(--line);color:var(--txt)}
.btn-ghost:hover{border-color:var(--blush);color:var(--blush)}
.btn-sm{padding:9px 16px;font-size:.8rem}
.nav-login{border-color:var(--ember);color:var(--txt)}
.nav-login:hover{border-color:var(--passion);color:#fff;background:rgba(235,6,3,.08)}

/* ---------- hero ---------- */
.hero{position:relative;padding:172px 0 108px;overflow:hidden}
.hero-media{position:absolute;inset:0;z-index:0}
.hero-slide{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 28%;
  opacity:0;transition:opacity 1.8s ease}
.hero-slide.is-active{opacity:1}
.hero-media::after{content:"";position:absolute;inset:0;
  background:
    linear-gradient(180deg, rgba(8,7,20,.28) 0%, rgba(8,7,20,.62) 55%, var(--obsidian) 100%),
    linear-gradient(100deg, rgba(8,7,20,.88) 0%, rgba(8,7,20,.56) 42%, rgba(8,7,20,.18) 68%);
}
.hero-grid{position:relative;z-index:1;max-width:720px}
/* le hero garde toujours son habillage photo + voile sombre, quel que soit le thème du site :
   son texte reste donc fixé sur les teintes claires (--on-dark…), jamais sur les jetons --txt. */
.hero h1{font-size:clamp(2.6rem,5.6vw,4.3rem);line-height:1.05;color:var(--on-dark)}
.hero p.lede{font-size:1.16rem;color:var(--on-dark-soft);max-width:50ch;margin:24px 0 0}
.slogan{font-family:var(--mono);font-weight:500;text-transform:uppercase;letter-spacing:.34em;
  font-size:clamp(.86rem,1.6vw,1.05rem);color:var(--blush);margin:26px 0 0;display:flex;align-items:center;gap:16px}
.slogan::before{content:"";width:38px;height:1px;flex:none;background:linear-gradient(90deg,var(--ember),transparent)}
.hero-cta{display:flex;gap:14px;margin-top:38px;flex-wrap:wrap}
.hero-trust{display:flex;gap:36px;margin-top:56px;flex-wrap:wrap}
.hero-trust .stat b{display:block;font-family:var(--serif);font-size:1.5rem;color:var(--on-dark)}
.hero-trust .stat span{font-size:.8rem;color:var(--on-dark-faint)}
/* ---------- section head ---------- */
.head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:56px;flex-wrap:wrap}
.head h2{font-size:clamp(1.9rem,3.4vw,2.7rem)}
.head p{max-width:44ch;color:var(--txt-soft)}

/* ---------- steps ---------- */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:32px}
@media(max-width:860px){.steps{grid-template-columns:1fr}}
.step{border:1px solid var(--line);border-radius:var(--r-lg);padding:34px;background:var(--surface);
  position:relative;overflow:hidden;display:flex;flex-direction:column;transition:background .25s ease,border-color .25s ease}
.step .num{font-family:var(--serif);font-style:italic;font-size:3.2rem;color:transparent;
  -webkit-text-stroke:1.4px rgba(232,158,161,.4);line-height:1}
.step h3{font-size:1.3rem;margin-top:18px}
.step p{color:var(--txt-soft);margin-top:10px;font-size:.95rem}
.step-cta{display:inline-flex;align-items:center;gap:9px;align-self:flex-start;margin-top:auto;padding-top:24px;
  color:var(--ember);font-family:var(--mono);font-size:.68rem;font-weight:700;letter-spacing:.08em;
  text-transform:uppercase;text-decoration:none;transition:color .2s ease,transform .2s ease}
.step-cta span{font-size:1.15rem;line-height:0;transition:transform .2s ease}
.step-cta:hover,.step-cta:focus-visible{color:var(--blush)}
.step-cta:hover span,.step-cta:focus-visible span{transform:translateX(4px)}

/* ---------- trust ---------- */
.trust-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:26px}
@media(max-width:980px){.trust-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.trust-grid{grid-template-columns:1fr}}
.trust-card{border:1px solid var(--line);border-radius:var(--r-md);padding:26px;background:var(--surface)}
.trust-card svg{width:26px;height:26px;stroke:var(--ember);stroke-width:1.6;fill:none;
  stroke-linecap:round;stroke-linejoin:round;margin-bottom:14px}
.trust-card h4{font-family:var(--sans);font-weight:700;font-size:1.02rem;margin:0}
.trust-card p{font-size:.86rem;color:var(--txt-faint);margin:8px 0 0}

.stories-grid{margin-top:64px;display:grid;grid-template-columns:repeat(2,1fr);gap:26px}
@media(max-width:820px){.stories-grid{grid-template-columns:1fr}}
.story-card{border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;
  background:linear-gradient(160deg,rgba(48,59,99,.95),rgba(8,7,20,.97));display:flex;flex-direction:column}
.story-photo{aspect-ratio:16/10;overflow:hidden}
.story-photo img{width:100%;height:100%;object-fit:cover;object-position:center 30%}
.story-body{padding:32px}
.story-card blockquote{font-family:var(--serif);font-size:1.14rem;font-style:italic;margin:0;
  color:var(--on-dark);line-height:1.5}
.story-card cite{display:block;margin-top:16px;font-style:normal;font-family:var(--mono);
  font-size:.72rem;letter-spacing:.1em;color:var(--blush);text-transform:uppercase}

/* ---------- international ---------- */
.intl{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:start}
@media(max-width:900px){.intl{grid-template-columns:1fr}}
.locale-card{border:1px solid var(--line);border-radius:var(--r-lg);padding:32px;
  background:var(--surface)}
.locale-row{display:flex;justify-content:space-between;padding:14px 0;border-bottom:1px solid var(--line);
  font-size:.92rem;gap:16px}
.locale-row:last-child{border-bottom:none}
.locale-row b{font-family:var(--mono);letter-spacing:.05em;color:var(--txt-faint);font-weight:500;text-align:right}
[dir="rtl"] .locale-row b{text-align:left}

/* ---------- pricing ---------- */
.plans{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
@media(max-width:980px){.plans{grid-template-columns:1fr}}
.plan{border:1px solid var(--line);border-radius:var(--r-lg);padding:34px;background:var(--surface);
  display:flex;flex-direction:column;transition:background .25s ease,border-color .25s ease}
.plan.hi{background:linear-gradient(160deg,var(--velvet),var(--noir-rouge) 60%);border-color:transparent;
  position:relative}
.plan.hi .tier-badge{position:absolute;top:-13px;right:28px;background:linear-gradient(135deg,var(--ember),var(--passion));
  color:#fff;font-family:var(--mono);font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;
  padding:6px 14px;border-radius:999px}
[dir="rtl"] .plan.hi .tier-badge{right:auto;left:28px}
.plan .tier{font-family:var(--mono);font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--blush)}
.plan .price{font-family:var(--serif);font-size:2.5rem;margin:14px 0;min-height:1.2em}
.plan .price .price-suffix{font-family:var(--sans);font-size:.92rem;color:var(--txt-faint)}
.plan ul{list-style:none;margin:22px 0;padding:0;display:flex;flex-direction:column;gap:12px;flex:1}
.plan li{display:flex;gap:10px;font-size:.92rem;color:var(--txt-soft)}
.plan li svg{width:16px;height:16px;stroke:var(--ember);flex:none;margin-top:3px}
/* la carte Gold reste volontairement sombre dans les deux thèmes : son texte est donc fixé */
.plan.hi .price,.plan.hi .price-suffix{color:var(--on-dark)}
.plan.hi .price .price-suffix{color:var(--on-dark-faint)}
.plan.hi li{color:var(--on-dark-soft)}
.plan .btn{margin-top:8px}

/* ---------- final cta ---------- */
.final{border-radius:36px;padding:80px 56px;text-align:center;position:relative;overflow:hidden;
  background:linear-gradient(155deg,var(--velvet),var(--noir-rouge) 55%,var(--obsidian));
  border:1px solid rgba(255,255,255,.06)}
.final h2{font-size:clamp(2.1rem,4.4vw,3.3rem);max-width:22ch;margin:0 auto;color:var(--on-dark)}
.final p{max-width:48ch;margin:20px auto 0;color:var(--blush)}
.store-row{display:flex;gap:16px;justify-content:center;flex-wrap:wrap}
.download-row{display:flex;gap:28px;justify-content:center;align-items:center;margin-top:38px;flex-wrap:wrap}
.qr-card{display:flex;align-items:center;gap:14px;background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.16);border-radius:14px;padding:12px 20px 12px 12px}
.qr-card img{width:72px;height:72px;border-radius:8px;background:#fff;padding:6px}
.qr-card span{font-family:var(--mono);font-size:.72rem;letter-spacing:.04em;color:rgba(255,255,255,.85);
  line-height:1.4;text-align:left}
[dir="rtl"] .qr-card span{text-align:right}
.store-btn{display:flex;align-items:center;gap:12px;background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.16);border-radius:14px;padding:12px 22px;text-decoration:none;color:#fff;
  transition:border-color .2s ease,background .2s ease,transform .18s ease}
.store-btn svg{width:24px;height:24px;stroke:#fff;fill:none;stroke-width:1.5}
.store-btn small{display:block;font-size:.66rem;color:rgba(255,255,255,.7);letter-spacing:.04em}
.store-btn strong{font-family:var(--sans);font-size:1rem}
.store-btn[aria-pressed="true"]{background:linear-gradient(135deg,var(--ember),var(--passion));
  border-color:transparent;box-shadow:0 14px 30px -14px rgba(235,6,3,.6)}
.store-btn[aria-pressed="true"] small{color:rgba(255,255,255,.85)}
.qr-card span b{color:#fff;font-weight:700}

/* ---------- footer ---------- */
footer{border-top:1px solid var(--line);padding:64px 0 34px;margin-top:60px}
.foot-grid{display:grid;grid-template-columns:1.2fr repeat(3,1fr);gap:40px}
@media(max-width:820px){.foot-grid{grid-template-columns:repeat(2,1fr)}}
.foot-grid h5{font-family:var(--mono);font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;
  color:var(--txt-faint);margin:0 0 16px}
.foot-grid ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.foot-grid a{text-decoration:none;color:var(--txt-soft);font-size:.9rem}
.foot-grid a:hover{color:var(--blush)}
.social-row{display:flex;justify-content:center;gap:10px}
.social-btn{width:40px;height:40px;border-radius:50%;border:1px solid var(--line);
  display:grid;place-items:center;color:var(--txt-soft);background:var(--surface);
  transition:.2s ease;flex:none}
.social-btn svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.6}
.social-btn:hover{color:#fff;border-color:transparent;
  background:linear-gradient(135deg,var(--ember),var(--passion));transform:translateY(-2px)}
.foot-sig{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;margin-top:56px;padding-top:28px;
  border-top:1px solid var(--line);gap:24px}
.foot-sig .brand-slogan{justify-self:start}
.foot-sig .legal{justify-self:end}
/* Style de référence pour le slogan "Never be lonely" — à réutiliser tel quel
   partout où la signature LovMy apparaît en pied de page dans l'application.
   Aligné sur la taille et la police du copyright pour rester discret. */
.brand-slogan{font-family:var(--sans);font-weight:400;font-size:.78rem;
  letter-spacing:normal;color:var(--blush)}
.foot-sig .legal{font-size:.78rem;color:var(--txt-faint)}
@media(max-width:620px){
  .foot-sig{grid-template-columns:1fr;justify-items:center;gap:16px;text-align:center}
  .foot-sig .brand-slogan,.foot-sig .legal{justify-self:center}
}

/* ---------- back to top ---------- */
.back-to-top{position:fixed;right:24px;bottom:24px;z-index:70;width:48px;height:48px;border:none;
  border-radius:50%;background:linear-gradient(135deg,var(--ember),var(--passion));color:#fff;
  display:grid;place-items:center;cursor:pointer;box-shadow:0 14px 30px -12px rgba(235,6,3,.55);
  opacity:0;transform:translateY(12px);pointer-events:none;
  transition:opacity .25s ease,transform .25s ease,box-shadow .18s ease}
.back-to-top.show{opacity:1;transform:none;pointer-events:auto}
.back-to-top:hover{box-shadow:0 18px 38px -12px rgba(235,6,3,.75)}
.back-to-top svg{width:20px;height:20px;stroke:#fff;fill:none;stroke-width:2;
  stroke-linecap:round;stroke-linejoin:round}
@media(max-width:560px){.back-to-top{right:16px;bottom:16px;width:42px;height:42px}}

/* ---------- ad billboard slot (970x250 IAB standard) ---------- */
.ad-slot{padding:40px 0}
@media(max-width:720px){.ad-slot{padding:26px 0}}
.ad-billboard{max-width:970px;width:100%;aspect-ratio:970/250;margin:0 auto;
  border:1px dashed var(--line);border-radius:var(--r-md);
  background:var(--obsidian);position:relative;overflow:hidden}
.ad-track,.ad-slide{position:absolute;inset:0}
.ad-slide{display:block;opacity:0;visibility:hidden;transition:opacity 1.1s ease,visibility 1.1s ease}
.ad-slide.is-active{opacity:1;visibility:visible;z-index:1}
.ad-slide img{width:100%;height:100%;object-fit:cover}
.ad-control{position:absolute;top:50%;z-index:2;width:34px;height:34px;border:1px solid rgba(255,255,255,.5);
  border-radius:50%;background:rgba(8,7,20,.52);color:#fff;font-size:1.55rem;line-height:1;
  display:grid;place-items:center;transform:translateY(-50%);cursor:pointer;opacity:0;
  transition:opacity .2s ease,background .2s ease}
.ad-carousel:hover .ad-control,.ad-carousel:focus-within .ad-control{opacity:1}
.ad-control:hover{background:rgba(235,6,3,.82)}
.ad-prev{left:14px}.ad-next{right:14px}
.ad-dots{position:absolute;z-index:2;bottom:12px;left:50%;display:flex;gap:7px;transform:translateX(-50%)}
.ad-dot{width:8px;height:8px;padding:0;border:1px solid #fff;border-radius:50%;background:transparent;cursor:pointer}
.ad-dot.is-active{background:#fff}
@media(max-width:720px){
  .ad-control{opacity:1;width:30px;height:30px;font-size:1.3rem}
  .ad-prev{left:8px}.ad-next{right:8px}
}
@media(prefers-reduced-motion:reduce){.ad-slide{transition:none}}

/* ---------- decorative background (fills the flat black past the hero) ---------- */
.bg-decor{position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none}
.bg-decor .wm{position:absolute;top:50%;left:50%;width:min(64vw,720px);height:auto;
  transform:translate(-50%,-50%);opacity:.05;filter:saturate(0) brightness(1.6)}
.bg-decor .heart{position:absolute;bottom:-12%;line-height:1;
  animation:floatHeart linear infinite;will-change:transform,opacity}
@keyframes floatHeart{
  0%{transform:translateY(0) translateX(0) rotate(-6deg);opacity:0}
  12%{opacity:var(--ho,.16)}
  50%{transform:translateY(-55vh) translateX(16px) rotate(6deg)}
  88%{opacity:var(--ho,.16)}
  100%{transform:translateY(-115vh) translateX(-14px) rotate(-4deg);opacity:0}
}
@media(max-width:720px){.bg-decor .heart{font-size:calc(var(--hs,28px) * .7)!important}}

/* skip link / focus */
a:focus-visible,button:focus-visible{outline:2px solid var(--passion);outline-offset:3px;border-radius:4px}
@media (prefers-reduced-motion: reduce){*{transition:none!important;animation:none!important}}

/* =========================================================
   MODE ÉCLAIRÉ — le site est sombre par défaut ; ce bloc active
   la variante claire quand <html data-theme="light">, posée par
   le bouton .theme-toggle (voir js/main.js). Les panneaux
   volontairement sombres de la charte (hero, CTA finale, bandeau
   pub, carte Gold, cartes témoignages) ne sont pas concernés :
   leur texte a été fixé plus haut sur --on-dark / --on-dark-soft.
   ========================================================= */
:root[data-theme="light"]{
  --bg:var(--ivory);
  --surface:#FFFFFF;
  --paper:#FFFFFF;
  --nav-bg:rgba(251,247,246,.86);
  --line:rgba(48,59,99,.16);
  --txt:#201C2B;
  --txt-soft:#4A4456;
  --txt-faint:#726C82;
}

:root[data-theme="light"] .nav-burger,
:root[data-theme="light"] .lang-btn,
:root[data-theme="light"] .curr-btn,
:root[data-theme="light"] .theme-toggle{background:rgba(48,59,99,.06);border-color:rgba(48,59,99,.22)}
:root[data-theme="light"] .flag{background:rgba(48,59,99,.12)}
:root[data-theme="light"] .lang-menu button:hover,
:root[data-theme="light"] .curr-menu button:hover{background:rgba(48,59,99,.07)}

/* les accents "blush" (pensés pour un fond sombre) deviennent bleu acier minuit
   sur les surfaces qui, elles, suivent le thème et passent au clair */
:root[data-theme="light"] .age-chip{color:var(--steel)}
:root[data-theme="light"] .curr-menu .sym{color:var(--steel)}
:root[data-theme="light"] .lang-btn:hover,
:root[data-theme="light"] .curr-btn:hover,
:root[data-theme="light"] .theme-toggle:hover{border-color:var(--steel)}
:root[data-theme="light"] .btn-ghost:hover{border-color:var(--steel);color:var(--steel)}
:root[data-theme="light"] .plan .tier{color:var(--steel)}
:root[data-theme="light"] .foot-grid a:hover{color:var(--steel)}
:root[data-theme="light"] .brand-slogan{color:var(--steel)}
:root[data-theme="light"] .step .num{-webkit-text-stroke-color:rgba(48,59,99,.4)}

/* re-fixer les éléments qui restent sur un panneau volontairement sombre
   (plus spécifiques que les règles génériques ci-dessus, donc prioritaires) */
:root[data-theme="light"] .hero .btn-ghost:hover{border-color:var(--blush);color:var(--blush)}
:root[data-theme="light"] .plan.hi .tier{color:var(--blush)}