/* ===== Base: fond par défaut pour TOUTES LES PAGES ===== */
html, body { height: 100%; }
body{
  margin:0;
  font-family:"Quicksand",system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  background:#F6F9FF;  /* bleu très clair, uni */
  color:#0d2b5c;
}

/* ===== Fond dégradé UNIQUEMENT sur l'accueil (.home) ===== */
.home{ position: relative; }
.home::before{
  content:""; position: fixed; inset: 0; z-index:-1; pointer-events:none;
  background: linear-gradient(180deg, #00387d 0%, #1ea3b5 55%, #28bcb0 100%);
}

/* ===== Hero ===== */
.md-typeset .hero{
  margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw);
  width: 100vw; min-height: 48vh;
  display:flex; align-items:center; justify-content:center; background: transparent;
  color:#fff; padding: 3.2rem 1.2rem 1.8rem; overflow:hidden;
}
.hero .container{
  max-width: 1100px; margin: 0 auto;
  display:grid; grid-template-columns: 1.1fr .9fr; align-items:center; gap: 28px;
}
.hero .hero-title{ font-weight:700; letter-spacing:.2px; font-size: clamp(2rem, 3.6vw, 3.25rem); margin:0 0 .6rem; }
.hero .hero-lead{ font-size: clamp(1rem, 1.25vw, 1.25rem); opacity:.95; max-width:820px; margin:0 0 1.1rem; color:#eef3ff; }
.hero .md-button--primary{ background:#fff !important; color:#00387d !important; border:0 !important; box-shadow:0 6px 14px rgba(0,0,0,.18); }
.hero .md-button{ color:#fff; border:2px solid rgba(255,255,255,.85); background:transparent; }
.hero .md-button:hover{ background: rgba(255,255,255,.12); border-color:#fff; }
.hero .hero-img{
  width: min(520px, 42vw); justify-self:end;
  filter: drop-shadow(0 8px 16px rgba(0,0,0,.12));
}

/* ===== Onglets ===== */
.tabs-wrap{ width:100%; padding: clamp(1rem, 3vw, 1.6rem) 0 1.2rem; }
.tabs{
  width: min(1200px, 94vw);
  margin: 0 auto;
  background: #ffffff;
  border-radius: 18px;
  box-shadow: 0 24px 60px rgba(0,0,0,.18), inset 0 0 0 1px #ffffff66;
  overflow: hidden;
}
.tabbar{
  position: relative;
  display: flex; gap: 6px; padding: 10px;
  background: linear-gradient(180deg,#f5f9ff,#fff);
  isolation: isolate;
}
.tab{
  position: relative; z-index: 1;
  border: 0; background: transparent; cursor: pointer;
  padding: 10px 14px; border-radius: 10px;
  font-weight: 700; font-size: 14px;
  color: #103a66 !important;
  opacity: .9;
  transition: opacity .2s, transform .2s;
  white-space: nowrap;
}
.tab:hover{ opacity: 1; transform: translateY(-1px); }
.tab[aria-selected="true"]{ opacity: 1; }
.indicator{
  position:absolute; z-index: 0; height:36px; top:50%; transform:translateY(-50%);
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 10px 22px rgba(0,0,0,.12), inset 0 0 0 1px #eaf2ff;
  transition: left .25s cubic-bezier(.22,.61,.36,1), width .25s cubic-bezier(.22,.61,.36,1);
  pointer-events: none;
}

/* Panneaux: espace fixe, contenus superposés */
.panels{
  position: relative;
  height: clamp(320px, 46vh, 560px);
  padding: 0;
  overflow: hidden;
}
.panel{
  position: absolute;
  inset: 14px 16px 18px 16px;
  border-radius: 12px;
  background: linear-gradient(180deg, #f9fbff, #fff 22%);
  padding: 12px;
  overflow: auto;
  opacity: 0;
  transform: translateY(4px);
  pointer-events: none;
  transition: opacity .20s, transform .20s;
}
.panel.active{
  opacity: 1;
  transform: none;
  pointer-events: auto;
}

/* Grille contenu 3 colonnes */
.cols{
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 18px 22px;
}
.cols h4{ font-size: 0.98rem; margin: 0 0 6px; color:#0f5561; font-weight:700; }
.cols ul{ margin:0; padding:0; list-style:none; display:grid; gap:6px; }
.cols a{ color:#0b4f7a; text-decoration:none; border-bottom:1px solid rgba(11,79,122,.25); padding-bottom:2px; }
.cols a:hover{ border-color: rgba(11,79,122,.7); }

/* Réactivité */
@media (max-width: 980px){
  .hero .container{ grid-template-columns: 1fr; }
  .hero .hero-img{ justify-self:start; width:min(480px,70vw); }
}
@media (max-width: 620px){
  .cols{ grid-template-columns: 1fr; }
}

/* En-tête MKDocs + footer */
.md-header, .md-tabs{ background-color:#00387d !important; }
.md-header__title, .md-tabs__link{ color:#fff !important; }
.md-tabs__link:hover{ background: rgba(255,255,255,0.1); }
.md-footer{ display:none !important; }

/* Accessibilité */
::selection{ background:#cfe2ff; color:#0d2b5c; }
@media (prefers-reduced-motion: reduce){
  *{ animation:none !important; transition:none !important; }
}

/* ===== Fond uni global ===== */
body{ background:#F6F9FF; }

/* ===== Accueil : garde le dégradé ===== */
.home{ position:relative; }
.home::before{
  content:""; position:fixed; inset:0; z-index:-1; pointer-events:none;
  background:linear-gradient(180deg,#00387d 0%,#1ea3b5 55%,#28bcb0 100%);
}

/* ===== Toutes les AUTRES pages : grand panneau blanc à droite ===== */
html:not(.is-home) .md-content{
  position:relative; z-index:0;
  background:#fff;                 /* paneau blanc principal */
  border-top-left-radius:18px;
  /* Étend le blanc vers la droite sous le TOC et jusqu'au bord fenêtre */
  box-shadow:0 0 0 100vmax #fff;
  clip-path: inset(0 -100vmax 0 0); /* ne pas déborder à gauche */
}

/* TOC au-dessus du “panneau” blanc, sans fond propre */
html:not(.is-home) .md-sidebar--secondary{ position:relative; z-index:1; background:transparent; }

/* Optionnel: fin filet vertical côté menu gauche */
html:not(.is-home) .md-content{ box-shadow:
    0 0 0 100vmax #fff,
    inset 1px 0 0 #e9eef9; }
.img-center { display:block; margin:0 auto; }