/* ============================================================
   LAMaFloO Child — feuille de style
   Toutes les classes personnalisées sont préfixées "lam-" pour ne
   jamais entrer en collision avec les classes du thème parent Astra
   ou des extensions. Reprend telle quelle la maquette Phase 2 validée.
   ============================================================ */

:root{
  --lam-sage:#A2BBB2;
  --lam-teal:#0E6973;
  --lam-raspberry:#AA4465;
  --lam-indigo:#295073;
  --lam-ink:#1a1a1a;
  --lam-paper:#ffffff;
  --lam-paper-soft:#F6F8F7;

  /* ==== LARGEUR DU CONTENU ====
     Astra applique par défaut une largeur de conteneur de 1200px
     (Apparence > Personnaliser > Général > Conteneur). La maquette
     validée en Phase 2 a été dessinée pour une colonne de contenu de
     1100px — un peu plus resserrée, pour garder les proportions du
     hero et des bandeaux telles que validées. Cette variable ramène
     la colonne de contenu (pas l'en-tête, qui reste en pleine largeur)
     à cette largeur ; à ajuster ici si besoin, sans toucher au reste. */
  --lam-content-width:1100px;

  /* ==== PHOTO DU HERO ====
     Aucun réglage ici : la photo se change directement dans l'éditeur
     de blocs en cliquant sur l'image du pattern "Hero — Photo
     circulaire" puis « Remplacer ». C'est la manière native et la
     plus simple de la rendre personnalisable, sans toucher au code. */
}

/* ---- Typographie de marque ---- */
h1, h2, h3, h4, .lam-eyebrow, .wp-block-button__link{
  font-family: "Baloo 2", Georgia, serif;
}

/* ---- En-tête : CTA "Nous suivre" dans le menu ----
   S'applique à un élément de menu (Apparence > Menus) auquel on a
   donné la classe CSS "lam-nav-cta" dans les options d'écran. */
.menu-item.lam-nav-cta > a{
  background:var(--lam-teal);
  color:#fff !important;
  border-radius:999px;
  padding:8px 20px !important;
  font-weight:700;
  font-family:"Baloo 2", Georgia, serif;
}
.menu-item.lam-nav-cta > a:hover{ background:var(--lam-indigo); }

