/* PASIVITE 2.8.48.0 — mascottes contextuelles, une présence utile par écran */

/* PWA Personnel : la mascotte principale quitte définitivement la zone du switch.
   Elle devient un repère discret dans l'angle inférieur droit de la carte. */
body.mobile-mode .mobile-dashboard-with-mascot{
  position:relative!important;
  overflow:hidden!important;
}
body.mobile-mode .mobile-dashboard-with-mascot .mobile-dashboard-mascot{
  position:absolute!important;
  right:18px!important;
  bottom:8px!important;
  width:74px!important;
  height:82px!important;
  object-fit:contain!important;
  object-position:center bottom!important;
  transform:none!important;
  z-index:1!important;
  pointer-events:none!important;
}
body.mobile-mode .mobile-dashboard-with-mascot .mobile-dashboard-copy,
body.mobile-mode .mobile-dashboard-with-mascot .mobile-mode-switcher{
  position:relative!important;
  z-index:2!important;
}

/* Urgence : présence rassurante, pas de mascotte dans les actions elles-mêmes. */
.emergency-hero-mascot{
  display:grid;
  grid-template-columns:minmax(0,1fr) 128px;
  gap:22px;
  align-items:end;
  margin-bottom:14px;
}
.emergency-hero-copy{min-width:0}
.emergency-hero-mascot>img{
  display:block;
  width:122px;
  height:142px;
  object-fit:contain;
  object-position:center bottom;
  justify-self:end;
  filter:drop-shadow(0 10px 16px rgba(18,53,91,.12));
}

/* Observatoire : éclaireur/jumelles en surimpression légère sur le visuel existant. */
.observatory-hero-visual-mascot{
  position:relative;
  isolation:isolate;
  min-height:240px;
}
.observatory-hero-visual-mascot .observatory-hero-report{
  position:relative;
  z-index:1;
}
.observatory-hero-visual-mascot .observatory-hero-mascot{
  position:absolute;
  right:-4px;
  bottom:-10px;
  z-index:2;
  width:min(150px,38%);
  height:auto;
  max-height:180px;
  object-fit:contain;
  filter:drop-shadow(0 12px 20px rgba(11,47,85,.18));
  pointer-events:none;
}

/* Décodeur / Boussole / Alertes : les règles existantes restent la référence.
   Cette couche garantit seulement une taille lisible sans dominer l'écran. */
.promise-hero-mascot>img,
.professional-guidance-hero-mascot>img,
.alerts-app-title-mascot>img,
body.mobile-mode .pv-section-head-character>img{
  object-fit:contain!important;
  object-position:center bottom!important;
}

@media (min-width:561px){
  body.mobile-mode .mobile-dashboard-with-mascot{
    padding-bottom:76px!important;
  }
}

@media (max-width:560px){
  body.mobile-mode .mobile-dashboard-with-mascot{
    display:grid!important;
    grid-template-columns:1fr!important;
    grid-template-rows:auto auto!important;
    gap:8px!important;
    padding:13px 13px 82px!important;
  }
  body.mobile-mode .mobile-dashboard-with-mascot .mobile-dashboard-copy{
    grid-column:1!important;
    grid-row:1!important;
  }
  body.mobile-mode .mobile-dashboard-with-mascot .mobile-mode-switcher{
    grid-column:1!important;
    grid-row:2!important;
    width:100%!important;
    max-width:none!important;
  }
  body.mobile-mode .mobile-dashboard-with-mascot .mobile-dashboard-mascot{
    right:16px!important;
    bottom:5px!important;
    width:64px!important;
    height:72px!important;
  }
  .emergency-hero-mascot{
    grid-template-columns:minmax(0,1fr) 78px;
    gap:8px;
    align-items:end;
  }
  .emergency-hero-mascot>img{
    width:74px;
    height:92px;
  }
  .observatory-hero-visual-mascot .observatory-hero-mascot{
    width:100px;
    max-height:118px;
    right:2px;
    bottom:-6px;
  }
}

@media (max-width:390px){
  .emergency-hero-mascot{
    grid-template-columns:1fr;
  }
  .emergency-hero-mascot>img{
    width:68px;
    height:78px;
    justify-self:end;
    margin-top:-12px;
  }
}

@media(prefers-reduced-motion:reduce){
  .emergency-hero-mascot>img,
  .observatory-hero-mascot,
  body.mobile-mode .mobile-dashboard-mascot{transition:none!important;animation:none!important}
}

/* 2.8.48.1 — mascottes de thème placées comme sur Urgence : une colonne dédiée, jamais en surimpression. */
.pv-theme-hero{display:grid;grid-template-columns:minmax(0,1fr) 132px;gap:20px;align-items:end;margin-bottom:18px}
.pv-theme-hero-copy{min-width:0}
.pv-theme-hero-mascot{display:block;width:124px;height:142px;object-fit:contain;object-position:center bottom;justify-self:end;align-self:end;filter:drop-shadow(0 10px 16px rgba(18,53,91,.12))}

