/* GOUPI — Recettes anti-inflammatoires.
   S'appuie sur les variables de style.css et les classes de blog.css. */

/* — Grille de la page pilier — */
.recette-grille{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(280px,1fr));
  gap:var(--sp-lg);
  margin:var(--sp-xxl) 0;
}
.recette-carte{
  background:var(--surface);
  border-radius:var(--r-card);
  box-shadow:var(--shadow-card);
  overflow:hidden;
  transition:transform .2s,box-shadow .2s;
}
.recette-carte:hover{transform:translateY(-3px);box-shadow:0 12px 30px rgba(0,0,0,.08)}
.recette-carte-lien{display:block;color:inherit;text-decoration:none}
.recette-carte img{display:block;width:100%;height:190px;object-fit:cover}
.recette-carte-texte{padding:var(--sp-lg)}
.recette-carte-meta{
  font-size:.8rem;color:var(--text-tertiary);
  margin-bottom:var(--sp-xs);text-transform:uppercase;letter-spacing:.02em;
}
.recette-carte h2{
  font-family:'Poppins',sans-serif;font-weight:700;font-size:1.15rem;
  line-height:1.3;margin-bottom:var(--sp-xs);color:var(--text-primary);
}
.recette-carte p{color:var(--text-secondary);font-size:.925rem;margin:0}

/* — Page d'une recette — */
.recette-categorie{
  font-family:'Poppins',sans-serif;font-weight:600;font-size:.825rem;
  text-transform:uppercase;letter-spacing:.04em;
  color:var(--link-blue);margin-bottom:var(--sp-xs);
}
.recette-photo{margin:var(--sp-xl) 0;border-radius:var(--r-card);overflow:hidden}
.recette-photo img{display:block;width:100%;height:auto}
.recette-chapo{
  font-size:1.1rem;line-height:1.65;color:var(--text-secondary);
  margin-bottom:var(--sp-xl);
}

/* Bandeau temps / portions / calories */
.recette-infos{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));
  gap:var(--sp-md);
  background:var(--surface);border-radius:var(--r-card);
  box-shadow:var(--shadow-card);
  padding:var(--sp-lg);margin-bottom:var(--sp-xxl);
}
.recette-info{display:flex;flex-direction:column;gap:2px;text-align:center}
.recette-info-cle{
  font-size:.75rem;text-transform:uppercase;letter-spacing:.04em;
  color:var(--text-tertiary);
}
.recette-info-valeur{
  font-family:'Poppins',sans-serif;font-weight:700;font-size:1.05rem;
  color:var(--text-primary);
}

/* Ingrédients et étapes */
.recette-bloc{margin-bottom:var(--sp-xxl)}
.recette-bloc h2{
  font-family:'Poppins',sans-serif;font-weight:700;font-size:1.5rem;
  margin-bottom:var(--sp-md);color:var(--text-primary);
}
.recette-ingredients{list-style:none;padding:0;margin:0}
.recette-ingredients li{
  padding:10px 0 10px 28px;position:relative;
  border-bottom:1px solid var(--border);color:var(--text-secondary);
}
.recette-ingredients li:last-child{border-bottom:none}
.recette-ingredients li::before{
  content:"";position:absolute;left:6px;top:18px;
  width:7px;height:7px;border-radius:50%;background:var(--link-blue);
}
.recette-etapes{counter-reset:etape;list-style:none;padding:0;margin:0}
.recette-etapes li{
  counter-increment:etape;position:relative;
  padding:0 0 var(--sp-lg) 44px;color:var(--text-secondary);line-height:1.7;
}
.recette-etapes li::before{
  content:counter(etape);position:absolute;left:0;top:-2px;
  width:30px;height:30px;border-radius:50%;
  background:var(--link-blue);color:#fff;
  font-family:'Poppins',sans-serif;font-weight:700;font-size:.9rem;
  display:flex;align-items:center;justify-content:center;
}

/* Encart application */
.recette-app{
  background:var(--surface);border-radius:var(--r-card);
  box-shadow:var(--shadow-card);
  padding:var(--sp-xxl);margin:var(--sp-xxl) 0;
}
.recette-app h2{
  font-family:'Poppins',sans-serif;font-weight:700;font-size:1.3rem;
  margin-bottom:var(--sp-sm);color:var(--text-primary);
}
.recette-app p{color:var(--text-secondary);margin-bottom:var(--sp-md)}
.recette-app-liens{display:flex;flex-wrap:wrap;gap:var(--sp-sm);margin:0}
.btn-store{
  display:inline-block;padding:11px 20px;border-radius:999px;
  background:var(--link-blue);color:#fff;text-decoration:none;
  font-family:'Poppins',sans-serif;font-weight:600;font-size:.925rem;
  transition:opacity .2s;
}
.btn-store:hover{opacity:.88}

@media (max-width:600px){
  .recette-carte img{height:170px}
  .recette-infos{padding:var(--sp-md)}
}