/* Accueil FR v2 (maquette 31 oct 2026). Chargé après home-hero.css ; règles sous body.hv. */

/* Hero : phrase des 300 personnes sous le titre, sur plusieurs lignes si besoin */
.hv .hp-b .sub.hv-phrase{font-family:var(--sans);font-weight:300;font-style:normal;font-size:clamp(16px,1.35vw,19px);line-height:1.55;max-width:30em;white-space:normal;color:var(--ink)}

/* Valeurs : 4 points numérotés, titre serif + texte */
.hv .hv-vlist{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(28px,4vw,64px);counter-reset:v}
.hv .hv-val{counter-increment:v;border-top:1px solid var(--ink);padding-top:26px}
.hv .hv-val::before{content:counter(v,decimal-leading-zero);display:block;font-family:var(--sans);font-size:12px;letter-spacing:.2em;color:#2A7359;margin-bottom:14px}
.hv .hv-val h3{font-family:var(--serif);font-weight:400;font-size:clamp(30px,2.5vw,36px);line-height:1.1;white-space:nowrap;letter-spacing:-.005em;margin:0 0 14px;color:var(--ink);font-variant-numeric:lining-nums}
.hv .hv-val p{margin:0;font-size:16px;line-height:1.6;color:var(--ink-2,var(--ink))}

/* 2e bouton : centré entre avis et ebooks */
.hv .hv-cta2 .wrap{display:flex;justify-content:center}
.hv main > .sec.hv-cta2{padding-top:clamp(40px,4.4vw,64px)}

/* Carrousel des ebooks */
.hv .hv-car{margin:0 calc(-1 * var(--gut));overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding:0 var(--gut);-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:#c9cbc4 transparent}
.hv .hv-track{list-style:none;margin:0;padding:0 var(--gut) 18px;display:grid;grid-auto-flow:column;grid-auto-columns:clamp(150px,44vw,220px);gap:clamp(16px,2vw,28px);width:max-content}
.hv .hv-book{scroll-snap-align:start}
.hv .hv-book a{display:block;text-decoration:none;color:var(--ink)}
.hv .hv-book img{display:block;width:100%;height:auto;aspect-ratio:420/596;object-fit:cover;box-shadow:0 10px 26px rgba(31,38,32,.14);transition:transform .3s,box-shadow .3s}
.hv .hv-book a:hover img{transform:translateY(-4px);box-shadow:0 16px 34px rgba(31,38,32,.2)}
.hv .hv-bt{display:block;margin-top:16px;font-family:var(--serif);font-size:19px;line-height:1.25}
.hv .hv-acts{display:flex;justify-content:center;flex-wrap:wrap;gap:14px;margin-top:clamp(28px,3.4vw,48px)}

/* Desktop large : les 8 couvertures tiennent sur une ligne, sans défilement */
@media (min-width:1200px){
  .hv .hv-car{margin:0;overflow:visible}
  .hv .hv-track{padding:0 0 4px;width:auto;grid-auto-flow:row;grid-template-columns:repeat(8,minmax(0,1fr));grid-auto-columns:auto}
  .hv .hv-bt{font-size:17px}
}
@media (max-width:860px){.hv .hv-vlist{grid-template-columns:1fr;gap:34px}}
@media (max-width:860px){
  .hv .hp-b .sub.hv-phrase{font-size:16.5px;max-width:24em}
}
@media (max-width:600px){
  .hv .hv-vlist{grid-template-columns:1fr;gap:34px}
  .hv .hv-acts{flex-direction:column;align-items:stretch}
  .hv .hv-acts .btn{width:100%;padding:20px 18px;letter-spacing:.16em}
  .hv .hv-track{grid-auto-columns:max(128px,38vw);gap:16px}
  .hv .hv-bt{font-size:17px}
  .hv .hv-cta2 .btn{width:100%}
}

/* Retour Marc 31 oct 21 h 20 : mobile, titres et boutons sur une ligne autant que possible */
@media (max-width:600px){
  .hv .hv-val h3{font-size:32px}
  .hv .hv-acts .btn{padding:20px 14px;letter-spacing:.1em}
  .hv .hv-track{grid-auto-columns:58vw}
  .hv .hv-bt{font-size:16px;letter-spacing:-.01em;text-wrap:balance}
}

/* Avant / après (7 photos du pack) : entières, format d'origine, sans recadrage ; sur mobile, deux rangées qui défilent avec snap */
.hv .hv-ba1 .shot img{aspect-ratio:auto;height:auto;object-fit:contain}
.hv .ba-grid.hv-ba img{display:block;height:auto}
@media (max-width:860px){
  .hv .hv-ba1,.hv .ba-grid.hv-ba{display:flex;gap:10px;margin-left:calc(-1 * var(--gut));margin-right:calc(-1 * var(--gut));padding:0 var(--gut) 12px;
    overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding:0 var(--gut);overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:#c9cbc4 transparent}
  .hv .hv-ba1 .shot{flex:none;width:min(77vw,384px);scroll-snap-align:start}
  .hv .hv-ba1 .shot:nth-child(3){grid-column:auto}
  .hv .hv-ba1 .shot:nth-child(3) img{aspect-ratio:auto;object-position:50% 50%}
  .hv .hv-ba1 .shot img{display:block;width:100%}
  .hv .ba-grid.hv-ba{margin-top:4px}
  .hv .ba-grid.hv-ba img{flex:none;width:88vw;scroll-snap-align:start}
}
