/* Steredenn Spa — feuille de style commune */
@font-face{font-family:'Cormorant Garamond';font-style:normal;font-weight:500 600;font-display:swap;src:url(fonts/CormorantGaramond-500-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2212}
@font-face{font-family:'Cormorant Garamond';font-style:normal;font-weight:500 600;font-display:swap;src:url(fonts/CormorantGaramond-500-latin-ext.woff2) format('woff2');unicode-range:U+0100-02AF,U+1E00-1EFF,U+20A0-20AB,U+20AD-20C0,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Cormorant Garamond';font-style:italic;font-weight:500;font-display:swap;src:url(fonts/CormorantGaramond-500i-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+2000-206F,U+20AC}
@font-face{font-family:'Lora';font-style:normal;font-weight:500 600;font-display:swap;src:url(fonts/Lora-500-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2212}
@font-face{font-family:'Lora';font-style:normal;font-weight:500 600;font-display:swap;src:url(fonts/Lora-500-latin-ext.woff2) format('woff2');unicode-range:U+0100-02AF,U+1E00-1EFF,U+20A0-20AB,U+20AD-20C0}
@font-face{font-family:'Lora';font-style:italic;font-weight:500;font-display:swap;src:url(fonts/Lora-500i-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+2000-206F,U+20AC}
@font-face{font-family:'Jost';font-style:normal;font-weight:500 600;font-display:swap;src:url(fonts/Jost-500-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2212}
@font-face{font-family:'Jost';font-style:normal;font-weight:500 600;font-display:swap;src:url(fonts/Jost-500-latin-ext.woff2) format('woff2');unicode-range:U+0100-02AF,U+1E00-1EFF}

:root{
  --nuit:#07090e;
  --nuit-2:#0c1630;
  --nuit-3:#151b26;
  --creme:#f4efe6;
  --creme-2:#e4ddd2;
  --gris:#b9b2a6;
  --or:#f2b443;
  --or-clair:#ffd36b;
  --teal:#509597;
  --ligne:rgba(242,180,67,.35);
  --max:1120px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--nuit);color:var(--creme);font-family:'Lora',Georgia,serif;font-size:17px;line-height:1.6;font-variant-numeric:lining-nums}
img{max-width:100%;display:block}
a{color:var(--or-clair)}
a:hover{color:#fff}
h1,h2,h3{font-family:'Cormorant Garamond',Georgia,serif;font-weight:600;line-height:1.1;margin:0;color:#f7f2ea}
h1{font-size:clamp(2.6rem,7vw,4.4rem)}
h2{font-size:clamp(2rem,5vw,3rem)}
h3{font-size:1.7rem}
p{margin:0 0 1em}
.or{background:linear-gradient(180deg,#fff6cc 0%,#ffe57f 38%,#ffd75a 70%,#f6c84c 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.sur-titre{font-family:'Jost',sans-serif;font-weight:600;font-size:.8rem;letter-spacing:.28em;text-transform:uppercase;color:var(--or-clair);margin:0 0 .7rem}
.intro{font-style:italic;color:var(--creme-2);font-size:1.1rem;max-width:40rem}
.centre{text-align:center;margin-left:auto;margin-right:auto}
.conteneur{max-width:var(--max);margin:0 auto;padding:0 20px}
.section{padding:72px 0}
.section + .section{border-top:1px solid rgba(242,180,67,.14)}
.filet{width:160px;height:1px;margin:22px auto;background:linear-gradient(90deg,transparent,var(--or),transparent)}

/* En-tête */
.entete{position:sticky;top:0;z-index:20;background:rgba(7,9,14,.92);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-bottom:1px solid rgba(242,180,67,.18)}
.entete .conteneur{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:66px}
.marque{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--creme)}
.marque img{width:44px;height:44px}
.marque span{font-family:'Cormorant Garamond',serif;font-size:1.45rem;font-weight:600;letter-spacing:.06em}
.menu{display:flex;gap:22px;align-items:center}
.menu a{font-family:'Jost',sans-serif;font-weight:500;font-size:.85rem;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;color:var(--creme-2)}
.menu a:hover,.menu a[aria-current="page"]{color:var(--or-clair)}
.menu-bouton{display:none;background:none;border:1px solid var(--ligne);color:var(--creme);border-radius:8px;padding:8px 12px;font-family:'Jost',sans-serif;font-size:.8rem;letter-spacing:.14em;text-transform:uppercase}
@media (max-width:820px){
  .menu-bouton{display:block}
  .menu{display:none;position:absolute;left:0;right:0;top:66px;flex-direction:column;gap:0;background:var(--nuit);border-bottom:1px solid var(--ligne)}
  .menu.ouvert{display:flex}
  .menu a{padding:16px 20px;width:100%;border-top:1px solid rgba(242,180,67,.12)}
}

/* Boutons */
.boutons{display:flex;flex-wrap:wrap;gap:12px}
.centre .boutons,.boutons.centre{justify-content:center}
.bouton{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:14px 26px;border-radius:999px;font-family:'Jost',sans-serif;font-weight:600;font-size:.9rem;letter-spacing:.12em;text-transform:uppercase;text-decoration:none;border:1px solid var(--or);color:var(--nuit);background:linear-gradient(180deg,#ffe57f,#f2b443)}
.bouton:hover{color:var(--nuit);filter:brightness(1.08)}
.bouton.ligne{background:transparent;color:var(--or-clair)}
.bouton.ligne:hover{background:rgba(242,180,67,.1);color:#fff}

/* Accueil : bandeau principal */
.hero{position:relative;min-height:86vh;display:flex;align-items:center;justify-content:center;text-align:center;overflow:hidden}
.hero picture,.hero picture img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,9,14,.55) 0%,rgba(7,9,14,.35) 40%,rgba(7,9,14,.9) 100%)}
.hero .contenu{position:relative;z-index:1;padding:60px 20px}
.hero .logo{width:min(220px,52vw);margin:0 auto 10px}
.hero h1{font-size:clamp(2.2rem,6vw,3.6rem)}
.hero .intro{margin:14px auto 28px}
.infos-rapides{margin-top:26px;font-family:'Jost',sans-serif;font-size:.8rem;letter-spacing:.16em;text-transform:uppercase;color:var(--creme-2)}

/* Deux univers */
.univers{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px;margin-top:40px}
.porte{position:relative;display:flex;flex-direction:column;justify-content:flex-end;min-height:380px;border-radius:18px;overflow:hidden;text-decoration:none;color:var(--creme);border:1px solid rgba(242,180,67,.25)}
.porte img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s}
.porte:hover img{transform:scale(1.04)}
.porte::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,9,14,0) 25%,rgba(7,9,14,.92) 100%)}
.porte .texte{position:relative;z-index:1;padding:26px}
.porte p{color:var(--creme-2);font-style:italic;margin:.5rem 0 1rem}
.porte .lien{font-family:'Jost',sans-serif;font-weight:600;font-size:.8rem;letter-spacing:.18em;text-transform:uppercase;color:var(--or-clair)}
.porte.soins{background:radial-gradient(circle at 70% 20%,#1f4d52 0%,#0e131c 55%,#07090e 100%)}

/* Rituels */
.rituels{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px;margin-top:40px}
.rituel{background:var(--nuit-2);border:1px solid rgba(242,180,67,.2);border-radius:18px;overflow:hidden;display:flex;flex-direction:column}
.rituel img{aspect-ratio:4/3;object-fit:cover;width:100%}
.rituel .texte{padding:20px 22px 24px}
.rituel h3{font-size:1.6rem;margin:.2rem 0 .3rem}
.rituel .effet{font-family:'Jost',sans-serif;font-weight:600;font-size:.75rem;letter-spacing:.2em;text-transform:uppercase;color:var(--or-clair)}
.rituel p{color:var(--creme-2);font-style:italic;font-size:.98rem;margin:.4rem 0 .8rem}
.rituel .massage{font-family:'Jost',sans-serif;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gris)}
.badge{display:inline-block;margin-left:6px;padding:2px 8px;border:1px solid var(--or);border-radius:999px;font-size:.65rem;letter-spacing:.14em;color:var(--or-clair);vertical-align:middle}

/* Grilles de tarifs */
.tarifs{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:28px;margin-top:40px}
.carte{background:var(--nuit-2);border:1px solid rgba(242,180,67,.2);border-radius:18px;padding:26px 24px}
.carte h3{margin-bottom:.4rem}
.carte .note{color:var(--gris);font-style:italic;font-size:.95rem;margin:.2rem 0 .8rem}
.ligne-tarif{display:grid;grid-template-columns:1fr auto auto;gap:4px 14px;align-items:baseline;padding:13px 0;border-bottom:1px solid rgba(242,180,67,.22)}
.ligne-tarif:last-child{border-bottom:0}
.ligne-tarif .nom{font-weight:600;font-size:1.05rem}
.ligne-tarif .duree{font-family:'Jost',sans-serif;font-weight:600;font-size:.78rem;letter-spacing:.1em;color:var(--or-clair);white-space:nowrap;text-transform:uppercase}
.ligne-tarif .prix{font-weight:600;font-size:1.3rem;white-space:nowrap;text-align:right;min-width:4.2ch}
.ligne-tarif .desc{grid-column:1/-1;color:var(--gris);font-style:italic;font-size:.93rem;line-height:1.4}
.ligne-tarif.vedette .nom{font-size:1.18rem}
.ligne-tarif.vedette .prix{color:var(--or-clair);font-size:1.5rem}
.titre-groupe{font-family:'Jost',sans-serif;font-weight:600;font-size:.8rem;letter-spacing:.2em;text-transform:uppercase;color:var(--or-clair);margin:22px 0 2px;padding:7px 10px;background:linear-gradient(90deg,rgba(80,149,151,.5),rgba(80,149,151,.06))}
.titre-groupe:first-of-type{margin-top:6px}
.mention{color:var(--gris);font-style:italic;font-size:.9rem;max-width:46rem;margin:30px auto 0;text-align:center}

/* Spa privatif */
.bandeau-photo{position:relative;border-radius:18px;overflow:hidden;min-height:260px;display:flex;align-items:center;border:1px solid rgba(242,180,67,.25)}
.bandeau-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.bandeau-photo::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(7,9,14,.92) 0%,rgba(7,9,14,.65) 50%,rgba(7,9,14,.1) 100%)}
.bandeau-photo .texte{position:relative;z-index:1;padding:30px;max-width:30rem}
.bandeau-photo p{color:var(--creme-2);font-style:italic;margin:.6rem 0 0}
.duo-photos{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:20px;margin-top:40px}
.prix-spa{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px;margin-top:24px}
.prix-spa .bloc{text-align:center;padding:28px 20px;border:1px solid var(--ligne);border-radius:18px;background:var(--nuit-2)}
.prix-spa .grand{font-size:2.3rem;font-weight:600;line-height:1.1}
.prix-spa .bloc p{color:var(--creme-2);font-style:italic;margin:.5rem 0 0}

/* Infos pratiques */
.infos{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px;margin-top:36px}
.info{padding:24px;border:1px solid rgba(242,180,67,.2);border-radius:18px;background:var(--nuit-2)}
.info .sur-titre{margin-bottom:.4rem}
.info p{margin:0;color:var(--creme-2)}
.info a{text-decoration:none}

/* Pied de page */
.pied{border-top:1px solid rgba(242,180,67,.2);padding:40px 0 110px;text-align:center;color:var(--gris);font-size:.92rem}
.pied img{width:70px;margin:0 auto 10px}
.pied .adresse{font-family:'Jost',sans-serif;font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;color:var(--creme-2);margin:.4rem 0}

/* Barre d'appel sur téléphone */
.barre-appel{position:fixed;left:0;right:0;bottom:0;z-index:30;display:none;gap:10px;padding:10px 12px calc(10px + env(safe-area-inset-bottom));background:rgba(7,9,14,.95);border-top:1px solid var(--ligne)}
.barre-appel .bouton{flex:1;padding:13px 10px;font-size:.8rem}
@media (max-width:820px){.barre-appel{display:flex}}
@media (min-width:821px){.pied{padding-bottom:40px}}

/* Page intérieure : titre */
.titre-page{position:relative;padding:90px 0 60px;text-align:center;overflow:hidden}
.titre-page img.fond{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.35}
.titre-page::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,9,14,.3),var(--nuit))}
.titre-page .conteneur{position:relative;z-index:1}
.titre-page .intro{margin:14px auto 0}
.ancres{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:26px}
.ancres a{font-family:'Jost',sans-serif;font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;padding:8px 14px;border:1px solid var(--ligne);border-radius:999px;color:var(--creme-2)}
.ancres a:hover{color:var(--or-clair);border-color:var(--or)}
.porte .sur-titre,.bandeau-photo .sur-titre,.info .sur-titre,.prix-spa .sur-titre{font-style:normal}
.rituels{display:flex;flex-wrap:wrap;justify-content:center}
.rituel{flex:1 1 280px;max-width:360px}

