:root{
  --ink:#0b1c2c; --muted:#5f6e86; --bg:#f7faff; --card:#ffffff;
  --primary:#0E71C8; --primary2:#0a5aa2; --ring:#e6f0ff;
  --radius:18px; --shadow:0 20px 50px rgba(10,60,120,.12);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:#fff;color:var(--ink);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Arial}
.container{width:min(1200px,92%);margin:auto}

/* Header */
.site-header{position:sticky;top:0;z-index:40;background:#fff;border-bottom:1px solid #eef3ff}
.header-inner{display:grid;grid-template-columns:auto 1fr auto auto;gap:14px;align-items:center;padding:.6rem 0}
.brand{display:flex;align-items:center;gap:.6rem;text-decoration:none;color:var(--ink);font-weight:800}
.brand img{width:42px;height:42px;border-radius:50%;box-shadow:0 6px 18px rgba(0,0,0,.15)}
.top-search{display:flex;gap:8px}
.top-search input{flex:1;border-radius:999px;padding:.8rem 1rem;border:1px solid #dbe6ff;background:#f6f9ff}
.top-search button{border:0;background:linear-gradient(135deg,var(--primary),var(--primary2));color:#fff;border-radius:999px;padding:.75rem 1rem;font-weight:800}
.nav-desktop a{margin:0 .6rem;text-decoration:none;color:var(--ink);font-weight:700}
.nav-desktop .btn.admin{background:linear-gradient(135deg,var(--primary),var(--primary2));color:#fff;padding:.5rem .9rem;border-radius:12px}
.hamburger{display:none;flex-direction:column;gap:4px;background:transparent;border:0}
.hamburger span{display:block;width:26px;height:2px;background:var(--ink)}
.mobile-nav{display:none;background:#fff;border-top:1px solid #eef3ff}
.mobile-nav a{display:block;padding:12px 16px;border-bottom:1px solid #eef3ff;text-decoration:none;color:var(--ink);font-weight:700}
.top-search.m{padding:8px 12px}
@media(max-width:980px){.nav-desktop{display:none}.hamburger{display:flex}.header-inner{grid-template-columns:auto 1fr auto}.mobile-nav.show{display:block;animation:slideDown .25s ease} @keyframes slideDown{from{opacity:.3;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}}

/* Hero */
.hero{position:relative;overflow:hidden;padding:80px 0;background:#fff;}
.hero h1{font-family:'Playfair Display',serif;font-size:clamp(30px,4.8vw,56px);line-height:1.06;margin:0 0 .4rem}
.hero p{color:var(--muted);max-width:800px}
.hero .cta{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}
.btn{display:inline-block;background:#fff;color:var(--primary);padding:.85rem 1.15rem;border-radius:14px;text-decoration:none;font-weight:800;border:2px solid var(--ring);box-shadow:var(--shadow)}
.btn.primary{background:linear-gradient(135deg,var(--primary),var(--primary2));color:#fff;border:0}

/* Sections & cards */
.section{padding:60px 0}
.section h2{font-size:clamp(24px,3.2vw,36px);margin:0 0 16px;font-family:'Playfair Display',serif}
.grid{display:grid;gap:18px}
.cards{grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}
.card{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);padding:16px;opacity:0;translate:0 16px;transition:opacity .6s,translate .6s cubic-bezier(.2,.9,.2,1)}
.card.visible{opacity:1;translate:0 0}
.card img{width:100%;height:160px;object-fit:cover;border-radius:12px}

/* Badges & price */
.badges{display:flex;gap:6px;flex-wrap:wrap}
.badge{padding:.25rem .55rem;border-radius:999px;background:linear-gradient(135deg,var(--primary),var(--primary2));color:#fff;font-weight:800;font-size:.75rem}
.price{display:flex;gap:8px;font-weight:800;margin:.4rem 0}
.price .old{text-decoration:line-through;color:#9aa9c3}

/* Category chips */
.chips{display:flex;gap:8px;overflow:auto;padding:6px 0 4px}
.chip{white-space:nowrap;background:#f2f7ff;border:1px solid #e3eeff;border-radius:999px;padding:.5rem .9rem;font-weight:700;text-decoration:none;color:var(--ink)}

/* Footer & forms */
.site-footer{background:#fff;border-top:1px solid #eef3ff;margin-top:40px;padding:40px 0}
.site-footer .grid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.copy{text-align:center;color:#667;opacity:.9;margin-top:10px}
input,textarea,select{width:100%;padding:.8rem;border-radius:12px;border:1px solid #dbe6ff;background:#fff}
label{font-weight:700;margin:.6rem 0 .25rem;display:block}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(max-width:700px){.form-row{grid-template-columns:1fr}}

/* Utilities */
.mt-2{margin-top:.5rem}.mt-3{margin-top:1rem}.mt-4{margin-top:1.6rem}
.text-muted{color:var(--muted)}

/* --- White fix overrides --- */
body, .hero, .site-footer, .site-header{background:#fff !important}


/* ====== Rich footer ====== */
.rich-footer{border-top:1px solid #eef3ff;background:#fff}
.rich-footer .footer-top{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 0}
.rich-footer .brand{display:flex;align-items:center;gap:.6rem;text-decoration:none;color:var(--ink);font-weight:800}
.rich-footer .brand img{width:44px;height:44px;border-radius:50%;box-shadow:0 6px 18px rgba(0,0,0,.1)}
.rich-footer .socials{display:flex;gap:10px}
.rich-footer .social{width:42px;height:42px;border:1px solid #e6efff;border-radius:12px;display:grid;place-items:center;background:#fff;box-shadow:var(--shadow);transition:transform .2s ease, box-shadow .2s ease}
.rich-footer .social:hover{transform:translateY(-2px);box-shadow:0 14px 28px rgba(10,60,120,.15)}
.rich-footer .social svg{width:22px;height:22px;fill:#0E71C8}
.rich-footer .social.wa svg{fill:#25D366}
.rich-footer .social.tel svg{fill:#0E71C8}
.rich-footer .social.mail svg{fill:#EA4335}
.rich-footer .social.map svg{fill:#7B61FF}

.footer-columns{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));padding:8px 0 10px}
.footer-columns h4{margin:.3rem 0 .4rem;font-size:1.05rem}
.footer-columns .links{list-style:none;margin:0;padding:0}
.footer-columns .links li{margin:.35rem 0}
.footer-columns .links a{text-decoration:none;color:var(--ink);border-bottom:1px solid transparent}
.footer-columns .links a:hover{border-color:#e6f0ff}
.contacts{list-style:none;margin:0;padding:0}
.contacts li{display:flex;align-items:center;gap:8px;margin:.35rem 0}
.contacts .ico{display:inline-block;width:18px;height:18px;border-radius:4px;background:#eaf3ff;position:relative}
.contacts .ico.wa{background:#e9f9f0}
.contacts .ico.tel{background:#eaf3ff}
.contacts .ico.mail{background:#fdecea}
.contacts .ico::after{content:'';position:absolute;inset:3px;background:#0E71C8;border-radius:3px}
.contacts .ico.wa::after{background:#25D366}
.contacts .ico.mail::after{background:#EA4335}

.rich-footer .copy{text-align:center;color:#667;opacity:.9;margin-top:8px}
@media(max-width:700px){.rich-footer .footer-top{flex-direction:column;align-items:flex-start}}


/* ===== Search embed (loupe dans le champ) ===== */
.search-embed{position:relative;align-items:center}
.search-embed .search-ico{position:absolute;left:12px;width:18px;height:18px;fill:#7a8fb0}
.search-embed input{padding-left:36px}
.search-embed .search-btn{position:absolute;right:5px;top:50%;transform:translateY(-50%);border:0;background:transparent;padding:6px;border-radius:999px;cursor:pointer}
.search-embed .search-btn svg{width:18px;height:18px;fill:#0E71C8}
.search-embed .search-btn:hover{background:#eef5ff}

/* ===== Blue footer (normal design) ===== */
.blue-footer{background:#0E71C8;color:#fff;border-top:none}
.blue-footer .blue-top{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 0;border-bottom:1px solid rgba(255,255,255,.25)}
.blue-footer .brand{display:flex;align-items:center;gap:.6rem;text-decoration:none;color:#fff;font-weight:800}
.blue-footer .brand img{width:44px;height:44px;border-radius:50%;box-shadow:0 6px 18px rgba(0,0,0,.25)}
.blue-footer .blue-links a{color:#fff;text-decoration:none;margin:0 .5rem;font-weight:700;opacity:.92;transition:opacity .2s}
.blue-footer .blue-links a:hover{opacity:1}
.blue-footer .blue-socials{display:flex;gap:10px}
.blue-footer .social{width:42px;height:42px;border:1px solid rgba(255,255,255,.35);border-radius:12px;display:grid;place-items:center;background:transparent;transition:transform .2s, background .2s}
.blue-footer .social:hover{transform:translateY(-2px);background:rgba(255,255,255,.12)}
.blue-footer .social svg{width:22px;height:22px;fill:#fff}
.blue-footer .blue-bottom{padding:12px 0}
.blue-footer .blue-bottom p{margin:0;opacity:.95}

/* ===== Hover/Glide animations ===== */
a, .btn, .card, .chip, .social { transition: transform .25s cubic-bezier(.2,.8,.2,1), box-shadow .25s, opacity .25s, background .25s, border-color .25s }
.btn:hover{transform:translateY(-3px);box-shadow:0 16px 36px rgba(10,60,120,.18)}
.card:hover{transform:translateY(-4px)}
.chip:hover{transform:translateY(-2px)}
.nav-desktop a:hover{opacity:.85}

/* ===== Mobile menu smooth slide ===== */
#mobileNav{transform-origin: top center; transform: translateY(-8px); opacity: 0; transition: transform .25s ease, opacity .25s ease}
#mobileNav.show{transform: translateY(0); opacity: 1}


/* ===== Blue footer (visible, simple) ===== */
.blue-footer{background:#0E71C8;color:#fff;border-top:none}
.blue-footer .blue-top{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 0;border-bottom:1px solid rgba(255,255,255,.25)}
.blue-footer .brand{display:flex;align-items:center;gap:.6rem;text-decoration:none;color:#fff;font-weight:800}
.blue-footer .brand img{width:44px;height:44px;border-radius:50%}
.blue-footer .blue-links a{color:#fff;text-decoration:none;margin:0 .5rem;font-weight:700;opacity:.92;transition:opacity .2s}
.blue-footer .blue-links a:hover{opacity:1}
.blue-footer .blue-socials{display:flex;gap:10px}
.blue-footer .social{width:42px;height:42px;border:1px solid rgba(255,255,255,.35);border-radius:12px;display:grid;place-items:center;background:transparent;transition:transform .2s, background .2s}
.blue-footer .social:hover{transform:translateY(-2px);background:rgba(255,255,255,.12)}
.blue-footer .social svg{width:22px;height:22px;fill:#fff}
.blue-footer .blue-bottom{padding:12px 0}
.blue-footer .blue-bottom p{margin:0;opacity:.95}

/* ===== Search loupe: show submit only when typing ===== */
.search-embed .search-ico{display:none} /* remove left icon to avoid double loupe */
.search-embed .search-btn{display:none}
.search-embed input.has-text ~ .search-btn{display:block}


/* ===== Blue Footer v2 (with visible text columns) ===== */
.blue-footer.v2{background:#0E71C8;color:#fff}
.blue-footer.v2 a{color:#fff}
.blue-footer.v2 .blue-top{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:22px 0;border-bottom:1px solid rgba(255,255,255,.25)}
.blue-footer.v2 .brand{display:flex;align-items:center;gap:.6rem;color:#fff;text-decoration:none;font-weight:800}
.blue-footer.v2 .brand img{width:44px;height:44px;border-radius:50%}
.blue-footer.v2 .blue-links a{margin:0 .6rem;text-decoration:none;font-weight:700;opacity:.95}
.blue-footer.v2 .blue-links a:hover{opacity:1}
.blue-footer.v2 .blue-socials{display:flex;gap:10px}
.blue-footer.v2 .social{width:42px;height:42px;border:1px solid rgba(255,255,255,.35);border-radius:12px;display:grid;place-items:center;transition:.2s}
.blue-footer.v2 .social:hover{transform:translateY(-2px);background:rgba(255,255,255,.12)}
.blue-footer.v2 .social svg{width:22px;height:22px;fill:#fff}
.blue-footer.v2 .footer-columns{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px;padding:18px 0}
.blue-footer.v2 h4{margin:.2rem 0 .4rem;font-size:1.05rem}
.blue-footer.v2 p{margin:.3rem 0 .2rem;opacity:.98}
.blue-footer.v2 .blue-bottom{text-align:center;padding:14px 0;border-top:1px solid rgba(255,255,255,.25);opacity:.95}


/* ===== CMC Footer (logo-inspired) ===== */
.cmc-footer{
  --navy:#0E235A; --royal:#2C4AAE; --sky:#7FAAFB; --ring:#eaf1ff;
  color:#fff; background: radial-gradient(900px 300px at 10% 0%, rgba(127,170,251,.25), transparent 60%),
              radial-gradient(900px 300px at 90% 0%, rgba(46,74,174,.25), transparent 60%),
              linear-gradient(180deg, #24366f 0%, #0e235a 100%);
  position:relative; overflow:hidden; padding-top:50px;
}
.cmc-footer .wave{position:absolute;top:-22px;left:0;right:0;height:50px;
  background:radial-gradient(120% 80% at 50% 0, #fff 0%, #dfe8ff 40%, transparent 41%);
  opacity:.9; pointer-events:none}
.cmc-footer a{color:#eaf1ff; text-decoration:none}
.cmc-footer a:hover{color:#fff}
.cmc-footer .footer-head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-bottom:18px;border-bottom:1px solid rgba(255,255,255,.2)}
.cmc-footer .brand{display:flex;align-items:center;gap:.7rem}
.cmc-footer .brand img{width:46px;height:46px;border-radius:50%;box-shadow:0 8px 24px rgba(0,0,0,.35)}
.cmc-footer .brand-text strong{font-size:1.1rem}
.cmc-footer .brand-text span{font-size:.85rem;opacity:.9}
.cmc-footer .ico-bar{display:flex;gap:12px}
.cmc-footer .orb{--size:46px;width:var(--size);height:var(--size);display:grid;place-items:center;border-radius:50%;
  background: radial-gradient(circle at 50% 50%, #ffffff 0%, #f3f7ff 55%, #e7eeff 100%);
  border:2px solid #d6e1ff; box-shadow:0 10px 30px rgba(0,0,0,.25); position:relative; overflow:hidden;
  transition:transform .28s cubic-bezier(.2,.8,.2,1), box-shadow .28s;
}
.cmc-footer .orb::after{content:''; position:absolute; inset:3px; border-radius:50%;
  border:2px solid transparent; background: conic-gradient(from 0deg, #7FAAFB, #2C4AAE, #0E235A, #2C4AAE, #7FAAFB);
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude; padding:2px; opacity:.25; transition:opacity .28s, transform .6s linear;
}
.cmc-footer .orb:hover{transform:translateY(-4px); box-shadow:0 18px 40px rgba(0,0,0,.35)}
.cmc-footer .orb:hover::after{opacity:.7; transform:rotate(180deg)}
.cmc-footer .orb svg{width:22px;height:22px; fill:#2C4AAE}
.cmc-footer .orb.wa svg{fill:#0dbb59}
.cmc-footer .orb tel svg{fill:#2C4AAE}

.cmc-footer .footer-grid{display:grid; gap:18px; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); padding:18px 0}
.cmc-footer .card{background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.18); border-radius:16px; padding:16px; box-shadow:0 12px 32px rgba(0,0,0,.2); opacity:0; transform:translateY(12px); transition:opacity .5s, transform .5s}
.cmc-footer .card.visible{opacity:1; transform:translateY(0)}
.cmc-footer h4{margin:.2rem 0 .4rem}
.cmc-footer .list{list-style:none;margin:0;padding:0}
.cmc-footer .list li{margin:.35rem 0}
.cmc-footer .copy{text-align:center; opacity:.9; padding:12px 0; border-top:1px solid rgba(255,255,255,.2)}

@media(max-width:720px){
  .cmc-footer .footer-head{flex-direction:column; align-items:flex-start; gap:10px}
}
/* ===== FOOTER BLANC AVEC TEXTE BLEU FONCÉ ===== */
.cmc-footer.white-version {
  background: #fff;
  color: #0E235A;
  border-top: 2px solid #0E235A10;
  padding-top: 50px;
}

.cmc-footer.white-version a {
  color: #0E235A;
  text-decoration: none;
}

.cmc-footer.white-version a:hover {
  color: #2C4AAE;
}

.cmc-footer .footer-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 16px;
  padding-bottom: 16px;
  border-bottom: 2px solid #0E235A15;
}

.cmc-footer .brand {
  display: flex;
  align-items: center;
  gap: 0.7rem;
}

.cmc-footer .brand img {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  border: 3px solid #2C4AAE;
}

.cmc-footer .brand-text strong {
  font-size: 1.2rem;
  color: #0E235A;
}

.cmc-footer .brand-text span {
  font-size: 0.85rem;
  color: #2C4AAE;
}

.cmc-footer .ico-bar {
  display: flex;
  gap: 12px;
}

/* Cercles animés */
.cmc-footer .orb {
  --size: 46px;
  width: var(--size);
  height: var(--size);
  display: grid;
  place-items: center;
  border-radius: 50%;
  border: 2px solid #2C4AAE;
  background: radial-gradient(circle, #f5f8ff 0%, #dce6ff 80%);
  box-shadow: 0 8px 20px rgba(0,0,0,0.15);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  position: relative;
  overflow: hidden;
}

.cmc-footer .orb svg {
  width: 22px;
  height: 22px;
  fill: #0E235A;
  transition: transform 0.3s ease;
}

.cmc-footer .orb::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background: conic-gradient(from 0deg, #2C4AAE, #0E235A, #7FAAFB, #2C4AAE);
  opacity: 0;
  transition: opacity 0.4s, transform 0.8s linear;
}

.cmc-footer .orb:hover {
  transform: translateY(-5px);
  box-shadow: 0 15px 35px rgba(44,74,174,0.25);
}

.cmc-footer .orb:hover::after {
  opacity: 0.3;
  transform: rotate(360deg);
}

.cmc-footer .orb:hover svg {
  transform: scale(1.1);
}

/* Grille de contenu */
.cmc-footer .footer-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 20px;
  padding: 25px 0;
}

.cmc-footer .card {
  background: #f9fbff;
  border-radius: 16px;
  padding: 18px;
  border: 1px solid #0E235A15;
  box-shadow: 0 8px 22px rgba(0,0,0,0.05);
  transition: transform 0.3s ease;
  opacity: 0;
  transform: translateY(10px);
}

.cmc-footer .card.visible {
  opacity: 1;
  transform: translateY(0);
}

.cmc-footer .card:hover {
  transform: translateY(-3px);
}

.cmc-footer h4 {
  margin: 0 0 0.4rem;
  font-size: 1.05rem;
  color: #0E235A;
}

.cmc-footer .copy {
  text-align: center;
  border-top: 1px solid #0E235A15;
  padding-top: 15px;
  font-size: 0.9rem;
  opacity: 0.8;
  color: #0E235A;
}

/* Animation d’apparition */
@media (prefers-reduced-motion: no-preference) {
  .cmc-footer .card {
    transition: opacity 0.6s ease, transform 0.6s ease;
  }
}

@media (max-width: 720px) {
  .cmc-footer .footer-head {
    flex-direction: column;
    align-items: flex-start;
  }
}