/* =========================================================================
   tactile.css — zones cliquables au doigt. Source unique pour tout le site.
   Créé le 10-08-2026 après l'audit responsive (79/100, 12,7 cibles trop
   petites par page en moyenne).

   Règle : WCAG 2.2 SC 2.5.8 niveau AA exige 24 px minimum ; Apple HIG et
   Material Design recommandent 44 et 48 px. On vise 44 px.

   Tout est sous @media (max-width:768px) : le rendu sur ordinateur, où l'on
   pointe à la souris, n'est pas modifié d'un pixel.

   Pour ajouter un cas : une ligne ICI, jamais dans une page.
   ========================================================================= */
@media (max-width: 768px) {

  /* Liens de section « Découvrir », présents sur les pages principales */
  a.section-link {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    padding:8px 0;
  }

  /* Fil d'Ariane des articles de blog (mesuré à 18 px de haut) */
  .breadcrumb a {
    display: inline-block;
    min-height: 44px;
    padding:8px 0;
  }
  .breadcrumb {
    line-height:1.35;
  }

  /* Bloc auteur des articles (mesuré à 22 px) */
  .author-info a,
  .author-box a {
    display: inline-block;
    min-height: 44px;
    padding:8px 0;
  }

  /* Liens à l'intérieur des réponses de FAQ */
  .faq-body a {
    display: inline-block;
    min-height: 44px;
    padding:8px 0;
  }

  /* Curseurs de simulateur : mesuré à 6 px de haut, impossible à attraper */
  input[type="range"],
  input.tk-slider {
    height: 44px;
    padding:16px 0;
    background: transparent;
  }
  input[type="range"]::-webkit-slider-thumb {
    width: 24px;
    height: 24px;
  }
  input[type="range"]::-moz-range-thumb {
    width: 24px;
    height: 24px;
  }

  /* Titres cliquables des fiches outil */
  .tool-card h4 a {
    display: inline-block;
    min-height: 44px;
    padding:8px 0;
  }
}

/* --- Ajouts du 10-08-2026, second passage de mesure --- */
@media (max-width: 768px) {
  /* Filtres de catégories de l'index du blog (mesurés à 34 px) */
  .filter-pill {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
  }
  /* Liens secondaires de la page SEO/GEO (mesurés à 33 px) */
  .under-link {
    display: inline-block;
    min-height: 44px;
    padding:8px 0;
  }
}

/* --- Ajouts du 17-08-2026, audit complet des 212 pages --- */
@media (max-width: 768px) {
  /* Appels de note en exposant : mesurés à 5-7 px de large, 410 occurrences.
     On agrandit la ZONE TACTILE à 44x44 px sans toucher au rendu visuel :
     le pseudo-élément est invisible et centré sur le chiffre. */
  sup > a[href^="#"] {
    position: relative;
    display: inline-block;
  }
  sup > a[href^="#"]::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 44px;
    height: 44px;
  }

  /* Badges de conformité cliquables (nLPD, LSR, EXPERTsuisse), mesurés à 24 px de haut */
  a[href*="fedlex"], a[href*="admin.ch"], a[href*="expertsuisse"] {
    display: inline-block;
    min-height: 44px;
    line-height: 44px;
  }

  /* Garde-fou : aucun bloc ne dépasse la largeur de l'écran */
  img, video, iframe, table, pre { max-width: 100%; }
}

@media (max-width: 768px) {
  /* Halos décoratifs (radial-gradient en position absolue, 400 à 700 px) : ils
     débordent de l'écran sur mobile et créent un défilement latéral.
     `clip` plutôt que `hidden` : n'interfère pas avec les positions sticky. */
  section, header, footer, .hero { overflow-x: clip; }
}

/* =====================================================================
   PAGE CHIEF AI OFFICER EXTERNALISÉ (04-09-2026)
   Ses liens de contenu vivent dans des titres et des notes de source :
   sans hauteur propre ils tombent à 18-20 px, sous le seuil WCAG de 24.
   ===================================================================== */
@media (max-width: 768px) {
  .caio .og h3 a,
  .caio .sou a {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    padding: 4px 0;
  }
}
