/* =============================================================================
   assets/css/institution-2027.css - turf.bzh
   -----------------------------------------------------------------------------
   Pages institutionnelles au gabarit 2027 (11/10/2026) : À propos
   (a-propos.php), Mentions légales (mentions.php), Conditions générales de
   vente (cgv.php). Même système que contact-2027.css : les jetons --tbz-ag-*
   du thème sont recopiés en --ip-* avec une valeur de secours.

   PORTÉE. Tout est sous .ip-page, classes préfixées .ip-. Deux règles seulement
   visent hors de la page, toutes deux dans @media print et limitées par
   body:has(> .ip-page) : seul le contenu de .ip-page est imprimé (en-tête,
   pied et boutons flottants du site masqués), sur fond blanc.

   MOBILE D'ABORD. Une colonne. Pages juridiques : sommaire replié en tête,
   puis, à partir de 64rem, sommaire collant à gauche du texte.

   GRILLES. Chaque grille reçoit un nombre de cases qui la remplit à chaque
   palier (2 colonnes : nombre pair ; 3 colonnes : multiple de 6), pour ne
   jamais laisser de case vide en fin de ligne.

   CONTRASTE. Texte mesuré sur blanc : #0f172a 17,8:1 ; #1e293b 14,6:1 ;
   #334155 10,4:1 ; #475569 7,6:1 ; #075d6e 7,9:1 ; #047857 5,5:1.
   #075d6e sur #e0f2f6 : 6,5:1. Blanc sur le dégradé du hero : 4,88:1 au pire
   point. Bord des pastilles d'ancre (À propos) : #8291a6, 3,2:1 ; les
   blocs, le sommaire et la FAQ gardent le bord neutre #e5e7eb.

   Aucune carte à bordure gauche colorée : les encadrés ont une bordure
   complète et un fond teinté.

   @author Claude (2026-10-11)
   @version 1.0.0
   ========================================================================== */

