/* ===== Page d'accueil ===== */
header.top .wrap{padding-top:.7rem}
.hero .wrap{display:grid;grid-template-columns:1fr 1.1fr;gap:2.5rem;align-items:center;padding-top:3.5rem;padding-bottom:3.5rem}
.hero h1{font-size:clamp(2.6rem,7vw,5rem);font-weight:800;letter-spacing:-.02em}
.hero p{font-size:1.2rem;max-width:34ch;margin:1.25rem 0 1.75rem}
.btn{display:inline-block;background:var(--rape-ink);color:#FFFDF5;padding:.85rem 1.5rem;border-radius:999px;font-weight:600;text-decoration:none}
.btn:hover{background:var(--field)}

section{padding:4.5rem 0}
#recette{padding-top:0}
h2{font-size:clamp(1.9rem,4vw,2.8rem);margin-bottom:1rem}
.facts li{border:2px solid var(--field);border-radius:999px;padding:.35rem 1rem;font-weight:500}

.recipe{display:grid;grid-template-columns:1fr 1.4fr;gap:3rem;margin-top:2rem}
.ingr{align-self:start}
.ingr h3{font-size:1.4rem;margin-bottom:1rem}
.ingr li{padding:.5rem 0}

.variants{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem;margin-top:2rem}
.variants article{border:2px solid currentColor;border-radius:1.25rem;padding:1.5rem}
.variants h3{font-size:1.35rem;margin-bottom:.5rem}
.variants p{margin:0}
.alt .lead{color:inherit;opacity:.85}

.dress{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:start}
.dress ul{margin:0;padding-left:1.2rem}
.dress li{margin-bottom:.5rem}
.dress .note{margin-top:1.25rem}

@media (max-width:820px){
  .hero .wrap,.recipe,.dress{grid-template-columns:1fr}
  .variants{grid-template-columns:1fr}
  section{padding:3rem 0}
  .hero .wrap{padding-top:2rem;padding-bottom:2.5rem}
  header.top .wrap{flex-direction:column;align-items:flex-start;gap:.3rem}
}