/* ==========================================================================
   SwissKH, ajustements tablette et mobile (contrôle du 13.10.2026)
   Points de rupture du kit Elementor : mobile ≤ 640 px, tablette ≤ 960 px,
   portable ≤ 1240 px. Les règles propres à un composant restent dans son fichier ;
   ici : cibles tactiles, lisibilité des petits libellés, images sans dimension.
   ========================================================================== */

/* ---------- Fiche machine : l'image de la scène garde sa taille avant chargement ---------- */
.skh-stage-img img { width: min(92%, 520px); height: auto; }

/* ---------- Écrans de portable (1241 à 1599 px) : le rail du récit CADRIA est dans la marge ---------- */
@media (min-width: 1241px) and (max-width: 1599px) {
	.e-con.skh-steps > .e-con.skh-step { right: 150px !important; width: auto !important; }
}

/* ---------- Portable et tablette paysage (≤ 1240 px) ---------- */
@media (max-width: 1240px) {
	/* Tuiles décors : le nombre de machines passe sous le nom (il le chevauchait). */
	.e-con.skh-decor-label { flex-wrap: wrap !important; row-gap: 2px !important; }
	.skh-decor-label > .elementor-widget-heading:first-child { flex: 1 1 100%; }
	.skh-decor-desc { bottom: 86px !important; }
	/* Récit CADRIA : le rail de navigation à droite chevauchait la liste des décors. */
	.e-con.skh-rail-wrap { display: none !important; }
}
@media (min-width: 961px) and (max-width: 1240px) {
	/* Bandeau chiffres de l'accueil : valeurs un peu plus petites pour tenir sur 4 colonnes. */
	.elementor-widget-heading.skh-stat-v .elementor-heading-title { font-size: clamp(2rem, 3.6vw, 2.75rem) !important; }
}

/* ---------- Tablette et mobile ---------- */
@media (max-width: 960px) {
	/* Cibles tactiles : liens des listes (pied de page, coordonnées, méga-menu) d'au moins 44 px. */
	.elementor-widget-icon-list .elementor-icon-list-item > a { min-height: 44px; align-items: center; }
	.elementor-widget-icon-list .elementor-inline-items .elementor-icon-list-item > a { min-height: 40px; }
	/* Barre du haut : plus compacte, mais toujours touchable. */
	.skh-topbar .elementor-icon-list-item > a { min-height: 36px; }
	.skh-topbar .skh-lang a, .skh-topbar .skh-lang span { padding: 10px 8px; }

	/* Fil d'Ariane : retour à la ligne propre sur les titres longs. */
	.skh-crumbs { overflow-wrap: anywhere; }

	/* Pas de survol au doigt : les cartes ne se soulèvent pas au toucher. */
	.e-con.skh-mcard:hover { transform: none; }
}

/* ---------- Tablette seule (641 à 960 px) : éviter la « version mobile étirée » ---------- */
@media (min-width: 641px) and (max-width: 960px) {
	/* Tuiles décors de l'accueil sur 3 colonnes, grande tuile Perlage sur 2 × 2. */
	.e-con.skh-decors:has(.skh-decor-xl) { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; grid-auto-flow: row dense; }
	.e-con.skh-decors .skh-decor-xl { grid-column: span 2 !important; grid-row: span 2 !important; aspect-ratio: auto !important; }
	/* Scène CADRIA (anneau gradué) : taille contenue. */
	.e-con.skh-stage { width: min(100%, 520px) !important; }
	/* Étapes du processus (machines spéciales) sur 2 colonnes. */
	.e-con.skh-htrack__track { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px !important; }
	.skh-htrack__track > .skh-pstep { width: auto !important; max-width: none !important; }
}

/* ---------- Mobile ---------- */
@media (max-width: 640px) {
	/* Libellés mono (11 px sur ordinateur) portés à 12 px. */
	.skh-crumbs, .skh-crumbs a, .skh-crumbs span,
	.skh-hud, .skh-hud .elementor-heading-title,
	.skh-acard-meta .elementor-widget-heading .elementor-heading-title,
	.elementor-widget-heading.skh-mcard-ops .elementor-heading-title,
	.elementor-widget-heading.skh-mcard-ref .elementor-heading-title,
	.elementor-widget-heading.skh-mod-s .elementor-heading-title,
	.elementor-widget-heading.skh-mono-label .elementor-heading-title,
	.elementor-widget-heading.skh-stage-hud .elementor-heading-title,
	.skh-mcard-badge, .skh-badge .elementor-heading-title,
	.skh-gloss-terms .skh-term-meta, .skh-gloss-terms dt, .skh-prose dt { font-size: .75rem !important; }

	/* Boutons pleine largeur dans les en-têtes de page : plus faciles à atteindre au pouce. */
	.skh-page-hero .elementor-widget-button { width: 100%; }
	.skh-page-hero .elementor-widget-button .elementor-button { width: 100%; justify-content: center; }

	/* Grilles de cartes (6 cartes et plus : partenaires, demandes de contact) sur 2 colonnes. */
	.e-con.e-grid:has(> .skh-card--link:nth-child(6)) { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 10px !important; }
	.e-grid:has(> .skh-card--link:nth-child(6)) > .skh-card--link { padding: 18px 16px !important; }

	/* Tuiles « sites du groupe » (À propos) : 2 colonnes, moins hautes. */
	.e-con.e-grid:has(> .skh-hub-tile) { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 8px !important; }
	.e-con.skh-hub-tile { min-height: 150px !important; padding: 18px !important; }
	.e-con.skh-cta-tile { min-height: 0; }

	/* Tuiles décors de la CADRIA : 2 colonnes carrées (la grille de l'accueil a sa propre mise en page). */
	.e-con.skh-decors:not(:has(.skh-decor-xl)) { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 8px !important; }
	.skh-decors:not(:has(.skh-decor-xl)) > .skh-decor-tile { grid-column: auto !important; grid-row: auto !important; aspect-ratio: 1 / 1; min-height: 0 !important; height: auto !important; }

	/* Glossaire : lettres de l'index plus grandes au doigt. */
	.skh-az-bar a, .skh-az-bar span { width: 40px; height: 40px; }

	/* Formulaires : cases à cocher en ligne présentées sur 2 colonnes, zone tactile agrandie. */
	.elementor-field-subgroup.elementor-subgroup-inline { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2px 12px; }
	.elementor-field-subgroup.elementor-subgroup-inline .elementor-field-option { display: flex; align-items: center; gap: 8px; min-height: 40px; margin: 0 !important; }
	.elementor-field-subgroup .elementor-field-option input[type="checkbox"],
	.elementor-field-subgroup .elementor-field-option input[type="radio"] { width: 18px; height: 18px; flex: none; margin: 0; }
}