/* Concept Clé — menu pilule + pied de page standard pour le site PHP.
   Tout est préfixé « cc- » : aucune règle de styles.css / responsive.css n'est modifiée ni réutilisée. */
@import url('https://fonts.googleapis.com/css2?family=Sora:wght@300;400;600;700;800&display=swap');

.cc-shell,.cc-shell *,.cc-shell *::before,.cc-shell *::after{box-sizing:border-box;font-family:'Sora',system-ui,sans-serif}
.cc-shell ul{list-style:none;margin:0;padding:0}
.cc-shell li{margin:0;padding:0;list-style:none}
.cc-shell a{text-decoration:none;color:inherit}
.cc-shell img{display:block;max-width:none}
.cc-shell button{font:inherit}

/* ================= MENU PILULE ================= */
.cc-header{position:fixed;top:16px;left:0;right:0;z-index:1000;padding-inline:20px;font-size:16px;line-height:1.6;color:#1a171b}
.cc-header .cc-nav{max-width:1320px;margin:0 auto;background:#fff;border-radius:18px;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:14px 28px;box-shadow:0 4px 24px rgba(0,0,0,.08);position:relative}
.cc-header .cc-brand{display:flex;align-items:center;gap:10px;flex:none}
.cc-header .cc-logo{display:flex;align-items:center}
.cc-header .cc-lg{width:auto;height:26px}

/* logos clair / sombre */
.cc-shell .cc-lg-d{display:none}
html[data-theme="dark"] .cc-shell .cc-lg-l{display:none}
html[data-theme="dark"] .cc-shell .cc-lg-d{display:block}

/* interrupteur clair / sombre (le point = marque Concept Clé) */
.cc-header .cc-switch{flex:none;position:relative;width:52px;height:28px;padding:0;border-radius:20px;cursor:pointer;border:2px solid #1a171b;background:transparent;transition:border-color .25s,box-shadow .25s}
.cc-header .cc-switch::after{content:"";position:absolute;top:2px;left:2px;width:20px;height:20px;border-radius:50%;background:url("img/mark-light.svg") center/contain no-repeat;transition:transform .28s cubic-bezier(.4,.1,.2,1)}
.cc-header .cc-switch svg{position:absolute;top:50%;width:11px;height:11px;margin-top:-5.5px;fill:none;stroke:#1a171b;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;opacity:.7}
.cc-header .cc-i-sun{right:4px}
.cc-header .cc-i-moon{left:4px}
.cc-header .cc-switch:focus-visible{outline:2px solid #8b5cf6;outline-offset:3px}

/* liens du menu */
.cc-header .cc-menu{display:flex;gap:20px;align-items:center;font-size:11.5px;text-transform:uppercase;letter-spacing:.04em}
.cc-header .cc-menu > li{position:relative}
.cc-header .cc-menu > li > a{display:inline-block;white-space:nowrap;padding:4px 0;color:#1a171b;position:relative;font-weight:400}
.cc-header .cc-menu > li > a::after{content:"";position:absolute;left:0;right:0;bottom:-4px;height:2px;background:#e3232c;transform:scaleX(0);transition:transform .3s}
.cc-header .cc-menu > li > a:hover::after,.cc-header .cc-menu > li.cc-active > a::after{transform:scaleX(1)}
.cc-header .cc-has-pill{display:inline-flex !important;align-items:flex-start;gap:5px}
.cc-header .cc-pill{display:inline-block;margin-top:-6px;padding:2px 7px 3px;border-radius:999px;background:#3a1d6e;color:#fff;font-size:9px;font-weight:600;line-height:1.3;letter-spacing:.09em;text-transform:uppercase}
.cc-header .cc-has-pill:hover .cc-pill{background:#e3232c}

/* sous-menus (liens empilés à la verticale) */
.cc-header .cc-dd{position:absolute;top:100%;left:0;min-width:210px;background:#fff;box-shadow:0 14px 30px rgba(0,0,0,.12);border-radius:2px;padding:8px 0;opacity:0;visibility:hidden;transform:translateY(6px);transition:all .15s ease}
.cc-header .cc-menu > li:hover .cc-dd{opacity:1;visibility:visible;transform:translateY(0)}
.cc-header .cc-dd li a{display:block;padding:9px 20px;font-size:14px;font-weight:400;text-transform:none;letter-spacing:normal;color:#252525;white-space:nowrap}
.cc-header .cc-dd li a:hover{color:#e3232c;background:#f6f6f6}

/* droite : téléphone / e-mail / burger */
.cc-header .cc-end{display:flex;align-items:center;gap:16px;flex:none}
.cc-header .cc-tel{display:none;font-size:11px;color:#1a171b;white-space:nowrap}
.cc-header .cc-tel b{font-weight:700}
.cc-header .cc-mail{display:flex;align-items:center;gap:5px;font-size:10px;line-height:1;color:#1a171b;white-space:nowrap}
.cc-header .cc-mail svg{width:13px;height:10px;color:#e3232c;flex:none}
.cc-header .cc-mail:hover{color:#e3232c}
.cc-header .cc-burger{display:none;background:none;border:0;width:32px;height:32px;cursor:pointer;flex:none;padding:0}
.cc-header .cc-burger span{display:block;height:2px;background:#1a171b;margin:6px 0}

@media (max-width:1023px){
  .cc-header .cc-tel{display:block}
  .cc-header .cc-mail{display:none}
  .cc-header .cc-menu{display:none}
  .cc-header .cc-burger{display:block}
  .cc-header .cc-nav.cc-open .cc-menu{display:flex;flex-direction:column;align-items:flex-start;gap:12px;position:absolute;top:calc(100% + 10px);right:28px;width:172px;background:#fff;padding:16px 12px;border-radius:16px;box-shadow:0 14px 30px rgba(0,0,0,.14);font-size:10px}
  .cc-header .cc-nav.cc-open .cc-dd{position:static;transform:none;opacity:1;visibility:visible;box-shadow:none;margin-top:8px;padding:0 0 0 10px;min-width:0;background:transparent;border-radius:0}
  .cc-header .cc-nav.cc-open .cc-dd li a{font-size:10px;padding:7px 8px}
}
@media (max-width:600px){
  .cc-header{padding-inline:12px}
  .cc-header .cc-nav{padding:12px 14px;gap:10px}
  .cc-header .cc-end{gap:10px}
  .cc-header .cc-nav.cc-open .cc-menu{right:14px;width:166px}
  .cc-header .cc-switch{width:46px;height:26px}
  .cc-header .cc-switch::after{width:18px;height:18px}
  .cc-header .cc-switch svg{width:9px;height:9px;margin-top:-4.5px}
}
@media (max-width:480px){
  .cc-header .cc-nav{padding:12px 10px;gap:6px}
  .cc-header .cc-end{gap:6px}
  .cc-header .cc-lg{height:17px}
  .cc-header .cc-tel{font-size:10px}
  .cc-header .cc-burger{width:26px}
}

/* ================= PIED DE PAGE STANDARD ================= */
.cc-footer{background:#eff0f2;color:#111114;padding:24px 0;font-size:.85rem;line-height:1.6;clear:both;position:relative;z-index:2}
.cc-footer .cc-card{background:#fff;border-radius:28px;padding:50px;width:min(1152px,calc(100% - 32px));margin:0 auto;display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:30px}
.cc-footer .cc-flogo{display:flex;align-items:center}
.cc-footer .cc-flogo .cc-lg{width:auto;height:36px}
.cc-footer h4{font-size:.85rem;font-weight:700;margin:0 0 14px;color:inherit;text-transform:none;letter-spacing:normal;line-height:1.6}
.cc-footer ul{line-height:2}
.cc-footer ul a:hover{color:#e3232c}
.cc-footer .cc-small{color:#4a4a52;max-width:280px;margin:14px 0 0;font-size:inherit}
.cc-footer .cc-copy{margin-top:40px;color:#4a4a52}
@media (max-width:900px){
  .cc-footer .cc-card{grid-template-columns:repeat(2,minmax(0,1fr));padding:32px}
  .cc-footer .cc-card > div:first-child{grid-column:1 / -1}
  .cc-footer ul a{overflow-wrap:anywhere}
}

/* ================= MODE SOMBRE ================= */
html[data-theme="dark"] .cc-header{color:#f4f1ff}
html[data-theme="dark"] .cc-header .cc-nav{background:rgba(22,14,42,.82);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid rgba(167,139,250,.22);box-shadow:0 8px 40px rgba(88,28,200,.25)}
html[data-theme="dark"] .cc-header .cc-switch{border-color:#8b5cf6;box-shadow:0 0 14px rgba(139,92,246,.45)}
html[data-theme="dark"] .cc-header .cc-switch::after{transform:translateX(24px);background-image:url("img/mark-dark.svg");filter:drop-shadow(0 0 5px rgba(76,114,241,.8))}
html[data-theme="dark"] .cc-header .cc-switch svg{stroke:#d9ccff}
html[data-theme="dark"] .cc-header .cc-menu > li > a,
html[data-theme="dark"] .cc-header .cc-tel,
html[data-theme="dark"] .cc-header .cc-mail{color:#f4f1ff}
html[data-theme="dark"] .cc-header .cc-menu > li > a::after{background:linear-gradient(135deg,#8b2bff,#3b6bff)}
html[data-theme="dark"] .cc-header .cc-mail svg{color:#a77bff}
html[data-theme="dark"] .cc-header .cc-mail:hover{color:#c9b3ff}
html[data-theme="dark"] .cc-header .cc-burger span{background:#f4f1ff}
html[data-theme="dark"] .cc-header .cc-pill{background:linear-gradient(135deg,#8b2bff,#3b6bff);box-shadow:0 0 12px rgba(139,92,246,.6)}
html[data-theme="dark"] .cc-header .cc-dd,
html[data-theme="dark"] .cc-header .cc-nav.cc-open .cc-menu{background:#150e29;border:1px solid rgba(167,139,250,.22);box-shadow:0 18px 44px rgba(0,0,0,.55),0 0 24px rgba(124,58,237,.18)}
html[data-theme="dark"] .cc-header .cc-nav.cc-open .cc-dd{background:transparent;border:0;box-shadow:none}
html[data-theme="dark"] .cc-header .cc-dd li a{color:#d9d3ee}
html[data-theme="dark"] .cc-header .cc-dd li a:hover{background:rgba(139,92,246,.16);color:#c9b3ff}
@media (max-width:600px){html[data-theme="dark"] .cc-header .cc-switch::after{transform:translateX(20px)}}

html[data-theme="dark"] .cc-footer{background:#07040f;color:#f4f1ff}
html[data-theme="dark"] .cc-footer .cc-card{background:#150e29;border:1px solid rgba(167,139,250,.20);box-shadow:0 14px 40px rgba(0,0,0,.35)}
html[data-theme="dark"] .cc-footer .cc-small,html[data-theme="dark"] .cc-footer .cc-copy{color:#a399c4}
html[data-theme="dark"] .cc-footer ul a:hover{color:#b794ff}

.cc-theme-anim,.cc-theme-anim .cc-shell,.cc-theme-anim .cc-shell *{transition:background-color .35s,color .35s,border-color .35s,box-shadow .35s !important}
