/* ===== Base ===== */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body, html {
  font-size: 16px;
  height: 100%;
  font-family: sans-serif;
  background: #c3c2aa; /* beige */
  color: #3d6053;      /* turquoise foncé */
  /*#9bb49e  turquoise clair */
  /*#a5c6b0  turquoise clair + vif */
  /*#c8b59c  brun */
}

/* ===== Slideshow ===== */
.slideshow-container {
  position: fixed;
  top: 0; left: 0;
  width: 100%; height: 100%;
  overflow: hidden;
  z-index: 0;
}
.slide {
  position: absolute;
  width: 100%; height: 100%;
  object-fit: cover;
  opacity: 0;
  transition: opacity 2s ease;
}
.slide.active { opacity: 1; }

/* ===== Contenu principal ===== */
.content {
  position: relative;
  z-index: 1;
  /*padding: 100vh 2rem 3.5rem; /* 3.5rem pour éviter le footer fixé */
  padding: 25vh 2rem 3.5rem;
  /*background: rgba(255, 255, 255, 0.20);*/
  color: #111;
  scroll-margin-top: 5rem; /* ancre confortable sous header */
}
.content h1 {
  font-size: 3rem;
  margin-bottom: 1rem;
}
.content section { margin: 4rem 0; }

/* ===== Responsif titres écran/smartphone ===== */
.smartphone { display: none; }

/* Smartphone */
@media (max-width: 640px) {
  /* La taille de base suit la largeur d'écran, avec garde-fous */
  html { font-size: clamp(10px, 3vw, 15px); }

  /* Optionnel : éviter les auto-agrandissements iOS */
  body { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }

  /* Ton existant */
  .screen { display: none; }
  .smartphone { display: inline-block; }
  .content { padding: 2.5rem 1rem; }
}

/* ===== Header / Footer (fichiers séparés) ===== */
/* header.css et footer.css externes — inchangés */

/* ===== Wellness (scopé) ===== */
.wellness{
  --ink:#3d6053;             /* texte principal */
  --ink-muted:#295043cc;     /* texte adouci */
  --line:#a5c6b0;            /* bordures */
  --chip:#c8b59c22;          /* pastilles */
  --card:#ffffff;            /* cartes sur fond clair */
  --shadow:#a5c6b055;        /* ombre douce */
  --btn-bg:#a5c6b0;          /* bouton principal */
  --btn-ink:#1f2f29;         /* texte bouton */
  --btn-bg-hover:#9bb49e;    /* hover bouton */
  color:var(--ink);
}
.wellness .w-container{max-width:1100px;margin:0 auto;padding:2rem 1rem}

.wellness .w-container {
  display: grid;            /* important : empile les enfants */
  position: relative;
}

.wellness .w-container > .page {
  grid-area: 1 / 1;         /* superposition */
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .4s ease, visibility 0s linear .4s;
  will-change: opacity;
}

.wellness .w-container > .page.visible {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition: opacity .4s ease, visibility 0s linear 0s;
}

@media (prefers-reduced-motion: reduce) {
  .wellness .w-container > .page {
    transition: none;
  }
}


.wellness .w-hero{display:grid;gap:.75rem;margin-bottom:1.5rem;text-align:center;

  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 1rem;
  box-shadow: 0 6px 20px var(--shadow);
  
}
.wellness .w-eyebrow{
  display:inline-flex;align-items:center;gap:.5rem;justify-content:center;
  align-self:center;padding:.35rem .7rem;border:1px dashed var(--line);
  border-radius:999px;font-size:.8rem;color:var(--ink-muted);background:var(--chip)
}
.wellness .w-title{font-size:clamp(1.8rem,4vw,2.4rem);line-height:1.2;margin:0}
.wellness .w-sub{color:var(--ink-muted);max-width:900px;margin:0 auto}
.wellness .w-chips{display:flex;flex-wrap:wrap;gap:.5rem;justify-content:center;margin-top:.5rem}
.wellness .w-chip{
  display: inline-flex;align-items: center;
  background:var(--chip);border:1px solid var(--line);border-radius:999px;
  padding: 0em .7rem;font-size:.8rem;color:var(--ink-muted);
  line-height: 0;
}

.wellness .w-grid{display:grid;gap:1rem;margin-top:1rem}
@media (min-width:900px){.wellness .w-grid.cols-3{grid-template-columns:1.1fr 1fr 1fr}}
@media (min-width:900px){.wellness .w-grid.cols-2{grid-template-columns:1fr 1fr}}

