/*
 Theme Name:   Vacher Fruits
 Theme URI:    https://vacher-fruits.ovh
 Description:  Child Theme Divi 5 — Vacher Fruits
 Author:       Creatiic
 Author URI:   https://creatiic.com
 Template:     Divi
 Version:      1.0.0
 Text Domain:  vacher-fruits
*/

/* ═══════════════════════════════════════════
   VARIABLES GLOBALES
═══════════════════════════════════════════ */
:root {
  --vf-vert:   #3a5c2b;
  --vf-vert2:  #4e7a38;
  --vf-amber:  #d4860a;
  --vf-amber2: #f0a832;
  --vf-creme:  #fdf6ec;
  --vf-beige:  #f5ead8;
  --vf-brun:   #7a4f24;
  --vf-txt:    #2b2015;
  --vf-gris:   #6b6460;
  --vf-radius: 10px;
}

/* ═══════════════════════════════════════════
   BODY & TYPOGRAPHIE
═══════════════════════════════════════════ */
body {
  font-family: 'Lato', sans-serif;
  color: var(--vf-txt);
  background: #fff;
}

h1, h2, h3, h4 {
  font-family: 'Playfair Display', serif;
  color: var(--vf-vert);
}

/* ═══════════════════════════════════════════
   HEADER / NAVIGATION DIVI 5
═══════════════════════════════════════════ */
#main-header,
.et-fixed-header {
  background: var(--vf-creme) !important;
  border-bottom: 2px solid var(--vf-beige) !important;
  box-shadow: none !important;
}

/* Menu liens */
#top-menu a,
.et_mobile_menu a {
  color: var(--vf-txt) !important;
  font-family: 'Lato', sans-serif !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: 1px !important;
  text-transform: uppercase !important;
  transition: color .2s !important;
}
#top-menu a:hover { color: var(--vf-amber) !important; }

/* Bouton CTA dans le menu */
#top-menu li.menu-cta a {
  background: var(--vf-amber) !important;
  color: #fff !important;
  padding: 8px 18px !important;
  border-radius: 4px !important;
}
#top-menu li.menu-cta a:hover {
  background: var(--vf-amber2) !important;
}

/* ═══════════════════════════════════════════
   BOUTONS GLOBAUX DIVI
═══════════════════════════════════════════ */
.et_pb_button {
  background: var(--vf-amber) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 5px !important;
  font-family: 'Lato', sans-serif !important;
  font-weight: 700 !important;
  font-size: 14px !important;
  letter-spacing: .5px !important;
  padding: 14px 28px !important;
  transition: background .2s, transform .15s !important;
}
.et_pb_button:hover {
  background: var(--vf-vert) !important;
  transform: translateY(-2px) !important;
}

.et_pb_button_style_2,
.btn-vert {
  background: var(--vf-vert) !important;
}
.et_pb_button_style_2:hover { background: var(--vf-amber) !important; }

/* ═══════════════════════════════════════════
   SECTIONS DIVI — COULEURS DE FOND
═══════════════════════════════════════════ */
.vf-bg-creme { background-color: var(--vf-creme) !important; }
.vf-bg-vert  { background-color: var(--vf-vert)  !important; }
.vf-bg-white { background-color: #fff !important; }

/* ═══════════════════════════════════════════
   HERO SECTION
═══════════════════════════════════════════ */
.vf-hero {
  background: linear-gradient(135deg, var(--vf-vert) 0%, var(--vf-vert2) 60%, #6b9a50 100%) !important;
  padding: 80px 0 90px !important;
}
.vf-hero .et_pb_text * { color: #fff !important; }
.vf-hero h1 { font-size: clamp(32px, 4vw, 52px) !important; line-height: 1.15 !important; }
.vf-hero h1 em { color: var(--vf-amber2) !important; }
.vf-hero p { font-size: 17px !important; opacity: .88; font-weight: 300 !important; }

/* Pastille tag hero */
.vf-hero-tag {
  display: inline-block;
  background: rgba(255,255,255,.15);
  border: 1px solid rgba(255,255,255,.3);
  border-radius: 20px;
  padding: 5px 16px;
  font-size: 12px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: #fff;
  margin-bottom: 16px;
}

/* ═══════════════════════════════════════════
   SECTION LABELS (surtitres)
═══════════════════════════════════════════ */
.vf-label {
  font-size: 12px !important;
  letter-spacing: 3px !important;
  text-transform: uppercase !important;
  color: var(--vf-amber) !important;
  font-weight: 700 !important;
  font-family: 'Lato', sans-serif !important;
}

/* ═══════════════════════════════════════════
   CARDS FAMILLES (3 colonnes)
═══════════════════════════════════════════ */
.vf-famille-card .et_pb_column {
  border-radius: var(--vf-radius);
  overflow: hidden;
  box-shadow: 0 2px 12px rgba(0,0,0,.07);
  transition: transform .2s, box-shadow .2s;
}
.vf-famille-card .et_pb_column:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 28px rgba(0,0,0,.13);
}

/* ═══════════════════════════════════════════
   FOOTER
═══════════════════════════════════════════ */
#main-footer {
  background: var(--vf-vert) !important;
}
#main-footer,
#main-footer p,
#main-footer a,
#main-footer .et_pb_text * {
  color: rgba(255,255,255,.8) !important;
  font-size: 13px !important;
}
#main-footer a:hover { color: var(--vf-amber2) !important; }
.et_pb_footer_bottom_bar { border-top: 1px solid rgba(255,255,255,.15) !important; }

/* ═══════════════════════════════════════════
   RESPONSIVE
═══════════════════════════════════════════ */
@media (max-width: 767px) {
  .vf-hero { padding: 50px 0 60px !important; }
  .vf-hero h1 { font-size: 28px !important; }
}