/* ==========================================================================
   Hikaad — Échelle typographique de marque
   Passion One (display) + Montserrat (texte)

   Chargée APRÈS la feuille de style de page. Chaque sélecteur est préfixé
   par « body » (spécificité 0,1,1) pour l'emporter sur les règles de classe
   des feuilles minifiées (0,1,0) sans recourir à !important.
   ========================================================================== */

:root{
  --font-display:"Passion One",Impact,"Arial Narrow",sans-serif;
  --font-text:"Montserrat","Helvetica Neue",Arial,sans-serif;

  --type-hook:clamp(48px,5.2vw,72px);   /* HOOK / H1    48-72 px */
  --type-titre:clamp(32px,3.4vw,48px);  /* TITRE / H2   32-48 px */
  --type-sous:clamp(18px,1.5vw,24px);   /* SOUS-TITRE   18-24 px */
  --type-texte:clamp(16px,1.1vw,18px);  /* TEXTE        16-20 px */
  --type-cta:16px;                      /* CTA          16-18 px */
  --type-legende:13px;                  /* LÉGENDE      12-14 px */
}

/* --------------------------------------------------------------------------
   Base — Montserrat Regular partout, interligne 150 % (charte : 140-155 %)
   -------------------------------------------------------------------------- */
body{
  font-family:var(--font-text);
  font-size:16px;
  font-weight:400;
  line-height:1.5;
}
body button,body input,body textarea,body select,body optgroup{font-family:var(--font-text);}

/* --------------------------------------------------------------------------
   HOOK / H1 — Passion One Bold, 48-72 px, 1 à 2 lignes
   -------------------------------------------------------------------------- */
body h1,
body .hero-title,
body .service-hero-title,
body .engagement-hero-title,
body .contact-title,
body .course-hero-title,
body .blog-article-title,
body .blog-hero-title,
body h1.agence-title{
  font-family:var(--font-display);
  font-weight:700;
  font-size:var(--type-hook);
  line-height:1.05;
  letter-spacing:.01em;
}

/* --------------------------------------------------------------------------
   TITRE / H2 — Passion One Regular, 32-48 px, phrase courte, casse normale
   -------------------------------------------------------------------------- */
body h2,
body .cta-title,
body .diagnostic-title,
body .faq-title,
body .process-title,
body .course-desc-title,
body .why-title,
body .audience-title,
body .action-title,
body .vision-title,
body .values-title,
body .approach-title,
body .approche-title,
body .performance-title,
body .realisations-title,
body .projets-title,
body .compare-title,
body .seo-approche-title,
body .team-title,
body .showcase-title,
body .catalog-title,
body .themes-title,
body .bestsellers-title,
body .offer-focus-title,
body .problem-title,
body .results-title,
body .solution-title,
body .main-title,
body .engagements-title,
body h2.agence-title,
body .engagement-block-content h2,
body .why-statement .why-title{
  font-family:var(--font-display);
  font-weight:400;
  font-size:var(--type-titre);
  line-height:1.15;
  text-transform:none;
}

/* Sous-titres internes d'article : plancher de la plage H2 (32 px) */
body .blog-article-body h2{font-size:32px;}

/* --------------------------------------------------------------------------
   SOUS-TITRE — Montserrat SemiBold, 18-24 px, clarifie la promesse
   -------------------------------------------------------------------------- */
body h3,
body h4,
body .blog-card-title,
body .sidebar-title,
body .catalog-table-title,
body .why-card h3,
body .service-card h3,
body .team-card h3,
body .process-card h3,
body .audience-card h3,
body .projet-card h3,
body .value-card h3,
body .approach-card h3,
body .approche-card h3,
body .realisation-card h3,
body .diagnostic-card h3,
body .offer-focus-card h3,
body .form-success h3,
body .legal-card h2,
body .blog-article-body h3{
  font-family:var(--font-text);
  font-weight:600;
  font-size:var(--type-sous);
  line-height:1.3;
  letter-spacing:0;
}

/* --------------------------------------------------------------------------
   TEXTE — Montserrat Regular, 16-20 px, interligne 140-155 %
   -------------------------------------------------------------------------- */
body p,
body li,
body .hero-copy,
body .service-hero-copy,
body .engagement-hero-copy,
body .blog-hero-copy,
body .cta-copy,
body .agence-copy,
body .action-copy,
body .approche-copy,
body .audience-copy,
body .bestsellers-copy,
body .catalog-copy,
body .compare-copy,
body .contact-subtitle,
body .diagnostic-copy,
body .faq-copy,
body .performance-copy,
body .problem-copy,
body .process-copy,
body .projets-copy,
body .realisations-copy,
body .seo-approche-copy,
body .solution-copy,
body .team-copy,
body .themes-copy,
body .why-subtitle,
body .engagement-text,
body .blog-card-excerpt,
body .blog-article-body,
body .blog-article-body p,
body .blog-article-body li,
body .vision-copy p,
body .problem-right p,
body .service-card p,
body .metric-card p,
body .faq-item summary{
  font-family:var(--font-text);
  font-weight:400;
  font-size:var(--type-texte);
  line-height:1.5;
}

/* --------------------------------------------------------------------------
   CTA — Montserrat Bold, 16-18 px, verbe d'action 2 à 5 mots.
   Géométrie recalibrée : à 16 px l'ancien letter-spacing 0.08em faisait
   déborder les libellés hors du min-width de 220 px.
   -------------------------------------------------------------------------- */
body .cta-button-primary,
body .cta-button-secondary,
body .service-hero-btn,
body .service-hero-btn-outline,
body .action-btn-primary,
body .action-btn-secondary,
body .engagement-hero-btn,
body .course-btn-primary,
body .course-btn-secondary,
body .form-submit{
  font-family:var(--font-text);
  font-weight:700;
  font-size:var(--type-cta);
  letter-spacing:.04em;
  line-height:1.2;
  padding-left:28px;
  padding-right:28px;
}

/* --------------------------------------------------------------------------
   LÉGENDE — Montserrat Medium, 12-14 px, source / contexte / précision
   -------------------------------------------------------------------------- */
body .eyebrow,
body .footer-title,
body .footer-list,
body .blog-article-meta,
body .blog-card-meta,
body .bestseller-card-meta,
body .bestseller-card-tag,
body .audience-card-tag,
body .breadcrumb,
body .breadcrumb-list,
body .compare-bar-label,
body .contact-item-label,
body .course-hero-label,
body .course-sticky-date-label,
body .form-label,
body .problem-card-label,
body .results-eyebrow-text,
body .results-stat-label,
body .stat-card-label,
body .stat-label,
body .engagement-block-subtitle{
  font-family:var(--font-text);
  font-weight:500;
  font-size:var(--type-legende);
  line-height:1.4;
}

/* Le bandeau de consentement suit la même échelle (LÉGENDE / CTA). */
body #hikaad-consent{font-family:var(--font-text);}
body #hikaad-consent p{font-size:var(--type-legende);line-height:1.5;}
body #hikaad-consent button{font-family:var(--font-text);font-weight:700;font-size:14px;}