/*
Theme Name:   GeneratePress Child - Landes Camping
Theme URI:    https://example.com
Description:  Thème enfant de GeneratePress reproduisant fidèlement la maquette HTML "Landes Camping" (header, hero, personas, articles, carte, réassurance, newsletter, footer).
Author:       Votre agence
Template:     generatepress
Version:      1.1.0
Text Domain:  generatepresse-child
*/

/* ==========================================================================
   1) IMPORT DES POLICES (identiques au fichier fourni)
   ========================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@500;600&family=Lora:ital,wght@1,400&family=Inter:wght@400;500&display=swap');

/* ==========================================================================
   2) VARIABLES DE LA CHARTE GRAPHIQUE (copiées à l'identique du :root fourni)
   ========================================================================== */
:root{
  --lc-bg-page:#FAF7F2;
  --lc-bg-card:#FFFFFF;
  --lc-navy:#0D3B57;
  --lc-text:#1F2937;
  --lc-gray:#6B7280;
  --lc-blue:#1D6FA5;
  --lc-blue-accent:#185FA5;
  --lc-blue-light:#378ADD;
  --lc-green:#2E6B3D;
  --lc-green-accent:#3B6D11;
  --lc-green-soft:#639922;
  --lc-gold:#E2A431;
  --lc-gold-light:#EFC069;
  --lc-brown:#854F0B;
  --lc-radius:16px;
  --lc-border:#E7E2D8;
}

/* ==========================================================================
   3) BASE
   ========================================================================== */
body{
  background:var(--lc-bg-page);
  color:var(--lc-text);
  font-family:'Inter',sans-serif;
  -webkit-font-smoothing:antialiased;
}
a{ color:inherit; text-decoration:none; }
h1,h2,h3,.lc-brand,
.lc-hero-title,
h1.wp-block-heading,
h2.wp-block-heading,
h3.wp-block-heading{
  font-family:'Poppins',sans-serif;
  font-weight:600;
  color:var(--lc-navy);
  letter-spacing:-0.01em;
  margin:0;
}

/* Boutons génériques (identiques aux classes .btn-primary / .btn-outline du fichier) */
.lc-btn-primary .wp-block-button__link,
a.lc-btn-primary{
  background:var(--lc-blue);
  color:#fff;
  border-radius:999px;
  padding:12px 22px;
  font-weight:500;
  font-size:14px;
  border:none;
  display:inline-block;
}
.lc-btn-primary .wp-block-button__link:hover,
a.lc-btn-primary:hover{ background:var(--lc-blue-accent); }

.lc-btn-outline .wp-block-button__link{
  background:#fff;
  color:var(--lc-navy);
  border:1px solid var(--lc-border);
  border-radius:999px;
  padding:12px 22px;
  font-weight:500;
  font-size:14px;
}

/* Conteneur : le fichier original utilise .wrap { max-width:1120px; padding:0 24px } */
.grid-container{ max-width:1120px; }

/* ==========================================================================
   4) HEADER (entête du site)
   Le thème GeneratePress (version gratuite) n'est PAS un thème "full site
   editing" : le header n'est pas une composition Gutenberg mais une zone
   gérée par le thème (logo + menu via le Customizer). On stylise donc ici
   les éléments natifs de GeneratePress pour qu'ils reproduisent le header
   du fichier fourni. Voir le README pour la configuration pas à pas.
   ========================================================================== */
.site-logo, .site-title, .main-title{
  font-family:'Poppins',sans-serif;
  font-weight:600;
  color:var(--lc-navy);
}
#site-navigation .main-nav ul li a,
.main-navigation .main-nav ul li a{
  font-family:'Inter',sans-serif;
  font-size:14px;
  color:var(--lc-text);
}
#site-navigation .main-nav ul li a:hover,
.main-navigation .main-nav ul li a:hover{ color:var(--lc-blue); }

/* Bouton CTA dans le menu : ajoutez la classe CSS "lc-header-cta" à un
   élément de menu (Apparence > Menus > Options de l'écran > Classes CSS) */