.ip-page{
  --ip-bg:      var(--tbz-ag-bg, #f8fafc);
  --ip-soft:    var(--tbz-ag-bg-soft, #f1f5f9);
  --ip-card:    var(--tbz-ag-card, #ffffff);
  --ip-bd:      var(--tbz-ag-border, #e5e7eb);
  --ip-bd-soft: var(--tbz-ag-border-soft, #eef0f3);
  --ip-bd-ctl:  #8291a6;
  --ip-ink:     var(--tbz-ag-text, #0f172a);
  --ip-ink2:    var(--tbz-ag-text-2, #1e293b);
  --ip-ink3:    #334155;
  --ip-mut:     #475569;
  --ip-acc:     var(--tbz-ag-accent, #0a7c91);
  --ip-acc-d:   var(--tbz-ag-accent-d, #075d6e);
  --ip-acc-l:   var(--tbz-ag-accent-l, #e0f2f6);
  --ip-acc-l2:  var(--tbz-ag-accent-l2, #ecf7fa);
  --ip-acc-bd:  #b6dde7;
  --ip-grad:    linear-gradient(135deg,#075d6e 0%,#0a7c91 55%,#0e7490 100%);
  --ip-ok:      #047857;
  --ip-r-sm:    var(--tbz-ag-r-sm, 10px);
  --ip-r-md:    var(--tbz-ag-r-md, 14px);
  --ip-r-lg:    var(--tbz-ag-r-lg, 18px);
  --ip-pill:    var(--tbz-ag-r-pill, 999px);
  --ip-sh-sm:   var(--tbz-ag-sh-sm, 0 1px 3px 0 rgba(15,23,42,.06), 0 1px 2px -1px rgba(15,23,42,.04));
  --ip-sh-lg:   var(--tbz-ag-sh-lg, 0 10px 15px -3px rgba(15,23,42,.08), 0 4px 6px -4px rgba(15,23,42,.05));
  --ip-ease:    var(--tbz-ag-ease-out, cubic-bezier(.16,1,.3,1));
  --ip-font:    var(--tbz-ag-font, 'Inter','Open Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',system-ui,sans-serif);
  --ip-haut:    calc(var(--tbz-hd-collant, 58px) + 1rem);   /* sous la barre collante du site */

  max-width: 1180px;
  margin: 0 auto;
  padding: .85rem 1rem 3.5rem;
  font-family: var(--ip-font);
  color: var(--ip-ink);
  line-height: 1.65;
  letter-spacing: -.005em;
  overflow-wrap: break-word;
}
.ip-page *, .ip-page *::before, .ip-page *::after{ box-sizing: border-box; }
.ip-page [hidden]{ display: none !important; }
.ip-page .ip-lecteur{ position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.ip-page h1, .ip-page h2, .ip-page h3{
  font-family: inherit; color: inherit; text-transform: none; letter-spacing: -.018em; margin: 0; line-height: 1.25;
}
.ip-page p{ margin: 0 0 .8rem; }
.ip-page p:last-child{ margin-bottom: 0; }
.ip-page ul, .ip-page ol{ margin: 0 0 .8rem; padding-left: 1.25rem; }
.ip-page li{ margin: .3rem 0; }
.ip-page dl, .ip-page dd{ margin: 0; }
.ip-page address{ font-style: normal; margin: 0; }
.ip-page img{ max-width: 100%; height: auto; }
.ip-page a{ color: var(--ip-acc-d); text-underline-offset: 2px; text-decoration-thickness: 1px; }
.ip-page a:hover{ color: var(--ip-acc); }
.ip-page :focus-visible{ outline: 2px solid var(--ip-acc); outline-offset: 2px; }
.ip-page button{ font-family: inherit; }

/* ------------------------------------------------------- fil d'Ariane -- */
.ip-page .ip-fil{ font-size: .86rem; color: var(--ip-mut); margin: 0 0 .7rem; }
.ip-page .ip-fil ol{ display: flex; flex-wrap: wrap; gap: .25rem; list-style: none; margin: 0; padding: 0; }
.ip-page .ip-fil li{ margin: 0; display: inline-flex; align-items: center; gap: .25rem; }
.ip-page .ip-fil li + li::before{ content: "›"; color: var(--ip-mut); }
.ip-page .ip-fil a{ text-decoration: none; font-weight: 600; }
.ip-page .ip-fil a:hover{ text-decoration: underline; }

/* ------------------------------------------------------------------ hero -- */
.ip-page .ip-hero{
  background: var(--ip-grad);
  color: #fff;
  border-radius: var(--ip-r-lg);
  padding: 1.5rem 1.25rem 1.35rem;
  box-shadow: var(--ip-sh-lg);
  margin-bottom: 1.25rem;
}
.ip-page .ip-hero-oeil{
  display: inline-flex; align-items: center; gap: .4rem;
  font-size: .72rem; font-weight: 800; text-transform: uppercase; letter-spacing: .13em;
  background: rgba(3,38,48,.30); border-radius: var(--ip-pill);
  padding: .22rem .7rem; margin-bottom: .7rem; color: #fff;
}
.ip-page .ip-hero h1{ font-size: clamp(1.4rem, 4.6vw, 2.1rem); font-weight: 800; line-height: 1.18; margin-bottom: .6rem; color: #fff; }
.ip-page .ip-hero-sous{ color: #fff; font-size: 1.02rem; line-height: 1.6; }
.ip-page .ip-chips{ display: flex; flex-wrap: wrap; gap: .5rem; margin: 1rem 0 0; padding: 0; list-style: none; }
.ip-page .ip-chips li{
  display: inline-flex; align-items: center; gap: .4rem; margin: 0;
  background: rgba(3,38,48,.28); border: 1px solid rgba(255,255,255,.28);
  border-radius: var(--ip-pill); padding: .26rem .8rem; font-size: .84rem; font-weight: 700; color: #fff;
}
.ip-page .ip-actions{ display: flex; flex-wrap: wrap; gap: .6rem; margin-top: 1.15rem; }
.ip-page .ip-btn{
  display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
  min-height: 2.75rem; padding: .55rem 1.1rem; border-radius: var(--ip-r-sm);
  font-size: .95rem; font-weight: 700; line-height: 1.2; text-decoration: none; cursor: pointer;
  border: 1.5px solid transparent; transition: background-color .15s var(--ip-ease), border-color .15s var(--ip-ease);
}
.ip-page .ip-btn--plein{ background: #fff; color: var(--ip-acc-d); }
.ip-page .ip-btn--plein:hover{ background: var(--ip-acc-l); color: var(--ip-acc-d); }
.ip-page .ip-btn--contour{ background: rgba(3,38,48,.18); color: #fff; border-color: rgba(255,255,255,.8); }
.ip-page .ip-btn--contour:hover{ background: rgba(3,38,48,.34); color: #fff; }
.ip-page .ip-hero .ip-btn:focus-visible{ outline-color: #fff; }
@media (max-width: 29.99rem){
  .ip-page .ip-actions .ip-btn{ flex: 1 1 100%; }
}
@media (min-width: 48rem){ .ip-page .ip-hero{ padding: 1.9rem 2rem 1.7rem; } }

/* ------------------------------------------------- ancres (À propos) -- */
.ip-page .ip-ancres{ margin: 0 0 1.25rem; }
.ip-page .ip-ancres ul{ display: flex; flex-wrap: wrap; gap: .45rem; list-style: none; margin: 0; padding: 0; }
.ip-page .ip-ancres li{ margin: 0; }
.ip-page .ip-ancres a{
  display: inline-flex; align-items: center; min-height: 2.25rem; padding: .3rem .85rem;
  border: 1px solid var(--ip-bd-ctl); border-radius: var(--ip-pill); background: var(--ip-card);
  font-size: .88rem; font-weight: 700; text-decoration: none; color: var(--ip-acc-d);
}
.ip-page .ip-ancres a:hover{ background: var(--ip-acc-l2); }

/* ----------------------------------------------------------------- blocs -- */
.ip-page .ip-bloc{
  background: var(--ip-card);
  border: 1px solid var(--ip-bd);
  border-radius: var(--ip-r-md);
  box-shadow: var(--ip-sh-sm);
  padding: 1.2rem 1.05rem;
  margin-bottom: 1.25rem;
}
@media (min-width: 48rem){ .ip-page .ip-bloc{ padding: 1.6rem 1.75rem; } }
.ip-page .ip-bloc-t{
  display: flex; align-items: center; gap: .55rem;
  font-size: 1.22rem; font-weight: 800; color: var(--ip-ink); margin-bottom: .45rem;
}
.ip-page .ip-bloc-t > i{ color: var(--ip-acc); font-size: 1rem; flex: 0 0 auto; }
@media (min-width: 48rem){ .ip-page .ip-bloc-t{ font-size: 1.4rem; } }
.ip-page .ip-bloc-st{ color: var(--ip-ink3); font-size: 1rem; margin-bottom: 1.1rem; max-width: 70rem; }
.ip-page .ip-bloc h3{ font-size: 1.04rem; font-weight: 800; color: var(--ip-ink2); margin-bottom: .45rem; }
.ip-page .ip-bloc p, .ip-page .ip-bloc li{ color: var(--ip-ink3); }
.ip-page .ip-bloc strong{ color: var(--ip-ink); }

.ip-page .ip-duo{ display: grid; grid-template-columns: minmax(0,1fr); gap: 1.25rem; }
@media (min-width: 48rem){ .ip-page .ip-duo{ grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 1.25rem 2rem; } }
.ip-page .ip-carte{
  background: var(--ip-bg); border: 1px solid var(--ip-bd); border-radius: var(--ip-r-sm);
  padding: 1rem 1.05rem;
}
@media (min-width: 48rem){ .ip-page .ip-carte{ padding: 1.15rem 1.3rem; } }

/* Liste cochée : coche Font Awesome, pas de glyphe */
.ip-page .ip-coches{ list-style: none; padding: 0; margin: 0; }
.ip-page .ip-coches li{ position: relative; padding-left: 1.75rem; margin: .55rem 0; }
.ip-page .ip-coches li::before{
  content: "\f00c"; font-family: "Font Awesome 6 Free","Font Awesome 5 Free"; font-weight: 900;
  position: absolute; left: 0; top: .12rem; width: 1.15rem; height: 1.15rem; border-radius: 999px;
  display: grid; place-items: center; font-size: .62rem; color: var(--ip-ok); background: #d1fae5;
}

/* Liens en pastilles sous un bloc */
.ip-page .ip-liens{ display: flex; flex-wrap: wrap; gap: .45rem .9rem; margin: 1rem 0 0; padding: 0; list-style: none; font-size: .93rem; }
.ip-page .ip-liens li{ margin: 0; }
.ip-page .ip-liens a{ display: inline-flex; align-items: center; gap: .4rem; font-weight: 700; text-decoration: none; }
.ip-page .ip-liens a:hover{ text-decoration: underline; }
.ip-page .ip-liens i{ font-size: .75rem; }
.ip-page .ip-liens-t{ font-weight: 700; color: var(--ip-mut); }

/* ------------------------------------------------------ faits (dl) -- */
/* Bords d'1 px par le fond du conteneur : les cases sont toujours en nombre
   qui remplit la grille (voir GRILLES en tête). */
.ip-page .ip-faits{
  display: grid; grid-template-columns: minmax(0,1fr); gap: 1px;
  background: var(--ip-bd); border: 1px solid var(--ip-bd); border-radius: var(--ip-r-sm); overflow: hidden;
}
.ip-page .ip-faits > div{ background: var(--ip-card); padding: .75rem .95rem; min-width: 0; }
.ip-page .ip-faits dt{
  font-size: .74rem; font-weight: 800; text-transform: uppercase; letter-spacing: .07em;
  color: var(--ip-mut); margin: 0 0 .2rem;
}
.ip-page .ip-faits dd{ color: var(--ip-ink); font-weight: 600; font-size: .98rem; line-height: 1.5; }
.ip-page .ip-faits dd a{ font-weight: 700; }
@media (min-width: 40rem){ .ip-page .ip-faits{ grid-template-columns: minmax(0,1fr) minmax(0,1fr); } }
@media (min-width: 72rem){ .ip-page .ip-faits--3{ grid-template-columns: repeat(3, minmax(0,1fr)); } }

/* ------------------------------------------------------------ étapes -- */
.ip-page .ip-etapes{ list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: minmax(0,1fr); gap: 1rem; counter-reset: ip-etape; }
.ip-page .ip-etapes > li{
  margin: 0; counter-increment: ip-etape;
  background: var(--ip-bg); border: 1px solid var(--ip-bd); border-radius: var(--ip-r-sm);
  padding: 1rem 1.05rem;
}
.ip-page .ip-etapes > li::before{
  content: counter(ip-etape); display: grid; place-items: center;
  width: 2rem; height: 2rem; border-radius: 999px; margin-bottom: .6rem;
  background: var(--ip-acc-l); color: var(--ip-acc-d); font-weight: 800; font-size: .95rem;
}
.ip-page .ip-etapes h3{ font-size: 1rem; margin-bottom: .35rem; }
.ip-page .ip-etapes p{ font-size: .94rem; }
@media (min-width: 40rem){ .ip-page .ip-etapes{ grid-template-columns: minmax(0,1fr) minmax(0,1fr); } }
@media (min-width: 72rem){ .ip-page .ip-etapes{ grid-template-columns: repeat(4, minmax(0,1fr)); } }

/* ------------------------------------------------------------ outils -- */
.ip-page .ip-outils{ display: grid; grid-template-columns: minmax(0,1fr); gap: 1rem; }
@media (min-width: 40rem){ .ip-page .ip-outils{ grid-template-columns: minmax(0,1fr) minmax(0,1fr); } }
@media (min-width: 64rem){ .ip-page .ip-outils{ grid-template-columns: repeat(3, minmax(0,1fr)); } }
.ip-page .ip-outils h3{ display: flex; align-items: center; gap: .5rem; font-size: 1rem; margin-bottom: .55rem; }
.ip-page .ip-outils h3 i{ color: var(--ip-acc); font-size: .9rem; }
.ip-page .ip-outils ul{ list-style: none; margin: 0; padding: 0; }
.ip-page .ip-outils li{ margin: 0; padding: .5rem 0; border-top: 1px solid var(--ip-bd); }
.ip-page .ip-outils li:first-child{ border-top: 0; padding-top: 0; }
.ip-page .ip-outils li:last-child{ padding-bottom: 0; }
.ip-page .ip-outils a{ font-weight: 700; text-decoration: none; }
.ip-page .ip-outils a:hover{ text-decoration: underline; }
.ip-page .ip-outils span{ display: block; font-size: .88rem; color: var(--ip-mut); line-height: 1.45; margin-top: .1rem; }

/* ------------------------------------------------------------ équipe -- */
.ip-page .ip-equipe{ display: grid; grid-template-columns: minmax(0,1fr); gap: 1rem; }
@media (min-width: 48rem){ .ip-page .ip-equipe{ grid-template-columns: minmax(0,1fr) minmax(0,1fr); } }
.ip-page .ip-membre--fondateur{ display: grid; grid-template-columns: minmax(0,1fr); gap: 1rem; align-items: start; }
@media (min-width: 48rem){
  .ip-page .ip-membre--fondateur{ grid-column: 1 / -1; grid-template-columns: 7.5rem minmax(0,1fr); gap: 1.4rem; }
}
.ip-page .ip-membre-photo{ width: 6.5rem; height: 6.5rem; border-radius: 999px; object-fit: cover; border: 3px solid #fff; box-shadow: 0 0 0 1px var(--ip-bd); display: block; }
@media (min-width: 48rem){ .ip-page .ip-membre-photo{ width: 7.5rem; height: 7.5rem; } }
.ip-page .ip-membre h3{ font-size: 1.1rem; margin-bottom: .1rem; }
.ip-page .ip-role{ font-size: .86rem; font-weight: 700; color: var(--ip-acc-d); margin-bottom: .55rem; }
.ip-page .ip-membre .ip-liens{ margin-top: .75rem; }

/* ----------------------------------------------------- mise en page doc -- */
.ip-page .ip-cadre{ display: grid; grid-template-columns: minmax(0,1fr); gap: 1.25rem; align-items: start; }
@media (min-width: 64rem){ .ip-page .ip-cadre{ grid-template-columns: 16.5rem minmax(0,1fr); gap: 1.5rem; } }
/* Sans script, le sommaire reste replié : il passe au-dessus du texte au lieu
   d'occuper seul une colonne vide. */
@media (scripting: none) and (min-width: 64rem){ .ip-page .ip-cadre{ grid-template-columns: minmax(0,1fr); } }
.ip-page .ip-principal{ min-width: 0; }
.ip-page .ip-principal > * + *{ margin-top: 1.25rem; }
.ip-page .ip-principal > .ip-bloc{ margin-bottom: 0; }

/* Sommaire : replié sur téléphone et tablette, collant à gauche ensuite */
.ip-page .ip-sommaire{
  background: var(--ip-card); border: 1px solid var(--ip-bd); border-radius: var(--ip-r-md);
  box-shadow: var(--ip-sh-sm); min-width: 0;
}
.ip-page .ip-sommaire summary{
  display: flex; align-items: center; justify-content: space-between; gap: .75rem;
  padding: .85rem 1rem; cursor: pointer; list-style: none; min-height: 2.75rem;
  font-weight: 800; font-size: .98rem; color: var(--ip-ink);
}
.ip-page .ip-sommaire summary::-webkit-details-marker{ display: none; }
.ip-page .ip-sommaire summary::after{
  content: "\f078"; font-family: "Font Awesome 6 Free","Font Awesome 5 Free"; font-weight: 900;
  font-size: .8rem; color: var(--ip-acc); flex: 0 0 auto; transition: transform .2s var(--ip-ease);
}
.ip-page .ip-sommaire[open] summary::after{ transform: rotate(180deg); }
.ip-page .ip-sommaire summary:focus-visible{ outline-offset: -2px; border-radius: var(--ip-r-md); }
.ip-page .ip-sommaire-n{ font-weight: 600; color: var(--ip-mut); font-size: .88rem; margin-left: .35rem; }
.ip-page .ip-sommaire ol{ list-style: none; margin: 0; padding: 0 .5rem .6rem; border-top: 1px solid var(--ip-bd-soft); }
.ip-page .ip-sommaire li{ margin: 0; }
.ip-page .ip-sommaire a{
  display: flex; gap: .55rem; align-items: baseline; padding: .42rem .55rem; border-radius: 8px;
  font-size: .9rem; line-height: 1.35; color: var(--ip-ink3); text-decoration: none;
}
.ip-page .ip-sommaire a:hover{ background: var(--ip-soft); color: var(--ip-acc-d); }
.ip-page .ip-sommaire a[aria-current]{ background: var(--ip-acc-l); color: var(--ip-acc-d); font-weight: 700; }
.ip-page .ip-sommaire .ip-sn{ flex: 0 0 1.4rem; font-variant-numeric: tabular-nums; font-weight: 700; color: var(--ip-acc-d); text-align: right; }
.ip-page .ip-sommaire li:first-child a{ margin-top: .45rem; }
@media (min-width: 40rem) and (max-width: 63.99rem){
  .ip-page .ip-sommaire ol{ columns: 2; column-gap: 1rem; }
  .ip-page .ip-sommaire li{ break-inside: avoid; }
}
@media (min-width: 64rem){
  .ip-page .ip-sommaire{
    position: sticky; top: var(--ip-haut);
    max-height: calc(100vh - var(--ip-haut) - 1rem); overflow-y: auto; overscroll-behavior: contain;
  }
  .ip-page .ip-sommaire summary{ padding-bottom: .7rem; }
}

/* Texte juridique : un seul bloc, articles séparés par un filet */
.ip-page .ip-doc{
  background: var(--ip-card); border: 1px solid var(--ip-bd); border-radius: var(--ip-r-md);
  box-shadow: var(--ip-sh-sm); padding: .35rem 1.05rem;
}
@media (min-width: 48rem){ .ip-page .ip-doc{ padding: .6rem 2rem; } }
.ip-page .ip-art{ padding: 1.35rem 0; }
.ip-page .ip-art + .ip-art{ border-top: 1px solid var(--ip-bd); }
.ip-page .ip-art p, .ip-page .ip-art li{ color: var(--ip-ink3); }
.ip-page .ip-art strong{ color: var(--ip-ink); }
.ip-page .ip-art-t{
  display: flex; align-items: flex-start; gap: .7rem;
  font-size: 1.16rem; font-weight: 800; color: var(--ip-ink); margin-bottom: .85rem;
}
@media (min-width: 48rem){ .ip-page .ip-art-t{ font-size: 1.28rem; } }
.ip-page .ip-num{
  flex: 0 0 auto; min-width: 2rem; height: 2rem; padding: 0 .4rem; border-radius: 999px;
  display: inline-grid; place-items: center; margin-top: -.15rem;
  background: var(--ip-acc-l); color: var(--ip-acc-d); font-size: .9rem; font-weight: 800; font-variant-numeric: tabular-nums;
}
.ip-page .ip-art-t > span:last-child{ min-width: 0; }
.ip-page .ip-art h3{ font-size: 1.02rem; font-weight: 800; color: var(--ip-ink2); margin: 1.25rem 0 .45rem; }
.ip-page .ip-art h3:first-of-type{ margin-top: .4rem; }
.ip-page .ip-art-t + h3{ margin-top: 0; }
.ip-page .ip-art .ip-faits{ margin: .2rem 0 .9rem; }
.ip-page .ip-art .ip-faits:last-child{ margin-bottom: 0; }

/* Encarts (bordure complète, fond teinté) */
.ip-page .ip-encart{
  display: flex; gap: .7rem; align-items: flex-start;
  background: var(--ip-acc-l2); border: 1px solid var(--ip-acc-bd); border-radius: var(--ip-r-sm);
  padding: .85rem 1rem; color: var(--ip-ink2); font-size: .95rem; margin: .9rem 0;
}
.ip-page .ip-encart > i{ color: var(--ip-acc-d); margin-top: .28rem; flex: 0 0 auto; }
.ip-page .ip-encart p{ color: var(--ip-ink2); }
.ip-page .ip-encart:last-child{ margin-bottom: 0; }
.ip-page .ip-encart a:hover, .ip-page .ip-jeu a:hover{ color: var(--ip-acc-d); }   /* 4,5:1 sur fond teinté */
.ip-page .ip-adresse{ line-height: 1.7; }

.ip-page .ip-jeu{
  font-size: .86rem; color: var(--ip-mut); line-height: 1.55;
  background: var(--ip-soft); border: 1px solid var(--ip-bd); border-radius: var(--ip-r-sm);
  padding: .8rem 1rem;
}
.ip-page .ip-jeu p{ margin: 0; color: var(--ip-mut); }
.ip-page .ip-jeu strong{ color: var(--ip-ink2); }

/* Note de version, signature */
.ip-page .ip-version{
  display: flex; gap: .6rem; align-items: flex-start;
  font-size: .9rem; color: var(--ip-mut);
}
.ip-page .ip-version i{ margin-top: .28rem; color: var(--ip-acc-d); }
.ip-page .ip-version p{ color: var(--ip-mut); }
.ip-page .ip-version + p, .ip-page p + .ip-version{ margin-top: .8rem; }

/* ------------------------------------------------- l'essentiel (CGV) -- */
.ip-page .ip-essentiel ul{ list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: minmax(0,1fr); gap: .75rem; }
@media (min-width: 40rem){ .ip-page .ip-essentiel ul{ grid-template-columns: minmax(0,1fr) minmax(0,1fr); } }
/* Nombre impair de points : le dernier prend toute la largeur, pas de case vide en fin de grille (CGV en 9 points, 12/10/2026). */
@media (min-width: 40rem){ .ip-page .ip-essentiel li:last-child:nth-child(odd){ grid-column: 1 / -1; } }
.ip-page .ip-essentiel li{
  margin: 0; display: grid; grid-template-columns: 2.2rem minmax(0,1fr); gap: .7rem; align-items: start;
  background: var(--ip-bg); border: 1px solid var(--ip-bd); border-radius: var(--ip-r-sm); padding: .85rem .95rem;
}
.ip-page .ip-essentiel li > i{
  width: 2.2rem; height: 2.2rem; border-radius: 999px; display: grid; place-items: center;
  background: var(--ip-acc-l); color: var(--ip-acc-d); font-size: .88rem;
}
.ip-page .ip-essentiel strong{ display: block; color: var(--ip-ink); margin-bottom: .15rem; }
.ip-page .ip-essentiel span{ display: block; font-size: .92rem; color: var(--ip-ink3); line-height: 1.5; }
.ip-page .ip-essentiel .ip-renvoi{ margin-top: .35rem; font-size: .86rem; color: var(--ip-mut); }
.ip-page .ip-essentiel .ip-renvoi a{ font-weight: 700; }
.ip-page .ip-essentiel .ip-avert{ font-size: .86rem; color: var(--ip-mut); margin: .9rem 0 0; }

/* ------------------------------------------------------------------ FAQ -- */
.ip-page .ip-faq-liste{ border: 1px solid var(--ip-bd); border-radius: var(--ip-r-sm); overflow: hidden; }
.ip-page .ip-faq details + details{ border-top: 1px solid var(--ip-bd); }
.ip-page .ip-faq summary{
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  padding: .9rem 1rem; cursor: pointer; list-style: none; min-height: 2.75rem;
  font-weight: 700; color: var(--ip-ink2); font-size: .98rem; line-height: 1.4;
}
.ip-page .ip-faq summary::-webkit-details-marker{ display: none; }
.ip-page .ip-faq summary::after{
  content: "\f078"; font-family: "Font Awesome 6 Free","Font Awesome 5 Free"; font-weight: 900;
  font-size: .8rem; color: var(--ip-acc); flex: 0 0 auto; transition: transform .2s var(--ip-ease);
}
.ip-page .ip-faq details[open] summary::after{ transform: rotate(180deg); }
.ip-page .ip-faq summary:hover{ background: var(--ip-soft); }
.ip-page .ip-faq summary:focus-visible{ outline-offset: -2px; }
.ip-page .ip-faq details p{ padding: 0 1rem 1rem; margin: 0; color: var(--ip-ink3); font-size: .95rem; }

@media (prefers-reduced-motion: reduce){
  .ip-page *, .ip-page *::before, .ip-page *::after{ transition-duration: .01ms !important; }
}

/* ------------------------------------------------------------ impression -- */
@media print{
  body:has(> .ip-page) > *:not(.ip-page){ display: none !important; }
  body:has(> .ip-page){ background: #fff !important; }
  .ip-page{ max-width: none; padding: 0; color: #000; font-size: 11pt; }
  .ip-page .ip-fil, .ip-page .ip-actions, .ip-page .ip-ancres, .ip-page .ip-sommaire{ display: none !important; }
  .ip-page .ip-hero{ background: none; color: #000; box-shadow: none; border: 0; border-bottom: 1px solid #999; border-radius: 0; padding: 0 0 .6rem; }
  .ip-page .ip-hero *, .ip-page .ip-hero h1, .ip-page .ip-hero-sous{ color: #000 !important; }
  .ip-page .ip-hero-oeil, .ip-page .ip-chips li{ background: none; border: 0; padding: 0; }
  .ip-page .ip-chips{ gap: .2rem 1rem; }
  .ip-page .ip-cadre{ display: block; }
  .ip-page .ip-bloc, .ip-page .ip-doc{ box-shadow: none; border: 0; padding: 0; }
  .ip-page .ip-art{ padding: .8rem 0; }
  .ip-page .ip-art-t, .ip-page .ip-art h3, .ip-page .ip-bloc-t{ break-after: avoid; }
  .ip-page .ip-faits > div, .ip-page .ip-essentiel li{ break-inside: avoid; }
  .ip-page .ip-doc a[href^="http"]:not(.ip-url)::after{ content: " (" attr(href) ")"; font-size: .85em; color: #333; }
  .ip-page a{ color: #000; }
}