/* Univers Soins : thème clair, comme les affiches */
body.clair{--nuit:#ffffff;--nuit-2:#ffffff;--creme:#14264a;--creme-2:#4a5872;--gris:#4a5872;--or:#9a7432;--or-clair:#9a7432;--ligne:rgba(154,116,50,.35);background:#fff;color:#14264a;font-family:'Cormorant Garamond',Georgia,serif;font-size:18.5px}
body.clair h1,body.clair h2,body.clair h3{color:#14264a}
body.clair .or{background:linear-gradient(180deg,#caa35c 0%,#a97d33 55%,#8a6424 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
body.clair a{color:#9a7432}
body.clair a:hover{color:#7a5a22}
body.clair .entete{background:rgba(255,255,255,.94);border-bottom-color:rgba(154,116,50,.25)}
body.clair .marque{color:#14264a}
body.clair .menu a{color:#4a5872}
body.clair .menu a:hover,body.clair .menu a[aria-current="page"]{color:#9a7432}
body.clair .menu-bouton{color:#14264a}
@media (max-width:820px){body.clair .menu{background:#fff}}
body.clair .section + .section{border-top-color:rgba(154,116,50,.18)}
body.clair .carte{background:#fff;border-color:rgba(154,116,50,.28);box-shadow:0 10px 30px rgba(16,16,16,.05)}
body.clair .ligne-tarif{border-bottom-color:rgba(154,116,50,.3)}
body.clair .ligne-tarif .nom{font-size:1.2rem}
body.clair .ligne-tarif .prix{font-size:1.6rem;color:#14264a}
body.clair .ligne-tarif.vedette .prix{color:#9a7432;font-size:1.75rem}
body.clair .ligne-tarif .desc{font-family:'Lora',Georgia,serif;font-size:.84rem}
body.clair .carte .note,body.clair .intro,body.clair .mention{font-family:'Lora',Georgia,serif}
body.clair .intro{font-size:1rem}
body.clair .titre-groupe{color:#9a7432;background:linear-gradient(90deg,rgba(20,38,74,.08),rgba(20,38,74,0))}
body.clair .titre-page::after{background:linear-gradient(180deg,#fff,#fff)}
body.clair .badge{color:#9a7432;border-color:#9a7432}
body.clair .bouton{color:#fff;background:linear-gradient(180deg,#caa35c,#9a7432);border-color:#9a7432}
body.clair .bouton.ligne{background:transparent;color:#9a7432}
body.clair .bouton.ligne:hover{background:rgba(154,116,50,.08)}
body.clair .pied{border-top-color:rgba(154,116,50,.25);color:#4a5872}
body.clair .pied .adresse{color:#14264a}
body.clair .barre-appel{background:rgba(255,255,255,.96)}
body.clair .ancres a{color:#4a5872}

/* Accueil : la porte Univers Soins en clair */
.porte.soins{background:radial-gradient(circle at 50% 25%,#ffffff 0%,#f4f6fa 60%,#e6ebf2 100%);color:#14264a}
.porte.soins::after{background:linear-gradient(180deg,rgba(255,255,255,0) 30%,rgba(255,255,255,.85) 100%)}
.porte.soins h3{color:#14264a}
.porte.soins p{color:#4a5872}
.porte.soins .sur-titre,.porte.soins .lien{color:#9a7432}
.porte.soins img.logo-porte{position:relative;inset:auto;width:150px;height:150px;object-fit:contain;margin:28px auto 0;transform:none}
.porte.soins:hover img.logo-porte{transform:none}
body.clair .titre-page.mer{padding-top:70px}
body.clair .titre-page.mer img.fond{opacity:1;object-position:center 40%}
body.clair .titre-page.mer::after{background:linear-gradient(180deg,rgba(255,255,255,.35) 0%,rgba(255,255,255,.78) 45%,#fff 100%)}
.porte.soins{background:#fff}
.porte.soins::after{background:linear-gradient(180deg,rgba(255,255,255,0) 15%,rgba(255,255,255,.88) 58%,#fff 100%)}

/* Rituels en bandeaux, comme l'affiche */
.bandes{display:flex;flex-direction:column;margin-top:36px;border-top:1px solid var(--or);text-align:left}
.bande{position:relative;min-height:200px;display:flex;align-items:center;overflow:hidden;border-bottom:1px solid var(--or);background:#07090e}
.bande img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.bande::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(7,9,14,.94) 0%,rgba(7,9,14,.78) 42%,rgba(7,9,14,.15) 80%,rgba(7,9,14,0) 100%)}
.bande.droite{justify-content:flex-end;text-align:right}
.bande.droite::after{background:linear-gradient(270deg,rgba(7,9,14,.94) 0%,rgba(7,9,14,.78) 42%,rgba(7,9,14,.15) 80%,rgba(7,9,14,0) 100%)}
.bande .texte{position:relative;z-index:1;padding:26px max(22px,5vw);max-width:34rem}
.bande .nom-rituel{font-family:'Jost',sans-serif;font-weight:600;font-size:.82rem;letter-spacing:.24em;text-transform:uppercase;color:var(--or-clair)}
.bande h3{font-size:clamp(1.7rem,4vw,2.3rem);margin:.25rem 0 .2rem}
.bande p{font-style:italic;color:var(--creme-2);margin:0 0 .35rem}
.bande .massage{font-family:'Jost',sans-serif;font-weight:600;font-size:.75rem;letter-spacing:.18em;text-transform:uppercase;color:var(--or-clair)}
@media (max-width:600px){
  .bande{min-height:190px}
  .bande::after,.bande.droite::after{background:linear-gradient(90deg,rgba(7,9,14,.92) 0%,rgba(7,9,14,.7) 60%,rgba(7,9,14,.25) 100%)}
  .bande.droite::after{background:linear-gradient(270deg,rgba(7,9,14,.92) 0%,rgba(7,9,14,.7) 60%,rgba(7,9,14,.25) 100%)}
}
@media (min-width:821px){.bande{min-height:240px}}

/* Univers Spa : les laminaires en fond */
.titre-page.laminaires{padding:110px 0 80px}
.titre-page.laminaires img.fond{opacity:.85;object-position:center 20%}
.titre-page.laminaires::after{background:linear-gradient(180deg,rgba(7,9,14,.15) 0%,rgba(7,9,14,.55) 55%,var(--nuit) 100%)}

/* Pourquoi Steredenn */
.pourquoi{position:relative;overflow:hidden;text-align:center}
.pourquoi img.fond{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.8}
.pourquoi::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 50% 50%,rgba(7,9,14,.62) 0%,rgba(7,9,14,.45) 75%)}
.pourquoi .conteneur{position:relative;z-index:1;max-width:44rem}
.pourquoi p{font-size:1.08rem;color:var(--creme)}
.pourquoi .accent{color:var(--or-clair);font-weight:600}
.pourquoi .vous{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:clamp(1.9rem,5vw,2.6rem);margin:1.2rem 0 .6rem}
.etoiles{color:var(--or);letter-spacing:.6em;font-size:.8rem;margin:.6rem 0 1.4rem}
.video{max-width:420px;margin:30px auto 0;border-radius:18px;overflow:hidden;border:1px solid var(--ligne)}
.video video{width:100%;display:block;background:#000}

/* Univers Spa : listes sur fond nuit, sans encadrés */
.liste{max-width:46rem}
.liste .titre-groupe{margin-top:34px}
.massage-vedette{text-align:center;padding:10px 0 6px}
.massage-vedette .grand-titre{font-family:'Cormorant Garamond',serif;font-weight:600;font-size:clamp(2.2rem,7vw,3.2rem);line-height:1.1;margin:0}
.massage-vedette .grand-prix{font-weight:600;font-size:clamp(1.6rem,5vw,2.1rem);margin:.3rem 0 1rem}
.massages-liste{list-style:none;margin:0 auto;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:10px;max-width:34rem}
.massages-liste li{font-family:'Jost',sans-serif;font-weight:600;font-size:.85rem;letter-spacing:.16em;text-transform:uppercase;padding:9px 16px;border:1px solid var(--ligne);border-radius:999px;color:var(--creme)}
.bandeau-photo.grand{min-height:520px}
.bandeau-photo.grand .texte{max-width:34rem;padding:40px max(22px,5vw)}
.bandeau-photo.grand::after{background:linear-gradient(90deg,rgba(7,9,14,.9) 0%,rgba(7,9,14,.7) 55%,rgba(7,9,14,.25) 100%)}
.bandeau-photo .ligne-tarif{border-bottom-color:rgba(242,180,67,.3)}
.bandeau-photo .ligne-tarif .nom{font-size:.98rem}
.bandeau-photo .petit{font-size:.88rem;color:var(--creme-2);margin-top:12px}
@media (max-width:600px){.bandeau-photo.grand::after{background:linear-gradient(180deg,rgba(7,9,14,.35) 0%,rgba(7,9,14,.62) 35%,rgba(7,9,14,.62) 100%)}}

/* Portes de l'accueil : les logos nuit et clair */
.porte .logo-porte{position:relative;inset:auto;z-index:1;width:min(190px,48vw);height:auto;aspect-ratio:1;object-fit:contain;margin:34px auto 0;transform:none}
.porte:hover .logo-porte{transform:none}
.porte.spa img:first-child{opacity:.55}
.porte.soins img:first-child{opacity:.5}
.porte{justify-content:space-between}

/* Univers Soins : présentation */
.presentation .intro{font-size:1.08rem}
.citation{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:clamp(1.7rem,5vw,2.3rem);margin:1.4rem 0 0}

/* Mentions légales */
.mentions h2{font-size:1.6rem;margin:2rem 0 .5rem}
.mentions p{color:var(--creme-2)}

/* Logos : jamais déformés */
.hero .logo{height:auto}
.marque img{object-fit:contain}

/* Portes de l'accueil : les visuels des deux univers */
.porte-logo{display:flex;flex-direction:column;align-items:center;gap:14px;text-decoration:none;border-radius:18px;overflow:hidden;border:1px solid rgba(242,180,67,.3);background:#07090e;padding-bottom:22px}
.porte-logo.clair{background:#fff}
.porte-logo img{width:100%;height:auto;aspect-ratio:1;object-fit:cover}
.porte-logo .lien{font-family:'Jost',sans-serif;font-weight:600;font-size:.85rem;letter-spacing:.2em;text-transform:uppercase;color:var(--or-clair)}
.porte-logo.clair .lien{color:#9a7432}

/* Galerie du lieu */
.galerie{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-top:30px}
.galerie img{width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:12px}
@media (min-width:821px){.galerie{grid-template-columns:repeat(4,1fr)}}

/* Visuels (affiches) : format d'origine, sans recadrage */
.visuels{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin:10px 0 26px;align-items:start}
.visuels img{width:100%;height:auto;border-radius:12px}
@media (min-width:821px){.visuels.quatre{grid-template-columns:repeat(4,1fr)}}
.galerie + .visuels{margin-top:12px}

/* Déroulé du soin (rituels) */
.deroule{margin-top:12px}
.deroule summary{cursor:pointer;list-style:none;display:inline-block;font-family:'Jost',sans-serif;font-weight:600;font-size:.75rem;letter-spacing:.2em;text-transform:uppercase;color:var(--or-clair);border-bottom:1px solid var(--or);padding-bottom:3px}
.deroule summary::-webkit-details-marker{display:none}
.deroule summary::after{content:" +"}
.deroule[open] summary::after{content:" –"}
.deroule[open]{background:rgba(7,9,14,.88);border:1px solid var(--ligne);border-radius:12px;padding:14px 16px;margin-top:12px;text-align:left}
.deroule .deroule-intro{font-style:italic;color:var(--creme-2);margin:10px 0 6px}
.deroule ol{margin:0;padding-left:1.2em;color:var(--creme)}
.deroule li{margin:.45em 0;font-size:.96rem;line-height:1.45}
.deroule .deroule-reserver{margin:14px 0 2px}
.deroule .deroule-produits{font-family:'Jost',sans-serif;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gris);margin:10px 0 0}
.bande:has(.deroule[open]){align-items:flex-start}
.affiche-horaires{width:min(340px,80%);height:auto;margin:6px auto 0;border-radius:12px}

/* Fond fixe : la mer d'Audierne au coucher du soleil, sur toutes les pages */
body{background:#07090e}
body::before{content:"";position:fixed;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(7,9,14,.45) 0%,rgba(7,9,14,.62) 60%,rgba(7,9,14,.72) 100%),url(img/hero-audierne.webp) center 45%/cover no-repeat}
@media (min-width:821px){body::before{background:linear-gradient(180deg,rgba(7,9,14,.45) 0%,rgba(7,9,14,.62) 60%,rgba(7,9,14,.72) 100%),url(img/hero-audierne-large.webp) center 45%/cover no-repeat}}
.hero picture{display:none}
.hero::after{background:linear-gradient(180deg,rgba(7,9,14,0) 40%,rgba(7,9,14,.35) 100%)}
:root{--nuit-2:rgba(7,9,14,.55)}
.titre-page::after{background:linear-gradient(180deg,rgba(7,9,14,.15),rgba(7,9,14,.35))}
.titre-page img.fond{opacity:.6}

/* Univers Soins : même mer, voile clair */
body.clair{background:#fff}
body.clair::before{background:linear-gradient(180deg,rgba(255,255,255,.55) 0%,rgba(255,255,255,.82) 45%,rgba(255,255,255,.86) 100%),url(img/hero-audierne.webp) center 45%/cover no-repeat}
body.clair{--nuit-2:rgba(255,255,255,.85)}
body.clair .titre-page::after{background:linear-gradient(180deg,rgba(255,255,255,.2),rgba(255,255,255,.55))}
body.clair .carte{background:rgba(255,255,255,.88)}

/* Infos pratiques sur les laminaires */
.infos-laminaires{position:relative;overflow:hidden}
.infos-laminaires img.fond{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.infos-laminaires::after{content:"";position:absolute;inset:0;background:rgba(7,9,14,.12)}
.infos-laminaires .conteneur{position:relative;z-index:1}
.infos-laminaires .info{background:rgba(7,9,14,.45);border-color:rgba(242,180,67,.45);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}
.infos-laminaires .info p{color:#f4efe6}
.videos{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;margin-top:30px}
.videos .video{margin:0 auto;width:100%}
.avant-apres{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:24px;align-items:start}
.avant-apres img{width:100%;height:auto;border-radius:10px}
@media (max-width:600px){.avant-apres{grid-template-columns:repeat(3,1fr);gap:6px}}
.liens-resa{display:flex;flex-direction:column;gap:12px;max-width:28rem;margin:26px auto 0}
.liens-resa .bouton{width:100%}

/* Bons cadeaux */
.visuel-cadeau{width:min(360px,80%);height:auto;margin:22px auto 0;border-radius:14px}
.cadeau{display:grid;gap:6px;max-width:30rem;margin:26px auto 0;text-align:left}
.cadeau label{font-family:'Jost',sans-serif;font-weight:600;font-size:.75rem;letter-spacing:.16em;text-transform:uppercase;color:var(--or-clair);margin-top:10px}
[hidden]{display:none!important}
.cadeau input,.cadeau select{font:inherit;font-size:1rem;padding:12px 14px;border-radius:10px;border:1px solid var(--ligne);background:rgba(7,9,14,.6);color:var(--creme);width:100%}
.cadeau input:focus,.cadeau select:focus{outline:2px solid var(--or);outline-offset:1px}
.cheque{position:relative;container-type:inline-size;max-width:720px;margin:12px auto 0;border-radius:10px;overflow:hidden;box-shadow:0 18px 50px rgba(0,0,0,.45);text-align:left}
.cheque img{width:100%;height:auto;display:block}
.ch-champ{position:absolute;left:48%;right:5%;font-family:'Cormorant Garamond',serif;font-style:italic;font-weight:500;font-size:3.1cqw;line-height:1.2;color:#14264a;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cheque-gauche{background:radial-gradient(circle at 50% 30%,#13203a 0%,#0a0f1c 70%);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:18px 10px;text-align:center}
.cheque-gauche img{width:72%;height:auto}
.cheque-resa{font-family:'Jost',sans-serif;font-size:.55rem;letter-spacing:.3em;text-transform:uppercase;color:#c9a15a;margin:12px 0 2px}
.cheque-tel{font-family:'Jost',sans-serif;font-weight:600;font-size:clamp(.6rem,2.6vw,.85rem);white-space:nowrap;color:#f2d7a1;margin:0}
.cheque-adr{font-family:'Jost',sans-serif;font-size:.6rem;color:#cfd3dc;margin:6px 0 0;line-height:1.4}
.cheque-droite{background:#fff;color:#2a2d33;padding:18px 20px 14px}
.cheque-titre{font-family:'Jost',sans-serif;font-weight:600;font-size:clamp(1.2rem,4vw,1.9rem);letter-spacing:.02em;color:#2a2d33;margin:0 0 6px}
.cheque-ligne{display:flex;align-items:baseline;gap:10px;border-bottom:1px solid #8a8d93;padding:7px 0 2px}
.cheque-ligne span{flex:0 0 28%;font-family:'Jost',sans-serif;font-size:.55rem;letter-spacing:.12em;text-transform:uppercase;color:#4a4d55}
.cheque-ligne em{font-family:'Cormorant Garamond',serif;font-size:clamp(.95rem,3vw,1.3rem);color:#14264a;overflow-wrap:anywhere}
.cheque-note{font-family:'Jost',sans-serif;font-size:.5rem;color:#6a6d75;margin:10px 0 0}
.prix-cadeau{margin:16px 0 0;font-size:1.1rem}
.cheque-exemple{width:100%;max-width:640px;height:auto;margin:12px auto 0;border-radius:10px;box-shadow:0 18px 50px rgba(0,0,0,.45)}
.vitruve{width:min(280px,70%);height:auto;margin:0 auto 18px;border-radius:14px}
.etoile-laminaires{width:min(340px,80%);height:auto;margin:0 auto 22px;border-radius:14px}
.visuel-rituels,.visuel-presso{width:min(480px,100%);height:auto;margin:30px auto 0;border-radius:14px}
.cheque-gauche{padding:0;background:#05070d;display:block}
.cheque-gauche{display:flex;align-items:center}
.cheque-gauche img{width:100%;height:auto;display:block}
.presso-bloc{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:28px;align-items:center;margin-top:26px;text-align:left}
.presso-bloc img{width:100%;height:auto;border-radius:14px}
.presso-texte p{color:var(--creme-2)}
.presso-texte strong{color:var(--or-clair)}
.presso-texte .petit{font-size:.92rem;margin-top:12px}
@media (max-width:820px){.presso-bloc{grid-template-columns:1fr}}

/* Bandeau des marques : orange feuille d'automne */
.marques{overflow:hidden;background:linear-gradient(90deg,#8c3a10,#c9621c 30%,#e0882c 50%,#c9621c 70%,#8c3a10);border-bottom:1px solid rgba(255,214,150,.55);white-space:nowrap;box-shadow:0 2px 14px rgba(140,58,16,.35)}
.marques-piste{display:inline-flex;gap:26px;padding:9px 0;animation:defile 32s linear infinite;font-family:'Jost',sans-serif;font-weight:600;font-size:.78rem;letter-spacing:.22em;text-transform:uppercase;color:#fff8ec}
.marques-piste span:nth-child(odd){color:#fff8ec;text-shadow:0 1px 2px rgba(80,25,5,.45)}
.marques-piste span:nth-child(even){color:#5a1f06}
@keyframes defile{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.marques-piste{animation:none}}
.visuel-large{width:100%;max-width:520px;height:auto;margin:26px auto 0;border-radius:14px}
.agenda{margin:26px auto 0;max-width:900px;border-radius:14px;overflow:hidden;border:1px solid var(--ligne);background:#0e131c}
.agenda iframe{width:100%;height:760px;border:0;display:block}
.bandeau-photo.photo-haut{flex-direction:column;align-items:stretch;background:rgba(7,9,14,.85)}
.bandeau-photo.photo-haut img{position:static;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover}
.bandeau-photo.photo-haut::after{display:none}
.bandeau-photo.photo-haut .texte{max-width:none;padding:24px max(22px,4vw) 28px}
@media (min-width:821px){.bandeau-photo.photo-haut{flex-direction:row}.bandeau-photo.photo-haut img{width:55%;aspect-ratio:auto}}

/* Chatbot */
.visuellement-cache{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.chat-bulle{position:fixed;right:max(16px,env(safe-area-inset-right));bottom:calc(16px + env(safe-area-inset-bottom));z-index:40;border:1px solid #f2b443;border-radius:999px;padding:12px 18px;background:#0e131c;color:#ffd36b;font-family:'Jost',sans-serif;font-weight:600;font-size:.8rem;letter-spacing:.12em;text-transform:uppercase;box-shadow:0 8px 24px rgba(0,0,0,.45);cursor:pointer}
.chat-fenetre{position:fixed;right:max(16px,env(safe-area-inset-right));bottom:calc(76px + env(safe-area-inset-bottom));z-index:41;width:min(360px,calc(100vw - 32px));height:min(480px,70vh);display:flex;flex-direction:column;background:#0b0f1a;border:1px solid rgba(242,180,67,.5);border-radius:16px;overflow:hidden;box-shadow:0 18px 50px rgba(0,0,0,.6)}
.chat-fenetre[hidden]{display:none}
.chat-tete{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;background:#141b2a;font-family:'Cormorant Garamond',serif;font-size:1.25rem;color:#ffd36b}
.chat-fermer{background:none;border:0;color:#f4efe6;font-size:1.6rem;cursor:pointer;line-height:1}
.chat-fil{flex:1;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:8px}
.chat-msg{margin:0;padding:10px 12px;border-radius:12px;max-width:85%;font-size:.95rem;line-height:1.45;white-space:pre-wrap}
.chat-msg.bot{background:#151d2e;color:#f4efe6;align-self:flex-start}
.chat-msg.moi{background:#f2b443;color:#07090e;align-self:flex-end}
.chat-msg.attente{opacity:.6}
.chat-form{display:flex;gap:8px;padding:10px;border-top:1px solid rgba(242,180,67,.25)}
.chat-form input{flex:1;min-width:0;font:inherit;font-size:.95rem;padding:10px 12px;border-radius:10px;border:1px solid rgba(242,180,67,.4);background:#07090e;color:#f4efe6}
.chat-form button{border:0;border-radius:10px;padding:0 14px;background:#f2b443;color:#07090e;font-family:'Jost',sans-serif;font-weight:600;cursor:pointer}
@media (max-width:820px){.chat-bulle{bottom:calc(78px + env(safe-area-inset-bottom))}.chat-fenetre{bottom:calc(134px + env(safe-area-inset-bottom))}}
body.clair .chat-bulle{background:#fff;color:#9a7432;border-color:#9a7432}
.bandeau-photo.photo-haut img.affiche-spa{aspect-ratio:auto;height:auto;object-fit:contain;background:#07090e}
@media (min-width:821px){.bandeau-photo.photo-haut img.affiche-spa{width:45%}}
.pied{padding-bottom:90px}
@media (max-width:820px){.chat-bulle{bottom:calc(16px + env(safe-area-inset-bottom))}.chat-fenetre{bottom:calc(76px + env(safe-area-inset-bottom))}}

/* Spa privatif réservé aux soins, liens vers les fiches */
.reserve-soin{display:inline-block;margin:.2rem 0 .9rem;padding:7px 14px;border:1px solid var(--or);border-radius:999px;font-family:'Jost',sans-serif;font-weight:600;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--or-clair);background:rgba(242,180,67,.1)}
.lien-fiche{font-family:'Jost',sans-serif;font-weight:600;font-size:.82rem;letter-spacing:.08em;text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:2px}
.lien-fiche:hover{color:#fff}

/* Fiche règlement & précautions */
.fiche .carte{margin-bottom:22px}
.fiche-liste{margin:.4rem 0 0;padding:0;list-style:none}
.fiche-liste li{position:relative;padding:8px 0 8px 26px;border-bottom:1px solid rgba(242,180,67,.14);color:var(--creme-2)}
.fiche-liste li:last-child{border-bottom:0}
.fiche-liste li::before{content:"✦";position:absolute;left:0;top:9px;color:var(--or);font-size:.8rem}
.fiche-liste strong{color:var(--creme)}
.carte.alerte{border-color:rgba(224,136,44,.6);background:linear-gradient(180deg,rgba(140,58,16,.22),rgba(13,17,28,.9))}
.carte.alerte .fiche-liste li::before{content:"!";font-family:'Jost',sans-serif;font-weight:700;color:#e0882c}

/* Accueil : coucher de soleil jusqu'aux deux univers, laminaires ensuite, plage pour finir */
.zone-laminaires{position:relative;clip-path:inset(0)}
.zone-laminaires::before{content:"";position:fixed;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(7,9,14,.6),rgba(7,9,14,.72)),url(img/laminaires.webp) center/cover no-repeat}
.zone-laminaires>.section{background:transparent}
.zone-laminaires>.section+.section{border-top:1px solid rgba(242,180,67,.14)}
.infos-plage{position:relative;padding-bottom:110px}
.infos-plage .info{background:rgba(7,9,14,.5);border-color:rgba(242,180,67,.45);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
.infos-plage .info p{color:#f4efe6}

/* Mouvement */
@keyframes respire{0%{transform:scale(1.02)}100%{transform:scale(1.12)}}
@keyframes monte{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}
@keyframes rayonne{0%,100%{filter:drop-shadow(0 0 10px rgba(255,211,107,.25))}50%{filter:drop-shadow(0 0 28px rgba(255,211,107,.65))}}
@keyframes reflet{0%{background-position:-160% 0}60%,100%{background-position:260% 0}}
@media (prefers-reduced-motion:no-preference){
  .hero picture img{animation:respire 22s ease-in-out infinite alternate}
  .hero .logo{animation:monte 1.1s ease-out both,rayonne 5s ease-in-out 1.1s infinite}
  .hero h1{animation:monte 1.1s ease-out .25s both}
  .hero .intro{animation:monte 1.1s ease-out .45s both}
  .hero .boutons,.hero .infos-rapides{animation:monte 1.1s ease-out .65s both}
  .bouton:not(.ligne){background-image:linear-gradient(110deg,transparent 35%,rgba(255,255,255,.55) 50%,transparent 65%),linear-gradient(180deg,#ffe57f,#f2b443);background-size:250% 100%,100% 100%;background-repeat:no-repeat;animation:reflet 5.5s ease-in-out infinite}
  body.clair .bouton:not(.ligne){background-image:linear-gradient(110deg,transparent 35%,rgba(255,255,255,.45) 50%,transparent 65%),linear-gradient(180deg,#caa35c,#9a7432)}
  .bouton{transition:transform .25s ease,box-shadow .25s ease}
  .bouton:hover{transform:translateY(-2px);box-shadow:0 10px 26px rgba(242,180,67,.3)}
  .porte-logo{transition:transform .5s cubic-bezier(.2,.7,.2,1),box-shadow .5s ease}
  .porte-logo:hover{transform:translateY(-8px) scale(1.02);box-shadow:0 22px 50px rgba(242,180,67,.28)}
  .visuel-large,.presso-bloc img{transition:transform .8s cubic-bezier(.2,.7,.2,1)}
  .visuel-large:hover,.presso-bloc img:hover{transform:scale(1.02)}
  .js .apparait{opacity:0;transform:translateY(34px);transition:opacity .9s ease,transform .9s cubic-bezier(.2,.7,.2,1)}
  .js .apparait.visible{opacity:1;transform:none}
}

/* Accueil : photos du lieu, carte résumée, avant/après */
.lieu-duo{display:flex;justify-content:center;align-items:center;gap:14px;margin-top:8px}
.lieu-duo img{height:clamp(220px,28vw,340px);width:auto;max-width:100%;min-width:0}
@media (max-width:820px){.lieu-duo{flex-direction:column}.lieu-duo img{height:auto;width:100%}}
.carte-resume{max-width:44rem;margin:10px auto 0;text-align:left;background:rgba(7,9,14,.55);border:1px solid rgba(242,180,67,.28);border-radius:18px;padding:12px 24px 6px;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
.carte-resume .mention{text-align:center}
.photo-sauna{display:block;width:100%;max-width:760px;margin:26px auto 0;border-radius:18px;border:1px solid rgba(242,180,67,.3)}
.avant-apres-accueil{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;max-width:760px;margin:0 auto}
.avant-apres-accueil img{width:100%;border-radius:14px;border:1px solid rgba(242,180,67,.3)}
@media (max-width:560px){.avant-apres-accueil{gap:6px}}

/* Bulle du chat : une petite étoile qui danse */
.chat-bulle{display:inline-flex;align-items:center;gap:9px;padding:6px 18px 6px 9px}
.chat-etoile{width:34px;height:34px;flex:none;filter:drop-shadow(0 0 6px rgba(80,200,195,.55));overflow:visible}
@keyframes cligne{0%,92%,100%{transform:scaleY(1)}95%{transform:scaleY(.1)}}
@keyframes danse{0%,100%{transform:rotate(0) scale(1)}20%{transform:rotate(18deg) scale(1.15)}40%{transform:rotate(-12deg) scale(.92)}60%{transform:rotate(10deg) scale(1.1)}80%{transform:rotate(-6deg) scale(1)}}
@keyframes scintille{0%,100%{opacity:.2;transform:scale(.6)}50%{opacity:1;transform:scale(1)}}
@media (prefers-reduced-motion:no-preference){
  .chat-etoile .astre{transform-box:fill-box;transform-origin:center;animation:danse 3.2s ease-in-out infinite}
  .chat-etoile .eclat{transform-box:fill-box;transform-origin:center;animation:scintille 1.8s ease-in-out infinite}
  .chat-etoile .eclat.deux{animation-delay:.9s}
  .chat-etoile .yeux{transform-box:fill-box;transform-origin:center;animation:cligne 4s infinite}
}
body.clair .chat-etoile{filter:drop-shadow(0 2px 4px rgba(42,157,152,.35))}
@media (min-width:821px){.menu{gap:14px}.menu a{font-size:.74rem;letter-spacing:.1em}}
@media (min-width:821px) and (max-width:1300px){.marque span{display:none}}
.ligne-tarif{grid-template-columns:minmax(0,1fr) auto auto}
.ligne-tarif .nom{min-width:0;overflow-wrap:break-word}
@media (max-width:520px){.carte-resume{padding:8px 16px 4px}.carte-resume .ligne-tarif{gap:2px 10px}}
.sous-titre-duo{font-family:'Jost',sans-serif;font-weight:500;font-size:.8rem;letter-spacing:.22em;text-transform:uppercase;color:var(--creme-2);margin:.6rem 0 0}

/* Écouter l'océan */
.ocean{display:inline-flex;align-items:center;gap:10px;margin:0 auto 18px;padding:8px 18px;border:1px solid rgba(244,239,230,.45);border-radius:999px;background:rgba(7,9,14,.35);color:var(--creme);font-family:'Jost',sans-serif;font-weight:500;font-size:.75rem;letter-spacing:.22em;text-transform:uppercase;cursor:pointer;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
.ocean:hover{border-color:var(--or)}
.ocean-icone{width:18px;height:12px;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 12'%3E%3Cpath d='M1 4c2-2 3-2 4 0s2 2 4 0 3-2 4 0 2 2 4 0M1 9c2-2 3-2 4 0s2 2 4 0 3-2 4 0 2 2 4 0' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 12'%3E%3Cpath d='M1 4c2-2 3-2 4 0s2 2 4 0 3-2 4 0 2 2 4 0M1 9c2-2 3-2 4 0s2 2 4 0 3-2 4 0 2 2 4 0' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E") center/contain no-repeat}
.ocean[aria-pressed="true"]{border-color:#5cc9c2;color:#9be6e0}
@media (prefers-reduced-motion:no-preference){.ocean[aria-pressed="true"] .ocean-icone{animation:vague 2.4s ease-in-out infinite}}
@keyframes vague{0%,100%{transform:translateX(0)}50%{transform:translateX(3px)}}

/* Réserver : l'Univers Spa en turquoise, comme le soleil du logo */
.liens-resa .bouton:not(.ligne){background:linear-gradient(180deg,#6fd3cc,#2a9d98);border-color:#2a9d98;color:#07131a}
.liens-resa .bouton:not(.ligne):hover{color:#07131a;filter:brightness(1.08)}

/* Univers Spa : la carte des soins sur le bleu de la cabine */
.carte-bleue{background:linear-gradient(180deg,rgba(7,9,14,.5),rgba(7,9,14,.62)),url(img/lieu-ciel-etoile-bleu.webp) center/cover no-repeat}
.photo-spa-haut{margin:6px auto 30px}

/* Rituels du monde sur l'accueil : bandes d'origine, séparées par un espace */
.rituels-accueil{margin-top:30px}
.rituels-accueil .bandes{margin-top:0;border-top:0;gap:18px}
.rituels-accueil .bande{border:1px solid rgba(242,180,67,.45);border-radius:16px}
.photo-sauna-haut{margin:0 auto 26px}

/* Univers Soins : la carte des tarifs sur la cabine de soins (mur en bois), en écho au bleu de l'Univers Spa */
.carte-ambre{background:linear-gradient(180deg,rgba(7,9,14,.5),rgba(7,9,14,.62)),url(img/lieu-cabine-bois.webp) center 35%/cover no-repeat;border-color:rgba(242,180,67,.4)}
@media (max-width:520px){
  .carte-resume .ligne-tarif{grid-template-columns:minmax(0,1fr) auto}
  .carte-resume .ligne-tarif .prix{grid-column:2;grid-row:1}
  .carte-resume .ligne-tarif .duree{grid-column:1;grid-row:2}
  .carte-resume .ligne-tarif .desc{grid-row:3}
  .carte-resume .ligne-tarif .nom{overflow-wrap:normal;hyphens:auto}
}

/* Pressothérapie : visuel du soin + avant/après, explications */
.presso-visuels{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;max-width:980px;margin:6px auto 0}
.presso-photo{position:relative;margin:0;border-radius:16px;overflow:hidden;border:1px solid rgba(242,180,67,.3);aspect-ratio:1}
.presso-photo img{width:100%;height:100%;object-fit:cover}
.aa-etiquette{position:absolute;top:12px;padding:5px 12px;border-radius:999px;background:rgba(7,9,14,.7);font-family:'Jost',sans-serif;font-weight:600;font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:#fff}
.aa-g{left:12px}.aa-d{right:12px}
.presso-aa figcaption{position:absolute;left:0;right:0;bottom:0;padding:26px 14px 14px;background:linear-gradient(transparent,rgba(7,9,14,.88));font-family:'Jost',sans-serif;font-weight:500;font-size:.8rem;letter-spacing:.16em;text-transform:uppercase;color:#f4efe6;text-align:center}
.presso-aa figcaption strong{color:#ffd36b;font-weight:600}
.presso-science{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;max-width:980px;margin:36px auto 0;text-align:left}
.presso-point{padding:22px 20px;border:1px solid rgba(242,180,67,.25);border-radius:16px;background:rgba(7,9,14,.55)}
.presso-point .chiffre{font-family:'Cormorant Garamond',serif;font-weight:600;font-size:2.6rem;line-height:1;margin:0;color:#ffd36b}
.presso-point .chiffre span{font-size:1.1rem;margin:0 6px;color:var(--creme-2)}
.presso-point .titre-point{font-family:'Jost',sans-serif;font-weight:600;font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:var(--creme);margin:8px 0 10px}
.presso-point p:last-child{margin:0;color:var(--creme-2);font-size:.95rem;line-height:1.5}
.presso-effet{max-width:44rem;margin:26px auto 0;font-size:1.05rem;color:var(--creme)}
.presso-effet strong{color:#ffd36b;font-weight:600}
.presso-tarifs{max-width:36rem;margin:26px auto 0;text-align:left}
@media (max-width:820px){.presso-visuels{grid-template-columns:1fr;max-width:460px}.presso-science{grid-template-columns:1fr}}

/* Bande blanche des marques, entre l'Univers Spa et l'Univers Soins */
.bande-marques{overflow:hidden;white-space:nowrap;background:#fff;border-top:1px solid rgba(154,116,50,.35);border-bottom:1px solid rgba(154,116,50,.35)}
.bande-marques-piste{display:inline-flex;align-items:center;gap:34px;padding:16px 0;animation:defile 16s linear infinite;font-family:'Jost',sans-serif;font-weight:600;font-size:.95rem;letter-spacing:.32em;text-transform:uppercase;color:#14264a}
.bande-marques-piste .point{color:#9a7432;font-size:.8rem}
@media (prefers-reduced-motion:reduce){.bande-marques-piste{animation:none}}
.galerie-groupes .galerie{margin-top:0}
.galerie-groupes .galerie+.galerie{margin-top:46px;padding-top:46px;border-top:1px solid rgba(242,180,67,.25)}

/* Réserver : deux univers, même style, nom du soin + détail */
.resa-univers{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;max-width:980px;margin:30px auto 0;text-align:left}
.resa-groupe{display:flex;flex-direction:column;gap:10px}
.resa-titre{font-family:'Jost',sans-serif;font-weight:600;font-size:.8rem;letter-spacing:.28em;text-transform:uppercase;color:var(--or-clair);margin:0 0 4px;padding-bottom:8px;border-bottom:1px solid rgba(242,180,67,.4)}
.resa-lien{display:flex;flex-direction:column;gap:3px;padding:16px 20px;border:1px solid rgba(242,180,67,.45);border-radius:14px;background:rgba(7,9,14,.55);text-decoration:none;transition:border-color .3s,background .3s,transform .3s}
.resa-lien:hover{border-color:#ffd36b;background:rgba(242,180,67,.1);transform:translateY(-2px)}
.resa-nom{font-family:'Cormorant Garamond',serif;font-weight:600;font-size:1.35rem;color:#f7f2ea}
.resa-nom::after{content:" →";color:#ffd36b}
.resa-detail{font-size:.9rem;color:var(--creme-2);font-style:italic}
.resa-voir{margin-top:4px;font-family:'Jost',sans-serif;font-weight:600;font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;color:var(--or-clair);text-decoration:none}
.apercu-note{font-style:italic;color:var(--creme-2);font-size:.95rem;margin:22px auto 0;max-width:36rem}
@media (max-width:820px){.resa-univers{grid-template-columns:1fr}}

/* Univers Soins : focus sur un soin (photo + explications) */
.focus-soin{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:30px;align-items:center;margin-top:40px;text-align:left}
.focus-soin>img{width:100%;height:auto;border-radius:16px}
.focus-texte h3{margin:.2rem 0 .8rem}
.focus-liste{margin:.6rem 0 1rem;padding-left:1.2em}
.focus-liste li{margin:.35em 0}
@media (max-width:820px){.focus-soin{grid-template-columns:1fr}}
.galerie img.large{grid-column:span 2;aspect-ratio:auto;height:100%;object-fit:cover;object-position:center 30%}
@media (max-width:820px){.galerie img.large{aspect-ratio:4/3;height:auto}}

/* Accueil : les trois technologies de l'Univers Soins */
.techno-trio{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;max-width:980px;margin:30px auto 0}
.techno-trio a{display:flex;flex-direction:column;gap:10px;text-decoration:none}
.techno-trio img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:14px;border:1px solid rgba(242,180,67,.3);transition:transform .5s}
.techno-trio a:hover img{transform:translateY(-4px)}
.techno-trio span{font-family:'Jost',sans-serif;font-weight:600;font-size:.75rem;letter-spacing:.18em;text-transform:uppercase;color:var(--or-clair);text-align:center}
@media (max-width:620px){.techno-trio{grid-template-columns:1fr;max-width:420px}}

/* Déroulés sur fond clair (Univers Soins) */
.ligne-tarif .deroule{grid-column:1/-1}
body.clair .deroule[open]{background:#fff;border-color:rgba(154,116,50,.35)}
body.clair .deroule ol{color:#14264a}
body.clair .deroule .deroule-intro{color:#4a5872}
.marques-piste{animation-duration:24s}

/* Réserver : couleurs des deux univers */
.resa-spa .resa-lien{background:linear-gradient(180deg,rgba(7,9,14,.35),rgba(7,9,14,.5)),url(img/lieu-ciel-etoile-bleu.webp) center/cover no-repeat;border-color:rgba(120,150,255,.55)}
.resa-spa .resa-lien:hover{border-color:#ffd36b;background:linear-gradient(180deg,rgba(7,9,14,.2),rgba(7,9,14,.4)),url(img/lieu-ciel-etoile-bleu.webp) center/cover no-repeat}
.resa-spa .resa-detail{color:#e6ecff}
.resa-soins .resa-lien{background:linear-gradient(135deg,#ffffff 0%,#f6f8fb 100%);border-color:rgba(154,116,50,.55)}
.resa-soins .resa-lien:hover{background:linear-gradient(135deg,#ffffff 0%,#eef2f8 100%);border-color:#9a7432}
.resa-soins .resa-nom{color:#14264a}
.resa-soins .resa-nom::after{color:#9a7432}
.resa-soins .resa-detail{color:#4a5872}

/* Boutique */
.lien-boutique{margin:14px 0 0}
.lien-boutique a{font-family:'Jost',sans-serif;font-weight:600;font-size:.8rem;letter-spacing:.16em;text-transform:uppercase;color:var(--or-clair);text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:2px}
.produits{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,240px),1fr));gap:20px;text-align:left}
.produit{display:flex;flex-direction:column;gap:6px;padding:16px;border:1px solid rgba(242,180,67,.3);border-radius:16px;background:rgba(7,9,14,.6)}
.produit img{width:100%;aspect-ratio:1;object-fit:contain;border-radius:12px;background:#fff;margin-bottom:6px}
.produit-marque{margin:0;font-family:'Jost',sans-serif;font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--or-clair)}
.produit h3{font-size:1.35rem}
.produit-desc{margin:0;color:var(--creme-2);font-size:.92rem;flex:1}
.produit-prix{margin:6px 0;font-family:'Cormorant Garamond',serif;font-weight:600;font-size:1.5rem;color:#f7f2ea}
.produit .bouton:disabled{opacity:.5;cursor:default}
.prix-garanti{display:inline-block;margin:14px 0 0;padding:8px 18px;border:1px solid rgba(242,180,67,.5);border-radius:999px;font-size:.92rem;color:var(--creme-2)}
.prix-garanti strong{font-family:'Jost',sans-serif;font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;color:var(--or-clair)}
.prix-garanti a{color:var(--or-clair)}
.produit-vignettes{display:flex;flex-wrap:wrap;gap:6px;margin:-2px 0 6px}
.produit-vignettes img{width:48px;height:48px;aspect-ratio:1;margin:0;border-radius:8px;cursor:pointer;border:1px solid rgba(242,180,67,.3)}
.produit-info{border-top:1px solid rgba(242,180,67,.2);padding:6px 0;font-size:.88rem;color:var(--creme-2)}
.produit-info summary{cursor:pointer;font-family:'Jost',sans-serif;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--or-clair)}
.produit-info p{margin:6px 0 2px;white-space:pre-line}
.produit-ref{margin:4px 0 0;font-family:'Jost',sans-serif;font-size:.7rem;letter-spacing:.12em;color:var(--creme-2)}
.merci{max-width:40rem;margin:0 auto 30px;padding:16px 20px;border:1px solid var(--or);border-radius:14px;background:rgba(242,180,67,.12)}
.panier-bouton{position:fixed;left:max(16px,env(safe-area-inset-left));bottom:calc(16px + env(safe-area-inset-bottom));z-index:40;border:1px solid var(--or);border-radius:999px;padding:13px 20px;background:var(--or);color:#07090e;font-family:'Jost',sans-serif;font-weight:600;font-size:.8rem;letter-spacing:.12em;text-transform:uppercase;cursor:pointer}
.panier{position:fixed;left:max(16px,env(safe-area-inset-left));bottom:calc(76px + env(safe-area-inset-bottom));z-index:41;width:min(380px,calc(100vw - 32px));max-height:70vh;overflow:auto;padding:18px;background:#0b0f1a;border:1px solid rgba(242,180,67,.5);border-radius:16px;box-shadow:0 18px 50px rgba(0,0,0,.6)}
.panier-tete{display:flex;justify-content:space-between;align-items:center;font-family:'Cormorant Garamond',serif;font-size:1.4rem}
.panier-tete button{background:none;border:0;color:var(--creme);font-size:1.6rem;cursor:pointer}
.panier ul{list-style:none;margin:12px 0;padding:0}
.panier li{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:10px;align-items:center;padding:8px 0;border-bottom:1px solid rgba(242,180,67,.2);font-size:.92rem}
.panier li .q button{width:26px;height:26px;border-radius:50%;border:1px solid var(--or);background:none;color:var(--creme);cursor:pointer}
.panier-total{margin:6px 0}
.panier-livraison{border:0;margin:4px 0 8px;padding:0;display:grid;gap:8px;font-size:.9rem}
.panier-livraison label{display:flex;align-items:center;gap:8px;cursor:pointer}
.panier-livraison input{accent-color:var(--or)}
.panier-livraison span{margin-left:auto;color:var(--or);white-space:nowrap}
.panier-note{font-size:.85rem;color:var(--creme-2)}
.panier .bouton{width:100%}
.panier-erreur{color:#ffb38a;font-size:.9rem;margin:10px 0 0}
.cadeau-erreur{color:#ffb38a;margin:12px 0 0}
.cadeau-merci{max-width:36rem;margin:16px auto 0;padding:14px 18px;border:1px solid var(--or);border-radius:14px;background:rgba(242,180,67,.12)}
/* Boutique : fiches produits blanches sur la mer au coucher du soleil */
.boutique-claire{color:#14264a}
.boutique-claire .produit{background:#fff;border-color:rgba(154,116,50,.28);box-shadow:0 14px 40px rgba(0,0,0,.35)}
.boutique-claire .produit img{background:#fff}
.boutique-claire .produit-marque,.boutique-claire .produit-info summary{color:#9a7432}
.boutique-claire .produit h3,.boutique-claire .produit-prix{color:#14264a}
.boutique-claire .produit-desc,.boutique-claire .produit-info,.boutique-claire .produit-ref{color:#4a5872}
.boutique-claire .produit-info{border-top-color:rgba(154,116,50,.22)}
.boutique-claire .produit-vignettes img{border-color:rgba(154,116,50,.3)}
.boutique-claire .merci{color:#14264a}
.boutique-claire .boutique-vide h2,.boutique-claire .boutique-vide .intro{color:#14264a}
/* ===== Boutique moderne : fond nacré, étoile 3D, produits animés ===== */
body.boutique-page{background:#fff}
body.boutique-page::before{background:radial-gradient(ellipse at 50% -10%,#ffffff 0%,rgba(255,255,255,0) 60%),linear-gradient(180deg,#ffffff 0%,#ffffff 40%,#f3f5f8 100%)}
@media (min-width:821px){body.boutique-page::before{background:radial-gradient(ellipse at 50% -10%,#ffffff 0%,rgba(255,255,255,0) 60%),linear-gradient(180deg,#ffffff 0%,#ffffff 40%,#f3f5f8 100%)}}
/* reflets dorés qui scintillent doucement */
body.boutique-page::after{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.55;
  background-image:radial-gradient(circle,rgba(212,169,84,.55) 0 1.5px,transparent 2.5px),radial-gradient(circle,rgba(212,169,84,.4) 0 1px,transparent 2px);
  background-size:220px 260px,140px 170px;background-position:20px 40px,90px 10px;animation:scintille 6s ease-in-out infinite alternate}
@keyframes scintille{from{opacity:.25}to{opacity:.6}}
.boutique-page .titre-page.boutique-titre{padding:56px 0 50px;background:radial-gradient(ellipse at 50% 42%,#a8520f 0%,#933f0a 38%,#7a2c06 72%,#6a2204 100%);border-bottom:1px solid rgba(255,214,140,.35)}
.boutique-page .boutique-titre .sur-titre{color:#ffd98a}
.boutique-page .boutique-titre .intro{color:#f8ebd8}
.boutique-page .boutique-titre .prix-garanti{background:rgba(255,255,255,.1);border-color:rgba(255,217,138,.55);color:#f8ebd8;box-shadow:none}
.boutique-page .boutique-titre .prix-garanti strong,.boutique-page .boutique-titre .prix-garanti a{color:#ffd98a}
.boutique-page .titre-page.boutique-titre::after{display:none}
.boutique-page .prix-garanti{background:#fff;border-color:rgba(154,116,50,.4);color:#4a5872;box-shadow:0 6px 20px rgba(154,116,50,.1)}
.boutique-page .prix-garanti strong{color:#9a7432}
.boutique-page .panier{background:#fff;border-color:rgba(154,116,50,.45);box-shadow:0 18px 50px rgba(20,38,74,.18)}
.boutique-page .panier-tete button,.boutique-page .panier li .q button{color:#14264a}
.boutique-page .panier-bouton{background:linear-gradient(180deg,#caa35c,#9a7432);border-color:#9a7432;color:#fff}
.boutique-page .panier-bouton.rebond{animation:rebond .6s}
@keyframes rebond{30%{transform:scale(1.15)}60%{transform:scale(.95)}}

/* Étoile en or poli « La boutique Steredenn » : se balance doucement, brille et scintille */
.etoile-titre{margin:0 0 4px}
.etoile-3d{display:block;position:relative;width:min(330px,76vw);aspect-ratio:1;margin:0 auto;perspective:900px}
.etoile-or{display:block;width:100%;height:100%;animation:balance 7s ease-in-out infinite,lueur 3.5s ease-in-out infinite}
@keyframes balance{0%,100%{transform:rotateY(-20deg) translateY(0)}50%{transform:rotateY(20deg) translateY(-8px)}}
@keyframes lueur{0%,100%{filter:brightness(1) drop-shadow(0 16px 20px rgba(40,10,0,.45))}50%{filter:brightness(1.1) drop-shadow(0 20px 26px rgba(40,10,0,.5))}}
.etoile-3d .eclat{position:absolute;opacity:0;animation:eclat 3.6s ease-in-out infinite;filter:drop-shadow(0 0 5px rgba(255,230,160,1))}
@keyframes eclat{0%,100%{opacity:0;transform:scale(.3) rotate(0)}15%{opacity:1;transform:scale(1) rotate(45deg)}35%{opacity:0;transform:scale(.3) rotate(90deg)}}
@media (prefers-reduced-motion:reduce){.etoile-or,.etoile-3d .eclat{animation:none}}

/* Fiches produits : entrée animée, inclinaison 3D, visuel qui se retourne */
.boutique-page .produits{gap:26px}
.boutique-claire .produit{box-shadow:0 18px 45px rgba(20,38,74,.10);transform-style:preserve-3d;transition:transform .25s ease,box-shadow .25s ease,opacity .7s ease}
.boutique-claire .produit.cache-entree{opacity:0;transform:translateY(40px)}
.boutique-claire .produit:hover{box-shadow:0 26px 60px rgba(20,38,74,.16)}
.produit .reflet{position:absolute;inset:0;border-radius:16px;pointer-events:none;opacity:0;transition:opacity .3s;background:radial-gradient(circle at var(--rx,50%) var(--ry,50%),rgba(255,255,255,.55),rgba(255,255,255,0) 45%)}
.produit:hover .reflet{opacity:1}
.produit{position:relative}
.produit-visuel{position:relative;perspective:900px;margin-bottom:6px;cursor:grab;touch-action:pan-y;user-select:none;-webkit-user-select:none}
.produit-visuel:active{cursor:grabbing}
.produit-tourne{position:relative;transform-style:preserve-3d;transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.produit-tourne.glisse{transition:none}
.produit-tourne img{display:block;margin:0!important;backface-visibility:hidden;-webkit-backface-visibility:hidden;-webkit-user-drag:none;box-shadow:0 1px 0 rgba(154,116,50,.15)}
.produit-tourne img.verso{position:absolute;inset:0;transform:rotateY(180deg)}
.produit-tourne.invite{animation:invite 1.6s ease-in-out .3s 1}
@keyframes invite{30%{transform:rotateY(-28deg)}65%{transform:rotateY(12deg)}100%{transform:rotateY(0)}}
.tourner{position:absolute;right:10px;bottom:10px;z-index:2;display:flex;align-items:center;gap:6px;border:1px solid rgba(154,116,50,.45);border-radius:999px;padding:6px 12px;background:rgba(255,255,255,.92);color:#9a7432;font-family:'Jost',sans-serif;font-weight:600;font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;cursor:pointer;box-shadow:0 4px 14px rgba(20,38,74,.12)}
.tourner:hover{background:#9a7432;color:#fff}
.produit .bouton.ajoute{background:linear-gradient(180deg,#5d8a6a,#3f6b4d);border-color:#3f6b4d;color:#fff}
@media (prefers-reduced-motion:reduce){.produit-tourne.invite{animation:none}.boutique-claire .produit.cache-entree{opacity:1;transform:none}}
/* Accueil de la boutique sur fond noir, bokeh doré et poussière d'or (choisi par Valérie) */
.boutique-page.fond-noir .titre-page.boutique-titre{background:
  radial-gradient(circle at 22% 38%,rgba(214,120,40,.32) 0 26px,transparent 46px),
  radial-gradient(circle at 78% 30%,rgba(214,120,40,.28) 0 34px,transparent 58px),
  radial-gradient(circle at 70% 70%,rgba(200,105,30,.22) 0 22px,transparent 40px),
  radial-gradient(circle at 30% 74%,rgba(200,105,30,.2) 0 30px,transparent 52px),
  radial-gradient(circle at 12% 18%,rgba(214,120,40,.18) 0 16px,transparent 30px),
  radial-gradient(circle at 90% 82%,rgba(214,120,40,.18) 0 18px,transparent 34px),
  radial-gradient(ellipse at 50% 40%,rgba(255,170,70,.22) 0%,rgba(255,170,70,0) 45%),
  radial-gradient(ellipse at 50% 100%,#1a120b 0%,#0c0a08 55%,#050404 100%);
  border-bottom-color:rgba(242,193,78,.35)}
.boutique-page.fond-noir .titre-page.boutique-titre::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.6;background:url(boutique/poussiere-or.webp) 0 0/900px 600px repeat;animation:poussiere 40s linear infinite}
@keyframes poussiere{to{background-position:0 -600px}}
.boutique-page.fond-noir .boutique-titre .intro{color:#e9dcc6}
.boutique-page.fond-noir .boutique-titre .prix-garanti{background:rgba(255,255,255,.04)}
/* Boutique : carrousel simple des visuels produits */
.produit-visuel{position:relative;margin-bottom:8px;border-radius:12px;overflow:hidden;background:#fff}
.produit-visuel .carrousel{overflow:hidden}
.produit-visuel .piste{display:flex;transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.produit-visuel .piste img{flex:0 0 100%;width:100%;aspect-ratio:1;object-fit:cover;margin:0!important;border-radius:0;user-select:none;-webkit-user-drag:none}
.produit-visuel .fleche{position:absolute;top:50%;transform:translateY(-50%);width:28px;height:28px;opacity:.85;border-radius:50%;border:1px solid rgba(154,116,50,.4);background:rgba(255,255,255,.92);color:#9a7432;font-size:22px;line-height:1;cursor:pointer;box-shadow:0 4px 12px rgba(20,38,74,.12)}
.produit-visuel .prec{left:4px}.produit-visuel .suiv{right:4px}
.produit-visuel .piste img{cursor:zoom-in}
@media (hover:hover){.produit-visuel .fleche{opacity:0;transition:opacity .2s}.produit-visuel:hover .fleche{opacity:.95}}
/* Zoom plein écran */
.zoom{position:fixed;inset:0;z-index:60;display:flex;align-items:center;justify-content:center;background:rgba(7,9,14,.86);padding:16px}
.zoom[hidden]{display:none}
.zoom img{max-width:min(92vw,900px);max-height:86vh;border-radius:14px;background:#fff;box-shadow:0 30px 80px rgba(0,0,0,.5)}
.zoom button{position:absolute;border:0;background:rgba(255,255,255,.12);color:#fff;font-size:30px;width:48px;height:48px;border-radius:50%;cursor:pointer}
.zoom .z-fermer{top:16px;right:16px}.zoom .z-prec{left:16px;top:50%;transform:translateY(-50%)}.zoom .z-suiv{right:16px;top:50%;transform:translateY(-50%)}
.produit-visuel .points{position:absolute;left:0;right:0;bottom:8px;display:flex;justify-content:center;gap:6px}
.produit-visuel .points button{width:8px;height:8px;padding:0;border-radius:50%;border:0;background:rgba(20,38,74,.25);cursor:pointer}
.produit-visuel .points button.actif{background:#9a7432;width:20px;border-radius:4px}
/* Boutique : couleurs « laboratoire » vert d'eau (gamme des étiquettes D-LAB) au lieu du doré, prix barrés et badges de remise */
.boutique-page{--labo:#9fd8c8;--labo-fonce:#2f7f6f;--ardoise:#25323a}
.boutique-claire .produit{border-color:rgba(47,127,111,.22)}
.boutique-claire .produit-marque,.boutique-claire .produit-info summary{color:var(--labo-fonce)}
.boutique-claire .produit-info{border-top-color:rgba(47,127,111,.18)}
.boutique-claire .produit h3,.boutique-claire .produit-prix{color:var(--ardoise)}
.boutique-claire .produit .bouton{background:var(--ardoise);border-color:var(--ardoise);color:#fff;box-shadow:none}
.boutique-claire .produit .bouton:hover{background:var(--labo-fonce);border-color:var(--labo-fonce)}
.boutique-claire .produit .bouton.ajoute{background:var(--labo-fonce);border-color:var(--labo-fonce)}
.boutique-page .produit-visuel .points button.actif{background:var(--labo-fonce)}
.boutique-page .produit-visuel .fleche{color:var(--ardoise);border-color:rgba(47,127,111,.35)}
.boutique-page .panier-bouton{background:var(--ardoise);border-color:var(--ardoise);color:#fff}
.boutique-page .panier{border-color:rgba(47,127,111,.4)}
.boutique-page .panier .bouton{background:var(--ardoise);border-color:var(--ardoise);color:#fff}
.boutique-page .panier li .q button{border-color:var(--labo-fonce)}
.boutique-page .panier-livraison span{color:var(--labo-fonce)}
.boutique-page .panier-livraison input{accent-color:var(--labo-fonce)}
.boutique-page .panier-tete,.boutique-page .panier,.boutique-page .panier li{color:var(--ardoise)}
.produit-prix{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px}
.prix-actuel{font-size:1.75rem;font-weight:600}
.prix-barre{font-family:'Jost',sans-serif;font-size:1rem;color:#8a949b}
.prix-eco{font-family:'Jost',sans-serif;font-weight:600;font-size:.82rem;letter-spacing:.04em;color:#fff;background:#d6453d;border-radius:4px;padding:3px 7px}
.prix-ref-mention{flex-basis:100%;font-family:'Jost',sans-serif;font-size:.74rem;letter-spacing:.02em;color:var(--labo-fonce)}
.badge-remise{position:absolute;top:10px;left:10px;z-index:2;font-family:'Jost',sans-serif;font-weight:700;font-size:.95rem;color:#fff;background:#d6453d;border-radius:6px;padding:6px 10px;box-shadow:0 4px 12px rgba(214,69,61,.35)}
.boutique-page .boutique-claire .produit .bouton:not(.ligne),.boutique-page .panier .bouton:not(.ligne){background-image:linear-gradient(110deg,transparent 35%,rgba(255,255,255,.22) 50%,transparent 65%),linear-gradient(180deg,#33454e,#25323a);border-color:#25323a;color:#fff}
.boutique-page .boutique-claire .produit .bouton:not(.ligne):hover{background-image:linear-gradient(180deg,#3a9482,#2f7f6f);border-color:#2f7f6f}
.boutique-page .boutique-claire .produit .bouton.ajoute{background-image:none;background:#2f7f6f}
/* Bandeau « bonnes affaires » qui défile, badges qui pulsent */
.bandeau-affaires{overflow:hidden;background:#25323a;color:#fff;border-radius:999px;margin:0 auto 26px;max-width:1100px;box-shadow:0 10px 30px rgba(37,50,58,.18)}
.bandeau-affaires .piste-affaires{display:flex;gap:42px;width:max-content;padding:12px 0;animation:defile-affaires 28s linear infinite;font-family:'Jost',sans-serif;font-weight:600;font-size:.82rem;letter-spacing:.14em;text-transform:uppercase;white-space:nowrap}
.bandeau-affaires b{color:#9fd8c8}
.bandeau-affaires .flash{display:inline-block;background:#d6453d;color:#fff;border-radius:4px;padding:2px 8px;margin-right:8px;animation:flash 1.4s ease-in-out infinite}
@keyframes defile-affaires{to{transform:translateX(-50%)}}
@keyframes flash{0%,100%{opacity:1}50%{opacity:.45}}
.badge-remise{animation:pulse-remise 2.2s ease-in-out infinite}
@keyframes pulse-remise{0%,100%{transform:scale(1)}50%{transform:scale(1.1)}}
@media (prefers-reduced-motion:reduce){.bandeau-affaires .piste-affaires,.bandeau-affaires .flash,.badge-remise{animation:none}}
/* Bandeau cookies (mesure d'audience) */
#bandeau-cookies{position:fixed;left:16px;right:16px;bottom:calc(16px + env(safe-area-inset-bottom));z-index:80;max-width:640px;margin:0 auto;padding:16px 18px;background:#0b0f1a;color:#f4efe6;border:1px solid rgba(242,180,67,.45);border-radius:14px;box-shadow:0 18px 50px rgba(0,0,0,.45);font-family:'Jost',sans-serif;font-size:.88rem;line-height:1.5}
#bandeau-cookies p{margin:0 0 12px}
#bandeau-cookies a{color:#ffd36b}
#bandeau-cookies .bc-boutons{display:flex;gap:10px;justify-content:flex-end}
#bandeau-cookies button{border-radius:999px;padding:9px 20px;font:600 .8rem 'Jost',sans-serif;letter-spacing:.1em;text-transform:uppercase;cursor:pointer}
#bandeau-cookies .bc-refuser{background:transparent;color:#f4efe6;border:1px solid rgba(244,239,230,.5)}
#bandeau-cookies .bc-accepter{background:#f2b443;color:#07090e;border:1px solid #f2b443}