/* =====================================================================
   LTC Group — Refine layer B (2026-10)
   ---------------------------------------------------------------------
   Scoped fixes for: /contact, /audit-gratuit, /mes-solutions-ia,
   /guide-ia-gratuit, /guide-ia-merci, /faq, /blog (+ article template),
   /conformite, /legal/*, /nota/confiance.
   Loaded site-wide after refine.css — every selector below is scoped to
   components that only exist on this lot's pages.
   ===================================================================== */

/* ---------------------------------------------------------------------
   CONTACT — channel cards: one accent (blue), no multicolour pastels
--------------------------------------------------------------------- */
.channel::before { background: var(--primary) !important; }
.channel:hover { box-shadow: var(--shadow-md) !important; border-color: var(--line-strong) !important; }

.channel--whatsapp .channel__icon,
.channel--phone .channel__icon,
.channel--email .channel__icon,
.channel--audit .channel__icon {
  color: var(--primary) !important;
  background: var(--primary-50) !important;
}
.channel--whatsapp .channel__kicker,
.channel--phone .channel__kicker {
  color: var(--text-muted) !important;
}
.channel--whatsapp .channel__cta { color: var(--primary) !important; }

.channel--audit {
  background: var(--primary-50) !important;
  border-color: rgba(32, 32, 204, 0.18) !important;
}

/* ---------------------------------------------------------------------
   AUDIT GRATUIT — missing gap-x-6 utility in the pre-built Tailwind
   output leaves the two fallback links glued together on desktop.
--------------------------------------------------------------------- */
.flex.flex-col.sm\:flex-row:has(> a[data-track-cta="audit-fallback-solutions"]) {
  column-gap: 1.5rem;
}

/* ---------------------------------------------------------------------
   MES SOLUTIONS IA (wizard) — flat accent, sober badges, no emoji icon
--------------------------------------------------------------------- */
.sol-progress__fill { background: var(--primary) !important; }
.sol-estimation { background: var(--primary) !important; }

.sol-card__badge { border-radius: 6px !important; }
.sol-card__badge--quick_win,
.sol-card__badge--produit {
  background: var(--primary-50) !important;
  color: var(--primary) !important;
}
.sol-card__icon { display: none !important; }
.sol-card, .sol-chip { background: #fff !important; }

/* ---------------------------------------------------------------------
   BLOG — listing cards: category tags & top accents all read as
   decorative multicolour pastels; unify to a sober neutral.
   (inline styles reference --accent-* custom properties, scoped via
   attribute selectors so nothing outside the blog listing is touched)
--------------------------------------------------------------------- */
div.h-1[style*="--accent-"],
div.h-1\.5[style*="--accent-"] {
  background: var(--line) !important;
}
span[style*="--accent-"][class*="rounded-full"] {
  background: var(--surface-2) !important;
  color: var(--text-secondary) !important;
  border-radius: 6px !important;
}
div[style*="radial-gradient"][class*="opacity-"] { display: none !important; }

/* ---------------------------------------------------------------------
   BLOG ARTICLE — hero title keeps the old serif + per-category colour;
   bring it back to Geist / single accent (template lives outside src/,
   generated for every article, so this fix is page-CSS only).
--------------------------------------------------------------------- */
.article-hero h1 {
  font-family: var(--font-sans) !important;
  font-style: normal !important;
}
.article-hero .mb-6.flex.items-center.gap-3 > span[style*="color: #"] {
  color: var(--text-muted) !important;
}
.article-hero .mb-6.flex.items-center.gap-3 > span[style*="color: #"] > span[style*="background: #"] {
  background: var(--text-muted) !important;
}

/* ---------------------------------------------------------------------
   CONFORMITÉ — document-type badges use a raw Tailwind rounded-full pill
--------------------------------------------------------------------- */
span[style*="rgba(238,240,255"][class*="rounded-full"] {
  border-radius: 6px !important;
}
