/* ===== Product Cards (style Harvest adapté Anacaona) ===== */
/* ========= Product Cards — Anacaona (Harvest-like) ========= */

.product-cards{
  display:grid;
  grid-template-columns:1fr;
  gap:clamp(18px,2.2vw,28px);
  margin-block:clamp(18px,3vw,36px);
}

/* carte */
.product-card{
  display:grid;
  grid-template-columns: 340px 1fr;          /* 2 colonnes image + texte */
  min-height:420px;
  background:#fff;                            /* ✅ pas de gris */
  border:1px solid rgba(56,45,34,.22);
  border-radius:var(--radius-lg,18px);
  box-shadow:0 14px 32px rgba(8,11,13,.12);
  overflow:hidden;
  transition:transform .25s ease, box-shadow .25s ease;
}
.product-card:hover{ transform:translateY(-2px); box-shadow:0 18px 40px rgba(8,11,13,.16); }

/* colonne image */
.product-card .pc-img{
  /* léger souffle sans “bandes grises” */
  background: radial-gradient(80% 80% at 20% 10%, rgba(56,52,37,.06), transparent 60%);
}
.product-card .pc-img img{
  display:block; width:100%; height:100%; object-fit:cover;
}

/* colonne texte (fond clair crème) */
.product-card .pc-info{
  display:flex; flex-direction:column;
  background: linear-gradient(180deg, #ffffff, #fff9ee);  /* ✅ ton neutre chaud */
}

/* en-tête */
.pc-head{ padding:clamp(18px,2vw,24px) clamp(18px,2.4vw,28px) 0; background:transparent; }
.pc-head h2{
  font-family:'Playfair Display',serif;
  font-size:clamp(22px,2.2vw,30px);
  color:var(--brand,#383425); margin:0 0 2px;
}
.pc-sub{
  margin:0; text-transform:uppercase; letter-spacing:.18em;
  font-size:.8rem; color:rgba(56,52,37,.55);
}

/* corps */
.pc-body{ padding:6px clamp(18px,2.4vw,28px) 0; }
.pc-body p{ color:var(--muted,#6c665d); line-height:1.7; margin:0 0 .8rem; font-size:1rem; }
.pc-bullets{ margin:.4rem 0 1rem 1.1rem; color:var(--muted,#6c665d); }
.pc-bullets li{ margin:.35rem 0; }
.pc-note{ font-style:italic; }

/* pied */
.pc-cta{ margin-top:auto; padding:0 clamp(18px,2.4vw,28px) clamp(18px,2.4vw,28px); }

/* responsive */
@media (max-width:980px){
  .product-card{ grid-template-columns:1fr; }
  .product-card .pc-img{ height:320px; }
}
@media (max-width:560px){
  .product-card{ border-radius:14px; }
  .product-card .pc-img{ height:260px; }
  .pc-head h2{ font-size:clamp(20px,6vw,26px); }
}

/* ===== Boutons (ta charte) ===== */
.btn{
  display:inline-block; margin:1rem; padding:10px 16px;
  border-radius:12px; border:1px solid var(--line);
  background:#fff; color:var(--olive); font-weight:700;
  transition:transform var(--transition), background var(--transition), color var(--transition);
}
.btn:hover{ transform:translateY(-2px); background:linear-gradient(180deg,#fff,#fff3d8); color:var(--olive); }
.btn.primary{
  background:linear-gradient(180deg,#3d3a2b,var(--olive)); color:var(--brand-2);
  border:1px solid rgba(252,238,205,.18); box-shadow:0 10px 24px rgba(8,11,13,.18);
}
.btn.primary:hover{ filter:brightness(1.06); transform:translateY(-2px); }
.btn:focus-visible{ outline:2px solid var(--brand-2); outline-offset:2px; }

/* ===== Sécurité anti “bande grise” héritée ===== */
.product-cards, .product-card, .pc-head, .pc-info { background-color:transparent; }




/* ===== Boutons ===== */
.btn{display:inline-block;margin:1rem;padding:10px 16px;border-radius:12px;border:1px solid var(--line);background:#fff;color:var(--olive);font-weight:700;transition:transform var(--transition),background var(--transition),color var(--transition)}
.btn:hover{transform:translateY(-2px);background:linear-gradient(180deg,#ffffff,#fff3d8);color:var(--olive)}
.btn.primary{background:linear-gradient(180deg,#3d3a2b,var(--olive));color:var(--brand-2);border:1px solid rgba(252,238,205,.18);box-shadow:0 10px 24px rgba(8,11,13,.18)}
.btn.primary:hover{filter:brightness(1.06);transform:translateY(-2px)}
.btn.ghost{background:transparent;color:var(--brand-2);border:1px solid rgba(252,238,205,.45)}
.btn.ghost:hover{background:rgba(252,238,205,.12)}
.btn:focus-visible{outline:2px solid var(--brand-2);outline-offset:2px}

/* ===== Ingredients Section ===== */
.ingredients-section {
  padding: 60px 20px;
  background: linear-gradient(180deg, #fffdf9, #fff);
}

.section-head {
  max-width: 940px;
  margin: 0 auto 40px;
  text-align: center;
}

.section-head h2 {
  font-size: clamp(22px, 2.6vw, 32px);
  color: var(--brand, #383425);
  font-weight: 700;
  margin: 0 0 8px;
}

.section-head .section-sub {
  color: var(--muted, #6c665d);
  font-size: 1rem;
  font-weight: 400;
  margin: 0;
}

.ingredient-cards {
  max-width: 1140px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: clamp(20px, 3vw, 30px);
}

.ingredient-card {
  background: #fff;
  border: 1px solid rgba(56, 45, 34, .22);
  border-radius: 18px;
  box-shadow: 0 12px 28px rgba(8, 11, 13, .12);
  overflow: hidden;
  transition: transform .25s ease, box-shadow .25s ease;
}

.ingredient-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 16px 36px rgba(8, 11, 13, .16);
}

.ingredient-card img {
  width: 100%;
  height: 235px;
  object-fit: cover;
  display: block;
}

.card-content {
  padding: 20px;
  text-align: center;
}

.card-content h3 {
  font-family: 'Playfair Display', serif;
  font-size: clamp(20px, 2.2vw, 24px);
  color: var(--brand, #383425);
  margin: 0 0 10px;
}

.card-content p {
  color: var(--muted, #6c665d);
  font-size: 1rem;
  line-height: 1.6;
  margin: 0;
}

/* Responsive Adjustments */
@media (max-width: 980px) {
  .ingredient-card img {
    height: 180px;
  }
}

@media (max-width: 560px) {
  .ingredient-card img {
    height: 150px;
  }
  .card-content h3 {
    font-size: clamp(18px, 5vw, 22px);
  }
}

/* ===== Titre de section réutilisable ===== */
.section-head{max-width:940px;margin:0 auto 20px;padding:0 10px;text-align:center;background:none}
.section-head h2{font-size:clamp(20px,2.6vw,28px);color:var(--brand);font-weight:700;margin:0 0 8px}
.section-sub{color:var(--muted);font-size:1rem;font-weight:400;margin:0}

/* ===== Avant / Après ===== */
.avant-apres{background:#fffdf9;padding:60px 0}
.avant-apres .section-title{text-align:center;color:var(--brand);font-size:clamp(22px,2.6vw,32px);margin-bottom:32px}
.avant-apres-grid{display:flex;justify-content:center;gap:40px;flex-wrap:wrap}
.avant-apres figure{flex:1 1 300px;max-width:380px;text-align:center;margin:0}
.avant-apres img{width:100%;border-radius:14px;box-shadow:0 10px 30px rgba(0,0,0,.15)}
.avant-apres figcaption{margin-top:10px;font-weight:700;color:var(--brand);font-size:1rem}
