/* KingBurgerPrix — feuille de style unique, mobile-first, aucune dépendance externe */
:root{
  --rouge:#b3271e;
  --rouge-fonce:#8c1d16;
  --orange:#e07b24;
  --brun:#3d2314;
  --fond:#fff8f0;
  --carte:#ffffff;
  --texte:#2b211b;
  --gris:#6f6259;
  --ligne:#eadfce;
  --badge-fond:#fdf0d5;
  --badge-texte:#8a5a00;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  background:var(--fond);
  color:var(--texte);
  line-height:1.55;
  font-size:16px;
}
a{color:var(--rouge);text-decoration:none}
a:hover{text-decoration:underline}
img{max-width:100%}

/* ---------- En-tête ---------- */
.site-header{
  background:var(--brun);
  color:#fff;
  padding:.9rem 1rem .7rem;
}
.site-header .marque{
  font-size:1.45rem;
  font-weight:800;
  letter-spacing:.2px;
  color:#fff;
}
.site-header .marque span{color:var(--orange)}
.site-header .slogan{margin:.15rem 0 0;font-size:.9rem;color:#f3e3cf}
.main-nav{
  background:var(--rouge);
  overflow-x:auto;
  white-space:nowrap;
  -webkit-overflow-scrolling:touch;
}
.main-nav ul{
  display:flex;
  gap:.2rem;
  list-style:none;
  margin:0 auto;
  padding:.35rem .6rem;
  max-width:1100px;
}
.main-nav a{
  display:inline-block;
  color:#fff;
  padding:.45rem .7rem;
  border-radius:.5rem;
  font-size:.95rem;
  font-weight:600;
}
.main-nav a:hover{background:var(--rouge-fonce);text-decoration:none}
.main-nav a.actif{background:#fff;color:var(--rouge)}

/* ---------- Contenu ---------- */
.wrap{max-width:1100px;margin:0 auto;padding:1rem}
.hero{
  background:linear-gradient(135deg,var(--rouge),var(--orange));
  color:#fff;
  border-radius:1rem;
  padding:1.6rem 1.2rem;
  margin-bottom:1.2rem;
}
.hero h1{margin:.1rem 0 .5rem;font-size:1.7rem;line-height:1.25}
.hero p{margin:.3rem 0;max-width:60ch}
.hero .cta{
  display:inline-block;
  background:#fff;
  color:var(--rouge);
  font-weight:700;
  padding:.6rem 1rem;
  border-radius:.6rem;
  margin-top:.7rem;
}
h1.page-title{font-size:1.6rem;line-height:1.3;margin:.4rem 0 .4rem}
h2{font-size:1.25rem;margin:1.6rem 0 .6rem;color:var(--brun)}
h3{font-size:1.05rem;margin:1.1rem 0 .4rem}
.lead{font-size:1.05rem;color:#463830;max-width:70ch}
.maj{color:var(--gris);font-size:.9rem}
.note{
  background:#fff;
  border:1px solid var(--ligne);
  border-left:4px solid var(--orange);
  border-radius:.6rem;
  padding:.8rem 1rem;
  margin:1rem 0;
}

/* ---------- Grille catégories ---------- */
.grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:.8rem;
  margin:1rem 0;
}
.card{
  background:var(--carte);
  border:1px solid var(--ligne);
  border-radius:.8rem;
  padding:1rem;
  display:block;
  color:var(--texte);
}
.card:hover{border-color:var(--orange);text-decoration:none;box-shadow:0 2px 10px rgba(61,35,20,.08)}
.card .emoji{font-size:1.5rem}
.card strong{display:block;margin:.35rem 0 .2rem;color:var(--brun)}
.card small{color:var(--gris)}

/* ---------- Tableaux de prix ---------- */
.table-wrap{overflow-x:auto;background:var(--carte);border:1px solid var(--ligne);border-radius:.8rem}
table{border-collapse:collapse;width:100%;min-width:520px}
th,td{padding:.65rem .8rem;text-align:left;vertical-align:top}
thead th{background:var(--brun);color:#fff;font-size:.92rem}
tbody tr:nth-child(even){background:#fdf6ec}
tbody td{border-top:1px solid var(--ligne)}
td.produit{font-weight:700;color:var(--brun);white-space:nowrap}
td.desc{color:#57493f;font-size:.95rem}
td.prix,td.prix-menu{font-weight:700;white-space:nowrap}
.badge-verif{
  display:inline-block;
  background:var(--badge-fond);
  color:var(--badge-texte);
  font-size:.82rem;
  font-weight:700;
  padding:.15rem .55rem;
  border-radius:1rem;
  white-space:nowrap;
}

/* ---------- FAQ ---------- */
.faq details{
  background:var(--carte);
  border:1px solid var(--ligne);
  border-radius:.6rem;
  padding:.7rem 1rem;
  margin:.5rem 0;
}
.faq summary{font-weight:700;cursor:pointer;color:var(--brun)}
.faq p{margin:.5rem 0 .2rem}

/* ---------- Pied de page ---------- */
.site-footer{
  background:var(--brun);
  color:#f3e3cf;
  margin-top:2.2rem;
  padding:1.4rem 1rem 1.8rem;
  font-size:.9rem;
}
.site-footer .wrap{padding:0}
.site-footer a{color:#ffb26b}
.site-footer .disclaimer{max-width:75ch;color:#e8d5bd}
.site-footer .bas{margin-top:1rem;color:#c9ae8f;font-size:.85rem}

/* ---------- Écrans plus larges ---------- */
@media (min-width:640px){
  .grid{grid-template-columns:repeat(3,1fr)}
  .hero h1{font-size:2.1rem}
  h1.page-title{font-size:1.9rem}
}
@media (min-width:960px){
  .grid{grid-template-columns:repeat(4,1fr)}
  body{font-size:17px}
}

/* ---------- Photos produits ---------- */
th.photo-th{width:80px}
td.photo{width:80px;padding:.45rem .4rem}
td.photo img{
  width:72px;
  height:72px;
  object-fit:cover;
  border-radius:.6rem;
  display:block;
}

/* ---------- Mobile : tableaux en cartes (≤700px) ---------- */
/* Chaque ligne devient une carte : photo fixe à gauche (jamais écrasée),
   nom, description et prix empilés à droite. Corrige l'écrasement des
   photos constaté sur téléphone (colonnes nowrap + min-width du tableau). */
@media (max-width:700px){
  .table-wrap{overflow-x:visible}
  table{min-width:0}
  thead{display:none}
  tbody tr{
    display:grid;
    grid-template-columns:76px 1fr;
    grid-template-areas:"photo produit" "photo desc" "photo prix";
    column-gap:.7rem;
    padding:.6rem .7rem;
  }
  tbody td{border-top:none;padding:.08rem 0}
  tbody tr + tr{border-top:1px solid var(--ligne)}
  td.photo{grid-area:photo;width:auto;padding:0;align-self:start}
  td.photo img{width:72px;height:72px;min-width:72px}
  td.produit{grid-area:produit;white-space:normal;font-size:1.02rem;line-height:1.3}
  td.desc{grid-area:desc;font-size:.92rem}
  td.prix,td.prix-menu{grid-area:prix;font-size:1.05rem;color:var(--rouge-fonce);white-space:normal}
}