/* ioumi — seo.css : pages publiques générées par tools/build-seo-pages.mjs
   (recettes/, menus/). Même palette que liste.html. 25/10/2026 : charte cantine (listes en
   feuilles sable sans filet beige, bloc d'appel posé au trait encre, action en vert sauge). */
@font-face{font-family:"Rubik";font-weight:400;font-display:swap;src:url("fonts/rubik-latin-400-normal.woff2") format("woff2")}
@font-face{font-family:"Rubik";font-weight:600;font-display:swap;src:url("fonts/rubik-latin-600-normal.woff2") format("woff2")}
@font-face{font-family:"Alfa Slab One";font-weight:400;font-display:swap;src:url("fonts/alfa-slab-one-latin-400-normal.woff2") format("woff2")}
:root{
  --bg:#FBF3E4; --surface:#FFFCF5; --surface-2:#F3E7CF;
  --sage:#7FB069; --sage-soft:#E3F0DA; --sage-text:#3F6832; --terra:#FF6B4A;
  --ink:#14213D; --ink-2:#3D4A6B; --muted:#5F687F; --border:#DCC9A6;
  --serif:"Alfa Slab One",Georgia,serif; --sans:"Rubik",system-ui,-apple-system,sans-serif;
  color-scheme:light;
}
@media (prefers-color-scheme:dark){
  :root{
    --bg:#14161F; --surface:#1E2230; --surface-2:#282D3E;
    --sage:#9BCB86; --sage-soft:#1D3320; --sage-text:#A6D695; --terra:#FF8467;
    --ink:#FBF3E4; --ink-2:#C6CCDD; --muted:#99A1B7; --border:#3A4157;
    color-scheme:dark;
  }
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{background:var(--bg);color:var(--ink);font-family:var(--sans);line-height:1.55;-webkit-font-smoothing:antialiased}
a{color:var(--ink)}
.haut{max-width:760px;margin:0 auto;padding:18px 16px;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.marque{display:flex;align-items:center;gap:8px;text-decoration:none;font-family:var(--serif);font-size:1.3rem}
.haut nav{display:flex;gap:16px;font-size:.92rem}
main{max-width:760px;margin:0 auto;padding:8px 16px 40px}
.fil{font-size:.85rem;color:var(--muted);margin:0 0 8px}
.fil a{color:var(--muted)}
.emoji{font-size:3rem;margin:8px 0 0;line-height:1}
h1{font-family:var(--serif);font-weight:400;font-size:clamp(1.6rem,5vw,2.3rem);line-height:1.15;margin:10px 0 8px}
h2{font-size:1.15rem;margin:28px 0 10px}
.pour{font-weight:400;color:var(--muted);font-size:.9rem}
.chapo{font-size:1.08rem;color:var(--ink-2);margin:0 0 14px}
.puces{list-style:none;padding:0;margin:0 0 8px;display:flex;flex-wrap:wrap;gap:8px}
.puces li{background:var(--surface-2);border-radius:999px;padding:4px 12px;font-size:.88rem}
.ingredients{background:var(--surface-2);border-radius:14px;padding:12px 16px 12px 34px;margin:0}
.ingredients li{padding:3px 0}
.etapes{padding-left:22px}
.etapes li{margin:0 0 10px}
.note{font-size:.86rem;color:var(--muted)}
.total{background:var(--surface-2);color:var(--ink);border-radius:12px;padding:10px 14px;display:inline-block}
.semaine{list-style:none;padding:0;margin:16px 0}
.semaine li{display:grid;grid-template-columns:96px 1fr;gap:2px 12px;align-items:baseline;background:var(--surface-2);border-radius:14px;padding:12px 14px;margin:0 0 8px}
.semaine .jour{font-weight:600;color:var(--terra);grid-row:span 2}
.semaine small{color:var(--muted);font-size:.84rem}
.grille{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:8px}
.grille a{display:block;height:100%;background:var(--surface-2);border-radius:14px;padding:12px 14px;text-decoration:none}
.grille a:active{transform:scale(.98)}
.grille small{display:block;color:var(--muted);font-size:.8rem;margin-top:2px}
.cta{margin:32px 0 8px;background:var(--surface);border:2px solid var(--ink);border-radius:16px;padding:18px 16px;box-shadow:4px 4px 0 var(--ink)}
.cta h2{font-family:var(--sans);font-weight:700;font-size:1.2rem;margin:0 0 6px}
.cta p{margin:0 0 12px;color:var(--ink-2)}
.btn{display:flex;justify-content:center;align-items:center;min-height:48px;border-radius:12px;font-weight:600;text-decoration:none;margin-top:8px;padding:0 14px;text-align:center}
.btn-1{background:var(--sage);color:#14213D;border:2px solid var(--ink);box-shadow:4px 4px 0 var(--ink)}
.btn-2{background:var(--surface);color:var(--ink);border:2px solid var(--ink);box-shadow:4px 4px 0 var(--ink)}
.btn:active{transform:translate(3px,3px);box-shadow:none}
.btn[hidden]{display:none}
.cta .note{margin:10px 0 0;color:var(--muted)}
.bas{max-width:760px;margin:0 auto;padding:20px 16px 40px;border-top:1px solid var(--border);font-size:.86rem;color:var(--muted)}
.bas a{color:var(--muted)}
.ouvrir-menu{margin:18px 0 8px}.ouvrir-menu small{display:block;margin-top:8px;color:var(--muted,#5b6475);font-size:.88rem;line-height:1.45}
/* Une seule action pleine par écran : sur un menu, « Ouvrir ce menu » ; le bloc d'appel passe en secondaire. */
main:has(.ouvrir-menu) .cta .btn-1{background:var(--surface)}
@media (prefers-reduced-motion:reduce){.btn:active,.grille a:active{transform:none}}