/* Page Compatibilité (Compatibilite.dc.html) — préfixe « cpt ». Chargée par [iptv_cpt_verif] / [iptv_cpt_appareils]. */

/* Contournement (voir deploy/notes/compatibilite.md › Demandes partagées) : la règle des styles globaux
   « :root :where(.is-layout-flow) > * { margin-block-start: 24px } », imprimée APRÈS style.css, l'emporte à
   spécificité égale sur « .wp-block-post-content > * { margin-block: 0 } » : 24 px parasites entre les sections. */
.wp-block-post-content.is-layout-flow > * { margin-block: 0; }
.wp-block-post-content.is-layout-flow > .iptv-ask { margin-top: 104px; }

/* Contournement (voir notes › Demandes partagées) : « :root :where(p) { color: encre-3; line-height: 1.65 } » des styles
   globaux, imprimée APRÈS cette feuille, écrase à spécificité égale (0,1,0) les couleurs / interlignes posées par une
   seule classe sur un <p>. Les sélecteurs de paragraphes de la page sont donc préfixés par leur conteneur. */
.iptv-hero-line p.iptv-eyebrow, .iptv-cpt-guides p.iptv-eyebrow { color: var(--violet); line-height: normal; }

/* ---------- Vérificateur « Est-ce que ça marchera chez moi ? » ---------- */
.iptv-cpt-verif { padding-top: clamp(40px,4.9vw,64px); }
.iptv-cpt-verif__box {
	position: relative; overflow: hidden; background: linear-gradient(150deg,#12307a 0%,#0d1230 62%); color: #fff;
	border-radius: 32px; padding: clamp(26px,4vw,44px); display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%,320px),1fr)); gap: clamp(24px,4vw,44px); align-items: start;
}
.iptv-cpt-verif__box::before {
	content: ""; position: absolute; right: -10%; top: -50%; width: 50%; aspect-ratio: 1; border-radius: 50%;
	background: radial-gradient(circle, rgba(91,46,255,0.55) 0%, rgba(13,18,48,0) 65%); pointer-events: none;
}
.iptv-cpt-verif__box :focus-visible { outline-color: var(--violet-nuit); }
.iptv-cpt-verif__main { position: relative; display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.iptv-cpt-verif__k { font-size: 12px; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: var(--violet-nuit); }
.iptv-cpt-verif__h2 { font-family: var(--f-titre); font-size: clamp(28px,3.6vw,46px); font-weight: 800; line-height: 1.04; letter-spacing: -0.038em; margin: 0; color: #fff; text-wrap: balance; }
.iptv-cpt-verif p.iptv-cpt-verif__p { font-size: 15px; line-height: 1.65; color: var(--sur-nuit); margin: 0; }
.iptv-cpt-verif__qs { display: flex; flex-direction: column; gap: 12px; }
.iptv-cpt-verif__q { font-size: 12px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--violet-nuit); }
.iptv-cpt-verif__q:not(:first-child) { margin-top: 6px; }
.iptv-cpt-verif__pills { display: flex; flex-wrap: wrap; gap: 8px; }
.iptv-cpt-pill {
	font-family: var(--f-texte); font-size: 14px; font-weight: 700; line-height: normal; border-radius: 999px; padding: 10px 14px;
	min-height: 44px; box-sizing: border-box; white-space: nowrap; cursor: pointer; transition: all .18s;
	background: rgba(255,255,255,0.06); color: #fff; border: 1px solid rgba(255,255,255,0.22);
}
.iptv-cpt-pill:hover { background: rgba(255,255,255,0.12); }
.iptv-cpt-pill[aria-pressed="true"] { background: #fff; color: var(--nuit); border-color: #fff; }

.iptv-cpt-verdict {
	position: relative; background: rgba(255,255,255,0.07); border: 1px solid rgba(255,255,255,0.14); border-radius: 22px;
	padding: 22px 24px; display: flex; flex-direction: column; gap: 14px; min-width: 0;
}
.iptv-cpt-verdict__top { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.iptv-cpt-verdict__k { font-size: 11px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--violet-nuit); white-space: nowrap; }
.iptv-cpt-verdict__pill { font-size: 12px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; border-radius: 999px; padding: 6px 10px; white-space: nowrap; color: var(--nuit); background: #7be3b1; }
.iptv-cpt-verdict__pill[data-tone="warn"] { background: linear-gradient(90deg,#FFC94A,#FF9A2E); }
.iptv-cpt-verdict__pill[data-tone="unknown"] { background: #c9cfe6; }
.iptv-cpt-verdict__t { font-family: var(--f-titre); font-size: 22px; font-weight: 800; line-height: 1.15; }
.iptv-cpt-verdict__txt { font-size: 15px; line-height: 1.65; color: #e6e9f5; }
.iptv-cpt-verdict__facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%,120px),1fr)); gap: 8px; }
.iptv-cpt-verdict__facts > span { display: flex; flex-direction: column; gap: 2px; background: rgba(255,255,255,0.07); border: 1px solid rgba(255,255,255,0.12); border-radius: 12px; padding: 10px 12px; min-width: 0; }
.iptv-cpt-verdict__facts > span > span { font-size: 10px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--violet-nuit); }
.iptv-cpt-verdict__facts strong { font-family: var(--f-titre); font-size: 14px; font-weight: 800; }
.iptv-cpt-verdict__acts { display: flex; gap: 10px; flex-wrap: wrap; border-top: 1px solid rgba(255,255,255,0.14); padding-top: 14px; }
.iptv-cpt-verdict__go, .iptv-cpt-verdict__trial {
	font-family: var(--f-titre); font-size: 14px; font-weight: 800; line-height: normal; border-radius: 12px; padding: 12px 16px;
	white-space: nowrap; display: inline-flex; align-items: center;
}
.iptv-cpt-verdict__go { color: var(--nuit); background: #fff; }
.iptv-cpt-verdict__go:hover, .iptv-cpt-verdict__go:focus-visible { background: var(--lavande); color: var(--nuit); }
.iptv-cpt-verdict__trial { color: #fff; border: 1px solid rgba(255,255,255,0.3); }
.iptv-cpt-verdict__trial:hover, .iptv-cpt-verdict__trial:focus-visible { background: rgba(255,255,255,0.1); color: #fff; }

/* ---------- Grille d'appareils ---------- */
.iptv-cpt-devs { padding-top: clamp(40px,4.9vw,64px); }
.iptv-cpt-devs__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%,260px),1fr)); gap: 20px; }
.iptv-cpt-dev {
	background: #fff; border: 1px solid var(--bord-2); border-radius: 22px; padding: 28px; display: flex; flex-direction: column; gap: 14px;
	min-width: 0; transition: all .2s ease;
}
.iptv-cpt-dev:hover { border-color: var(--bord-fort); transform: translateY(-3px); box-shadow: 0 22px 57px rgba(13,18,48,0.07); }
.iptv-cpt-dev__top { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.iptv-cpt-dev__ico { width: 52px; height: 52px; box-sizing: border-box; border-radius: 16px; background: #f3f2ef; border: 1px solid var(--bord-fort); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.iptv-cpt-dev__status { font-size: 11px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--succes-texte); background: var(--succes-fond); border: 1px solid var(--succes-bord); border-radius: 999px; padding: 6px 11px; white-space: nowrap; }
.iptv-cpt-dev__name { font-family: var(--f-titre); font-size: 19px; font-weight: 600; line-height: normal; letter-spacing: normal; margin: 0; color: var(--encre); }
.iptv-cpt-dev__detail { font-size: 15px; line-height: 1.65; color: var(--encre-3); margin: 0; }
.iptv-cpt-dev__models { font-size: 13px; color: var(--attenue); border-top: 1px solid var(--filet-2); padding-top: 14px; margin-top: auto; }
.iptv-cpt-dev__link { font-size: 14px; font-weight: 600; color: var(--violet); display: flex; align-items: center; gap: 7px; transition: gap .18s ease, color .18s ease; align-self: flex-start; }
.iptv-cpt-dev__link:hover { gap: 11px; color: var(--violet-hover); }
.iptv-cpt-dev__link svg { flex-shrink: 0; }

/* ---------- « Bon à savoir » ---------- */
.iptv-cpt-savoir { padding-top: clamp(60px,7.4vw,96px); }
.iptv-cpt-savoir__box {
	background: #f3f2ef; border: 1px solid var(--bord-2); border-radius: 32px; padding: clamp(24px,4vw,48px);
	display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%,340px),1fr)); gap: clamp(28px,4vw,48px); align-items: center;
}
.iptv-cpt-savoir__main { display: flex; flex-direction: column; gap: 18px; min-width: 0; }
.iptv-cpt-savoir p.iptv-cpt-savoir__k { font-size: 12px; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: var(--violet); margin: 0; line-height: normal; }
.iptv-cpt-savoir p.iptv-cpt-savoir__p { font-size: 16px; line-height: 1.7; color: var(--encre-3); margin: 0; }
.iptv-cpt-savoir__list { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.iptv-cpt-savoir__item { background: #fff; border: 1px solid var(--bord-2); border-radius: 18px; padding: 22px 24px; }
.iptv-cpt-savoir__item .iptv-cpt-savoir__t { font-family: var(--f-titre); font-size: 16px; font-weight: 600; line-height: normal; letter-spacing: normal; margin: 0 0 5px; color: var(--encre); }
.iptv-cpt-savoir p.iptv-cpt-savoir__d { font-size: 15px; line-height: normal; color: var(--encre-3); margin: 0; }

/* ---------- « Votre appareil en détail » ---------- */
.iptv-cpt-guides { padding-bottom: clamp(64px,8vw,104px); }
.iptv-cpt-guides .iptv-cpt-guides__head { display: flex; flex-direction: column; gap: 14px; max-width: 620px; margin-bottom: 28px; }
.iptv-cpt-guides__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%,260px),1fr)); gap: 20px; }
.iptv-cpt-guide {
	background: #fff; border: 1px solid var(--bord-2); border-radius: 22px; padding: 28px; display: flex; flex-direction: column; gap: 10px;
	color: var(--encre); min-width: 0; transition: transform .22s cubic-bezier(.22,1,.36,1), box-shadow .22s ease, border-color .22s ease;
}
.iptv-cpt-guide:hover, .iptv-cpt-guide:focus-visible { transform: translateY(-5px); border-color: var(--bord-actif); box-shadow: 0 24px 56px rgba(13,18,48,0.09); color: var(--encre); }
.iptv-cpt-guide__t { font-family: var(--f-titre); font-size: 20px; font-weight: 800; }
.iptv-cpt-guide__d { font-size: 15px; line-height: 1.6; color: var(--encre-3); }
.iptv-cpt-guide__more { margin-top: 6px; font-size: 14px; font-weight: 700; color: var(--violet); }
.iptv-cpt-guide__more svg { flex-shrink: 0; vertical-align: -3px; }

/* ---------- Téléphone ---------- */
@media (max-width: 519px) {
	.iptv-cpt-verdict { padding: 20px 18px; }
	.iptv-cpt-verdict__go, .iptv-cpt-verdict__trial { white-space: normal; justify-content: center; text-align: center; flex: 1 1 100%; }
	.iptv-cpt-pill { white-space: normal; text-align: left; }
	.iptv-cpt-dev, .iptv-cpt-guide { padding: 24px; }
	.iptv-cpt-savoir__item { padding: 20px; }
}
@media (prefers-reduced-motion: reduce) {
	.iptv-cpt-dev:hover, .iptv-cpt-guide:hover { transform: none; }
}