/* ---- Hero à photo circulaire ---- */
.lam-hero{
  background:linear-gradient(180deg,#E4ECE8 0%, #F6F8F7 100%);
  padding:56px 32px;
  border-radius:24px;
  align-items:center;
  gap:56px;
}
.lam-hero-visual{
  position:relative;
  flex:0 0 auto;
  width:320px;
}
.lam-hero-visual::before{
  content:"";
  position:absolute;
  top:-22px; left:-22px;
  width:100%; height:100%;
  border-radius:50%;
  background:var(--lam-teal);
  z-index:0;
}
.lam-hero-photo{ position:relative; z-index:1; margin:0; }
.lam-hero-photo img{
  border-radius:50%;
  aspect-ratio:1/1;
  object-fit:cover;
  box-shadow:0 24px 48px rgba(14,105,115,.22);
}
.lam-hero-copy{ flex:1 1 420px; }
.lam-eyebrow{
  display:inline-block;
  color:var(--lam-teal);
  background:#fff;
  border:1px solid var(--lam-sage);
  padding:6px 16px;
  border-radius:999px;
  font-size:.78rem;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.lam-hero-copy h1{ color:var(--lam-teal); font-size:2.4rem; line-height:1.25; max-width:640px; }
.lam-hero-actions{ gap:14px; }

/* ---- Boutons ---- */
.lam-btn-primary .wp-block-button__link{
  background:var(--lam-sage); color:var(--lam-ink);
  border-radius:999px; font-weight:700; box-shadow:0 6px 18px rgba(162,187,178,.55);
}
.lam-btn-outline .wp-block-button__link{
  background:transparent; color:var(--lam-teal);
  border:2px solid var(--lam-teal); border-radius:999px; font-weight:700;
}
.lam-btn-outline .wp-block-button__link:hover{ background:var(--lam-teal); color:#fff; }
.lam-btn-raspberry .wp-block-button__link{
  background:var(--lam-raspberry); color:#fff; border-radius:999px; font-weight:700;
}

/* ---- Barre de navigation rapide (icônes) ---- */
.lam-quick-nav{
  background:#fff; border-radius:20px; overflow:hidden;
  box-shadow:0 10px 30px rgba(14,105,115,.12);
}
.lam-quick-nav .wp-block-column{
  padding:22px 24px !important;
  border-right:1px solid #eef2f0;
}
.lam-quick-nav .wp-block-column:last-child{ border-right:none; }
.lam-quick-nav a{ text-decoration:none; color:var(--lam-ink); display:block; }
.lam-quick-nav a:hover{ color:var(--lam-teal); }
.lam-quick-nav .lam-qn-label{
  display:block; font-size:.72rem; text-transform:uppercase; letter-spacing:.04em;
  color:var(--lam-raspberry); font-weight:700; margin-bottom:2px;
}
.lam-quick-nav .lam-qn-title{ font-family:"Baloo 2",Georgia,serif; font-size:1rem; font-weight:700; }

/* ---- Road book : carrousel horizontal ---- */
.lam-roadbook{
  display:flex; gap:20px; overflow-x:auto; padding:6px 6px 18px;
  scroll-snap-type:x proximity; -webkit-overflow-scrolling:touch;
}
.lam-roadbook-card{
  flex:0 0 300px; scroll-snap-align:start;
  background:var(--lam-paper-soft); border-radius:20px; overflow:hidden; position:relative;
}
.lam-roadbook-card img{ height:190px; width:100%; object-fit:cover; margin:0; }
.lam-roadbook-tag{
  position:absolute; left:14px; top:150px; z-index:2;
  background:var(--lam-teal); color:#fff !important; font-size:.72rem; font-weight:700;
  text-transform:uppercase; letter-spacing:.04em; padding:5px 12px; border-radius:999px;
}
.lam-roadbook-card .lam-roadbook-body{ padding:20px; }
.lam-roadbook-card h4{ color:var(--lam-teal); margin:0 0 8px; font-size:1.1rem; }
.lam-roadbook-card a{ font-weight:700; color:var(--lam-teal); }

/* ---- Journal de bord : timeline verticale ---- */
.lam-timeline{
  position:relative; padding-left:28px; border-left:3px solid var(--lam-sage);
}
.lam-entry{ position:relative; padding-bottom:8px; margin-bottom:28px; }
.lam-entry::before{
  content:""; position:absolute; left:-38px; top:4px; width:14px; height:14px;
  border-radius:50%; background:var(--lam-teal); border:3px solid #fff; box-shadow:0 0 0 2px var(--lam-sage);
}
.lam-entry-date{
  font-size:.8rem; color:var(--lam-raspberry); font-weight:700; text-transform:uppercase; letter-spacing:.04em;
}
.lam-entry h4{ color:var(--lam-teal); margin:6px 0 8px; }
.lam-entry a{ font-weight:700; color:var(--lam-teal); }
.lam-entry-photo{
  display:flex; flex-wrap:wrap; gap:20px; align-items:flex-start;
  background:var(--lam-paper-soft); border-radius:16px; padding:20px;
}
.lam-entry-photo img{ flex:0 0 200px; width:200px; height:150px; object-fit:cover; border-radius:12px; margin:0; }

/* ---- Encadré "à compléter" (honnêteté de contenu) ---- */
.lam-note-box{
  color:#9a5c14; background:#FFF4E5; border:1px dashed #E0A94B;
  padding:14px 18px; border-radius:10px; font-size:.9rem;
}
.lam-placeholder-photo{
  display:flex; align-items:center; justify-content:center; text-align:center;
  color:#6b7a75; background:repeating-linear-gradient(135deg,#EDF3F1,#EDF3F1 10px,#E3ECE8 10px,#E3ECE8 20px);
  border:1px dashed #B9C9C2; font-size:.85rem; padding:12px; border-radius:12px; min-height:150px;
}

/* ---- Section de soutien / don (cta-section) ---- */
.lam-support{
  background:var(--lam-indigo); color:#fff; border-radius:24px; padding:44px; text-align:center;
}
.lam-support h2{ color:#fff; margin:0 0 10px; }
.lam-support .lam-fine-print{ font-size:.78rem; opacity:.75; max-width:600px; margin:16px auto 0; }

/* ---- Fiche véhicule ---- */
.lam-vehicle-card{
  display:flex; flex-wrap:wrap; gap:32px; align-items:center;
  background:var(--lam-paper-soft); border-radius:24px; padding:36px;
}
.lam-vehicle-card img{ flex:1 1 340px; min-width:280px; border-radius:16px; object-fit:cover; margin:0; }
.lam-vehicle-card .lam-vehicle-text{ flex:1 1 340px; }
.lam-vehicle-card h3{ color:var(--lam-teal); margin:0 0 12px; }

/* ---- Grille de portraits ---- */
.lam-people-grid{ gap:24px !important; }
.lam-person-card{
  background:var(--lam-paper-soft); border-radius:18px; overflow:hidden; padding:20px;
}
.lam-person-card h3{ color:var(--lam-teal); margin:0 0 8px; font-size:1.1rem; }

/* ---- Teasers (bas de page d'accueil) ---- */
.lam-teasers{ gap:24px !important; }
.lam-teaser{
  background:var(--lam-paper-soft); border-radius:16px; overflow:hidden; text-align:center; display:block;
  text-decoration:none; color:var(--lam-ink);
}
.lam-teaser img{ height:170px; width:100%; object-fit:cover; margin:0; }
.lam-teaser .lam-teaser-label{ padding:20px; }
.lam-teaser .lam-teaser-label strong{ display:block; color:var(--lam-teal); font-family:"Baloo 2",Georgia,serif; font-size:1.15rem; margin-bottom:4px; }

/* ---- Largeur de la colonne de contenu ----
   .entry-content est le conteneur généré par Astra autour de tout le
   contenu des pages (là où vivent nos patterns) ; .lam-container est
   la même largeur, utilisée explicitement dans le bandeau newsletter
   (template-parts/footer-newsletter.php) pour que le pied de page
   s'aligne avec le reste du contenu plutôt qu'avec le conteneur plus
   large (1200px) d'Astra. */
.entry-content,
.lam-container{
  max-width:var(--lam-content-width) !important;
  margin-left:auto !important;
  margin-right:auto !important;
}

/* ---- Bannière de page intérieure ---- */
.lam-page-header{
  position:relative; border-radius:24px; overflow:hidden; padding:64px 40px; color:#fff;
  background:linear-gradient(180deg, rgba(14,105,115,.15) 0%, rgba(10,30,32,.75) 100%), var(--lam-teal);
  background-size:cover; background-position:center;
}
.lam-page-header.has-photo{ background-blend-mode:multiply; }
.lam-page-header .lam-breadcrumb{ font-size:.82rem; opacity:.85; margin-bottom:10px; }
.lam-page-header .lam-breadcrumb a{ color:#fff; }
.lam-page-header h1{ color:#fff; margin:0 0 8px; }

/* ---- Fil "étape suivante" ---- */
.lam-next-step{
  display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:20px;
  background:var(--lam-paper-soft); border-radius:18px; padding:24px 28px;
}
.lam-next-step .lam-label{ font-size:.8rem; text-transform:uppercase; letter-spacing:.05em; color:var(--lam-raspberry); font-weight:700; }
.lam-next-step h4{ color:var(--lam-teal); margin:4px 0 0; }

/* ---- Pied de page : newsletter + réseaux (template-part) ---- */
.lam-newsletter-band{ background:var(--lam-indigo); color:#fff; padding:44px 32px; border-radius:0; }
.lam-newsletter-band h2{ color:#fff; margin:0 0 4px; }
.lam-newsletter-band .lam-sub{ opacity:.85; margin:0; }
.lam-newsletter-form{ display:flex; gap:10px; flex-wrap:wrap; max-width:440px; }
.lam-newsletter-form input[type="email"]{ flex:1 1 220px; border:none; border-radius:999px; padding:13px 18px; font-size:.95rem; }
.lam-newsletter-form button{ border:none; border-radius:999px; padding:13px 24px; font-weight:700; font-family:"Baloo 2",Georgia,serif; background:var(--lam-sage); color:var(--lam-ink); cursor:pointer; }
.lam-newsletter-form .lam-form-msg{ width:100%; font-size:.82rem; margin-top:2px; }
.lam-social-row{ display:flex; gap:14px; align-items:center; flex-wrap:wrap; }
.lam-social-icon{
  width:38px; height:38px; border-radius:50%; background:rgba(255,255,255,.14);
  border:1px solid rgba(255,255,255,.3); display:flex; align-items:center; justify-content:center; color:#fff;
}
.lam-social-note{ font-size:.72rem; opacity:.7; }

/* ---- Responsive ---- */
@media (max-width:781px){
  .lam-hero{ flex-direction:column; text-align:center; padding:32px 24px; }
  .lam-hero-copy{ text-align:center; }
  .lam-hero-visual{ width:220px; margin:0 auto; }
  .lam-hero-actions{ justify-content:center; }
  .lam-quick-nav .wp-block-column{ border-right:none; border-bottom:1px solid #eef2f0; }
  .lam-vehicle-card{ flex-direction:column; }
  .lam-page-header{ padding:44px 24px; }
}