/* ==========================================================
   Centre de Santé Bernissart - design v2 (couleurs, typographie, mouvement)
   Se charge apres design.css, sans le modifier.
   Chargee par wp-content/novamira-sandbox/site-design-2.php :
   retirer ce fichier PHP annule l'ensemble.
   ========================================================== */

:root {
  --sb2-ink: #12282f;        /* petrole profond : remplace le noir, s'accorde au logo */
  --sb2-ink-2: #1b3a44;
  --sb2-text: #41535a;
  --sb2-teal: #1c6b78;
  --sb2-accent: #d7f24e;
  --sb2-surface: #f4f6f1;
  --sb2-line: #e0e5dc;
  --sb2-radius: 16px;
  --sb2-shadow: 0 1px 2px rgba(18,40,47,.05), 0 10px 28px rgba(18,40,47,.08);
  --sb2-shadow-up: 0 2px 4px rgba(18,40,47,.06), 0 18px 40px rgba(18,40,47,.14);
  --sb2-ease: cubic-bezier(.22,.8,.28,1);
  --sb-ink: var(--sb2-ink);
  --sb-ink-soft: var(--sb2-text);
  --sb-surface: var(--sb2-surface);
  --sb-line: var(--sb2-line);
}

/* ---------- Navigation fluide ---------- */
html { scroll-behavior: smooth; scroll-padding-top: 110px; }
@view-transition { navigation: auto; }
::view-transition-old(root), ::view-transition-new(root) { animation-duration: .22s; }
::selection { background: var(--sb2-accent); color: var(--sb2-ink); }

/* ---------- Typographie ---------- */
body { color: var(--sb2-text); text-rendering: optimizeLegibility; }

h1, h2, h3, h4,
.elementor-heading-title { text-wrap: balance; }

.elementor-widget-heading h2.elementor-heading-title,
.elementor-widget-heading h3.elementor-heading-title,
.elementor-widget-heading h4.elementor-heading-title,
.elementskit-info-box-title {
  color: var(--sb2-ink) !important;
}
h2.elementor-heading-title {
  font-size: clamp(30px, 3.6vw, 46px) !important;
  line-height: 1.12 !important;
  letter-spacing: -.018em;
}
h3.elementor-heading-title {
  line-height: 1.2 !important;
  letter-spacing: -.012em;
}
.elementor-element-76dc128 h3.elementor-heading-title {
  font-size: clamp(34px, 4.4vw, 56px) !important;
}

.elementor-widget-text-editor,
.elementor-widget-text-editor p,
.elementor-widget-text-editor li {
  font-size: clamp(16px, .35vw + 14.6px, 17.5px) !important;
  line-height: 1.7 !important;
  color: var(--sb2-text);
}
.elementor-widget-text-editor p { max-width: 68ch; text-wrap: pretty; }
.elementor-widget-text-editor p:last-child { margin-bottom: 0; }
.elementor-widget-text-editor[style*="center"] p,
.elementor-widget-text-editor .has-text-align-center { margin-inline: auto; }
.elementor-widget-text-editor a {
  color: var(--sb2-teal);
  text-decoration: underline;
  text-decoration-color: var(--sb2-accent);
  text-decoration-thickness: 2px;
  text-underline-offset: 3px;
}

/* ---------- En-tete de page : lisible avant meme l'arrivee de la photo ---------- */
.site-main .elementor > .elementor-element:first-child:has(h1) {
  position: relative;
  background-color: var(--sb2-ink) !important;
}
.site-main .elementor > .e-con:first-child:has(h1)::before {
  content: "";
  position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background: linear-gradient(100deg, rgba(18,40,47,.72) 0%, rgba(18,40,47,.34) 52%, rgba(18,40,47,.04) 100%);
}
.site-main .elementor > .e-con:first-child:has(h1) > * { position: relative; z-index: 1; }
.site-main .elementor > .elementor-element:first-child h1.elementor-heading-title {
  color: #fff !important;
  line-height: 1.04 !important;
  letter-spacing: -.022em;
  font-size: clamp(40px, 6vw, 76px) !important;
}

