/* === Polices locales Cormorant Garamond === */
@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 400;
  src: url('/assets/fonts/CormorantGaramond-400.woff2') format('woff2');
  font-display: swap;
}

@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 600;
  src: url('/assets/fonts/CormorantGaramond-600.woff2') format('woff2');
  font-display: swap;
}

@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 700;
  src: url('/assets/fonts/CormorantGaramond-700.woff2') format('woff2');
  font-display: swap;
}


/* === Moon & Star — Overrides: Marble background (fixed) + Strong 3D frames + 3D nav === */
html, body { height: 100%; }
body{
  background: url("../assets/marble-with-yellow-veins.jpg") center/cover no-repeat fixed #ffffff !important;
  color: #1a1a1a;
}
body::before{ content:""; position: fixed; inset: 0; pointer-events: none; background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.18)); z-index:0; }

:root{ --gold-871:#C5A253; --gold:#D4AF37; --pane: rgba(255,255,255,.86); }

.frame-3d, .frame, .cadre, .bloc, .block, .card, .panel, .box, .container-3d, .content-frame {
  background: var(--pane);
  border: 3px solid var(--gold-871);
  border-radius: 18px;
  padding: clamp(20px, 3vw, 36px);
  box-shadow: 0 22px 38px rgba(0,0,0,.35), 0 10px 18px rgba(0,0,0,.22), inset 0 3px 9px rgba(255,255,255,.72), inset 0 -5px 12px rgba(0,0,0,.12);
  backdrop-filter: blur(3px);
}
.frame-3d::before, .frame::before, .cadre::before, .bloc::before, .block::before, .card::before, .panel::before, .box::before, .container-3d::before, 
main > section, .section {
  background: rgba(255,255,255,.84);
  border: 2px solid var(--gold-871);
  border-radius: 16px;
  padding: clamp(18px, 3vw, 28px);
  box-shadow: 0 16px 28px rgba(0,0,0,.28), inset 0 2px 6px rgba(255,255,255,.65);
}
nav a, .nav a, .menu a, .navbar a, header nav a, .site-nav a {
  color: #111 !important; font-weight: 800; text-decoration: none;
  text-shadow: 0 1px 0 #fff, 0 2px 6px rgba(0,0,0,.25);
  transition: transform .15s ease, filter .15s ease, text-shadow .15s ease;
}
nav a:hover, .nav a:hover, .menu a:hover, .navbar a:hover, header nav a:hover, .site-nav; a:hover {
  transform: translateY(-1px);
  text-shadow: 0 1px 0 #fff, 0 3px 10px rgba(0,0,0,.35);
  filter: saturate(1.05);
}

 }

/* Prestations: extra spacing after first card */
.page-prestations .card-grid > *:nth-child(n+2){ margin-top: 28px; }
@media (min-width: 700px){ .page-prestations .card-grid { row-gap: 28px; } }

/* Center helper */
.center { display:flex; justify-content:center; align-items:center; gap:10px; flex-wrap:wrap; }




/* Center CTA on home */
.center { display:flex; justify-content:center; align-items:center; gap:10px; flex-wrap:wrap; }







/* Prestations spacing backup */
.page-prestations .card-grid > .card-3d:first-child{ margin-bottom:40px !important; }



/* Center helper */
.center { display:flex; justify-content:center; align-items:center; width:100%; text-align:center; flex-wrap:wrap; }


