/* ═══════════════════════════════════════════════════════════════════════
   site-fixes.css — correctifs UI/responsive (audit 2026-08-15).
   CSS pur, aucun markup modifié : ce fichier surcharge les classes
   existantes. Chaque bloc référence le constat d'audit correspondant.
   ═══════════════════════════════════════════════════════════════════════ */

/* 1 · HEADER — collapse à 1280 au lieu de 1024.
   À 1024–1279 la nav desktop (9 items) ne tient pas : CTA hors écran,
   burger hors canvas, logo 112px dans une barre de 64. On rend cette
   bande identique à la tablette (burger + drawer), et on masque le
   burger à ≥1280 (il restait visible par accident de cascade). */
@media (min-width:1024px) and (max-width:1279.98px){
  nav .hidden.lg\:flex.items-center.gap-1{display:none!important}
  nav div.lg\:hidden{display:block!important}   /* drawer mobile actif dans la bande */
}
@media (min-width:1280px){
  nav button.lg\:hidden{display:none!important} /* burger réellement masqué en desktop */
}
/* CTA « Essai 24h » : 2 lignes → 68px dans une barre de 64. Une ligne. */
nav .hidden.md\:block a{white-space:nowrap}

/* 2 · CARTES TARIFAIRES — alignement sans trous.
   v3 (retour utilisateur 15/08 ×2) : les compensations :has() créaient de
   grands blancs quand une zone n'existait que dans l'AUTRE rang de la
   grille (CSS ne sait pas cibler un rang). On garde uniquement :
   – slot titre 2 lignes → durées et PRIX alignés dans chaque rang ;
   – min-height sur les zones existantes (puce bonus, encart activation)
     → les cartes qui ONT la zone restent égales entre elles.
   Les cartes sans zone ne réservent plus rien : léger décalage naturel
   des listes sous le prix, zéro espace mort. */
@media (min-width:768px){
  .pricing-card>h3{min-height:56px;display:flex;align-items:flex-end}
  .pricing-card>.my-4{min-height:88px;display:flex;align-items:center}
  .pricing-card>.mb-4.rounded-xl{min-height:87px}
}
@media (min-width:768px) and (max-width:1023.98px){
  .pricing-card>.my-4{min-height:102px}
  .pricing-card>.mb-4.rounded-xl{min-height:180px}
}
/* One-off (football 768–1023) : « (6,66€/mois) » débordait de +13px —
   le libellé mensuel passe sous le prix dans les colonnes étroites. */
@media (min-width:768px) and (max-width:1023.98px){
  .text-4xl.font-bold.text-white+.text-gray-400.text-sm.ml-2{display:block;margin-left:0}
}

/* 3 · BOUTONS — politique de retour à la ligne globale.
   ~40 CTA relevés en wrap déséquilibré (« S'ABONNER / MAINTENANT »,
   flèche « → » orpheline en 2ᵉ ligne). text-wrap:balance équilibre les
   2 lignes et recolle la flèche au dernier mot. Sans effet sur les
   boutons d'une ligne. */
a[class*="rounded-"],button[class*="rounded-"]{text-wrap:balance}

/* 4a · TRONCATURES — clamp 2 lignes au lieu d'une coupe à un mot.
   Pills de pays (/chaines2027/ : « English (International) » coupée
   jusqu'à 1024) et cartes précédent/suivant du blog (coupées à moitié). */
h3.text-sm.truncate,
p.text-purple-300.text-sm.font-medium.truncate{
  white-space:normal;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

/* 4b · TABLES — affordance de scroll sous 768px.
   Les tableaux comparatifs coupaient la 4ᵉ colonne sans aucun indice.
   Fondu au bord droit (mobile) + barre de défilement fine et visible. */
div[class*="overflow-x-auto"]{scrollbar-width:thin;scrollbar-color:rgba(167,139,250,.6) rgba(255,255,255,.06)}
div[class*="overflow-x-auto"]::-webkit-scrollbar{height:6px}
div[class*="overflow-x-auto"]::-webkit-scrollbar-thumb{background:rgba(167,139,250,.6);border-radius:3px}
div[class*="overflow-x-auto"]::-webkit-scrollbar-track{background:rgba(255,255,255,.06)}
@media (max-width:767.98px){
  div[class*="overflow-x-auto"]{
    -webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent);
    mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent);
  }
}

/* 5 · LIENS WHATSAPP — TOUS masqués (21/08/2026).
   Aucune exception : tout passe par le formulaire de commande. Les liens
   restent dans le HTML (parité SEO intacte, rien n'est supprimé) ; seul
   l'affichage est désactivé, donc réactivable en supprimant ce bloc. */
a[href*="wa.me"],
a[href*="whatsapp.com"]{
  display:none!important;
}