/*
Theme Name: DAA International Child
Theme URI: https://daainternational.org
Template: hello-elementor
Description: Thème enfant du thème gratuit Hello Elementor, appliquant la charte graphique MasterBrand DAA International (Bleu Nuit / Or Africain) et fournissant une bibliothèque d'éléments réutilisables (boutons, cartes satellites, badge Sovereign Trust Index, bloc floutage tactique, etc.). À installer sur chaque site de l'écosystème DAA (daainternational.org, developperautrement.net, daacademy.org, odacity.org, developperautrement.cm), avec la variable --daa-accent-secondaire ajustée par satellite.
Version: 1.0.0
Author: DAA International
Text Domain: daa-child
*/

/* ==========================================================================
   1. VARIABLES DE MARQUE — CHARTE GRAPHIQUE MASTERBRAND DAA
   Ces valeurs doivent être répliquées à l'identique dans Elementor
   (Site Settings > Global Colors / Global Fonts) pour que les widgets
   natifs Elementor (non couverts par ce fichier) restent cohérents.
   ========================================================================== */
:root{
  /* Palette principale (commune à tous les satellites) */
  --daa-bleu-nuit: #0D1B2A;
  --daa-or: #C8A84B;
  --daa-blanc: #FFFFFF;

  /* Palette secondaire — À AJUSTER PAR SATELLITE avant mise en prod :
     DAA Media (.net)      : #1D6B4A (vert émeraude)
     DAA International     : #0D1B2A (pas de secondaire, garder l'or)
     DAA Academy           : à définir
     DAA Connect           : à définir
     DAA Cameroun          : à définir */
  --daa-accent-secondaire: #1D6B4A;

  /* Typographie */
  --daa-font-titres: 'Montserrat', 'Inter', sans-serif;
  --daa-font-corps: 'Lora', Georgia, serif;

  /* Espacements standard */
  --daa-radius: 6px;
  --daa-ombre: 0 8px 24px rgba(13, 27, 42, 0.12);
}

body, p, li, blockquote {
  font-family: var(--daa-font-corps);
}
h1, h2, h3, h4, h5, h6, .elementor-heading-title {
  font-family: var(--daa-font-titres);
}

/* ==========================================================================
   2. HEADER COMMUN
   Structure attendue (construite dans Elementor Theme Builder si Pro,
   sinon en haut de chaque page) : logo à gauche, nav au centre,
   lien "DAA International" à droite. Fond bleu nuit sur tous les sites.
   ========================================================================== */
.daa-header{
  background: var(--daa-bleu-nuit);
}
.daa-header .daa-header__lien-hub{
  color: var(--daa-or);
  font-family: var(--daa-font-titres);
  font-weight: 600;
  font-size: 13px;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  text-decoration: none;
  border: 1px solid var(--daa-or);
  padding: 8px 18px;
  border-radius: 999px;
  transition: all .2s ease;
}
.daa-header .daa-header__lien-hub:hover{
  background: var(--daa-or);
  color: var(--daa-bleu-nuit);
}
.daa-header nav a{
  color: var(--daa-blanc);
  font-family: var(--daa-font-titres);
  font-weight: 500;
}
.daa-header nav a:hover{
  color: var(--daa-or);
}

/* ==========================================================================
   3. FOOTER COMMUN
   Bloc "L'écosystème DAA" + tagline + réseaux sociaux DAA International.
   ========================================================================== */
.daa-footer{
  background: var(--daa-bleu-nuit);
  color: var(--daa-blanc);
  padding: 64px 0 32px;
}
.daa-footer a{
  color: var(--daa-or);
  text-decoration: none;
}
.daa-footer a:hover{
  text-decoration: underline;
}
.daa-footer__tagline{
  font-family: var(--daa-font-titres);
  font-size: 13px;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: rgba(255,255,255,0.6);
  margin-top: 32px;
}
.daa-footer__ecosysteme-titre{
  font-family: var(--daa-font-titres);
  font-size: 13px;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--daa-or);
  margin-bottom: 12px;
}

