/* ===========================================================
   DA dédiée — La Petite Cantine · « Caliente Brasil »
   Tropical vibrant : vert jungle · corail · rose chaud · jaune
   feuilles, vagues festives, coucher de soleil.
   Chargée uniquement sur /la-petite-cantine (override de style.css)
   =========================================================== */
@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,500;9..144,600;9..144,700&family=Caveat:wght@600;700&family=Mulish:wght@400;500;600;700;800&display=swap');

:root {
  --green:       #0f6b43;   /* vert jungle (surfaces sombres) */
  --green-deep:  #094d30;
  --orange:      #ff6b35;   /* corail (accent / CTA) */
  --orange-dark: #e14e1d;
  --pink:        #f0356e;   /* rose chaud */
  --pink-soft:   #ffe2d2;   /* pêche clair */
  --cream:       #fff6e9;   /* crème solaire */
  --ink:         #20342a;
  --muted:       #6f6557;
  --border:      #f2e2cf;
  --shadow:      0 16px 36px rgba(15, 107, 67, 0.14);
  --shadow-lg:   0 28px 64px rgba(15, 107, 67, 0.24);

  /* extras tropicaux */
  --yellow:      #ffc233;
  --turq:        #14b8a6;

  /* vagues recolorées (crème solaire) */
  --wave-top:    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 48' preserveAspectRatio='none'%3E%3Cpath d='M0,0 L1440,0 L1440,26 C1080,50 360,2 0,26 Z' fill='%23fff6e9'/%3E%3C/svg%3E");
  --wave-bottom: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 48' preserveAspectRatio='none'%3E%3Cpath d='M0,48 L1440,48 L1440,22 C1080,-2 360,46 0,22 Z' fill='%23fff6e9'/%3E%3C/svg%3E");

  /* feuilles tropicales (décor) */
  --leaf-green:  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 140'%3E%3Cpath d='M60 138 C58 96 40 70 8 54 C40 56 52 44 56 6 C60 30 62 30 64 6 C68 44 80 56 112 54 C80 70 62 96 60 138 Z' fill='%230f6b43'/%3E%3C/svg%3E");
  --leaf-turq:   url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 140'%3E%3Cpath d='M60 138 C58 96 40 70 8 54 C40 56 52 44 56 6 C60 30 62 30 64 6 C68 44 80 56 112 54 C80 70 62 96 60 138 Z' fill='%2314b8a6'/%3E%3C/svg%3E");
  --leaf-white:  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 140'%3E%3Cpath d='M60 138 C58 96 40 70 8 54 C40 56 52 44 56 6 C60 30 62 30 64 6 C68 44 80 56 112 54 C80 70 62 96 60 138 Z' fill='%23ffffff'/%3E%3C/svg%3E");
}

/* ---------- Typographie ---------- */
h1, h2, h3,
.brand__name, .hero__title, .section-head__title, .intro__title,
.card__name, .infos__block h3 {
  font-family: 'Fraunces', Georgia, serif !important;
  font-weight: 600 !important;
  letter-spacing: -0.015em;
}
body { font-family: 'Mulish', system-ui, sans-serif; }
.btn, .card__link, .event__date, .link-arrow {
  font-family: 'Mulish', system-ui, sans-serif !important; font-weight: 800 !important;
}
.btn { text-transform: uppercase; letter-spacing: .07em; }

/* Eyebrows manuscrits (touche caliente) */
.eyebrow {
  font-family: 'Caveat', cursive !important;
  text-transform: none; letter-spacing: 0; font-weight: 700;
  font-size: 1.6rem; color: var(--pink);
}
.agenda .eyebrow { color: var(--yellow); }

/* En-tête : vert jungle (le vert d'origine est codé en dur dans style.css) */
.site-header { background: rgba(9, 77, 48, 0.96); }

/* ---------- Hero : coucher de soleil caliente ---------- */
.hero__overlay {
  background: linear-gradient(155deg, rgba(240,53,110,.42), rgba(255,107,53,.40) 48%, rgba(9,77,48,.78));
}
.hero__kicker {
  background: var(--yellow); color: var(--green-deep);
  border-radius: 999px; padding: .4rem 1rem;
  transform: rotate(-2deg); display: inline-block;
}
.hero__title { text-shadow: 0 3px 28px rgba(9,77,48,.5); }

/* ---------- Vagues festives sous les titres ---------- */
.squiggle,
.section-head__title::after, .hero__title::after, .intro__title::after {
  width: 170px !important; height: 18px !important; border-radius: 0;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='170' height='18' viewBox='0 0 170 18'%3E%3Cpath d='M3,10 Q16,1 29,10 T55,10 T81,10 T107,10 T133,10 T159,10' fill='none' stroke='%23ff6b35' stroke-width='5' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center / contain !important;
}
.agenda .section-head__title::after {
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='170' height='18' viewBox='0 0 170 18'%3E%3Cpath d='M3,10 Q16,1 29,10 T55,10 T81,10 T107,10 T133,10 T159,10' fill='none' stroke='%23ffc233' stroke-width='5' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center / contain !important;
}

/* ---------- Décor : feuilles tropicales ---------- */
.intro { position: relative; overflow: hidden; background: var(--pink-soft); }
.intro::before {
  content: ""; position: absolute; top: -40px; right: -30px; width: 230px; height: 270px;
  background: var(--leaf-green) no-repeat center / contain; opacity: .14; transform: rotate(28deg);
  pointer-events: none;
}
.intro::after {
  content: ""; position: absolute; bottom: -50px; left: -40px; width: 200px; height: 240px;
  background: var(--leaf-turq) no-repeat center / contain; opacity: .12; transform: rotate(-18deg);
  pointer-events: none;
}

/* Bandeau programmation : motif feuilles vibrant (re-activé) */
.agenda { overflow: hidden; }
.agenda .container::after {
  display: block !important; content: "" !important;
  position: absolute; right: -50px; bottom: -70px; width: 380px; height: 440px;
  background: var(--leaf-white) no-repeat center / contain !important; opacity: .07 !important;
  transform: rotate(18deg); pointer-events: none;
}
.agenda::before { background: var(--leaf-white) no-repeat 8% center / 90px, var(--wave-top) no-repeat center / 100% 100%; }

/* Galerie & infos : touches de couleur */
.gallery { position: relative; overflow: hidden; }
.gallery::before {
  content: ""; position: absolute; top: 20px; left: -50px; width: 200px; height: 240px;
  background: var(--leaf-green) no-repeat center / contain; opacity: .10; transform: rotate(-22deg);
  pointer-events: none;
}
.infos { position: relative; overflow: hidden; background: linear-gradient(180deg, var(--cream), var(--pink-soft)); }
.infos__block { border-top-color: var(--pink); }
.infos__block--contact { border-top-color: var(--yellow); }
.link-arrow { border-bottom-color: var(--orange); }

/* Tags d'événements plus colorés */
.event__tag { background: rgba(255,194,51,.16); border-color: rgba(255,194,51,.4); color: #fff; }
.event__date { color: var(--yellow); }