/* === FORCE H1–H3: Engraved Dark Gold (from flyer) === */
:root {
  --gold-light: #ffd704;
  --gold-mid:   #e4ab00;
  --gold-deep:  #c68500;
}
html body h1, html body h2, html body h3 {
  background-image: linear-gradient(180deg, var(--gold-light) 0%, var(--gold-mid) 38%, var(--gold-deep) 72%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  color: transparent !important;
  text-shadow:
    0 1px 0 rgba(255,255,240,0.95),
    -1px -1px 0 rgba(255,255,220,0.35),
    1px 1px 0 rgba(0,0,0,0.35),
    0 8px 16px rgba(0,0,0,0.30) !important;
  -webkit-text-stroke: 0.7px rgba(70,50,10,0.50);
          text-stroke: 0.7px rgba(70,50,10,0.50);
}
@supports not (-webkit-background-clip: text) {
  html body h1, html body h2, html body h3 {
    color: var(--gold-deep) !important;
    background-image: none !important;
  }
}

.cta-center{display:flex;justify-content:center;align-items:center;width:100%;text-align:center;margin:14px 0}

/* Force H2 titles in black */
html body h2 {
  background: none !important;
  -webkit-background-clip: initial !important;
  background-clip: initial !important;
  color: #000 !important;
  text-shadow: none !important;
  -webkit-text-stroke: 0 !important;
          text-stroke: 0 !important;
}


/* === GLOBAL H1 & H3: Flyer Gold Engraved === */
:root {
  --gold-light: #ffd704;
  --gold-mid:   #e4ab00;
  --gold-deep:  #c68500;
}
html body h1, html body h3 {
  background-image: linear-gradient(180deg, var(--gold-light) 0%, var(--gold-mid) 38%, var(--gold-deep) 72%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  color: transparent !important;
  text-shadow:
    0 1px 0 rgba(255,255,240,0.95),
    -1px -1px 0 rgba(255,255,220,0.35),
    1px 1px 0 rgba(0,0,0,0.35),
    0 8px 16px rgba(0,0,0,0.30) !important;
  -webkit-text-stroke: 0.7px rgba(70,50,10,0.50);
          text-stroke: 0.7px rgba(70,50,10,0.50);
}
@supports not (-webkit-background-clip: text) {
  html body h1, html body h3 {
    color: var(--gold-deep) !important;
    background-image: none !important;
  }
}

/* === Remove decorative lines above H3 === */
html body h3 {
  border: none !important;
  border-top: none !important;
  border-image: none !important;
}
html body h3::before,
html body h3::after {
  display: none !important;
  content: none !important;
  border: none !important;
}

/* CTA centering helper */
.cta-center{display:flex;justify-content:center;align-items:center;width:100%;text-align:center;margin:14px 0}

/* === Remove ALL decorative bars above sections/cards/titles === */
.frame-3d::before,
.frame::before,
.cadre::before,
.bloc::before,
.block::before,
.card::before,
.panel::before,
.box::before,
.container-3d::before,
.content-frame::before,
h3::before,
h3::after {
  display: none !important;
  content: none !important;
  border: none !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}
/* Ensure H3 has no borders either */
h3 {
  border: none !important;
  border-top: none !important;
  border-image: none !important;
}


/* === Footer visibility fix === */
footer.site{
  position: relative !important;
  z-index: 10 !important;
  background: rgba(255,255,255,0.92) !important;
  border-top: 2px solid rgba(0,0,0,0.06) !important;
  box-shadow: 0 -6px 16px rgba(0,0,0,0.12) !important;
  backdrop-filter: blur(2px);
}
footer.site .container{
  padding: 16px 12px !important;
  text-align: center !important;
  color: #111 !important;
  font-weight: 600;
  letter-spacing: .2px;
}
/* Ensure main content sits above background overlay too */
header.site, main, .frame-3d, .card-3d, .container, .content-frame, section, nav{
  position: relative;
  z-index: 5;
}



/* Category sections for prestations (clean) */
.presta-cat{ margin-top: 36px; }
.presta-cat .card-grid{ row-gap: 20px; }
.presta-cat h3{ margin: 0 0 14px 0; }

/* ===== Contact : alignement au reste du site ===== */

/* conteneur étroit cohérent */
.container.narrow,
.contact-section.container {
  max-width: 920px;
  margin-left: auto;
  margin-right: auto;
  padding-left: min(5vw, 24px);
  padding-right: min(5vw, 24px);
}

/* séparation claire entre H1 et tuile */
.page-header { 
  margin: clamp(16px, 4vw, 28px) 0 clamp(18px, 4.8vw, 32px);
}
.page-title {
  margin: 0 0 6px 0;
  line-height: 1.1;
}

/* carte (tuile) formulaire – même 3D que le site */
.card.contact-card {
  background: rgba(255,255,255,0.86);
  backdrop-filter: blur(4px);
  border-radius: 18px;
  padding: clamp(18px, 4.2vw, 28px);
  box-shadow:
    0 14px 28px rgba(0,0,0,0.12),
    0 10px 10px rgba(0,0,0,0.08),
    inset 0 1px 0 rgba(255,255,255,0.6);
  border: 1px solid rgba(0,0,0,0.06);
  margin-bottom: clamp(16px, 4vw, 28px);
}

/* grille 2 colonnes sur desktop, 1 col sur mobile */
.grid.grid-2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(12px, 2.6vw, 20px);
}
@media (max-width: 760px) {
  .grid.grid-2 { grid-template-columns: 1fr; }
}

/* labels & champs */
.contact-card label {
  display: block;
}
.contact-card label > span {
  display: inline-block;
  font-weight: 600;
  margin-bottom: 6px;
}
.contact-card input[type="text"],
.contact-card input[type="email"],
.contact-card input[type="tel"],
.contact-card input[type="url"],
.contact-card textarea {
  width: 100%;
  appearance: none;
  border: 1px solid rgba(0,0,0,0.12);
  border-radius: 12px;
  background: rgba(255,255,255,0.9);
  padding: 12px 14px;
  font-size: 16px;
  line-height: 1.4;
  outline: none;
  transition: border-color .2s ease, box-shadow .2s ease, background .2s ease;
}
.contact-card input:focus,
.contact-card textarea:focus {
  border-color: rgba(0,0,0,0.28);
  box-shadow: 0 0 0 3px rgba(0,0,0,0.06);
  background: #fff;
}

/* actions */
.contact-card .form-actions {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 10px;
}
.contact-card .btn.btn-primary {
  font-weight: 700;
  padding: 12px 18px;
  border-radius: 999px;
  border: none;
  box-shadow: 0 8px 20px rgba(0,0,0,0.12);
}

/* texte annexe (RGPD / reCAPTCHA) */
.contact-section .legal {
  margin-top: 8px;
}

/* éviter la “page trop haute” (héritage 100vh quelque part) */
.contact-page main.content,
.contact-section { min-height: auto; }

/* header cliquable et au-dessus de tout */
:root { --header-h: 72px; }
header.site { position: sticky; top: 0; z-index: 100000; background: rgba(255,255,255,0.96); backdrop-filter: saturate(120%) blur(6px); }
main, .content, .container { position: relative; z-index: 0; }
html { scroll-padding-top: var(--header-h); }

/* H1–H3 en or foncé (comme le reste du site) */
h1, h2, h3 {
  color: var(--gold-ink, #7a5a12); /* garde ta var si déjà définie */
  text-shadow: 0 1px 0 rgba(0,0,0,0.12);
  font-weight: 700;
}

/* Option : si le marbre a des pseudo-éléments qui capturent les clics */
.page::before, .page::after,
.content::before, .content::after {
  pointer-events: none !important;
}
/* ===== Titres dorés éclatants sur tout le site ===== */
h1, h2, h3 {
  font-weight: 700;
  text-align: center;
  text-transform: none;

  /* Couleur or intense */
  color: #ffd700;

  /* Contour plus foncé pour le contraste */
  -webkit-text-stroke: 1px #b8860b;
  text-stroke: 1px #b8860b;

  /* Halo lumineux doré pour l’éclat */
  text-shadow:
    0 0 4px #ffd700,
    0 0 8px #ffec8b,
    0 0 12px #f5d76e,
    0 0 18px rgba(212,175,55,0.95),
    0 0 24px rgba(255,223,0,0.85);
}

/* ==== Footer collé en bas (wrapper version) ==== */
html, body { height: 100%; margin: 0; }
.page-wrapper { min-height: 100%; display: flex; flex-direction: column; }
.page-wrapper main { flex: 1; }
.footer, footer.site { flex-shrink: 0; }
.presta-cat-title {
  grid-column: 1 / -1; /* le titre prend toute la largeur de la grille */
  font-size: 1.8rem;
  color: silver; /* effet argenté */
  margin: 24px 0 12px;
  text-align: left;
}
/* Titres de catégorie dans la grille */
.presta-cat-title {
  grid-column: 1 / -1;   /* occupe toute la largeur de la grille */
  margin: 24px 0 12px;
  font-size: 1.8rem;      /* ajuste comme tu veux */
  /* color: silver;       // si tu veux l’argenté directement */
}
/* ===== Prestations – corrections ciblées ===== */

/* H1 cohérent (même échelle que le reste du site) */
.container > h1 {
  font-size: clamp(2.2rem, 4vw, 3.2rem);
  line-height: 1.15;
  margin-bottom: 10px;
}

/* Grille Prestations : 3 colonnes desktop, 2 tablette, 1 mobile */
#presta-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(260px, 1fr));
  gap: 20px;
}

/* Les titres de catégories prennent toute la largeur de la grille */
#presta-grid .presta-cat-title {
  grid-column: 1 / -1;
  margin: 28px 0 10px;
  font-size: clamp(1.4rem, 2.2vw, 2rem);
  font-weight: 700;
}

