/*
Theme Name: Prêt Auto Partez
Theme URI: https://www.pretautopartez.ca
Description: Thème enfant GeneratePress pour Prêt Auto Partez. Palette et typographie du Guide de normes 2025, structure mobile d'abord (Document Maître v1.5).
Author: Prêt Auto Partez
Template: generatepress
Version: 0.2.1
Text Domain: pap
*/

/* ---------- Jetons de marque (Guide de normes juillet 2025) ---------- */
:root {
  --pap-lime: #6abf4b;
  --pap-herbe: #03a244;
  --pap-nuage: #ffffff;
  --pap-charbon: #090108;
  --pap-fraise: #cc072d;
  --pap-cerise: #950c23;
  --pap-violette: #433178;
  --pap-aubergine: #36265e;
  --pap-fond: #f7f7f4;          /* blanc cassé du guide, fond de page */
  --pap-gris: #5f5f5c;          /* texte secondaire, contraste AA sur blanc */
  --pap-ligne: #e6e6e1;

  --pap-font: "Axiforma", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

  --pap-radius: 16px;
  --pap-radius-sm: 10px;
  --pap-shadow: 0 6px 24px rgba(9, 1, 8, 0.08);

  --pap-topbar: 56px;
  --pap-bottomnav: 64px;
  --pap-cta: 56px;
  --pap-safe-bottom: env(safe-area-inset-bottom, 0px);
}