/* Accueil : une seule voix, deux tailles qui se repondent */
.elementor-element-34c1439e .elementor-background-overlay {
  background-image: linear-gradient(100deg, rgba(18,40,47,.86) 0%, rgba(18,40,47,.52) 56%, rgba(18,40,47,.2) 100%) !important;
  opacity: 1 !important;
}
.site-main .elementor > .elementor-element:first-child .elementor-element-5c60954a h1.elementor-heading-title {
  font-size: clamp(26px, 3vw, 40px) !important;
  font-weight: 300 !important;
  letter-spacing: -.01em;
}
.site-main .elementor > .elementor-element:first-child .elementor-element-af47b8a h1.elementor-heading-title {
  font-size: clamp(42px, 5.6vw, 78px) !important;
  font-weight: 700 !important;
}
.elementor-element-d41a1ac h2.elementor-heading-title { font-size: 26px !important; }
.elementor-element-fd5fa6e p {
  color: rgba(255,255,255,.92) !important;
  font-size: clamp(17px, 1.4vw, 20px) !important;
  line-height: 1.55 !important;
}
.elementor-element-c53f202, .elementor-element-d41a1ac, .elementor-element-f844b33 { position: relative; }

/* ---------- Boutons ---------- */
.elementor-button, .sbz-sticky-cta, .sb-mbar a, .sb-mbar button {
  transition: background-color .22s var(--sb2-ease), color .22s var(--sb2-ease),
    transform .22s var(--sb2-ease), box-shadow .22s var(--sb2-ease) !important;
}
.elementor-button:hover, .sbz-sticky-cta:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 22px rgba(18,40,47,.2);
}
.elementor-button:active, .sbz-sticky-cta:active { transform: translateY(0) scale(.98); }
.elementor-form .elementor-button[type="submit"]:hover,
.elementor-form .elementor-button[type="submit"]:focus-visible,
.sbz-sticky-cta:hover {
  background-color: var(--sb2-ink) !important;
  border-color: var(--sb2-ink) !important;
}
.sbz-sticky-cta { box-shadow: 0 8px 20px rgba(18,40,47,.18); color: var(--sb2-ink); }

/* ---------- Menu ---------- */
.elementor-nav-menu--main .elementor-item { color: var(--sb2-ink) !important; }
.elementor-nav-menu--main .sub-menu,
.elementor-nav-menu--dropdown {
  border-radius: 12px;
  box-shadow: var(--sb2-shadow-up);
  overflow: hidden;
}
.elementor-nav-menu--main .sub-menu a:hover { background: var(--sb2-surface) !important; color: var(--sb2-ink) !important; }

/* ---------- Blocs de texte en cartes ---------- */
.elementskit-infobox {
  border: 1px solid var(--sb2-line) !important;
  border-radius: var(--sb2-radius) !important;
  box-shadow: var(--sb2-shadow);
  overflow: hidden;
  height: 100%;
  display: flex; flex-direction: column;
  transition: transform .3s var(--sb2-ease), box-shadow .3s var(--sb2-ease), border-color .3s var(--sb2-ease);
}
.elementor-widget-elementskit-icon-box,
.elementor-widget-elementskit-icon-box > .elementor-widget-container,
.elementor-widget-elementskit-icon-box .ekit-wid-con { height: 100%; }
.elementskit-infobox:hover { transform: translateY(-5px); box-shadow: var(--sb2-shadow-up); border-color: transparent; }
.elementskit-infobox .box-body { display: flex; flex-direction: column; flex: 1; }
.elementskit-infobox .elementskit-info-box-title {
  font-family: 'Fraunces', serif !important;
  font-size: 21px !important;
  font-weight: 600 !important;
  line-height: 1.22 !important;
  letter-spacing: -.01em;
}
.elementskit-infobox .box-body p {
  font-size: 15.5px !important;
  line-height: 1.6 !important;
  color: var(--sb2-text) !important;
}
.elementskit-infobox .box-body p:last-of-type { flex: 1 0 auto; }
.elementskit-infobox img { transition: transform .5s var(--sb2-ease); }
.elementskit-infobox:hover img { transform: scale(1.05); }