/* Les cartes sont cliquables sans styling "lien" bleuté/souligné */
#presta-grid .card {
  display: block;
  text-decoration: none;
  color: inherit;
}

/* Assure que rien dans la carte n’est souligné/bleu */
#presta-grid .card h3,
#presta-grid .card p,
#presta-grid a {
  text-decoration: none;
  color: inherit;
}

/* Hover doux (optionnel) */
#presta-grid .card:hover {
  transform: translateY(-2px);
  transition: transform .15s ease;
}

/* Responsive */
@media (max-width: 1024px) {
  #presta-grid { grid-template-columns: repeat(2, minmax(220px, 1fr)); }
}
@media (max-width: 640px) {
  #presta-grid { grid-template-columns: 1fr; }
}
/* ===== Prestations – corrections ciblées ===== */

/* H1 cohérent (même échelle que le reste du site) */
.container > h1 {
  font-size: clamp(2.2rem, 4vw, 3.2rem);
  line-height: 1.15;
  margin-bottom: 10px;
}

/* Grille Prestations : 3 colonnes desktop, 2 tablette, 1 mobile */
#presta-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(260px, 1fr));
  gap: 20px;
}

/* Les titres de catégories prennent toute la largeur de la grille */
#presta-grid .presta-cat-title {
  grid-column: 1 / -1;
  margin: 28px 0 10px;
  font-size: clamp(1.4rem, 2.2vw, 2rem);
  font-weight: 700;
}

