/* ==========================================================================
   IT'S A VISIT — Habillage des trois vues
   Chaque vue n'ajoute que ce qui lui est propre : la structure, le menu,
   la barre de filtres et la fiche viennent de iav-core.css.
   ========================================================================== */

/* ==========================================================================
   VUE 1 — MUR DE LOGOS
   ========================================================================== */

/* Bandeau défilant dans le hero */
.mur-ticker{
  margin-top:30px;overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);
}
.mur-ticker__track{display:flex;gap:14px;width:max-content;animation:mur-slide 64s linear infinite}
.mur-ticker:hover .mur-ticker__track{animation-play-state:paused}
.mur-ticker__item{width:172px;flex:0 0 auto;border-radius:9px;overflow:hidden;
  background:#fff;box-shadow:0 6px 22px rgba(0,0,0,.32)}
@keyframes mur-slide{from{transform:translateX(0)}to{transform:translateX(-50%)}}

.mur-grid{
  --mur-min:196px;
  display:grid;gap:10px;
  grid-template-columns:repeat(auto-fill,minmax(var(--mur-min),1fr));
  padding-top:24px;
}
.mur-card{
  position:relative;border-radius:11px;overflow:hidden;cursor:pointer;
  background:#fff;border:0;padding:0;text-align:left;display:block;
  box-shadow:0 2px 10px rgba(0,0,0,.34);
  transition:transform .22s cubic-bezier(.2,.7,.3,1),box-shadow .22s,outline-color .18s;
  outline:2px solid transparent;
}
.mur-card:hover,.mur-card:focus-visible{
  transform:translateY(-5px) scale(1.022);z-index:3;
  box-shadow:0 18px 44px rgba(0,0,0,.55);
  outline-color:var(--iav-gold);
}
.mur-card__cap{
  position:absolute;left:0;right:0;bottom:0;padding:22px 11px 9px;color:#fff;
  background:linear-gradient(180deg,transparent,rgba(8,12,26,.9));
  transform:translateY(101%);transition:transform .22s ease;pointer-events:none;
}
.mur-card:hover .mur-card__cap,.mur-card:focus-visible .mur-card__cap{transform:none}
.mur-card__cap b{display:block;font-size:12.5px;font-weight:700;letter-spacing:-.01em}
.mur-card__cap span{display:block;font-size:10.5px;opacity:.72;margin-top:1px}
.mur-card__dot{
  position:absolute;top:7px;right:7px;width:7px;height:7px;border-radius:50%;
  background:var(--iav-teal);box-shadow:0 0 0 3px rgba(18,150,140,.24);
  opacity:0;transition:opacity .2s;
}
.mur-card--anim .mur-card__dot{opacity:1}

/* ==========================================================================
   VUE 2 — CATALOGUE
   ========================================================================== */

.cat-head{
  display:flex;justify-content:space-between;align-items:baseline;gap:16px;
  flex-wrap:wrap;padding:24px 0 14px;
}
.cat-head h2{margin:0;font-size:18px;letter-spacing:-.02em}

.cat-grid{display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(252px,1fr))}
.cat-card{
  background:#fff;border:1px solid var(--line);border-radius:var(--iav-radius);
  overflow:hidden;cursor:pointer;text-align:left;padding:0;display:flex;flex-direction:column;
  transition:transform .18s,box-shadow .18s,border-color .18s;color:var(--iav-navy);
}
.cat-card:hover,.cat-card:focus-visible{
  transform:translateY(-3px);box-shadow:var(--iav-shadow);border-color:#c3cae0;
}
.cat-card .iav-logo{border-bottom:1px solid #eceff6}
.cat-card__body{padding:12px 14px 14px;display:flex;flex-direction:column;gap:5px;flex:1}
.cat-card__name{font-size:14.5px;font-weight:700;letter-spacing:-.015em;line-height:1.25}
.cat-card__geo{font-size:12.5px;color:#66708f;line-height:1.4}
.cat-card__foot{display:flex;align-items:center;gap:8px;margin-top:auto;padding-top:9px;
  border-top:1px solid #eceff6;flex-wrap:wrap}
.cat-card__dom{font-size:11.5px;color:#8b93ad;margin-right:auto;word-break:break-all}
/* Signature chromatique du logo — le lien visuel avec la vue Mosaïque */
.cat-card__swatches{display:inline-flex;gap:3px;flex:0 0 auto}
.cat-card__swatches i{width:11px;height:11px;border-radius:3px;border:1px solid rgba(0,0,0,.12)}
.cat-card__cont{
  font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
  color:#8b93ad;white-space:nowrap;
}

.cat-group{grid-column:1/-1;margin:14px 0 -4px;display:flex;align-items:center;gap:12px}
.cat-group h3{margin:0;font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:var(--fg)}
.cat-group::after{content:"";flex:1;height:1px;background:var(--line)}

/* ==========================================================================
   VUE 3 — MOSAÏQUE
   ========================================================================== */

.mos-spectrum{
  display:flex;height:52px;border-radius:10px;overflow:hidden;
  border:1px solid var(--line);background:#fff;margin-top:8px;
}
.mos-spectrum button{
  flex:1;border:0;cursor:pointer;position:relative;padding:0;
  transition:flex .25s ease,filter .2s;
}
.mos-spectrum button:hover{filter:brightness(1.09)}
.mos-spectrum button[aria-pressed="true"]{flex:1.9}
.mos-spectrum button span{
  position:absolute;inset:auto 0 5px;font-size:9.5px;font-weight:800;
  letter-spacing:.08em;color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.55);pointer-events:none;
}
.mos-legend{
  display:flex;justify-content:space-between;margin-top:7px;
  font-size:11px;color:var(--muted);letter-spacing:.05em;
}
.mos-legend strong{color:var(--fg)}

.mos-modes{display:flex;background:var(--panel);border:1px solid var(--line);border-radius:999px;padding:3px;gap:2px}
.mos-modes button{
  border:0;background:transparent;border-radius:999px;padding:6px 14px;
  font-size:12.5px;font-weight:700;cursor:pointer;color:var(--muted);transition:all .16s;
}
.mos-modes button[aria-pressed="true"]{background:var(--fg);color:var(--bg)}

.mos-board{padding-top:24px}
.mos-band{margin-bottom:34px}
.mos-band__head{
  display:flex;align-items:center;gap:14px;margin-bottom:12px;
  position:sticky;top:calc(var(--iav-header-h) + 175px);z-index:20;
  background:var(--bar);backdrop-filter:blur(6px);padding:7px 0;
}
.mos-band__swatch{
  width:34px;height:34px;border-radius:9px;flex:0 0 auto;
  border:1px solid rgba(0,0,0,.1);box-shadow:inset 0 0 0 2px rgba(255,255,255,.5);
}
.mos-band__title{margin:0;font-size:15px;font-weight:800;letter-spacing:-.01em}
.mos-band__sub{font-size:12.5px;color:var(--muted)}
.mos-band__head::after{content:"";flex:1;height:1px;background:var(--line)}

.mos-tiles{display:grid;gap:8px;grid-template-columns:repeat(auto-fill,minmax(178px,1fr))}
.mos-board.is-density .mos-tiles{grid-auto-flow:dense}
.mos-tile{
  position:relative;border-radius:9px;overflow:hidden;cursor:pointer;border:0;padding:0;
  background:#fff;box-shadow:0 1px 0 rgba(0,0,0,.06);
  transition:transform .2s cubic-bezier(.2,.7,.3,1),box-shadow .2s;
}
.mos-tile::before{
  content:"";position:absolute;inset:0;z-index:2;pointer-events:none;
  border:1px solid rgba(0,0,0,.07);border-radius:9px;
}
.mos-tile:hover,.mos-tile:focus-visible{transform:scale(1.09);z-index:5;box-shadow:0 14px 34px rgba(27,26,23,.24)}
.mos-tile__tint{position:absolute;inset:0;opacity:.07;pointer-events:none}
.mos-tile__cap{
  position:absolute;left:0;right:0;bottom:0;z-index:3;
  padding:16px 8px 6px;color:#fff;font-size:10.5px;font-weight:700;
  background:linear-gradient(180deg,transparent,rgba(20,18,15,.86));
  opacity:0;transition:opacity .18s;text-align:left;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.mos-tile:hover .mos-tile__cap,.mos-tile:focus-visible .mos-tile__cap{opacity:1}
.mos-tile.is-xl{grid-column:span 2}

.mos-note{
  margin-top:20px;background:var(--panel-2);border:1px solid var(--line);border-radius:14px;
  padding:24px 26px;font-size:14px;line-height:1.7;color:var(--muted);
}
.mos-note h2{margin:0 0 8px;font-family:var(--iav-serif);font-size:20px;font-weight:400;color:var(--fg)}
.mos-note code{background:var(--bg);padding:1px 6px;border-radius:5px;font-size:12.5px;color:var(--fg)}

/* ==========================================================================
   PAGES PAYS ET PAGE HUB
   Pages statiques générées depuis la database : le contenu est dans le HTML,
   sans exécution de JavaScript. Elles réutilisent le thème clair du portail.
   ========================================================================== */

.pays-crumb{font-size:12.5px;color:var(--muted);margin:0 0 16px}
.pays-crumb a{text-decoration:none}
.pays-crumb a:hover{text-decoration:underline}

.pays-page .iav-hero h1{max-width:24ch;font-size:clamp(30px,4.6vw,54px)}
.pays-intro{max-width:74ch;margin:0 0 26px}
.pays-intro p{margin:0 0 12px;font-size:16px;line-height:1.72;color:var(--muted)}
.pays-intro p strong{color:var(--fg)}

.pays-cta{display:flex;gap:10px;flex-wrap:wrap;margin:24px 0 0}

.pays-grid-wrap{padding:34px 0 0}
.pays-h2{margin:0 0 18px;font-size:18px;letter-spacing:-.02em}
.pays-grid{
  list-style:none;margin:0;padding:0;display:grid;gap:16px;
  grid-template-columns:repeat(auto-fill,minmax(240px,1fr));
}
.pays-card{margin:0}
.pays-card figure{
  margin:0;background:#fff;border:1px solid var(--line);border-radius:var(--iav-radius);
  overflow:hidden;height:100%;display:flex;flex-direction:column;
  transition:transform .18s,box-shadow .18s,border-color .18s;
}
.pays-card figure:hover{transform:translateY(-3px);box-shadow:var(--iav-shadow);border-color:#c3cae0}
.pays-card .iav-logo{display:block;border-bottom:1px solid #eceff6}
.pays-card figcaption{padding:11px 14px 13px;display:flex;flex-direction:column;gap:3px}
.pays-card figcaption b{font-size:14px;font-weight:700;letter-spacing:-.015em;line-height:1.3;color:var(--iav-navy)}
.pays-card figcaption span{font-size:12.5px;color:#66708f}
.pays-card figcaption em{font-style:normal;font-size:11.5px;color:#8b93ad;word-break:break-all;margin-top:2px}

/* Page hub : tous les pays, groupés par continent */
.hub-wrap{padding:34px 0 0}
.hub-bloc{margin-bottom:40px}
.hub-bloc h2{margin:0 0 3px;font-size:20px;letter-spacing:-.02em}
.hub-sub{margin:0 0 16px;font-size:13px;color:var(--muted)}
.hub-links{display:grid;gap:8px;grid-template-columns:repeat(auto-fill,minmax(210px,1fr))}
.hub-links a{
  display:flex;align-items:baseline;justify-content:space-between;gap:10px;
  text-decoration:none;padding:10px 14px;border-radius:10px;
  border:1px solid var(--line);background:var(--panel);
  font-size:14px;font-weight:600;transition:border-color .16s,transform .16s;
}
.hub-links a:hover{border-color:var(--accent);transform:translateY(-1px)}
.hub-links a b{font-weight:700;font-size:12.5px;color:var(--muted)}

.pays-page .iav-kpi b sup{font-size:.55em;font-weight:700;vertical-align:super}