/* ==========================================================================
   v/12 « Jungle & sable » — palette JUNGLE
   Chargé APRÈS /v/00/site.css : redéfinit les tokens + quelques surcharges.
   Vert jungle profond, sable, terracotta, touche de jaune mangue.
   Titres Bricolage Grotesque, texte Figtree, manuscrit Kaushan conservé.
   ========================================================================== */

:root {
  --bg: #efe2c8;            /* sable */
  --paper: #faf3e3;
  --ink: #16382a;           /* vert jungle profond */
  --teal: #1d4a35;          /* surfaces sombres : hero, footer, notes */
  --teal-deep: #10291d;
  --lagoon: #3b7350;
  --aqua: #bcd7a6;          /* vert tendre (tags « Tu organises ») */
  --coral: #d8704a;         /* terracotta */
  --coral-ink: #2a0c03;
  --coral-text: #a2431f;    /* terracotta lisible sur sable */
  --gold: #f4b62f;          /* jaune mangue : scotch, « Places limitées » */
  --mut: #4c5c4e;
  --line: #dac7a2;
  --grey: #6c766a;
  --peach: #ffd36b;         /* manuscrit sur le vert */
  --white: #ffffff;
  --on-dark: #f8f1df;
  --shadow-color: #16382a;

  --font-title: "Bricolage Grotesque", "Arial Narrow", sans-serif;
  --font-body: "Figtree", system-ui, sans-serif;
  --font-hand: "Kaushan Script", cursive;

  --radius-lg: 22px;
  --radius-md: 16px;
  --radius-sm: 10px;

  /* motif feuilles (SVG inline) */
  --leaves: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240' viewBox='0 0 240 240'%3E%3Cg fill='none' stroke='%2316382a' stroke-width='1.6' stroke-linecap='round'%3E%3Cpath d='M30 70c20-34 58-40 78-30-10 30-46 52-78 30z'/%3E%3Cpath d='M30 70c26-12 50-20 78-30'/%3E%3Cpath d='M150 200c-6-36 18-66 40-72 8 30-10 64-40 72z'/%3E%3Cpath d='M150 200c12-24 24-48 40-72'/%3E%3Cpath d='M170 40c16 6 26 22 22 40-18-4-28-22-22-40z'/%3E%3Cpath d='M50 170c18-4 36 6 42 22-18 6-36-4-42-22z'/%3E%3C/g%3E%3C/svg%3E");
  --leaves-light: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240' viewBox='0 0 240 240'%3E%3Cg fill='none' stroke='%23f8f1df' stroke-width='1.6' stroke-linecap='round'%3E%3Cpath d='M30 70c20-34 58-40 78-30-10 30-46 52-78 30z'/%3E%3Cpath d='M30 70c26-12 50-20 78-30'/%3E%3Cpath d='M150 200c-6-36 18-66 40-72 8 30-10 64-40 72z'/%3E%3Cpath d='M150 200c12-24 24-48 40-72'/%3E%3Cpath d='M170 40c16 6 26 22 22 40-18-4-28-22-22-40z'/%3E%3Cpath d='M50 170c18-4 36 6 42 22-18 6-36-4-42-22z'/%3E%3C/g%3E%3C/svg%3E");
}

/* Fond sable avec feuilles très légères */
body { position: relative; }
body::before {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: var(--leaves) 0 0 / 240px 240px;
  opacity: .07;
}

/* Typo : Bricolage Grotesque grasse, un peu serrée */
h1, h2, h3, .choice__title, .day__title, .day__num, .formula__price {
  font-weight: 800;
  letter-spacing: -0.02em;
}
.hero__avec, .hero__comme { letter-spacing: -0.01em; }
.day__num { font-size: 14px; letter-spacing: 0; }
.btn, .tab, .program summary { font-weight: 700; }

/* Accents terracotta lisibles sur le sable */
:focus-visible { outline-color: var(--coral-text); }
.about__book, .about__promise, .program summary, .formula__price { color: var(--coral-text); }

/* Hero : vert jungle dense à gauche, feuilles en filigrane */
.hero::before {
  background:
    linear-gradient(to top, color-mix(in srgb, var(--teal-deep) 92%, transparent) 0%, transparent 34%),
    linear-gradient(100deg,
      var(--teal) 0%,
      var(--teal) 30%,
      color-mix(in srgb, var(--teal) 86%, transparent) 42%,
      color-mix(in srgb, var(--teal) 28%, transparent) 62%,
      color-mix(in srgb, var(--gold) 8%, transparent) 100%);
}
.hero::after {
  content: ""; position: absolute; inset: 0 55% 0 0; z-index: -1; pointer-events: none;
  background: var(--leaves-light) 0 0 / 260px 260px;
  opacity: .10;
  -webkit-mask-image: linear-gradient(to right, #000 60%, transparent);
  mask-image: linear-gradient(to right, #000 60%, transparent);
}
.hero__comme { border-radius: 4px; }
.choice--avec .choice__icon { background: var(--coral); }
.choice--comme .choice__icon { background: var(--gold); }

/* Cartes un peu plus « carnet d'aventure » */
.trip, .formula { border: 1.5px solid var(--line); }
.trip__media::after {
  background: linear-gradient(to top, color-mix(in srgb, var(--teal-deep) 62%, transparent), transparent 48%);
}
.polaroid { border-radius: 4px; }
.note { border-radius: var(--radius-sm); border-left: 6px solid var(--gold); }

/* Footer feuillage */
.footer { background: var(--teal); position: relative; isolation: isolate; }
.footer::before {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: var(--leaves-light) 0 0 / 240px 240px;
  opacity: .09;
}
.footer__sign { color: var(--peach); }

@media (max-width: 760px) {
  .hero::after { inset: 380px 0 0 0; -webkit-mask-image: none; mask-image: none; }
  .hero::before {
    background: linear-gradient(to bottom,
      color-mix(in srgb, var(--teal) 30%, transparent) 0,
      transparent 100px,
      color-mix(in srgb, var(--teal) 10%, transparent) 250px,
      color-mix(in srgb, var(--teal) 88%, transparent) 370px,
      var(--teal) 460px,
      var(--teal-deep) 100%);
  }
}