/* Les cartes sont cliquables sans styling "lien" bleuté/souligné */
#presta-grid .card {
  display: block;
  text-decoration: none;
  color: inherit;
}

/* Assure que rien dans la carte n’est souligné/bleu */
#presta-grid .card h3,
#presta-grid .card p,
#presta-grid a {
  text-decoration: none;
  color: inherit;
}

/* Hover doux (optionnel) */
#presta-grid .card:hover {
  transform: translateY(-2px);
  transition: transform .15s ease;
}

/* Responsive */
@media (max-width: 1024px) {
  #presta-grid { grid-template-columns: repeat(2, minmax(220px, 1fr)); }
}
@media (max-width: 640px) {
  #presta-grid { grid-template-columns: 1fr; }
}
/* ===== Prestations – forcer neutralisation des liens dans les tuiles ===== */

/* La tuile elle-même reste clickable */
#presta-grid a.card {
  display: block;
  text-decoration: none !important;
  color: inherit !important;
  cursor: pointer;
}

/* Tous les enfants n'ont plus l'apparence "lien" */
#presta-grid a.card *,
#presta-grid .card a,
#presta-grid .card a *,
#presta-grid a.card:link,
#presta-grid a.card:visited,
#presta-grid a.card:hover,
#presta-grid a.card:active,
#presta-grid a.card:focus,
#presta-grid .card a:link,
#presta-grid .card a:visited,
#presta-grid .card a:hover,
#presta-grid .card a:active,
#presta-grid .card a:focus {
  text-decoration: none !important;
  color: inherit !important;
  outline: none !important;
  cursor: inherit;
}