.lc-header-cta > a{
  background:var(--lc-blue);
  color:#fff !important;
  border-radius:999px;
  padding:10px 20px !important;
  font-weight:500;
  margin-left:8px;
}
.lc-header-cta > a:hover{ background:var(--lc-blue-accent); color:#fff !important; }

/* ==========================================================================
   5) HERO — reproduction fidèle du fichier fourni
   .hero{ margin:8px 24px 0; border-radius:24px; padding:72px 40px; }
   ========================================================================== */
.lc-hero{
  background:var(--lc-blue);
  color:#fff;
  padding:72px 40px;
  text-align:center;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:16px;
  margin:8px 24px 0;
  border-radius:24px;
}
/* Variante optionnelle "bord à bord" : ajouter la classe
   additionnelle lc-hero-fullbleed en plus de lc-hero si vous voulez
   le hero pleine largeur comme demandé précédemment. */
.lc-hero.lc-hero-fullbleed{
  margin-left:calc(50% - 50vw);
  margin-right:calc(50% - 50vw);
  margin-top:0;
  border-radius:0;
  width:100vw;
  max-width:100vw;
}
.lc-hero .lc-eyebrow{
  font-size:13px;
  letter-spacing:.06em;
  text-transform:uppercase;
  opacity:.85;
  color:#fff;
  margin:0;
}
.lc-hero .lc-hero-title{
  color:#fff;
  font-size:38px;
  line-height:1.15;
  max-width:640px;
  margin:0 auto;
}
.lc-hero .lc-hero-sub{
  font-family:'Lora',serif;
  font-style:italic;
  font-weight:400;
  font-size:19px;
  line-height:1.5;
  max-width:560px;
  opacity:.95;
  margin:0 auto;
}
.lc-hero-cta{
  display:flex;
  gap:12px;
  margin-top:8px;
  justify-content:center;
}
.lc-hero-cta .lc-btn-primary .wp-block-button__link{
  background:#fff;
  color:var(--lc-navy);
}
.lc-hero-cta .lc-btn-primary .wp-block-button__link:hover{ background:#f0f0f0; }
.lc-hero-cta .lc-btn-ghost .wp-block-button__link{
  background:transparent;
  color:#fff;
  border:1px solid rgba(255,255,255,.5);
  border-radius:999px;
  padding:12px 22px;
  font-weight:500;
  font-size:14px;
}

@media (max-width:820px){
  .lc-hero{ padding:48px 24px; }
  .lc-hero .lc-hero-title{ font-size:28px; }
}

/* ==========================================================================
   6) PADDING VERTICAL DES SECTIONS — le fichier fourni applique
   "section{padding:56px 0}" à chaque bloc de contenu.
   ========================================================================== */
.lc-section{ padding:56px 0; }
.lc-section-label{
  font-size:13px;
  color:var(--lc-gray);
  margin:0 0 16px;
  text-transform:uppercase;
  letter-spacing:.04em;
}

/* ==========================================================================
   7) PERSONAS — grid-template-columns:1fr 1fr; gap:20px
   ========================================================================== */
.lc-personas.wp-block-columns{ gap:20px; }
.lc-persona-card{
  border-radius:var(--lc-radius);
  padding:32px;
  color:#fff;
  min-height:180px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
}
.lc-persona-card.lc-familles{ background:var(--lc-gold); color:#3A2400; }
.lc-persona-card.lc-surf{ background:var(--lc-blue); color:#fff; }
.lc-persona-card h3{ font-size:22px; margin:0 0 8px; }
.lc-persona-card.lc-familles h3{ color:#3A2400; }
.lc-persona-card.lc-surf h3{ color:#fff; }
.lc-persona-card p{ margin:0; font-size:14px; opacity:.9; line-height:1.5; }
.lc-persona-card .lc-link{
  font-size:14px;
  font-weight:500;
  margin-top:20px;
  display:flex;
  align-items:center;
  gap:6px;
}

/* ==========================================================================
   8) ARTICLES — grid-template-columns:repeat(3,1fr); gap:18px
   ========================================================================== */
.lc-articles.wp-block-columns{ gap:18px; }
.lc-article-card{
  background:var(--lc-bg-card);
  border:1px solid var(--lc-border);
  border-radius:var(--lc-radius);
  overflow:hidden;
  padding:0 !important;
}
.lc-article-card .lc-thumb{
  height:110px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  margin:0;
}
.lc-article-card.lc-nature .lc-thumb{ background:var(--lc-green); }
.lc-article-card.lc-surf .lc-thumb{ background:var(--lc-blue); }
.lc-article-card.lc-familles .lc-thumb{ background:var(--lc-gold-light); color:#3A2400; }
.lc-article-card .lc-body{ padding:16px; }
.lc-article-card .lc-tag{
  font-size:11px;
  color:var(--lc-blue);
  font-weight:500;
  text-transform:uppercase;
  letter-spacing:.03em;
  display:block;
  margin-bottom:8px;
}
.lc-article-card h4{
  font-size:15px;
  font-weight:500;
  font-family:'Inter',sans-serif;
  margin:0;
  color:var(--lc-text);
}

/* ==========================================================================
   9) BLOC CARTE / ZONES — pas de padding défini dans le fichier fourni
   ========================================================================== */
.lc-map-block{
  background:var(--lc-green);
  color:#fff;
  border-radius:var(--lc-radius);
  min-height:160px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:8px;
  text-align:center;
}
.lc-map-block h3{ color:#fff; }
.lc-map-block p{ margin:0; font-size:14px; opacity:.9; }

/* ==========================================================================
   10) RÉASSURANCE — grid-template-columns:repeat(3,1fr); gap:16px
   ========================================================================== */
.lc-trust-grid.wp-block-columns{ gap:16px; }
.lc-trust-item{
  background:var(--lc-bg-card);
  border:1px solid var(--lc-border);
  border-radius:var(--lc-radius);
  padding:20px;
  text-align:center;
}
.lc-trust-item .lc-num{
  font-size:24px;
  font-weight:500;
  color:var(--lc-brown);
  font-family:'Inter',sans-serif;
  margin:0;
}
.lc-trust-item p.lc-legend{ margin:6px 0 0; font-size:13px; color:var(--lc-gray); }

/* ==========================================================================
   11) NEWSLETTER
   ========================================================================== */
.lc-newsletter{
  background:var(--lc-blue);
  color:#fff;
  border-radius:var(--lc-radius);
  padding:28px 32px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  flex-wrap:wrap;
}
.lc-newsletter p{ margin:0; font-size:15px; color:#fff; }
.lc-newsletter-form{
  display:flex;
  gap:10px;
  flex:1;
  min-width:280px;
  max-width:420px;
}
.lc-newsletter-form input[type="email"]{
  flex:1;
  border-radius:999px;
  border:none;
  padding:12px 16px;
  font-family:'Inter',sans-serif;
  font-size:14px;
}
.lc-newsletter-form button{
  background:#fff;
  color:var(--lc-navy);
  white-space:nowrap;
  border:none;
  border-radius:999px;
  padding:12px 22px;
  font-weight:500;
  font-size:14px;
  cursor:pointer;
  font-family:'Inter',sans-serif;
}

/* ==========================================================================
   12) FOOTER — 3 colonnes (Destinations / Campings / À propos)
   Le footer GeneratePress gratuit se configure via des widgets
   (Apparence > Personnaliser > Mise en page > Pied de page > Widgets,
   choisir 3 colonnes). On stylise ici les colonnes de widgets pour
   reproduire l'original : border-top, gap 48px, titres en Poppins.
   ========================================================================== */
#footer-widgets,
.site-footer .inside-top-footer{
  border-top:1px solid var(--lc-border);
  padding:32px 0;
  color:var(--lc-gray);
  font-size:13px;
}
#footer-widgets .widget,
.site-footer .widget{
  margin-right:48px;
}
#footer-widgets .widget-title,
.site-footer .widget-title,
.lc-footer-col h5{
  color:var(--lc-navy);
  font-family:'Poppins',sans-serif;
  font-size:13px;
  font-weight:600;
  margin:0 0 10px;
}
#footer-widgets .widget a,
.site-footer .widget a,
.lc-footer-col a{
  display:block;
  margin-bottom:6px;
  color:var(--lc-gray);
}
#footer-widgets .widget a:hover,
.site-footer .widget a:hover,
.lc-footer-col a:hover{ color:var(--lc-blue); }

/* ==========================================================================
   13) RESPONSIVE
   ========================================================================== */
@media (max-width:820px){
  .lc-trust-grid.wp-block-columns,
  .lc-personas.wp-block-columns,
  .lc-articles.wp-block-columns{
    flex-wrap:wrap;
  }
  .lc-trust-grid .wp-block-column,
  .lc-personas .wp-block-column,
  .lc-articles .wp-block-column{
    flex-basis:100% !important;
  }
  #site-navigation .main-nav,
  .main-navigation .main-nav{ display:none; }
}