/* Ebanda & Valcourt — feuille complémentaire « map » : chargée seulement par les pages concernées. */
@layer reset, tokens, base, layout, components, utilities, pages;

@layer components {
  .tile__go .ico { transition: transform var(--dur-2) var(--ease-out); }
  .tile__a:hover .tile__go .ico { transform: translateX(4px); }
}

@layer pages {
  .hero .lead { margin-top: var(--space-5); }
  .tmini .portrait { margin-bottom: var(--space-3); }
  .ohada__layout { display: grid; gap: var(--space-6) var(--gap); align-items: start; }
  .ohada__map { position: relative; container-type: inline-size; margin: 0; }
  .ohada__svg { width: 100%; height: auto; max-height: 82vh; margin-inline: auto; background: var(--color-carte); border: 1px solid var(--color-filet); }
  .ohada__top { margin-bottom: var(--space-6); }
  .ohada__top .sec__head { margin-bottom: var(--space-5); }
  .ohada__top .ohada__controls { margin-bottom: 0; }
  .ohada__tooltip { position: absolute; z-index: 5; left: 0; top: 0; pointer-events: none; background: var(--color-marine); color: var(--color-ivoire); padding: .35rem .65rem; font-size: .8125rem; font-weight: 600; border-radius: var(--radius); white-space: nowrap; border-top: 2px solid var(--color-or); }
  .ohada__cap { margin-top: var(--space-4); }
  .legend__n { color: var(--color-pierre); }
  .sw { display: inline-block; width: 1.2rem; height: 1.2rem; flex: none; border: 1px solid var(--color-ivoire); box-shadow: 0 0 0 1px var(--color-filet); }
  .sw--cemac { background: var(--color-marine); }
  .sw--uemoa { background: repeating-linear-gradient(45deg, var(--color-uemoa) 0 3px, var(--color-ivoire) 3px 4.5px); }
  .sw--autres { background: radial-gradient(circle, var(--color-ivoire) 1.2px, transparent 1.6px) 0 0 / 5px 5px, var(--color-autres); }
  .sw--office { width: .9rem; height: 1.2rem; border: 0; box-shadow: none; background: var(--color-bordeaux); clip-path: path("M7 19C3 13 1 10 1 7a6 6 0 0 1 12 0c0 3-2 6-6 12z"); }
  .sw--corr { border-radius: 50%; background: var(--color-marine); border: 2px solid var(--color-ivoire); box-shadow: 0 0 0 1px var(--color-marine); width: .8rem; height: .8rem; }
  .sw--inst { width: .75rem; height: .75rem; transform: rotate(45deg); background: var(--color-or); border: 0; box-shadow: none; }
  .ohada__select { display: block; margin-bottom: var(--space-4); }
  .ohada__select-l { display: block; font-weight: 600; font-size: .9375rem; margin-bottom: var(--space-2); }
  .ohada__panel { background: var(--color-carte); border: 1px solid var(--color-filet); border-top: 3px double var(--color-or); padding: var(--space-5); }
  .ohada__panel-t { font-family: var(--font-serif); font-weight: 400; font-size: clamp(1.5rem, 1.2rem + 1.2vw, 2.1rem); line-height: 1.15; }
  .ohada__panel-body.is-swap { animation: fade-in 150ms ease-out; }
  .ohada__counts { list-style: none; padding: 0; margin: var(--space-4) 0; display: grid; gap: .5rem; }
  .ohada__counts li { display: flex; align-items: center; gap: .6rem; font-size: .9375rem; }
  .ohada__hint { color: var(--color-pierre); margin-bottom: var(--space-4); }
  .ohada__dl { display: grid; gap: var(--space-3); margin: var(--space-4) 0; font-size: .9375rem; }
  .ohada__dl dt { font-size: .75rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--color-or-profond); }
  .ohada__leads { list-style: none; padding: 0; display: grid; gap: .6rem; margin: var(--space-3) 0 var(--space-4); }
  .ohada__leads a { display: inline-flex; align-items: center; gap: .75rem; font-weight: 600; text-decoration: none; }
  .ohada__leads a:hover { text-decoration: underline; }
  .ohada__h4 { font-size: .75rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--color-or-profond); margin-top: var(--space-4); }
  .ohada__note { font-size: var(--fs-small); color: var(--color-pierre); margin-bottom: var(--space-4); }
  .ohada__clear { margin-top: var(--space-3); background: none; border: 0; padding: .5rem 0; color: var(--color-marine); font-weight: 600; font-size: .875rem; text-decoration: underline; text-decoration-color: var(--color-or-profond); min-height: 44px; }
  .ohada__controls { display: flex; flex-wrap: wrap; gap: var(--space-4) var(--space-6); align-items: end; margin-bottom: var(--space-5); }
  .ohada__list { border: 0; padding: 0; margin: var(--space-7) 0 0; }
  .ohada__list legend { font-family: var(--font-serif); font-size: 1.4rem; margin-bottom: var(--space-4); color: var(--color-marine); }
  .ohada__li { display: flex; align-items: center; gap: .6rem; min-height: 40px; cursor: pointer; font-size: .9375rem; padding-inline: .25rem; }
  .ohada__li input { accent-color: var(--color-marine); width: 1.1rem; height: 1.1rem; flex: none; }
  .ohada__li.is-hover span { text-decoration: underline; text-decoration-color: var(--color-or); }
  .ohada__li:has(input:checked) span { font-weight: 700; color: var(--color-bordeaux); }
  .ohada__li[hidden] { display: none; }
  .ohada__grp[hidden] { display: none; }
  .ohada--compact .ohada__select { display: block; }
  @media (min-width: 64em) {
    .ohada__layout { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); }
    .ohada--full .ohada__side { position: sticky; top: calc(var(--hdr) + 1.5rem); }
    .ohada--full .ohada__select { display: none !important; }
  }
  @media (max-width: 47.99em) { .ohada__list { display: none !important; } }
  @media (min-width: 48em) and (max-width: 63.99em) { .ohada--full .ohada__select { display: none !important; } }
  @media (min-width: 64em) { .ohada--full .ohada__top { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--gap); align-items: end; } .ohada--full .ohada__top .sec__head { margin-bottom: 0; } }
  .inst { background: var(--color-carte); border: 1px solid var(--color-filet); padding: var(--space-5); display: grid; gap: .35rem; align-content: start; }
  @container (max-width: 34rem) { .ohada .mk-lbl[data-lbl="paris"] { font-size: 15px; } }
}