/* Sécurité supplémentaire : titres/paragraphes dans les cartes */
#presta-grid .card h3,
#presta-grid .card p,
#presta-grid .card li,
#presta-grid .card span,
#presta-grid .card strong,
#presta-grid .card em {
  text-decoration: none !important;
  color: inherit !important;
}

/* ===== Titres des catégories en doré (même si la classe a sauté) ===== */
#presta-grid .presta-cat-title,
#presta-grid > h2.presta-cat-title,
#presta-grid > h2 {
  grid-column: 1 / -1;
  margin: 28px 0 10px;
  font-weight: 800;
  color: #d4af37 !important; /* or riche */
}
/* ===== Forcer les cartes Prestations ===== */
body.prestations #presta-grid a.card,
body.prestations #presta-grid a.card *,
body.prestations #presta-grid .card a,
body.prestations #presta-grid .card a * {
  all: unset !important;      /* retire tout style imposé */
  display: block !important;
  cursor: pointer !important;
  font: inherit !important;
  color: inherit !important;
  text-decoration: none !important;
  line-height: 1.4 !important;
}

/* Rétablir le texte interne après reset */
body.prestations #presta-grid .card h3 {
  font-size: 1.2rem !important;
  font-weight: 700 !important;
  margin: 0 0 8px !important;
}
body.prestations #presta-grid .card p {
  font-size: 1rem !important;
  margin: 0 !important;
}

/* Titres de catégorie dorés */
body.prestations #presta-grid .presta-cat-title {
  grid-column: 1 / -1 !important;
  color: #d4af37 !important;
  font-weight: 800 !important;
  font-size: 1.6rem !important;
  margin: 28px 0 12px !important;
}
/* === Correction alignement grilles prestations === */

/* La grille est uniforme : colonnes auto-fit avec écart constant */
#presta-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)) !important;
  gap: 28px !important;
  align-items: stretch !important;
}

/* Chaque carte prend toute la hauteur de sa cellule */
#presta-grid > .card {
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  margin: 0 !important;   /* supprime marges parasites */
  height: 100% !important;
  box-sizing: border-box !important;
}

/* Neutralise les marges héritées qui faisaient monter/descendre une colonne */
#presta-grid > *:first-child,
#presta-grid > * + * {
  margin: 0 !important;
}

/* Images toujours responsives */
#presta-grid img {
  max-width: 100% !important;
  height: auto !important;
  display: block !important;
}
/* S'assurer que le menu reste toujours au-dessus */
header,
.site-header,
.navbar,
#main-header {
  position: relative;
  z-index: 9999;
}

/* Corriger les sections qui passaient au-dessus */
section,
.page-content,
main,
.content,
.entry-content {
  position: relative;
  z-index: 1;
}

/* Footer & cookie banner */
.footer { background: rgba(255,255,255,0.9); backdrop-filter: blur(5px); -webkit-backdrop-filter: blur(5px);
  padding:24px 0 16px; font-size:18px; line-height:1.6; }
