/* ============================================================
   HEKLA — Dark mode
   Toggle ISK MODE intégré dans la float-nav + overrides CSS variables
   ============================================================ */

/* ── ISK toggle — overrides en mode ISK (fond sombre du pill) ── */
html[data-theme="dark"] .float-nav__isk-track {
  background: rgba(255, 255, 255, 0.2);
}

html[data-theme="dark"] .float-nav__isk-thumb {
  background: #242424;
}

/* ── Float-nav — couleur du logo et textes en ISK mode ─────────── */
html[data-theme="dark"] .logo-swap__item,
html[data-theme="dark"] .pill-project-logo {
  filter: invert(1);
}

/* ── Overrides CSS variables ─────────────────────────────────── */
html[data-theme="dark"] {
  --c-bg:       #242424;
  --c-black:    #ffffff;
  --c-orange:   #a6b28b;
  --c-rust:     #6c7359;
  --c-ember:    #3b4031;
  --c-white:    #000000;
  --c-grey-800: #b1b1b1;
  --c-grey-100: #242424; /* = --c-bg */
}

/* ── projects-section — fond noir en ISK mode ────────────────── */
html[data-theme="dark"] .projects-section {
  background: #000000;
}

/* ── projects-section-title — visible sur fond noir ──────────── */
html[data-theme="dark"] .projects-section-title {
  color: rgba(255, 255, 255, 0.45);
}

/* ── project-band — gris foncé en ISK mode ───────────────────── */
html[data-theme="dark"] .project-band {
  background: #1e1e1e;
  border-color: rgba(255, 255, 255, 0.07);
  box-shadow:
    0 8px 32px rgba(0, 0, 0, 0.6),
    0 2px 8px  rgba(0, 0, 0, 0.4),
    inset 0 1px 0 rgba(255, 255, 255, 0.06),
    inset 0 -1px 0 rgba(255, 255, 255, 0.02);
}

/* ── video-section — fond noir ───────────────────────────────── */
html[data-theme="dark"] .video-section {
  background: #000000 !important;
}

/* ── team-content — tout le texte en noir ────────────────────── */
html[data-theme="dark"] .team-content,
html[data-theme="dark"] .team-left__title,
html[data-theme="dark"] .team-promise,
html[data-theme="dark"] .team-body p {
  color: #000000;
}
html[data-theme="dark"] .team-left__line {
  background: rgba(0, 0, 0, 0.25);
}
html[data-theme="dark"] .team-body p {
  border-top-color: rgba(0, 0, 0, 0.2);
}
html[data-theme="dark"] .team-body p:last-child {
  border-bottom-color: rgba(0, 0, 0, 0.2);
}
html[data-theme="dark"] .team-wheel {
  filter: brightness(0); /* noir sur fond sage */
}

/* ── exp-morph — fond ISL ────────────────────────────────────── */
html[data-theme="dark"] .exp-morph {
  background: var(--c-bg);
}

/* ── exp-synergy — fond noir en ISL ─────────────────────────── */
html[data-theme="dark"] .exp-synergy {
  background: #000000;
}

/* ── exp-synergy__content — fond noir en ISL mode ───────────────── */
html[data-theme="dark"] .exp-synergy__content {
  background: #000000;
}

/* ── exp-synergy — textes et lignes en blanc en ISL mode ────────── */
html[data-theme="dark"] .exp-synergy__intro,
html[data-theme="dark"] .exp-synergy__list,
html[data-theme="dark"] .exp-synergy__list li,
html[data-theme="dark"] .exp-synergy__list .word,
html[data-theme="dark"] .exp-synergy__list strong {
  color: #ffffff;
}

/* Lignes séparatrices : background noir → blanc */
html[data-theme="dark"] .exp-synergy__list-line {
  background: rgba(255, 255, 255, 0.25);
}

/* ── exp-morph__body — fond ISL + texte blanc ───────────────── */
html[data-theme="dark"] .exp-morph__body {
  background: var(--c-bg);
  padding: 20px;
  border-radius: 12px;
}
html[data-theme="dark"] .exp-morph__body p {
  color: #ffffff;
}