/* Observatoire : le personnage est réellement dans le hero, pas caché dans une image secondaire. */
.observatory-hero{grid-template-columns:minmax(0,1fr) 180px!important;align-items:end!important}
.observatory-theme-mascot{min-height:220px;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:8px;padding:10px 4px 0}
.observatory-theme-mascot>img{display:block;width:156px;height:172px;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 12px 18px rgba(18,53,91,.14))}
.observatory-theme-mascot>span{display:block;max-width:172px;padding:8px 10px;border-radius:12px;background:#fff;border:1px solid #d8e6ec;color:#14385f;text-align:center;box-shadow:0 8px 18px rgba(18,53,91,.07)}
.observatory-theme-mascot strong,.observatory-theme-mascot small{display:block}.observatory-theme-mascot small{margin-top:2px;color:#617386;line-height:1.28}

/* Pages déjà dotées de mascottes : normalisation au même gabarit qu'Urgence. */
.alerts-app-title-mascot,.promise-hero-mascot,.professional-guidance-hero-mascot{display:grid!important;grid-template-columns:minmax(0,1fr) 132px!important;gap:20px!important;align-items:end!important}
.alerts-app-title-mascot>img,.promise-hero-mascot>img,.professional-guidance-hero-mascot>img{display:block!important;width:124px!important;height:142px!important;max-height:none!important;object-fit:contain!important;object-position:center bottom!important;justify-self:end!important;align-self:end!important;margin:0!important}

/* Home : aucune bulle ni aucun bouton ne doit recouvrir la mascotte. */
.psv-home-hero-mascot{display:grid!important;grid-template-columns:1fr!important;grid-template-rows:auto auto auto!important;align-items:end!important;justify-items:center!important;gap:10px!important;min-height:0!important;padding:14px 0 0!important}
.psv-home-hero-mascot>img{grid-row:1!important;width:min(300px,82%)!important;height:auto!important;max-height:360px!important;margin:0!important}
.psv-mascot-note{position:static!important;grid-row:2!important;max-width:260px!important;width:auto!important;margin:0!important}
.psv-home-method-mini{position:static!important;grid-row:3!important;display:flex!important;justify-content:center!important;max-width:none!important;width:100%!important;margin:0!important}

/* PWA Personnel : personnage à côté du texte, switch dessous. */
body.mobile-mode .mobile-dashboard-with-mascot{display:grid!important;grid-template-columns:minmax(0,1fr) 76px!important;grid-template-rows:auto auto!important;gap:8px 8px!important;padding:13px!important;overflow:hidden!important}
body.mobile-mode .mobile-dashboard-with-mascot .mobile-dashboard-copy{grid-column:1!important;grid-row:1!important;min-width:0!important}
body.mobile-mode .mobile-dashboard-with-mascot .mobile-dashboard-mascot{position:static!important;grid-column:2!important;grid-row:1!important;align-self:end!important;justify-self:end!important;width:72px!important;height:86px!important;object-fit:contain!important;object-position:center bottom!important}
body.mobile-mode .mobile-dashboard-with-mascot .mobile-mode-switcher{grid-column:1/-1!important;grid-row:2!important;width:100%!important;max-width:none!important}

@media(max-width:760px){
  .pv-theme-hero,.alerts-app-title-mascot,.promise-hero-mascot,.professional-guidance-hero-mascot{grid-template-columns:minmax(0,1fr) 82px!important;gap:10px!important}
  .pv-theme-hero-mascot,.alerts-app-title-mascot>img,.promise-hero-mascot>img,.professional-guidance-hero-mascot>img{display:block!important;width:78px!important;height:92px!important}
  .observatory-hero{grid-template-columns:minmax(0,1fr) 96px!important;gap:10px!important;padding:22px!important}
  .observatory-theme-mascot{min-height:118px;padding:0}.observatory-theme-mascot>img{width:92px;height:112px}.observatory-theme-mascot>span{display:none}
}
@media(max-width:560px){
  .pv-theme-hero,.alerts-app-title-mascot,.promise-hero-mascot,.professional-guidance-hero-mascot{grid-template-columns:minmax(0,1fr) 70px!important}
  .pv-theme-hero-mascot,.alerts-app-title-mascot>img,.promise-hero-mascot>img,.professional-guidance-hero-mascot>img{display:block!important;width:66px!important;height:82px!important}
  .observatory-hero{grid-template-columns:minmax(0,1fr) 78px!important}.observatory-theme-mascot{display:flex!important;min-height:94px!important}.observatory-theme-mascot>img{display:block!important;width:72px!important;height:88px!important}
}

/* 2.8.48.2 — correction des vues réellement utilisées en production. */
/* Observatoire / Baromètre : mascotte réellement visible dans le hero actif. */
.observatory-public .observatory-hero{
  grid-template-columns:minmax(0,1fr) 210px!important;
  align-items:center!important;
  gap:26px!important;
}
.observatory-public .observatory-theme-mascot{
  min-height:250px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  padding:8px 0!important;
}
.observatory-public .observatory-theme-mascot>img{
  display:block!important;
  width:176px!important;
  height:190px!important;
  max-width:100%!important;
  object-fit:contain!important;
  object-position:center bottom!important;
  margin:0!important;
}
.observatory-public .observatory-theme-mascot>span{
  display:block!important;
  width:100%!important;
  max-width:190px!important;
  padding:9px 11px!important;
  border-radius:14px!important;
  background:#fff!important;
  border:1px solid #d8e6ec!important;
  color:#14385f!important;
  text-align:center!important;
}

/* Urgences : personnage Action distinct de la mascotte d'accueil. */
.emergency-hero-mascot>img{
  width:150px!important;
  height:170px!important;
  object-fit:contain!important;
  object-position:center bottom!important;
}

@media(max-width:860px){
  .observatory-public .observatory-hero{
    grid-template-columns:minmax(0,1fr) 120px!important;
    gap:14px!important;
  }
  .observatory-public .observatory-theme-mascot{min-height:150px!important}
  .observatory-public .observatory-theme-mascot>img{width:112px!important;height:132px!important}
  .observatory-public .observatory-theme-mascot>span{display:none!important}
}
@media(max-width:560px){
  .observatory-public .observatory-hero{
    grid-template-columns:minmax(0,1fr) 86px!important;
    gap:8px!important;
    padding:18px!important;
  }
  .observatory-public .observatory-theme-mascot{min-height:108px!important}
  .observatory-public .observatory-theme-mascot>img{width:82px!important;height:100px!important}
  .emergency-hero-mascot>img{width:86px!important;height:104px!important}
}

/* 2.8.48.2 HOME AUDIT — stabilité des 4 portes d'entrée et densité mobile. */
/* La carte primaire doit conserver son identité au hover, focus, tap et après visite. */
body.public-body:not(.mobile-mode) .pv-home-main .pv-card.is-primary,
body.public-body:not(.mobile-mode) .pv-home-main .pv-card.is-primary:link,
body.public-body:not(.mobile-mode) .pv-home-main .pv-card.is-primary:visited,
body.public-body:not(.mobile-mode) .pv-home-main .pv-card.is-primary:hover,
body.public-body:not(.mobile-mode) .pv-home-main .pv-card.is-primary:focus,
body.public-body:not(.mobile-mode) .pv-home-main .pv-card.is-primary:focus-visible,
body.public-body:not(.mobile-mode) .pv-home-main .pv-card.is-primary:active{
  border-color:var(--pv-navy)!important;
  background:var(--pv-navy)!important;
  color:#fff!important;
  text-decoration:none!important;
}
body.public-body:not(.mobile-mode) .pv-home-main .pv-card.is-primary :is(strong,small,em){
  color:#fff!important;
}

/* Les cartes neutres gardent elles aussi les mêmes couleurs après visite/tap. */
body.public-body:not(.mobile-mode) .pv-home-main .pv-card:not(.is-primary):visited{
  color:var(--pv-text)!important;
}
body.public-body:not(.mobile-mode) .pv-home-main .pv-card:not(.is-primary):visited strong{
  color:var(--pv-navy-dark)!important;
}
body.public-body:not(.mobile-mode) .pv-home-main .pv-card:not(.is-primary):visited small{
  color:var(--pv-muted)!important;
}
body.public-body:not(.mobile-mode) .pv-home-main .pv-card:not(.is-primary):visited em{
  color:var(--pv-teal)!important;
}

/* Focus clavier visible sans transformer la carte en bloc blanc. */
body.public-body:not(.mobile-mode) .pv-home-main .pv-card:focus-visible{
  outline:3px solid rgba(0,191,184,.35)!important;
  outline-offset:3px!important;
}

/* Mobile web : quatre entrées compactes et lisibles, sans grandes zones vides. */
@media(max-width:680px){
  body.public-body:not(.mobile-mode) .pv-home-main{
    padding:28px 0!important;
  }
  body.public-body:not(.mobile-mode) .pv-home-main .pv-section-head{
    margin-bottom:16px!important;
  }
  body.public-body:not(.mobile-mode) .pv-home-main .pv-section-head h2{
    font-size:clamp(1.75rem,8vw,2.25rem)!important;
    line-height:1.05!important;
  }
  body.public-body:not(.mobile-mode) .pv-home-main .pv-section-head>p{
    margin-top:12px!important;
    font-size:1rem!important;
    line-height:1.45!important;
  }
  body.public-body:not(.mobile-mode) .pv-home-main .pv-card-grid{
    gap:12px!important;
  }
  body.public-body:not(.mobile-mode) .pv-home-main .pv-card{
    min-height:0!important;
    padding:18px 18px 16px!important;
  }
  body.public-body:not(.mobile-mode) .pv-home-main .pv-card strong{
    font-size:1.22rem!important;
    line-height:1.18!important;
  }
  body.public-body:not(.mobile-mode) .pv-home-main .pv-card small{
    margin-top:7px!important;
    font-size:.92rem!important;
    line-height:1.38!important;
  }
  body.public-body:not(.mobile-mode) .pv-home-main .pv-card em{
    margin-top:12px!important;
    padding-top:0!important;
    font-size:.9rem!important;
  }
}