/* =========================================================================
   AN NAJM — PIED DE PAGE ET BANDEAU SUPÉRIEUR (tout le site)
   Fichier : wp-content/themes/annajm-child/assets/css/annajm-site.css
   Chargé sur toutes les pages (functions.php, section 8.1).

   Toutes les règles sont scopées sous .annajm-footer (sortie du shortcode
   [annajm_footer]) ou .header-top-offer (bandeau supérieur Kadence).

   1. Variables
   2. Intégration dans le pied de page Kadence
   3. Zone principale
   4. Colonnes de liens
   5. Barre basse
   6. Responsive
   7. Bandeau supérieur de l'en-tête
   8. Accessibilité, impression
   ========================================================================= */


/* -------------------------------------------------------------------------
   1. VARIABLES (palette Kadence + valeurs de secours de la charte)
   ------------------------------------------------------------------------- */
.annajm-footer {
  --af-navy:       var(--global-palette6, #2C3E50);
  --af-navy-deep:  #1A252F;
  --af-gold:       var(--global-palette1, #D4A574);
  --af-gold-soft:  #E6BF8A;                 /* 6,4:1 sur marine */
  --af-text:       #C9D2DB;                 /* 7,2:1 sur marine */
  --af-text-strong:#FEFCF8;
  --af-text-bar:   #B9C3CD;                 /* 8,7:1 sur marine profond */
  --af-line:       rgba(201, 210, 219, 0.16);
  --af-font-heading: var(--anjm-font-heading, 'Crimson Text', Georgia, serif);
  --af-font-body:    var(--anjm-font-body, 'Inter', system-ui, sans-serif);
  --af-wrap:       1240px;
  --af-gutter:     clamp(16px, 4vw, 40px);

  font-family: var(--af-font-body);
  font-size: 0.9375rem;
  line-height: 1.6;
  color: var(--af-text);
  text-align: left;
}

.annajm-footer *,
.annajm-footer *::before,
.annajm-footer *::after {
  box-sizing: border-box;
}

.annajm-footer :where(p, ul, li) {
  margin: 0;
  padding: 0;
}

.annajm-footer :where(ul) {
  list-style: none;
}

.annajm-footer :where(a) {
  color: inherit;
  text-decoration: none;
  transition: color 0.2s ease;
}

.annajm-footer :where(a:hover) {
  color: var(--af-gold-soft);
  text-decoration: none;
}

.annajm-footer :where(a):focus-visible {
  outline: 3px solid var(--af-gold-soft);
  outline-offset: 3px;
  border-radius: 2px;
}

.annajm-footer .annajm-footer__wrap {
  width: min(100% - 2 * var(--af-gutter), var(--af-wrap));
  margin-inline: auto;
}

.annajm-footer .annajm-footer__sr {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}


/* -------------------------------------------------------------------------
   2. INTÉGRATION DANS LE PIED DE PAGE KADENCE
   Le fond s'étend sur toute la largeur de la fenêtre, même si la rangée
   Kadence est contenue (box-shadow + clip-path, sans défilement horizontal).
   Les marges de la rangée Kadence qui contient le shortcode sont neutralisées.
   ------------------------------------------------------------------------- */
.annajm-footer__main,
.annajm-footer__bottom {
  position: relative;
  clip-path: inset(0 -100vmax);
}

/* Kadence ajoute des espacements autour de l'élément HTML du pied :
   padding de la rangée (.site-footer-row, réglage « Rembourrage »),
   marge de .footer-html (1em) et du dernier paragraphe. Ils créaient
   une bande vide sous la barre du copyright : tout est remis à zéro
   dans la rangée qui contient le shortcode. */
.site-footer-row-container:has(.annajm-footer) .site-footer-row-container-inner,
.site-footer-row-container:has(.annajm-footer) .site-footer-row,
.site-footer-row-container:has(.annajm-footer) .site-footer-section {
  padding-top: 0;
  padding-bottom: 0;
  min-height: 0;
  background: transparent;
}

.footer-html:has(.annajm-footer),
.footer-html-inner:has(.annajm-footer),
.footer-html-inner:has(.annajm-footer) > p {
  margin: 0;
}

/* Fond de secours : marine profond, comme la barre basse. Si un réglage
   Kadence ajoute encore de l'espace sous la barre, il reste invisible. */
.site-footer-row-container:has(.annajm-footer),
.site-footer-wrap:has(.annajm-footer) {
  background: var(--af-navy-deep, #1A252F);
}

/* Paragraphes vides créés par l'option « Ajouter des paragraphes » */
.footer-html-inner:has(.annajm-footer) > p:empty,
.footer-html-inner:has(.annajm-footer) > br {
  display: none;
}


/* -------------------------------------------------------------------------
   3. ZONE PRINCIPALE
   ------------------------------------------------------------------------- */
.annajm-footer .annajm-footer__main {
  padding: clamp(48px, 6vw, 80px) 0 clamp(36px, 5vw, 56px);
  background: var(--af-navy);
  box-shadow: 0 0 0 100vmax var(--af-navy);
}

.annajm-footer .annajm-footer__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) repeat(3, minmax(0, 1fr));
  gap: 40px clamp(24px, 4vw, 56px);
}

.annajm-footer .annajm-footer__logo {
  display: inline-block;
  line-height: 0;
}

.annajm-footer .annajm-footer__logo-img {
  display: block;
  width: auto;
  max-width: 168px;
  height: auto;
  max-height: 56px;
}

.annajm-footer .annajm-footer__logo-text {
  font-family: var(--af-font-heading);
  font-size: 1.5rem;
  font-weight: 600;
  line-height: 1.2;
  color: var(--af-gold);
}

.annajm-footer .annajm-footer__ar {
  margin-top: 10px;
  font-family: var(--af-font-heading);
  font-size: 1.125rem;
  font-weight: 600;
  line-height: 1.4;
  color: var(--af-gold-soft);
  text-align: left;
}

.annajm-footer .annajm-footer__pitch {
  max-width: 34ch;
  margin-top: 12px;
  color: var(--af-text);
}

.annajm-footer .annajm-footer__facts {
  display: grid;
  gap: 6px;
  margin-top: 18px;
  padding-top: 18px;
  border-top: 1px solid var(--af-line);
  font-size: 0.875rem;
}

.annajm-footer .annajm-footer__facts li {
  position: relative;
  padding-left: 16px;
}

.annajm-footer .annajm-footer__facts li::before {
  content: "";
  position: absolute;
  top: 0.62em;
  left: 0;
  width: 6px;
  height: 6px;
  background: var(--af-gold);
  transform: rotate(45deg);
}

.annajm-footer .annajm-footer__mail {
  color: var(--af-text-strong);
  text-decoration: underline;
  text-decoration-color: var(--af-gold);
  text-underline-offset: 3px;
  overflow-wrap: anywhere;
}


/* -------------------------------------------------------------------------
   4. COLONNES DE LIENS
   ------------------------------------------------------------------------- */
.annajm-footer .annajm-footer__title {
  margin-bottom: 14px;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  line-height: 1.3;
  text-transform: uppercase;
  color: var(--af-gold-soft);
}

.annajm-footer .annajm-footer__links {
  display: grid;
  gap: 2px;
}

.annajm-footer .annajm-footer__links a {
  display: inline-block;
  padding: 5px 0;
  line-height: 1.4;
  color: var(--af-text);
}

.annajm-footer .annajm-footer__links a:hover {
  color: var(--af-gold-soft);
}


/* -------------------------------------------------------------------------
   5. BARRE BASSE
   ------------------------------------------------------------------------- */
.annajm-footer .annajm-footer__bottom {
  padding: 18px 0;
  background: var(--af-navy-deep);
  box-shadow: 0 0 0 100vmax var(--af-navy-deep);
  font-size: 0.8125rem;
  color: var(--af-text-bar);
}

.annajm-footer .annajm-footer__bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px 24px;
}