/* ---------- Couleurs de section ---------- */
.elementor-element-51bea5de { background-color: var(--sb2-surface) !important; }
.elementor-element-7d62c384, .elementor-element-4189650f { background-color: var(--sb2-surface) !important; }

/* Bandeau de chiffres : le contraste qui relance la lecture */
.elementor-element-170810a { background-color: var(--sb2-ink) !important; }
.elementor-element-170810a .elementor-counter .elementor-counter-number-wrapper {
  color: var(--sb2-accent) !important;
  font-family: 'Fraunces', serif !important;
  font-weight: 600 !important;
}
.elementor-element-170810a .elementor-counter .elementor-counter-number-wrapper::after { display: none; }
.elementor-element-170810a .elementor-counter-title { color: rgba(255,255,255,.86) !important; }

/* ---------- Images ---------- */
.elementor-widget-image img { border-radius: var(--sb2-radius); }
.elementor-element-1f49c91c img { border-radius: 0; }

/* ---------- Cartes de symptomes ---------- */
.sb-tile .elementor-icon-box-wrapper { border-color: var(--sb2-line); }
.sb-tile:hover .elementor-icon-box-wrapper,
.sb-tile:focus-within .elementor-icon-box-wrapper {
  background: var(--sb2-ink); border-color: var(--sb2-ink); transform: translateY(-4px); box-shadow: var(--sb2-shadow-up);
}
.sb-tile:hover .elementor-icon-box-title,
.sb-tile:focus-within .elementor-icon-box-title { color: #fff !important; }
.sb-tile:hover .elementor-icon-box-description,
.sb-tile:focus-within .elementor-icon-box-description { color: rgba(255,255,255,.82) !important; }
.sb-tile:hover .elementor-icon-box-wrapper::after,
.sb-tile:focus-within .elementor-icon-box-wrapper::after { color: var(--sb2-accent); }
.sb-tile .elementor-icon-box-title, .sb-tile .elementor-icon-box-description { transition: color .2s ease; }

/* ---------- Pied de page compact ---------- */
.elementor-344 .elementor-element-4189650f { padding: 28px 16px !important; }
.elementor-344 .elementor-widget { margin-bottom: 4px !important; }
.elementor-344 .elementor-widget-image img { max-width: 84px !important; height: auto; border-radius: 0; }
.elementor-344 .elementor-element-a36d476 .elementor-heading-title {
  font-size: 19px !important; line-height: 1.25 !important;
}
.elementor-344 .elementor-element-cf6d08a .elementor-heading-title,
.elementor-344 .elementor-element-6e0c140 .elementor-heading-title,
.elementor-344 .elementor-element-4dcb803 .elementor-heading-title {
  font: 600 12.5px/1.3 'Work Sans', sans-serif !important;
  letter-spacing: .05em; text-transform: uppercase;
  color: var(--sb2-text) !important;
  margin-top: 8px;
}
.elementor-344 .elementor-widget-icon-box .elementor-icon-box-wrapper {
  display: flex !important; flex-direction: row !important;
  align-items: flex-start; gap: 10px; text-align: left !important;
}
.elementor-344 .elementor-widget-icon-box .elementor-icon-box-icon { margin: 2px 0 0 !important; flex: none; }
.elementor-344 .elementor-widget-icon-box .elementor-icon {
  width: 22px; height: 22px; border-radius: 50%;
  background: var(--sb2-accent);
  display: inline-flex !important; align-items: center; justify-content: center;
  font-size: 11px !important; color: var(--sb2-ink) !important;
}
.elementor-344 .elementor-widget-icon-box .elementor-icon svg {
  width: 11px !important; height: 11px !important; fill: var(--sb2-ink) !important;
}
.elementor-344 .elementor-icon-box-title {
  margin: 0 !important; font: 500 15px/1.4 'Work Sans', sans-serif !important; color: var(--sb2-ink) !important;
}
.elementor-344 .elementor-icon-box-title a,
.elementor-344 .elementor-icon-box-title span { color: inherit !important; font: inherit !important; }
.elementor-344 .elementor-icon-box-description {
  margin: 0 !important; font-size: 14px !important; line-height: 1.45 !important; color: var(--sb2-text) !important;
}
.sb-cartes { display: grid; gap: 12px; }
.sb-cartes figure { margin: 0; }
.sb-cartes figcaption {
  font: 600 12.5px/1.3 'Work Sans', sans-serif;
  letter-spacing: .05em; text-transform: uppercase;
  color: var(--sb2-text); margin-bottom: 5px;
}
.sb-cartes iframe { display: block; width: 100%; height: 150px; border: 0; border-radius: 12px; }
@media (max-width: 767px) {
  .sb-cartes { grid-template-columns: 1fr 1fr; gap: 10px; }
  .sb-cartes iframe { height: 140px; }
}

/* Titres au-dessus des cartes de la page Contact */
.sb-map-titre { margin-top: 20px; }
.sb-map-titre h3.elementor-heading-title { font-size: 20px !important; }
.sb-map-wrap iframe { border-radius: 12px; }

/* ---------- Page de reservation ---------- */
.bern-resa .carte { border-color: var(--sb2-line); border-radius: var(--sb2-radius); box-shadow: var(--sb2-shadow); color: var(--sb2-ink); }
.bern-resa h2 { font-family: 'Fraunces', serif; color: var(--sb2-ink); }
.bern-resa .meta { color: var(--sb2-text); }
.bern-resa button {
  border-radius: 999px; border-color: var(--sb2-accent); background: var(--sb2-accent); color: var(--sb2-ink); font-weight: 600;
  transition: background-color .2s ease, color .2s ease, transform .2s ease;
}
.bern-resa button:hover:not(:disabled) { background: var(--sb2-ink); border-color: var(--sb2-ink); color: #fff; transform: translateY(-1px); }
.bern-resa button.second { background: #fff; border-color: var(--sb2-ink); color: var(--sb2-ink); }
.bern-resa .info { background: var(--sb2-surface); color: var(--sb2-ink); }

/* ---------- Apparition au defilement (classes posees par design-v2.js) ---------- */
.sb2-reveal {
  opacity: 0;
  transform: translateY(22px);
  transition: opacity .6s var(--sb2-ease), transform .6s var(--sb2-ease);
  transition-delay: var(--sb2-delay, 0ms);
}
.sb2-reveal.sb2-in { opacity: 1; transform: none; }

/* Barre de progression de lecture */
.sb2-progress {
  position: fixed; left: 0; top: 0; z-index: 10000;
  width: 100%; height: 3px;
  background: var(--sb2-accent);
  transform: scaleX(0); transform-origin: 0 50%;
  pointer-events: none;
}
.admin-bar .sb2-progress { top: 32px; }

@media (max-width: 767px) {
  html { scroll-padding-top: 84px; }
  .elementskit-infobox:hover { transform: none; }
  .elementor-button:hover { transform: none; }
}

/* ---------- Respect des preferences du visiteur ---------- */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  @view-transition { navigation: none; }
  .sb2-reveal { opacity: 1 !important; transform: none !important; transition: none !important; }
  .sb2-progress { display: none; }
  .elementskit-infobox, .elementskit-infobox img, .elementor-button, .sbz-sticky-cta { transition: none !important; }
  .elementskit-infobox:hover, .elementskit-infobox:hover img, .elementor-button:hover { transform: none; }
}
@media print {
  .sb2-reveal { opacity: 1 !important; transform: none !important; }
  .sb2-progress { display: none; }
}