.footer-grid { display:grid; grid-template-columns:1fr auto 1fr; gap:12px 16px; align-items:start; }
.footer-title{color:#d4af37;font-weight:700;margin-bottom:6px;}
.footer-left a,.footer-right a{color:#d4af37;}
.footer-center{text-align:center;}
.footer-center a.black{color:#000;}
.footer-center a.gold{color:#d4af37;}
.footer-copy{margin-top:6px;color:#000;font-weight:600;}
.footer-right{text-align:right;}
.footer-line{display:inline-flex;align-items:center;gap:8px;margin:6px 0;}
.ico{width:18px;height:18px;flex-shrink:0;}
.ico-gold{color:#d4af37;}
.socials{display:inline-flex;gap:12px;margin-bottom:6px;}
.sep{color:#000;opacity:.7;}
.legal-links{margin:2px 0;}
@media(max-width:820px){.footer-grid{grid-template-columns:1fr;row-gap:12px;}.footer-left,.footer-center,.footer-right{text-align:center;}}

/* Cookie banner */
#cookie-banner{position:fixed;left:0;right:0;bottom:0;z-index:99999;background:rgba(17,17,17,0.98);color:#fff;
  padding:14px 16px;display:none;gap:12px;align-items:center;justify-content:space-between;
  box-shadow:0 -6px 20px rgba(0,0,0,.25);font-size:15px;line-height:1.5;}
#cookie-banner:not(.is-hidden){display:flex !important;}
#cookie-actions{display:inline-flex;gap:10px;}
#cookie-actions button{border:0;cursor:pointer;padding:8px 12px;border-radius:8px;font-weight:600;}
#cookie-decline{background:#333;color:#fff;} #cookie-accept{background:#d4af37;color:#111;}
@media(max-width:680px){#cookie-banner{flex-direction:column;align-items:stretch;gap:10px;}#cookie-actions{justify-content:flex-end;}}

<style data-slider-tiles-centered>
  #slider {
    overflow: hidden;
    max-width: 860px;
    margin: 0 auto;
    position: relative;
  }

  #slides {
    display: flex;
    flex-wrap: nowrap;
    transform: translateX(0);
    transition: transform .6s ease;
    will-change: transform;
    margin: 0;
    padding: 0;
  }

  /* Chaque slide conserve 100% de largeur → pas de calculs bizarres */
  #slides > .slide {
    flex: 0 0 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
  }

  /* 🎯 Espacement visuel: marge interne sur la tuile, sans changer la largeur du slide */
  #slides .tile {
    width: calc(100% - 24px);   /* crée ~12px d’espace visuel de chaque côté */
    margin: 0 12px;             /* l’espace visible entre les cartes */
    background: #fff;
    border: 2px solid #d4af37;
    border-radius: 18px;
    box-shadow: 0 10px 30px rgba(0,0,0,.08);
    padding: 36px;
  }

  #slides .tile blockquote { margin: 0 0 14px; font-size: 1.1rem; line-height: 1.7; }
  #slides .tile .meta { opacity: .9; font-size: 1rem; font-weight: 500; color: #555; }

  #prev, #next { display: none !important; }

  @media (max-width: 640px){
    #slides .tile { width: calc(100% - 16px); margin: 0 8px; border-radius: 14px; padding: 22px; }
  }
</style>
/* === ANTI-VOILE (desktop uniquement) === */
@media (min-width:1025px){
  /* Planity galleries & slideshows (classes dynamiques) */
  #planitywl > [class^="gallery-module_gallery-"],
  #planitywl > [class^="gallery-module_gallery-"] > [class^="gallery-module_slideshow-"],
  #planitywl > [class^="profile_gallery-module_profileGallery-"],
  #planitywl > [class^="profile_gallery-module_profileGallery-"] > [class^="profile_gallery-module_slideshow-"],
  /* Modal conteneur + overlay */
  #modal-container-undefined,
  #modal-container-undefined > [class^="modal-module_overlay-"]{
    pointer-events: none !important;
    opacity: 0 !important;
    z-index: -1 !important;
    background: transparent !important;
    backdrop-filter: none !important;
    box-shadow: none !important;
    transform: none !important;
  }
}
/* Le fond ne doit pas être sur <html> */
html{
  background: transparent !important;
  background-color: transparent !important;
}

/* Fond marbre sur body (propagé au viewport) */
body{
  background-image: url('/assets/marble-with-yellow-veins.jpg');
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: fixed;
  background-color: #f7f3ea; /* fallback */
}

/* Corrige aussi la règle cassée repérée plus haut :
   html, body { min-height: 100% background:var(--ivory); }
   -> doit être : */
html, body{ min-height: 100%; }
/* (et garder la couleur uniquement sur body si tu la veux en fallback) */
/* === META-in-grid fix (2025-09-15T09:26:07.966372Z) === */
.grid > meta,
.cards > meta,
.list > meta { display: none !important; }

/* Titles: small gap above, tiny gap below (generic) */
h2, h3 { margin: 12px 0 6px 0; }