/* ==========================================================================
   4. BOUTONS DAA
   Classes à ajouter manuellement dans l'onglet "Avancé > CSS Classes"
   de n'importe quel bouton Elementor.
   ========================================================================== */
.daa-btn{
  display: inline-block;
  padding: 14px 32px;
  border-radius: 4px;
  font-family: var(--daa-font-titres);
  font-weight: 600;
  font-size: 14px;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  text-decoration: none !important;
  transition: all .2s ease;
  cursor: pointer;
}
.daa-btn-primaire{
  background: var(--daa-or);
  color: var(--daa-bleu-nuit) !important;
  border: 2px solid var(--daa-or);
}
.daa-btn-primaire:hover{
  background: transparent;
  color: var(--daa-or) !important;
}
.daa-btn-secondaire{
  background: transparent;
  color: var(--daa-blanc) !important;
  border: 2px solid var(--daa-blanc);
}
.daa-btn-secondaire:hover{
  background: var(--daa-blanc);
  color: var(--daa-bleu-nuit) !important;
}

/* ==========================================================================
   5. CARTE SATELLITE DAA
   Pour présenter DAA Media / DAA Academy / DAA Connect / DAA Cameroun
   sur daainternational.org, ou une offre/fiche bailleur sur OdaFunding.
   ========================================================================== */
.daa-carte{
  border: 1px solid rgba(13,27,42,0.1);
  border-radius: var(--daa-radius);
  padding: 32px;
  background: var(--daa-blanc);
  transition: box-shadow .2s ease, transform .2s ease;
}
.daa-carte:hover{
  box-shadow: var(--daa-ombre);
  transform: translateY(-2px);
}
.daa-carte__badge{
  display: inline-block;
  background: var(--daa-bleu-nuit);
  color: var(--daa-or);
  font-family: var(--daa-font-titres);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 1px;
  text-transform: uppercase;
  padding: 4px 14px;
  border-radius: 999px;
  margin-bottom: 16px;
}

/* ==========================================================================
   6. BLOC FLOUTAGE TACTIQUE
   Le contenu premium reste visuellement présent mais flouté,
   avec un cadenas doré. Ne jamais remplacer par un mur vide.
   Utiliser via le shortcode [daa_floutage] (voir functions.php)
   ou en appliquant manuellement les classes ci-dessous à deux
   conteneurs Elementor imbriqués (position relative / absolue).
   ========================================================================== */
.daa-floutage{
  position: relative;
  overflow: hidden;
  border-radius: var(--daa-radius);
}
.daa-floutage__contenu{
  filter: blur(6px);
  user-select: none;
  pointer-events: none;
}
.daa-floutage__overlay{
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 24px;
  background: rgba(13,27,42,0.55);
  color: var(--daa-blanc);
}
.daa-floutage__cadenas{
  font-size: 28px;
  color: var(--daa-or);
  margin-bottom: 8px;
}
.daa-floutage__overlay p{
  font-family: var(--daa-font-titres);
  font-size: 14px;
  margin: 0;
}

/* ==========================================================================
   7. BADGE SOVEREIGN TRUST INDEX (🌍 1 à 5)
   Utiliser via le shortcode [daa_trust_index level="4"]
   ========================================================================== */
.daa-trust-index{
  font-size: 20px;
  letter-spacing: 3px;
  white-space: nowrap;
}
.daa-trust-index__empty{
  opacity: 0.25;
  filter: grayscale(1);
}

/* ==========================================================================
   8. BLOC CTA NEWSLETTER (L'Essentiel)
   ========================================================================== */
.daa-cta-newsletter{
  background: var(--daa-bleu-nuit);
  color: var(--daa-blanc);
  border-radius: var(--daa-radius);
  padding: 40px;
  text-align: center;
}
.daa-cta-newsletter h3{
  color: var(--daa-blanc);
  margin-top: 0;
}
.daa-cta-newsletter p{
  color: rgba(255,255,255,0.75);
}