.wellness .w-card{
  background:var(--card);border:1px solid var(--line);border-radius:16px;
  padding:1rem;box-shadow:0 6px 20px var(--shadow)
}
.wellness .w-card h3{margin:0 0 .5rem 0;font-size:1.05rem}
.wellness .w-card p{margin:.25rem 0;color:var(--ink)}
.wellness .w-card a{margin:.25rem 0;color:var(--ink)}
.wellness .w-list{list-style:none;margin:.25rem 0 0;padding:0;display:grid;gap:.5rem}
.wellness .w-li{display:flex;gap:.6rem}
/*.wellness .w-ico{flex:0 0 1.2rem}*/

.wellness .w-ico {
  flex: 0 0 1.2rem;
  text-align: right;
  font-size: 2rem;
  line-height: 1rem;
  color: #95ae9b;
}

.wellness .w-sep{
  height:1px;background:linear-gradient(90deg,transparent, var(--line), transparent);
  margin:1.25rem 0
}

.wellness .w-pricing{display:grid;gap:1rem}
@media (min-width:900px){.wellness .w-pricing{grid-template-columns:repeat(3,1fr)}}
.wellness .w-price-card{position:relative;overflow:hidden}
.wellness .w-badge{
  position:absolute;top:.8rem;right:.8rem;background:#a5c6b0;color:#20342d;
  font-weight:700;padding:.35rem .6rem;border-radius:999px;font-size:.75rem;border:1px solid #89a597
}
.wellness .w-price{font-size:1.6rem;font-weight:800;margin:.4rem 0 .15rem 0}
.wellness .w-muted{color:var(--ink-muted)}

.wellness .w-mini-grid{display:grid;gap:1rem}
@media (min-width:800px){.wellness .w-mini-grid{grid-template-columns:1fr 1fr}}

.wellness .w-table{width:100%;border-collapse:separate;border-spacing:0 .5rem;margin-top:.25rem}
.wellness .w-table tr{background:#ffffff}
.wellness .w-table td{
  padding:.6rem .75rem;border-top:1px solid var(--line);border-bottom:1px solid var(--line)
}
.wellness .w-table tr td:first-child{border-left:1px solid var(--line);border-top-left-radius:10px;border-bottom-left-radius:10px}
.wellness .w-table tr td:last-child{border-right:1px solid var(--line);border-top-right-radius:10px;border-bottom-right-radius:10px;text-align:right}

.wellness .w-cta{margin-top:.75rem;display:flex;flex-wrap:wrap;gap:.6rem}
.wellness .w-btn{
  display:inline-flex;align-items:center;gap:.5rem;border-radius:12px;padding:.7rem .9rem;
  border:1px solid var(--line);text-decoration:none;color:var(--ink);background:#ffffff;
  box-shadow:0 4px 12px var(--shadow);transition:background .15s ease, transform .05s ease
}
.wellness .w-btn:hover{background:#ffffffee}
.wellness .w-btn:active{transform:translateY(1px)}
.wellness .w-btn.primary{background:var(--btn-bg);color:var(--btn-ink);border-color:#8fb5a6}
.wellness .w-btn.primary:hover{background:var(--btn-bg-hover)}

.wellness .w-foot{font-size:.85rem;color:var(--ink-muted);margin-top:.5rem}

/* Carré de navigation bas-droite */
:root { --footer-safe: 4rem; }                 /* marge au-dessus du footer fixe */
@media (max-width: 640px){ :root { --footer-safe: 5rem; } }

.corner-nav{
  position: fixed;
  right: 1rem;
  bottom: var(--footer-safe);
  z-index: 2001;                               /* au-dessus du header/footer (1000) */
  /*background: #fff;*/
  border: 1px solid #a5c6b0;                   /* turquoise clair */
  box-shadow: 0 6px 18px #a5c6b055;
  border-radius: 12px;
  overflow: hidden;                             /* pour la séparation propre */
  display: grid;
  grid-template-rows: 1fr 1fr;                  /* 2 boutons empilés */
}

/* Boutons ^ et v */
.corner-btn{
  width: 54px;
  height: 48px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  font: inherit;
  line-height: 1;                               /* évite le “vide” baseline */
  background: #ffffff;
  color: #3d6053;                               /* turquoise foncé */
  border: 0;
  cursor: pointer;
  transition: background .15s ease, transform .05s ease;
}

/* séparateur entre ^ et v */
.corner-btn + .corner-btn{
  border-top: 1px solid #a5c6b0;
}

.corner-btn:hover{ background: #ffffffee; }
.corner-btn:active{ transform: translateY(1px); }
.corner-btn:focus-visible{
  outline: 3px solid #a5c6b0;
  outline-offset: -3px;                         /* reste à l’intérieur du carré */
}

.corner-btn.inactive{ opacity: 0.4; }

/* Touch targets un peu plus grands sur mobile */
@media (max-width: 640px){
  .corner-btn{ width: 60px; height: 56px; }
}

/* Impression : pas de bouton */
@media print{
  .corner-nav{ display: none; }
}