/* Street Shakers — Adaptations tablette, téléphone et écrans d'ordinateur peu hauts */
/* ---------- RESPONSIVE ---------- */
@media (max-width: 980px){
  .repertoire-layout{ grid-template-columns:1fr; gap:44px; }
  .repertoire-side{ order:-1; }
  .reviews-grid{ grid-template-columns:1fr; }
  .foot-grid{ grid-template-columns:1fr 1fr; }
}
@media (max-width: 700px){
  nav.links{ display:none; }
  .nav-cta{ display:none; }
  .burger{ display:block; }
  section{ padding:56px 0; }
  /* extraits (téléphone) : bandeau le plus bas possible — étiquette devant le titre, description dessous, onde masquée */
  .track{
    display:grid; grid-template-columns:36px 3.7rem 1fr; grid-template-areas:"play tag title" "play desc desc";
    column-gap:10px; row-gap:1px; align-items:center; padding:8px 12px;
  }
  .track-play{ grid-area:play; width:36px; height:36px; min-width:36px; }
  .track-info{ display:contents; }
  .track-info h4{ grid-area:title; line-height:1.2; }
  .track-info span{ grid-area:desc; line-height:1.35; font-size:0.8rem; }
  .track .tag{ grid-area:tag; justify-self:stretch; text-align:center; padding:3px 0; font-size:0.66rem; }
  .track .waveform{ display:none; }
  .tracklist{ gap:8px; }
  .gallery-grid{ grid-template-columns:repeat(2,1fr); grid-auto-rows:30vw; gap:10px; }
  .gal-tile{ grid-row:span 2; }
  .gal-tile.wide2, .gal-tile.wide3, .gal-tile:nth-child(6){ grid-column:span 2; }
  .foot-grid{ grid-template-columns:1fr; gap:32px; }
  /* accueil : tient dans l'écran avec le bandeau jaune entier en bas */
  .hero{ padding:0; min-height:calc(100svh - 73px - 42px); }
  .hero .wrap{ padding:20px 20px 64px; }
  .hero-logo img{ width:min(80vw, 44svh); }
  .hero p.sub{ margin-top:10px; font-size:0.95rem; line-height:1.55; }
  .hero-ctas{ margin-top:16px; }
  .scroll-cue{ bottom:calc(48px + env(safe-area-inset-bottom,0px)) !important; }
  /* à propos : boutons des musiciens resserrés pour que le groupe tienne dans l'écran */
  .profiles-grid{ gap:14px 12px; }
  .profile-card{ flex-basis:120px; }
  .profile-card .pname{ height:1.2rem; margin-bottom:24px; font-size:1rem; }
  .avatar{ margin-bottom:10px; }
  .profile-card h4{ line-height:1.15; }
  .profile-card > p{ font-size:0.8rem; line-height:1.3; margin-top:2px; }
}

/* ---------- ÉCRANS D'ORDINATEUR PEU HAUTS : tout se resserre selon la hauteur disponible ---------- */
@media (min-width: 981px) and (max-height: 760px){
  section{ padding:4vh 0; }
  .hero .wrap{ padding:2.5vh 7vw; }
  .hero-eyebrow{ margin-bottom:1vh; }
  .hero-logo img{ width:min(clamp(220px, 32vw, 430px), 52vh); }
  .hero p.sub{ margin-top:1.4vh; }
  .hero-ctas{ margin-top:2vh; }
  h2.section-title{ font-size:clamp(1.5rem, 4.4vh, 2.6rem); }
  .kicker{ margin-bottom:2px; }
  .section-head{ margin-bottom:2.8vh; }
  .apropos-top{ margin-bottom:2.8vh; }
  .section-head p{ margin-top:1vh; font-size:0.92rem; }
  .profile-card .pname{ height:1.2rem; margin-bottom:calc(1.6vh + 20px); }
  .avatar{ margin-bottom:1.4vh; }
  .profile-card > p{ font-size:0.85rem; line-height:1.45; }
  .tracklist{ gap:1.1vh; }
  .track{ padding:0.9vh 16px; }
  .track-play{ width:36px; height:36px; min-width:36px; }
  .stickers{ max-width:min(440px, 58vh); }
  .review-card{ padding:2.4vh 22px; }
  .stars{ margin-bottom:1.2vh; }
  .review-card p.quote{ font-size:0.92rem; line-height:1.5; }
  .review-foot{ margin-top:1.8vh; }
  .gallery-grid{ gap:1.4vh; }
  .cta-band p{ margin-top:1vh; }
  .cta-band .btn-ghost{ margin-top:2vh; }
}
:focus-visible{ outline:2px solid var(--rouge); outline-offset:2px; }

/* petits téléphones (écran peu haut, ex. iPhone SE) : on resserre encore */
@media (max-width: 700px) and (max-height: 640px){
  .hero .wrap{ padding:14px 20px 56px; }
  .hero-logo img{ width:min(72vw, 32svh); }
  .hero p.sub{ font-size:0.88rem; line-height:1.5; }
  .hero-ctas{ margin-top:12px; }
  .profiles-grid{ gap:10px 12px; }
  .avatar{ width:64px; height:64px; margin-bottom:8px; }
  .profile-card .pname{ margin-bottom:22px; height:1.05rem; }
  .profile-card > p{ line-height:1.25; }
}