/* Section 1 accueil - base saine V1.
   Ce fichier est charge apres styles.css pour neutraliser les overrides empiles
   pendant l'application du design system. Il ne touche pas au script ni aux
   comportements de fenetre, snap, aimantation, header ou pilules. */

html.is-home body.is-home #main > .home-snap-block--hero,
html.is-home body.is-home .hero.heroPhoto{
  --font-display:"PP Fraktion Sans","Inter",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
  --font-body:"Inter",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
  --font-sans:"Inter",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
  min-height:100svh!important;
  height:100svh!important;
  padding-top:0!important;
  background:var(--bg-inverse,#071c33)!important;
}

html.is-home body.is-home .heroVideoReal{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  transform:scale(1.045)!important;
  transform-origin:center center!important;
  filter:saturate(1.02) contrast(1.01) brightness(1.02)!important;
}

html.is-home body.is-home .hero.heroPhoto.hasRealVideo:after{
  background:
    linear-gradient(90deg,
      rgba(3,18,31,.76) 0%,
      rgba(3,18,31,.62) 28%,
      rgba(3,18,31,.32) 48%,
      rgba(3,18,31,.10) 68%,
      rgba(3,18,31,.02) 100%),
    linear-gradient(180deg,
      rgba(3,18,31,.24) 0%,
      rgba(3,18,31,.03) 42%,
      rgba(3,18,31,.16) 100%)!important;
}

html.is-home body.is-home .hero.heroPhoto .container{
  width:min(1360px,calc(100vw - clamp(32px,7vw,96px)))!important;
  height:100%!important;
  display:grid!important;
  align-content:stretch!important;
  /* Le premier row réserve la zone band + espace sous le band.
     Min basé sur svh pour rester lisible en viewport court (≤720svh)
     sans casser le contenu (titre + lead + actions). */
  grid-template-rows:minmax(calc(clamp(160px,calc(24svh + 32px),406px) + 3cm),auto) auto auto minmax(12px,1fr) auto!important;
  padding-top:0!important;
  padding-bottom:clamp(28px,4svh,60px)!important;
}

html.is-home body.is-home .home-snap-block--hero .heroTitle{
  grid-row:2!important;
  max-width:1180px!important;
}

html.is-home body.is-home .home-snap-block--hero h1{
  max-width:1180px!important;
  font-family:var(--font-display)!important;
  font-size:clamp(3rem,min(6.85vw,11svh),7.15rem)!important;
  font-weight:700!important;
  line-height:.91!important;
  letter-spacing:-.035em!important;
  margin:clamp(10px,1.5svh,18px) 0 clamp(12px,2.3svh,24px)!important;
  color:#fbf7f1!important;
  text-wrap:normal!important;
  /* Option H — filet bordeaux à gauche (rappel signature filet H2) */
  border-left:4px solid var(--fnam-rouge-bordeaux,#be3c3f)!important;
  padding-left:clamp(16px,1.6vw,28px)!important;
}

html.is-home body.is-home .home-snap-block--hero .heroTitle .line{
  white-space:nowrap!important;
}

html.is-home body.is-home .home-snap-block--hero .lead{
  grid-row:3!important;
  max-width:980px!important;
  font-family:var(--font-sans)!important;
  font-size:clamp(.98rem,min(1.55vw,2.45svh),1.42rem)!important;
  font-weight:700!important;
  line-height:1.36!important;
  margin:0!important;
  color:#fbf7f1!important;
  /* Aligne le lead sur le retrait du filet du h1 (pas de filet sur le lead) */
  padding-left:clamp(16px,1.6vw,28px)!important;
}

html.is-home body.is-home .home-snap-block--hero .heroActionGrid{
  grid-row:5!important;
  align-self:end!important;
  gap:clamp(10px,1.4vw,16px)!important;
  margin-top:0!important;
}

html.is-home body.is-home .home-snap-block--hero .btn{
  min-height:clamp(44px,5svh,54px)!important;
  padding:clamp(10px,1.5svh,14px) clamp(16px,1.8vw,24px)!important;
  font-size:clamp(.9rem,min(1.05vw,2svh),1.02rem)!important;
}

html.is-home body.is-home .home-snap-block--hero .spacePills .btn.secondary{
  background:var(--fnam-ivory)!important;
  border-color:color-mix(in srgb,var(--fnam-ivory) 80%,transparent)!important;
  color:var(--fnam-bleu-roi-900)!important;
}

html.is-home body.is-home .home-snap-block--hero .spacePills:has(.btn:hover) .btn,
html.is-home body.is-home .home-snap-block--hero .spacePills:has(.btn:focus-visible) .btn{
  background:color-mix(in srgb,var(--bg-inverse) 34%,transparent)!important;
  border-color:color-mix(in srgb,var(--fnam-ivory) 42%,transparent)!important;
  color:var(--fnam-ivory)!important;
  backdrop-filter:none!important;
}

html.is-home body.is-home .home-snap-block--hero .spacePills:has(.btn:hover) .btn:hover,
html.is-home body.is-home .home-snap-block--hero .spacePills:has(.btn:focus-visible) .btn:focus-visible{
  background:var(--fnam-ivory)!important;
  border-color:color-mix(in srgb,var(--fnam-ivory) 80%,transparent)!important;
  color:var(--fnam-bleu-roi-900)!important;
}

html.is-home body.is-home .home-snap-block--hero .heroInstitutionalBand{
  --hero-band-side:clamp(24px,2.8vw,48px)!important;
  position:absolute!important;
  left:var(--hero-band-side)!important;
  right:var(--hero-band-side)!important;
  top:clamp(112px,calc(25svh - 38px),202px)!important;
  z-index:4!important;
  display:grid!important;
  gap:clamp(9px,1svh,14px)!important;
  padding:clamp(8px,1svh,14px) 0!important;
  background:linear-gradient(90deg,rgba(8,22,34,0) 0%,rgba(8,22,34,.14) 12%,rgba(8,22,34,.22) 50%,rgba(8,22,34,.14) 88%,rgba(8,22,34,0) 100%)!important;
  border:0!important;
  overflow:visible!important;
  pointer-events:none!important;
}

html.is-home body.is-home .home-snap-block--hero .heroInstitutionalBand:before{
  content:""!important;
  display:block!important;
  height:1px!important;
  background:linear-gradient(90deg,rgba(255,255,255,0) 0%,rgba(255,255,255,.16) 10%,rgba(255,255,255,.38) 24%,rgba(255,255,255,.52) 50%,rgba(255,255,255,.38) 76%,rgba(255,255,255,.16) 90%,rgba(255,255,255,0) 100%)!important;
}

html.is-home body.is-home .home-snap-block--hero .heroInstitutionalBand:after{
  content:""!important;
  display:block!important;
  height:1.4px!important;
  background:rgba(255,255,255,.42)!important;
}

html.is-home body.is-home .home-snap-block--hero .heroInstitutionalText{
  display:block!important;
  width:100%;
  white-space:nowrap!important;
  overflow:hidden!important;
  color:rgba(255,255,255,.92)!important;
  font-family:var(--font-sans)!important;
  font-size:clamp(16px,1.35vw,25px)!important;
  font-weight:420!important;
  line-height:1!important;
  text-transform:uppercase!important;
  text-align:center!important;
  letter-spacing:.28em;
  transform:none!important;
  text-shadow:0 2px 12px rgba(0,0,0,.45)!important;
}

@media(max-width:900px){
  html.is-home body.is-home .home-snap-block--hero .heroInstitutionalBand{
    --hero-band-side:clamp(18px,4vw,32px)!important;
    top:clamp(82px,calc(20svh - 38px),142px)!important;
  }

  html.is-home body.is-home .home-snap-block--hero .heroInstitutionalText{
    font-size:clamp(12px,1.8vw,17px)!important;
    letter-spacing:.18em;
  }

  html.is-home body.is-home .hero.heroPhoto .container{
    grid-template-rows:minmax(clamp(167px,calc(30svh - 38px),262px),auto) auto auto minmax(18px,1fr) auto!important;
  }
}

@media(min-width:761px) and (max-width:1120px){
  html.is-home body.is-home .home-snap-block--hero h1{
    font-size:clamp(3rem,min(5.65vw,10svh),6.1rem)!important;
  }
}

@media(max-width:760px){
  html.is-home body.is-home .hero.heroPhoto .container{
    width:min(1180px,calc(100vw - 28px))!important;
    padding-top:calc(var(--home-fixed-header) + 18px)!important;
    padding-bottom:24px!important;
  }

  html.is-home body.is-home .home-snap-block--hero h1{
    font-size:clamp(1.45rem,min(6vw,8.4svh),2.6rem)!important;
  }

  html.is-home body.is-home .home-snap-block--hero .heroActionGrid{
    grid-template-columns:1fr!important;
  }
}

@media(max-width:640px){
  html.is-home body.is-home #main > .home-snap-block--hero,
  html.is-home body.is-home .hero.heroPhoto{
    height:auto!important;
    min-height:100svh!important;
  }

  html.is-home body.is-home .home-snap-block--hero .heroInstitutionalBand{
    display:none!important;
  }

  html.is-home body.is-home .hero.heroPhoto .container{
    grid-template-rows:minmax(clamp(150px,24svh,220px),auto) auto auto minmax(18px,1fr) auto!important;
    height:auto!important;
    min-height:100svh!important;
  }
}