/* ---------- Polices (fichiers Axiforma à déposer dans /fonts) ---------- */
@font-face {
  font-family: "Axiforma";
  src: url("fonts/axiforma-book.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Axiforma";
  src: url("fonts/axiforma-black.woff2") format("woff2");
  font-weight: 700 900;
  font-style: normal;
  font-display: swap;
}
/* Police de repli ajustée pour limiter le saut de mise en page (CLS). */
@font-face {
  font-family: "Axiforma Fallback";
  src: local("Arial");
  size-adjust: 104%;
  ascent-override: 92%;
  descent-override: 24%;
  line-gap-override: 0%;
}

/* ---------- Base ---------- */
html { -webkit-text-size-adjust: 100%; }
body {
  font-family: var(--pap-font), "Axiforma Fallback", sans-serif;
  font-weight: 400;
  color: var(--pap-charbon);
  background: var(--pap-fond);
  line-height: 1.55;
}
h1, h2, h3, h4, h5, h6, .pap-title { font-family: var(--pap-font); font-weight: 700; line-height: 1.15; letter-spacing: -0.01em; color: var(--pap-charbon); }
h1 { font-size: clamp(1.75rem, 6vw, 2.5rem); }
h2 { font-size: clamp(1.375rem, 4.5vw, 1.875rem); }
h3 { font-size: 1.125rem; }
p, li { font-size: 1rem; }
a { color: var(--pap-herbe); text-decoration-thickness: 1px; text-underline-offset: 3px; }
a:hover, a:focus { color: var(--pap-violette); }
:focus-visible { outline: 3px solid var(--pap-violette); outline-offset: 2px; }
img, video { max-width: 100%; height: auto; }

/* ---------- Boutons ---------- */
.button, button, input[type="submit"], .wp-block-button__link, .pap-btn {
  font-family: var(--pap-font); font-weight: 700; font-size: 1rem;
  border-radius: 999px; padding: 0.9rem 1.5rem; line-height: 1.2;
  background: var(--pap-lime); color: var(--pap-charbon); border: 0;
  min-height: 48px; display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
  transition: background .15s ease, transform .15s ease;
}
.button:hover, button:hover, .pap-btn:hover { background: var(--pap-herbe); color: var(--pap-nuage); }
.pap-btn--violette { background: var(--pap-violette); color: var(--pap-nuage); }
.pap-btn--violette:hover { background: var(--pap-aubergine); }
.pap-btn--ghost { background: transparent; color: var(--pap-charbon); box-shadow: inset 0 0 0 2px var(--pap-charbon); }

/* ---------- Bandeaux de couleur (combinaisons autorisées, page 8 du guide) ---------- */
.pap-bg-vert { background: var(--pap-lime); color: var(--pap-charbon); }
.pap-bg-vert h1, .pap-bg-vert h2, .pap-bg-vert h3 { color: var(--pap-nuage); }
.pap-bg-mauve { background: var(--pap-violette); color: var(--pap-nuage); }
.pap-bg-mauve h1, .pap-bg-mauve h2, .pap-bg-mauve h3, .pap-bg-mauve a { color: var(--pap-nuage); }
.pap-bg-mauve .pap-accent { color: var(--pap-lime); }
.pap-bg-rouge { background: var(--pap-fraise); color: var(--pap-nuage); }
.pap-bg-rouge h1, .pap-bg-rouge h2, .pap-bg-rouge h3 { color: var(--pap-nuage); }

/* ---------- Mise en page mobile d'abord ---------- */
.site-header { position: sticky; top: 0; z-index: 60; background: var(--pap-nuage); box-shadow: 0 1px 0 var(--pap-ligne); }
.inside-header { padding: 0 16px; min-height: var(--pap-topbar); display: flex; align-items: center; }
.site-logo img { height: 32px; width: auto; }
.site-content, .inside-article { padding-left: 16px; padding-right: 16px; }
body.pap-has-bottomnav .site-content { padding-bottom: calc(var(--pap-bottomnav) + var(--pap-cta) + var(--pap-safe-bottom) + 16px); }

/* CTA principal fixe au-dessus de la navigation basse (Document Maître 2.3) */
.pap-sticky-cta {
  position: fixed; left: 16px; right: 16px; bottom: calc(var(--pap-bottomnav) + var(--pap-safe-bottom) + 8px); z-index: 70;
}
.pap-sticky-cta .pap-btn { width: 100%; box-shadow: var(--pap-shadow); }

/* Navigation basse fixe : Accueil, Ma situation, Outils, Témoignages, Contact */
.pap-bottomnav {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 70;
  height: calc(var(--pap-bottomnav) + var(--pap-safe-bottom)); padding-bottom: var(--pap-safe-bottom);
  background: var(--pap-nuage); box-shadow: 0 -1px 0 var(--pap-ligne);
  display: grid; grid-template-columns: repeat(5, 1fr);
}
.pap-bottomnav a {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px;
  font-size: 0.6875rem; font-weight: 700; color: var(--pap-gris); text-decoration: none; min-height: 44px;
}
.pap-bottomnav a svg { width: 24px; height: 24px; stroke: currentColor; fill: none; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.pap-bottomnav a[aria-current="page"], .pap-bottomnav a.is-active { color: var(--pap-herbe); }

@media (min-width: 900px) {
  .pap-bottomnav, .pap-sticky-cta { display: none; }
  body.pap-has-bottomnav .site-content { padding-bottom: 0; }
  .site-logo img { height: 40px; }
}

/* ---------- Cartes du feed (structure de base, phase 2 pour le comportement) ---------- */
.pap-feed { max-width: 600px; margin: 0 auto; }
.pap-card {
  background: var(--pap-nuage); border-radius: var(--pap-radius); box-shadow: var(--pap-shadow);
  overflow: hidden; margin: 0 0 16px;
}
.pap-card__media { aspect-ratio: 4 / 5; background: var(--pap-violette); position: relative; }
.pap-card__media img, .pap-card__media video, .pap-card__media iframe { width: 100%; height: 100%; object-fit: cover; display: block; }
.pap-card__body { padding: 16px; }
.pap-card__kicker { font-size: 0.75rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--pap-herbe); }
.pap-card__title { margin: 4px 0 8px; font-size: 1.25rem; }
.pap-card__text { color: var(--pap-gris); margin: 0 0 12px; }
.pap-peek { height: 48px; margin-top: -48px; background: linear-gradient(to bottom, rgba(247,247,244,0), var(--pap-fond)); pointer-events: none; }

/* ---------- Utilitaires ---------- */
.pap-visually-hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.pap-reassurance { display: flex; gap: 16px; flex-wrap: wrap; font-size: 0.875rem; color: var(--pap-gris); }
.pap-reassurance strong { color: var(--pap-charbon); font-size: 1.25rem; display: block; }

/* Accueil : pas de titre de page, le H1 vient du contenu */
.home .entry-header, .home .entry-title { display: none; }
.pap-btn, .pap-bottomnav a { text-decoration: none; }
.site-logo img { max-height: 44px; }

/* Cartes dans le contenu (page Ma situation) */
.entry-content .pap-card { margin: 0 0 16px; }
.entry-content .pap-card .wp-block-group { padding: 0; margin: 0; }
.entry-content .pap-card .pap-card__body { padding: 16px; }
.entry-content .pap-card .pap-card__body > * { margin-top: 0; margin-bottom: 8px; }
.pap-card__title a { color: inherit; text-decoration: none; }
.pap-card__title a::after { content: " →"; color: var(--pap-herbe); }
.pap-card__kicker { margin-bottom: 4px; }
a.pap-card--lien { display: block; color: inherit; text-decoration: none; }
a.pap-card--lien .pap-card__title::after { content: " →"; color: var(--pap-herbe); }