/* ── Hover project-band → sage/vert ─────────────────────────── */
@media (hover: hover) {
  html[data-theme="dark"] .project-band:hover {
    background: rgba(166, 178, 139, 0.88);
    border-color: rgba(166, 178, 139, 0.35);
    box-shadow:
      0 8px 40px rgba(166, 178, 139, 0.22),
      0 2px 10px rgba(166, 178, 139, 0.14),
      inset 0 1px 0 rgba(255, 255, 255, 0.18),
      inset 0 -1px 0 rgba(255, 255, 255, 0.08);
  }
  html[data-theme="dark"] .project-band:hover .project-band__title,
  html[data-theme="dark"] .project-band:hover .project-band__typology { color: #1a1f16; }
  html[data-theme="dark"] .project-band:hover .project-tag { color: #1a1f16; border-color: rgba(26,31,22,0.4); }
}

/* ── hekla-footer-brain.svg — inversé en blanc ───────────────── */
html[data-theme="dark"] .contact-cta__logo {
  filter: invert(1);
}

/* ── .edito-panel::before — dégradé sage/vert ───────────────── */
html[data-theme="dark"] .edito-panel::before {
  background: conic-gradient(
    from 0deg,
    #c8d4b0  0deg,  #a6b28b  36deg,  #8a9870  72deg,  #6c7359 108deg,  #3b4031 144deg,
    #c8d4b0 180deg, #a6b28b 216deg,  #8a9870 252deg,  #6c7359 288deg,  #3b4031 324deg,
    #c8d4b0 360deg
  );
}

/* ── .expertises-title — dégradé animé sage/vert ────────────── */
html[data-theme="dark"] .expertises-title {
  background: linear-gradient(90deg, #a6b28b, #6c7359, #3b4031, #6c7359, #a6b28b);
  background-size: 300% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* ── Float-nav.is-light — override en blanc en ISK mode ─────── */
/* (Logo déjà inversé via filter:invert(1) en haut du fichier)  */
html[data-theme="dark"] .float-nav.is-light {
  color: var(--c-black); /* = #ffffff en dark mode */
}

/* ── sitemap — hover links sage/vert ────────────────────────── */
html[data-theme="dark"] .sitemap-links li a:hover {
  color: #a6b28b;
}

/* ── projet-detail-btn — teinté vert sage en ISL mode ───────── */
html[data-theme="dark"] .projet-detail-btn {
  background: rgba(166, 178, 139, 0.20);
  border-color: rgba(166, 178, 139, 0.30);
  box-shadow: 0 4px 24px rgba(166, 178, 139, 0.10), inset 0 1px 0 rgba(255,255,255,0.18);
  color: #a6b28b;
}

html[data-theme="dark"] .projet-detail-btn.is-open {
  background: rgba(166, 178, 139, 0.36);
  border-color: rgba(166, 178, 139, 0.50);
}

@media (hover: hover) {
  html[data-theme="dark"] .projet-detail-btn:hover {
    background: rgba(166, 178, 139, 0.32);
    box-shadow: 0 6px 32px rgba(166, 178, 139, 0.13), inset 0 1px 0 rgba(255,255,255,0.28);
    border-color: rgba(166, 178, 139, 0.46);
  }
}

/* ── Mobile — force le menu pill en bas (cohérence homepage / autres pages) ── */
/* Backup CSS : garantit position:fixed bottom:0 sur tous les viewport mobiles,
   indépendamment du contexte sticky de .above-fold sur la homepage.           */
@media (max-width: 768px) {
  .section-menu {
    position: fixed !important;
    bottom: 0 !important;
    top: auto !important;
  }

  /* Correctif calc() : le bundle minifié supprime les espaces autour de +
     ce qui rend calc(16px+env(...)) invalide selon la spec — iOS Safari
     peut ne pas appliquer env(safe-area-inset-bottom) dans ce cas.
     Ce correctif restaure les espaces obligatoires autour de l'opérateur. */
  .float-nav {
    margin: 0 auto calc(16px + env(safe-area-inset-bottom, 0px));
  }
}