.annajm-footer .annajm-footer__legal ul {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 20px;
}

.annajm-footer .annajm-footer__legal a {
  display: inline-block;
  padding: 4px 0;
  color: var(--af-text-bar);
  text-decoration: underline;
  text-decoration-color: rgba(212, 165, 116, 0.5);
  text-underline-offset: 3px;
}

.annajm-footer .annajm-footer__legal a:hover {
  color: var(--af-gold-soft);
}

.annajm-footer .annajm-footer__credit a {
  color: var(--af-text-strong);
}

.annajm-footer .annajm-footer__credit a:hover {
  color: var(--af-gold-soft);
}

.annajm-footer .annajm-footer__credit strong {
  font-weight: 700;
  letter-spacing: 0.04em;
}


/* -------------------------------------------------------------------------
   6. RESPONSIVE
   ------------------------------------------------------------------------- */
@media (max-width: 960px) {
  .annajm-footer .annajm-footer__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .annajm-footer .annajm-footer__brand {
    grid-column: 1 / -1;
  }

  .annajm-footer .annajm-footer__pitch {
    max-width: 52ch;
  }
}

@media (max-width: 600px) {
  .annajm-footer .annajm-footer__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 32px 20px;
  }

  .annajm-footer .annajm-footer__links a {
    padding: 7px 0;               /* cibles tactiles plus hautes */
  }

  .annajm-footer .annajm-footer__bar {
    flex-direction: column;
    align-items: flex-start;
  }
}

@media (max-width: 359px) {
  .annajm-footer .annajm-footer__grid {
    grid-template-columns: minmax(0, 1fr);
  }
}


/* -------------------------------------------------------------------------
   7. BANDEAU SUPÉRIEUR DE L'EN-TÊTE (élément HTML Kadence)
   ------------------------------------------------------------------------- */
.header-top-offer {
  font-size: 0.8125rem;
  line-height: 1.4;
  color: #C9D2DB;
}

.header-top-offer em {
  font-style: italic;
  color: #E6BF8A;
}

.header-top-offer strong {
  font-weight: 600;
  color: #FEFCF8;
}

.header-top-offer a {
  color: inherit;
  text-decoration: underline;
  text-decoration-color: rgba(230, 191, 138, 0.6);
  text-underline-offset: 3px;
}

.header-top-offer a:hover {
  color: #FEFCF8;
}

@media (max-width: 600px) {
  .header-top-offer__extra {
    display: none;
  }
}

@media (max-width: 480px) {
  .header-top-offer {
    font-size: 0.75rem;
  }
}


/* -------------------------------------------------------------------------
   8. ACCESSIBILITÉ ET IMPRESSION
   ------------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  .annajm-footer *,
  .annajm-footer *::before,
  .annajm-footer *::after {
    transition: none !important;
  }
}

@media print {
  .annajm-footer .annajm-footer__main,
  .annajm-footer .annajm-footer__bottom {
    background: none;
    box-shadow: none;
    color: #000;
  }
}