/* assets/css/style.css — feuille de style unique du site menumalin.fr */

:root{
  --green-deep: #2F4A34;
  --green-board: #1B2A20;
  --green-board-light: #24382A;
  --tomato: #D6432B;
  --mustard: #E8B93A;
  --kraft: #F1E9D2;
  --kraft-light: #FBF6E9;
  --ink: #2A2318;
  --ink-soft: #59503F;
  --line: rgba(42,35,24,0.14);
}
*{ box-sizing:border-box; }
body{
  margin:0;
  background:var(--kraft);
  color:var(--ink);
  font-family:'Karla', sans-serif;
  -webkit-font-smoothing:antialiased;
}
a{ color:inherit; text-decoration:none; }
.wrap{ max-width:1100px; margin:0 auto; padding:0 24px; }
.wrap.narrow{ max-width:760px; }

/* ---- Header ---- */
header{ padding:22px 0; border-bottom:1px solid var(--line); }
.header-row{ display:flex; align-items:center; justify-content:space-between; max-width:1100px; margin:0 auto; padding:0 24px; }
.logo{ font-family:'Archivo Black', sans-serif; font-size:22px; letter-spacing:-0.02em; display:flex; align-items:baseline; gap:6px; }
.logo span{ background:var(--mustard); color:var(--ink); font-family:'Space Mono', monospace; font-size:12px; font-weight:700; padding:3px 7px; border-radius:3px; transform:rotate(-3deg); display:inline-block; }
nav{ display:flex; gap:28px; font-weight:600; font-size:15px; }
nav a{ opacity:0.8; }
nav a.current{ opacity:1; border-bottom:2px solid var(--mustard); padding-bottom:2px; }
.btn-primary{ background:var(--tomato); color:#fff; padding:10px 18px; border-radius:6px; font-weight:700; font-size:14px; display:inline-block; }

/* ---- Breadcrumb ---- */
.breadcrumb{ font-size:13px; color:var(--ink-soft); padding:18px 0 0; }
.breadcrumb a{ opacity:0.75; }
.breadcrumb a:hover{ opacity:1; text-decoration:underline; }
.breadcrumb .sep{ margin:0 6px; opacity:0.5; }
.breadcrumb .current{ color:var(--ink); font-weight:600; }

/* ---- Bandeau vert (accueil + cette semaine) ---- */
.board{
  background:var(--green-board); color:var(--kraft-light);
  margin-top:20px; border-radius:14px; padding:34px 36px;
  position:relative; overflow:hidden;
  display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:16px;
}
.board::before{
  content:""; position:absolute; inset:0;
  background-image:linear-gradient(var(--green-board-light) 1px, transparent 1px);
  background-size:100% 44px; opacity:0.35; pointer-events:none;
}
.board h1{ font-family:'Archivo Black', sans-serif; font-size:32px; line-height:1.15; max-width:640px; margin:14px 0 10px; position:relative; }
.board p{ margin:0; color:#D9D2BE; font-size:14px; position:relative; max-width:520px; }
.board-eyebrow{ font-family:'Space Mono', monospace; font-size:13px; letter-spacing:0.08em; text-transform:uppercase; color:var(--mustard); position:relative; }
.week-nav{ display:flex; gap:10px; position:relative; }
.week-nav button{ background:var(--kraft-light); color:var(--ink); border:none; border-radius:6px; padding:8px 14px; font-family:'Space Mono', monospace; font-weight:700; font-size:13px; cursor:pointer; }
.week-nav button:disabled{ opacity:0.4; cursor:not-allowed; }

/* ---- Promo tags (accueil) ---- */
.promo-tags{ display:flex; flex-wrap:wrap; gap:14px; position:relative; }
.tag{ background:var(--kraft-light); color:var(--ink); border-radius:8px; padding:12px 16px 12px 14px; display:flex; align-items:center; gap:10px; min-width:170px; box-shadow:0 3px 0 rgba(0,0,0,0.18); }
.tag .icon{ width:34px; height:34px; flex:none; }
.tag .name{ font-weight:700; font-size:14.5px; display:block; }
.tag .store{ font-family:'Space Mono', monospace; font-size:11px; color:var(--ink-soft); }
.tag .price{ margin-left:auto; font-family:'Space Mono', monospace; font-weight:700; font-size:15px; color:var(--tomato); white-space:nowrap; }

/* ---- Sections génériques ---- */
.section{ padding:64px 0 20px; }
.section-head{ display:flex; align-items:flex-end; justify-content:space-between; margin-bottom:26px; flex-wrap:wrap; gap:10px; }
.section-head h2{ font-family:'Archivo Black', sans-serif; font-size:26px; margin:0; }
.section-head .sub{ color:var(--ink-soft); font-size:14px; margin-top:6px; }
.see-all{ font-weight:700; font-size:14px; color:var(--green-deep); border-bottom:2px solid var(--mustard); }
.block-title{ font-family:'Archivo Black', sans-serif; font-size:19px; margin:0 0 16px; }

/* ---- Page head (toutes les recettes) ---- */
.page-head{ padding:18px 0 28px; display:flex; align-items:flex-end; justify-content:space-between; flex-wrap:wrap; gap:10px; }
.page-head h1{ font-family:'Archivo Black', sans-serif; font-size:30px; margin:0; }
.page-head .count{ font-size:14px; color:var(--ink-soft); }
.search-box{ margin-top:14px; position:relative; max-width:340px; }
.search-box input{ width:100%; padding:11px 14px; border-radius:8px; border:1px solid var(--line); background:var(--kraft-light); font-family:'Karla', sans-serif; font-size:14px; color:var(--ink); }

/* ---- Filtres (budget, saison, tags) ---- */
.layout{ display:grid; grid-template-columns:250px 1fr; gap:38px; padding-bottom:70px; align-items:start; }
.filters{ background:var(--kraft-light); border:1px solid var(--line); border-radius:12px; padding:22px; position:sticky; top:20px; }
.filter-block{ margin-bottom:26px; }
.filter-block:last-child{ margin-bottom:0; }
.filter-title{ font-weight:700; font-size:13px; text-transform:uppercase; letter-spacing:0.04em; margin-bottom:12px; display:flex; justify-content:space-between; align-items:center; }
.filter-title .reset{ font-family:'Space Mono', monospace; font-size:11px; font-weight:400; text-transform:none; color:var(--tomato); cursor:pointer; opacity:0.85; }
.filter-title .reset:hover{ opacity:1; text-decoration:underline; }

input[type="range"]{ width:100%; -webkit-appearance:none; appearance:none; height:6px; border-radius:4px; background:linear-gradient(to right, var(--tomato) 0%, var(--tomato) var(--fill,50%), var(--line) var(--fill,50%), var(--line) 100%); outline:none; }
input[type="range"]::-webkit-slider-thumb{ -webkit-appearance:none; width:18px; height:18px; border-radius:50%; background:var(--tomato); border:3px solid var(--kraft-light); box-shadow:0 0 0 1px var(--tomato); cursor:pointer; }
input[type="range"]::-moz-range-thumb{ width:18px; height:18px; border-radius:50%; background:var(--tomato); border:3px solid var(--kraft-light); box-shadow:0 0 0 1px var(--tomato); cursor:pointer; }
.budget-value{ font-family:'Space Mono', monospace; font-weight:700; font-size:13.5px; margin-top:8px; text-align:center; background:var(--mustard); padding:5px 10px; border-radius:6px; }

.pills{ display:flex; flex-wrap:wrap; gap:6px; }
.pill{ font-size:12.5px; font-weight:600; padding:6px 12px; border-radius:20px; border:1px solid var(--line); background:#fff; cursor:pointer; user-select:none; }
.pill.active{ background:var(--green-deep); color:#fff; border-color:var(--green-deep); }

.tag-check{ display:flex; align-items:center; gap:8px; font-size:13.5px; padding:5px 0; cursor:pointer; }
.tag-check input{ accent-color:var(--tomato); width:15px; height:15px; cursor:pointer; }

/* ---- Grille de recettes / cartes ---- */
.grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.card{ background:var(--kraft-light); border:1px solid var(--line); border-radius:12px; overflow:hidden; transition:transform .15s ease; }
.card:hover{ transform:translateY(-3px); }
.card.is-hidden{ display:none; }
.card-media{ height:130px; background:linear-gradient(135deg, var(--green-deep), #3d6247); position:relative; display:flex; align-items:center; justify-content:center; }
.card-media svg{ width:52px; height:52px; opacity:0.92; }
.stamp{ position:absolute; top:12px; right:12px; background:var(--tomato); color:#fff; font-family:'Space Mono', monospace; font-weight:700; font-size:12.5px; border-radius:50%; width:52px; height:52px; display:flex; flex-direction:column; align-items:center; justify-content:center; line-height:1.05; transform:rotate(8deg); border:2px dashed rgba(255,255,255,0.6); }
.stamp small{ font-size:8px; font-weight:400; opacity:0.85; }
.card-body{ padding:14px 16px 18px; }
.card-badge{ font-family:'Space Mono', monospace; font-size:10.5px; background:var(--mustard); color:var(--ink); display:inline-block; padding:3px 7px; border-radius:4px; font-weight:700; margin-bottom:8px; }
.card h3{ font-size:15.5px; margin:0 0 6px; font-weight:700; line-height:1.3; }
.card .meta{ font-size:12.5px; color:var(--ink-soft); }
.card-tags{ display:flex; flex-wrap:wrap; gap:5px; }
.mini-tag{ font-size:10.5px; color:var(--ink-soft); background:var(--kraft); border-radius:10px; padding:2px 8px; }

.empty-state{ display:none; grid-column:1/-1; padding:50px 20px; text-align:center; color:var(--ink-soft); font-size:14.5px; border:1px dashed var(--line); border-radius:12px; }

/* ---- Steps (comment ça marche + accueil) ---- */
.steps{ display:grid; grid-template-columns:repeat(3,1fr); gap:26px; margin:38px 0 10px; }
.step{ background:var(--kraft-light); border:1px solid var(--line); border-radius:12px; padding:20px; }
.step .num{ font-family:'Space Mono', monospace; color:#fff; background:var(--green-deep); width:30px; height:30px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-weight:700; font-size:13px; margin-bottom:12px; }
.step h3, .step h4{ font-size:16px; margin:0 0 6px; }
.step p{ font-size:14px; color:var(--ink-soft); line-height:1.55; margin:0; }

/* ---- Store tabs / promo grid (cette semaine) ---- */
.store-tabs{ display:flex; gap:8px; margin:26px 0 24px; }
.store-tab{ font-weight:700; font-size:14px; padding:8px 16px; border-radius:20px; border:1px solid var(--line); background:var(--kraft-light); cursor:pointer; }
.store-tab.active{ background:var(--green-deep); color:#fff; border-color:var(--green-deep); }
.promo-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:16px; padding-bottom:60px; }
.promo-card{ background:var(--kraft-light); border:1px solid var(--line); border-radius:12px; padding:18px 20px; display:flex; align-items:flex-start; gap:14px; }
.promo-card.is-hidden{ display:none; }
.promo-card .icon{ width:56px; height:56px; border-radius:10px; flex:none; background:rgba(47,74,52,0.15); overflow:hidden; border:1px solid var(--line); }
.promo-main{ flex:1; min-width:0; }
.promo-top{ display:flex; align-items:flex-start; justify-content:space-between; gap:10px; }
.promo-name{ font-weight:700; font-size:15.5px; }
.promo-store{ font-family:'Space Mono', monospace; font-size:10.5px; color:var(--ink-soft); display:block; margin-top:2px; }
.promo-price{ font-family:'Space Mono', monospace; font-weight:700; font-size:15px; color:var(--tomato); white-space:nowrap; }
.promo-recipes{ margin-top:10px; display:flex; flex-wrap:wrap; gap:6px; }
.recipe-chip{ font-size:12px; font-weight:600; background:var(--kraft); border-radius:14px; padding:5px 11px; border:1px solid var(--line); }
.recipe-chip:hover{ background:var(--mustard); border-color:var(--mustard); }
.more-chip{ background:var(--tomato); color:#fff; border-color:var(--tomato); font-weight:700; }
.more-chip:hover{ background:#b8371f; border-color:#b8371f; }
.no-recipe{ margin-top:10px; font-size:12px; color:var(--ink-soft); border:1px dashed var(--line); border-radius:14px; padding:5px 11px; display:inline-block; }

.archive{ padding-bottom:70px; }
.archive h2{ font-family:'Archivo Black', sans-serif; font-size:19px; margin-bottom:16px; }
.archive-list{ display:flex; flex-wrap:wrap; gap:10px; }
.archive-list a{ font-size:13px; font-weight:600; background:var(--kraft-light); border:1px solid var(--line); border-radius:8px; padding:9px 14px; }
.archive-list a:hover{ border-color:var(--green-deep); }

/* ---- Page recette individuelle ---- */
.promo-callout{ margin-top:18px; background:var(--green-board); color:var(--kraft-light); border-radius:10px; padding:14px 18px; display:flex; align-items:center; gap:12px; font-size:14px; flex-wrap:wrap; }
.promo-callout .badge{ background:var(--mustard); color:var(--ink); font-family:'Space Mono', monospace; font-weight:700; font-size:12px; padding:4px 9px; border-radius:5px; white-space:nowrap; }
.promo-callout a{ margin-left:auto; font-weight:700; color:var(--mustard); white-space:nowrap; border-bottom:1px solid rgba(232,185,58,0.5); }

.recipe-photo{ width:100%; max-height:420px; object-fit:cover; border-radius:14px; margin-top:18px; display:block; }

.recipe-hero{ display:grid; grid-template-columns:1.4fr 1fr; gap:40px; padding:36px 0 10px; align-items:start; }
.recipe-hero h1{ font-family:'Archivo Black', sans-serif; font-size:36px; line-height:1.15; margin:0 0 14px; }
.chapo{ color:var(--ink-soft); font-size:15px; margin:0 0 14px; }
.recipe-meta{ display:flex; gap:18px; flex-wrap:wrap; font-size:14px; color:var(--ink-soft); margin-bottom:18px; }
.tags-row{ display:flex; gap:8px; flex-wrap:wrap; }
.tag-pill{ font-size:12.5px; font-weight:700; padding:5px 11px; border-radius:20px; background:var(--kraft-light); border:1px solid var(--line); }

.price-card{ background:var(--kraft-light); border:1px solid var(--line); border-radius:14px; padding:24px; text-align:center; }
.price-card .stamp-big{ font-family:'Space Mono', monospace; font-weight:700; font-size:38px; color:var(--tomato); line-height:1; }
.price-card .stamp-sub{ font-size:13px; color:var(--ink-soft); margin-top:6px; }

.servings-control{ margin:18px 0 4px; padding-top:18px; border-top:1px solid var(--line); display:flex; flex-direction:column; gap:12px; }
.servings-row{ display:flex; align-items:center; justify-content:space-between; gap:10px; }
.servings-row .who{ font-size:13.5px; font-weight:600; text-align:left; }
.servings-row .who small{ display:block; font-weight:400; color:var(--ink-soft); font-size:11.5px; }
.servings-row .stepper{ display:flex; align-items:center; gap:10px; }
.servings-control button{ width:30px; height:30px; border-radius:50%; border:1px solid var(--line); background:#fff; font-family:'Space Mono', monospace; font-weight:700; font-size:15px; cursor:pointer; color:var(--ink); }
.servings-control button:hover{ background:var(--mustard); border-color:var(--mustard); }
.servings-control button:disabled{ opacity:0.35; cursor:not-allowed; }
.servings-control .count{ font-family:'Space Mono', monospace; font-weight:700; font-size:15px; min-width:16px; text-align:center; }
.parts-summary{ font-size:12px; color:var(--ink-soft); text-align:center; margin-top:2px; }
.total-line{ font-size:13px; color:var(--ink-soft); margin-top:10px; }
.total-line b{ color:var(--ink); }

.recipe-body{ display:grid; grid-template-columns:1fr 1.6fr; gap:48px; padding:34px 0 60px; }
.ingredients-list{ list-style:none; margin:0; padding:0; }
.ingredients-list li{ display:flex; justify-content:space-between; align-items:center; padding:11px 0; border-bottom:1px solid var(--line); font-size:14.5px; }
.ingredients-list li .qty{ font-family:'Space Mono', monospace; font-weight:700; font-size:13px; color:var(--green-deep); min-width:64px; margin-right:8px; display:inline-block; }
.ingredients-list li .price{ font-family:'Space Mono', monospace; font-size:13px; color:var(--ink-soft); }
.ingredients-total{ display:flex; justify-content:space-between; padding-top:14px; font-weight:700; font-size:15px; }

.ingredient-label{ display:flex; align-items:center; gap:10px; cursor:pointer; flex:1; }
.ingredient-label input[type="checkbox"]{ width:16px; height:16px; accent-color:var(--tomato); cursor:pointer; flex:none; }
.ingredient-owned{ text-decoration:line-through; opacity:0.5; }

.steps-list{ list-style:none; margin:0; padding:0; counter-reset:step; }
.steps-list li{ counter-increment:step; display:flex; gap:16px; padding:18px 0; border-bottom:1px solid var(--line); font-size:15px; line-height:1.6; }
.steps-list li:last-child{ border-bottom:none; }
.steps-list li::before{ content:counter(step); font-family:'Space Mono', monospace; font-weight:700; font-size:14px; background:var(--green-deep); color:#fff; width:30px; height:30px; border-radius:50%; display:flex; align-items:center; justify-content:center; flex:none; }
.astuce{ margin-top:16px; font-size:14px; color:var(--ink-soft); }

.related{ padding:10px 0 70px; }

/* ---- FAQ (comment ça marche) ---- */
.hero{ padding:30px 0 10px; }
.hero h1{ font-family:'Archivo Black', sans-serif; font-size:34px; margin:0 0 14px; }
.hero p{ font-size:16px; line-height:1.65; color:var(--ink-soft); max-width:620px; }
section.block{ padding:44px 0; border-top:1px solid var(--line); }
section.block h2{ font-family:'Archivo Black', sans-serif; font-size:22px; margin:0 0 14px; }
section.block p{ font-size:15px; line-height:1.7; color:var(--ink-soft); max-width:640px; }
section.block p b{ color:var(--ink); }
.callout{ background:var(--green-board); color:var(--kraft-light); border-radius:12px; padding:22px 26px; margin-top:18px; font-size:14.5px; line-height:1.6; }
.callout b{ color:var(--mustard); }
.method-list{ list-style:none; margin:18px 0 0; padding:0; }
.method-list li{ display:flex; gap:14px; padding:14px 0; border-bottom:1px solid var(--line); font-size:14.5px; }
.method-list li:last-child{ border-bottom:none; }
.method-list .tag-label{ font-family:'Space Mono', monospace; font-size:11px; font-weight:700; color:#fff; background:var(--tomato); border-radius:5px; padding:4px 8px; flex:none; height:fit-content; }

details{ background:var(--kraft-light); border:1px solid var(--line); border-radius:10px; padding:16px 20px; margin-bottom:10px; }
summary{ font-weight:700; font-size:15px; cursor:pointer; list-style:none; display:flex; justify-content:space-between; align-items:center; }
summary::-webkit-details-marker{ display:none; }
summary::after{ content:"+"; font-family:'Space Mono', monospace; font-size:18px; color:var(--tomato); }
details[open] summary::after{ content:"−"; }
details p{ margin:12px 0 0; font-size:14px; color:var(--ink-soft); line-height:1.6; max-width:100%; }

/* ---- Formulaire (contact) ---- */
.form-card{ background:var(--kraft-light); border:1px solid var(--line); border-radius:12px; padding:26px; margin-bottom:60px; }
.form-field{ margin-bottom:18px; }
.form-field label{ display:block; font-weight:700; font-size:13.5px; margin-bottom:6px; }
.form-field input, .form-field select, .form-field textarea{
  width:100%; padding:11px 14px; border-radius:8px; border:1px solid var(--line);
  font-family:'Karla', sans-serif; font-size:14px; background:#fff; color:var(--ink);
}
.form-field textarea{ resize:vertical; }
.form-honeypot{ position:absolute; left:-9999px; }
.form-success{ background:var(--green-board); color:var(--kraft-light); border-radius:12px; padding:22px 26px; margin:20px 0; }
.form-success b{ color:var(--mustard); }
.form-errors{ background:#fbeae6; border:1px solid var(--tomato); color:var(--tomato); border-radius:10px; padding:16px 20px; margin:20px 0; font-size:14px; }

/* ---- Footer ---- */
footer{ border-top:1px solid var(--line); padding:26px 0 40px; font-size:13px; color:var(--ink-soft); }
.footer-row{ display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px; max-width:1100px; margin:0 auto; padding:0 24px; }

/* ---- Responsive ---- */
@media(max-width:900px){
  .layout{ grid-template-columns:1fr; }
  .filters{ position:static; }
  .grid{ grid-template-columns:repeat(2,1fr); }
  .recipe-hero, .recipe-body{ grid-template-columns:1fr; }
  .steps{ grid-template-columns:1fr; }
  .promo-grid{ grid-template-columns:1fr; }
  nav{ display:none; }
  .board{ flex-direction:column; align-items:flex-start; }
}
@media(max-width:560px){
  .grid{ grid-template-columns:1fr; }
}