*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Arial,sans-serif;background:#111;color:#fff}.top{background:#ff6b00;color:#111;text-align:center;padding:9px;font-weight:800}header{position:sticky;top:0;z-index:5;background:#090909ee;display:flex;align-items:center;gap:18px;padding:7px 5%;border-bottom:1px solid #333}.brand{display:flex;align-items:center;gap:12px;color:white;text-decoration:none;margin-right:auto;font-size:24px}.brand img{width:86px;height:86px;object-fit:cover;border-radius:50%;border:3px solid #ff6b00}.brand span{color:#ff6b00}.halal{width:92px;height:92px;object-fit:contain;border-radius:50%;padding:5px;background:#fff}nav{display:flex;gap:20px}nav a{color:white;text-decoration:none;font-weight:700}.call{border:1px solid #ff6b00;padding:8px 13px;border-radius:20px}.hero{max-width:1200px;margin:auto;padding:65px 6%;display:grid;grid-template-columns:1fr 1fr;gap:45px;align-items:center}.hero small,.intro small,.photos small,.infos small{color:#ff6b00;font-weight:900;letter-spacing:2px}.hero h1{font-size:clamp(48px,7vw,82px);line-height:.95;margin:12px 0 20px}.hero em{color:#ff6b00;font-style:normal}.hero p{font-size:20px;color:#ccc}.heroimg{width:100%;height:470px;object-fit:cover;border-radius:25px}.btn{display:inline-block;padding:12px 17px;border:1px solid #555;border-radius:10px;color:white;text-decoration:none;font-weight:800;margin:8px 5px 0 0}.orange{background:#ff6b00;border-color:#ff6b00;color:#111}#menu{background:#fff;color:#111;padding:70px 6%}.intro{text-align:center;max-width:700px;margin:auto}.intro h2,.photos h2,.infos h2{font-size:40px;margin:5px 0}.intro p{color:#555}.cats{max-width:1200px;margin:30px auto;display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.cats button{padding:0;background:#fff;border:1px solid #ddd;border-radius:20px;overflow:hidden;text-align:left;cursor:pointer;box-shadow:0 8px 25px #00000012;transition:.2s}.cats button:hover{transform:translateY(-5px);border-color:#ff6b00}.cats img{width:100%;height:230px;object-fit:cover}.cats b,.cats span{display:block;padding:0 18px}.cats b{font-size:27px;margin-top:14px}.cats span{color:#666;padding-bottom:18px}.panel{max-width:1200px;margin:20px auto;padding:24px;border:1px solid #ddd;border-radius:20px;background:#fafafa;display:none}.panel.active{display:block}.phead{display:flex;justify-content:space-between;align-items:center}.phead h3{font-size:30px}.close{border:1px solid #ccc;background:white;border-radius:9px;font-size:20px;padding:5px 12px;cursor:pointer}.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.grid article{background:white;border:1px solid #ddd;border-radius:13px;padding:16px;display:grid;grid-template-columns:1fr auto;gap:5px}.grid strong{color:#ff6b00;font-size:18px}.grid small{grid-column:1/-1;color:#666}.grid .sig{border-color:#ff6b00;background:#fff7f0}.note{color:#555;font-size:14px}.bowl{max-width:1200px;margin:20px auto;padding:20px;border:2px solid #ff6b00;border-radius:18px;background:#fff7f0;display:flex;justify-content:space-between;align-items:center}.bowl h3{margin:5px 0}.bowl p{color:#555}.bowl>b{font-size:28px;color:#ff6b00}.bowl>b small{display:block;color:#555;font-size:12px}.bar{background:#ff6b00;color:#111;padding:17px;display:flex;justify-content:center;gap:55px;flex-wrap:wrap}.photos,.infos{padding:65px 6%;max-width:1200px;margin:auto}.photos div{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.photos img{width:100%;height:250px;object-fit:cover;border-radius:16px}.infos{max-width:none;background:#171717;display:grid;grid-template-columns:1fr 1fr;gap:60px}.infos p{color:#ccc;border-bottom:1px solid #333;padding:7px}footer{text-align:center;padding:28px;color:#999}@media(max-width:800px){header{flex-wrap:wrap}.brand img{width:68px;height:68px}.halal{width:92px;height:92px;object-fit:contain;border-radius:50%;padding:5px;background:#fff}nav{width:100%;justify-content:center}.hero{grid-template-columns:1fr}.cats,.grid,.photos div,.infos{grid-template-columns:1fr}.bowl{display:block}.bar{gap:15px}}

/* Correction mobile du logo halal */
@media (max-width: 600px) {
  header .header-inner {
    gap: 8px;
  }

  header .logo {
    max-width: 58%;
  }

  header .logo img {
    max-width: 100%;
    height: auto;
  }

  header .halal {
    width: 54px;
    height: 54px;
    flex: 0 0 54px;
    padding: 3px;
  }

  header .nav {
    gap: 8px;
    flex-wrap: wrap;
    justify-content: center;
  }

  header .nav a {
    font-size: 13px;
  }
}

@media (max-width: 380px) {
  header .halal {
    width: 46px;
    height: 46px;
    flex-basis: 46px;
  }

  header .logo {
    max-width: 54%;
  }
}

/* Bouton Livraison + fenêtre de commande */
.delivery{border:1px solid #ff6b00;padding:8px 13px;border-radius:20px;color:#fff;text-decoration:none;font-weight:700;background:#ff6b00;color:#111}
.delivery-modal{position:fixed;inset:0;background:rgba(0,0,0,.78);display:none;align-items:center;justify-content:center;padding:20px;z-index:50}
.delivery-modal.active{display:flex}
.delivery-box{position:relative;width:min(420px,100%);background:#fff;color:#111;border-radius:24px;padding:32px;text-align:center;box-shadow:0 20px 70px rgba(0,0,0,.45)}
.delivery-close{position:absolute;right:12px;top:10px;width:38px;height:38px;border:1px solid #ddd;background:#fff;border-radius:50%;font-size:25px;cursor:pointer}
.delivery-logo{width:170px;height:170px;object-fit:cover;border-radius:50%;border:4px solid #ff6b00;margin:5px auto 15px;display:block}
.delivery-box h2{font-size:34px;margin:5px 0 10px}
.delivery-box p{color:#555;margin:0 0 20px}
.delivery-phone{display:inline-block;background:#ff6b00;color:#111;text-decoration:none;font-weight:900;font-size:22px;padding:14px 20px;border-radius:14px}
@media(max-width:600px){
  nav{gap:8px}
  nav a{font-size:13px}
  .delivery-box{padding:28px 20px}
  .delivery-logo{width:140px;height:140px}
  .delivery-phone{font-size:19px}
}

/* Catégories sans photos */
.cats button{min-height:150px;padding:24px 20px;display:flex;flex-direction:column;justify-content:center}
.cats button b{padding:0;font-size:28px;margin:0 0 8px}
.cats button span{padding:0;color:#666}
@media(max-width:800px){.cats{grid-template-columns:1fr 1fr}.cats button{min-height:130px}}
@media(max-width:480px){.cats{grid-template-columns:1fr}.cats button{min-height:110px}}

.delivery-offer{margin:18px 0;padding:14px 16px;border-radius:14px;background:#fff3e8;color:#111;border:1px solid rgba(255,107,0,.25);line-height:1.55}
.delivery-offer b{color:#f56b00}
.delivery-offer span{color:#555}
@media(max-width:480px){.delivery-offer{font-size:14px;padding:12px}.delivery-box{width:calc(100% - 28px);padding:22px 16px}}

/* Menu avec photos uniquement sur certains produits, comme demandé */
.cats button{overflow:hidden}
.cats button img{width:100%;height:150px;object-fit:cover;border-radius:14px;margin:-2px 0 12px}
.grid .with-photo{padding:0;overflow:hidden}
.grid .with-photo img{width:100%;height:145px;object-fit:cover;display:block}
.grid .with-photo>div{padding:15px}
.bowl-content{display:flex;align-items:center;gap:18px}
.bowl-content img{width:110px;height:110px;object-fit:cover;border-radius:14px}
@media(max-width:480px){
  .cats button img{height:120px}
  .grid .with-photo img{height:125px}
  .bowl-content img{width:85px;height:85px}
}


/* Écran d'accueil livraison */
.welcome-screen{
  position:fixed;
  inset:0;
  z-index:9999;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(0,0,0,.88);
  padding:20px;
  cursor:pointer;
  animation:welcomeFadeOut .7s ease 10s forwards;
}
.welcome-card{
  width:min(92vw,560px);
  min-height:330px;
  position:relative;
}
.welcome-back{
  position:absolute;
  inset:0;
  border-radius:28px;
  background:#ff7a00;
  color:#fff;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:35px;
  box-shadow:0 25px 80px rgba(0,0,0,.45);
}
.delivery-icon{
  font-size:62px;
  margin-bottom:8px;
}
.welcome-back h2{
  font-size:34px;
  margin:5px 0 14px;
}
.welcome-back p{
  font-size:25px;
  margin:6px 0;
}
@keyframes welcomeFadeOut{
  to{opacity:0;visibility:hidden;pointer-events:none}
}
@media (max-width:600px){
  .welcome-card{min-height:300px}
  .welcome-back{padding:25px;border-radius:22px}
  .welcome-back h2{font-size:29px}
  .welcome-back p{font-size:21px}
}
/* Compatibilité photos mobile */
img{
  max-width:100%;
}
.cats button{
  overflow:hidden;
}
.cats button img{
  display:block;
  width:100%;
  height:150px;
  object-fit:cover;
  object-position:center;
}
.grid .with-photo{
  overflow:hidden;
}
.grid .with-photo img{
  display:block;
  width:100%;
  max-width:100%;
  height:190px;
  object-fit:cover;
  object-position:center;
}
@media (max-width:700px){
  .cats{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
  }
  .cats button{
    min-width:0;
    width:100%;
  }
  .cats button img{
    height:120px;
  }
  .grid{
    grid-template-columns:1fr !important;
    width:100%;
  }
  .grid article,
  .grid .with-photo{
    width:100%;
    min-width:0;
    box-sizing:border-box;
  }
  .grid .with-photo img{
    width:100%;
    height:210px;
    object-fit:cover;
  }
}
@media (max-width:420px){
  .cats button img{
    height:105px;
  }
  .grid .with-photo img{
    height:180px;
  }
}


/* Correction mobile finale : catégories et photos toujours visibles */
@media (max-width:700px){
  .menu-section, .menu-panel, .panel, .category-panel {
    overflow:visible !important;
  }
  .cats{
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
    width:100% !important;
    overflow:visible !important;
  }
  .cats button{
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    width:100% !important;
    min-height:0 !important;
    overflow:hidden !important;
  }
  .cats button img{
    display:block !important;
    visibility:visible !important;
    opacity:1 !important;
    width:100% !important;
    height:115px !important;
    min-height:115px !important;
    object-fit:cover !important;
    object-position:center !important;
  }
  .grid{
    display:grid !important;
    grid-template-columns:1fr !important;
    width:100% !important;
    gap:14px !important;
    overflow:visible !important;
  }
  .grid article.with-photo,
  .grid .with-photo{
    display:flex !important;
    flex-direction:column !important;
    width:100% !important;
    min-width:0 !important;
    height:auto !important;
    overflow:hidden !important;
  }
  .grid .with-photo img{
    display:block !important;
    visibility:visible !important;
    opacity:1 !important;
    width:100% !important;
    height:200px !important;
    min-height:200px !important;
    max-height:none !important;
    object-fit:cover !important;
    object-position:center !important;
    flex:none !important;
  }
}
@media (max-width:420px){
  .cats{
    grid-template-columns:1fr !important;
  }
  .cats button img{
    height:150px !important;
    min-height:150px !important;
  }
  .grid .with-photo img{
    height:190px !important;
    min-height:190px !important;
  }
}

/* ===== CORRECTIONS FINALES PC + MOBILE ===== */
*,
*::before,
*::after{box-sizing:border-box}

html{overflow-x:hidden}
body{width:100%;max-width:100%;overflow-x:hidden;margin:0}
img{max-width:100%;height:auto}

.welcome-screen{
  position:fixed;
  inset:0;
  z-index:99999;
  display:flex;
  align-items:center;
  justify-content:center;
  width:100vw;
  height:100dvh;
  padding:20px;
  background:rgba(0,0,0,.86);
  cursor:pointer;
}
.welcome-card{
  width:min(92vw,560px);
  max-width:560px;
}
.welcome-content{
  width:100%;
  padding:42px 28px;
  border-radius:24px;
  background:#ff7a00;
  color:#fff;
  text-align:center;
  box-shadow:0 20px 60px rgba(0,0,0,.35);
}
.welcome-content h2{margin:6px 0 16px;font-size:clamp(28px,5vw,38px)}
.welcome-content p{margin:7px 0;font-size:clamp(19px,3vw,26px);line-height:1.3}
.welcome-content small{display:block;margin-top:20px;font-size:14px;opacity:.9}
.delivery-icon{font-size:58px;line-height:1;margin-bottom:10px}

/* Catégories : toujours visibles et sans débordement */
.cats{
  width:100%;
  max-width:100%;
  display:grid !important;
  gap:14px;
}
.cats button{
  width:100%;
  min-width:0;
  overflow:hidden;
}
.cats button img{
  display:block !important;
  width:100% !important;
  height:150px !important;
  min-height:0 !important;
  object-fit:cover !important;
  object-position:center !important;
}

/* Produits avec photos */
.grid{
  width:100%;
  max-width:100%;
  min-width:0;
}
.grid article{min-width:0;max-width:100%}
.grid .with-photo{
  min-width:0;
  width:100%;
  overflow:hidden;
}
.grid .with-photo img{
  display:block !important;
  width:100% !important;
  max-width:100% !important;
  height:190px !important;
  object-fit:cover !important;
  object-position:center !important;
}

/* Empêche les textes/prix de sortir des cartes */
.grid article,
.grid article *,
.cats button,
.cats button *{
  overflow-wrap:anywhere;
}

/* Téléphone */
@media (max-width:700px){
  body{font-size:15px}
  .cats{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
  .cats button img{
    height:125px !important;
  }
  .grid{
    grid-template-columns:1fr !important;
    gap:14px !important;
  }
  .grid .with-photo img{
    height:205px !important;
  }
  .welcome-content{
    padding:34px 20px;
    border-radius:20px;
  }
}

/* Très petit téléphone */
@media (max-width:430px){
  .cats{
    grid-template-columns:1fr !important;
  }
  .cats button img{
    height:155px !important;
  }
  .grid .with-photo img{
    height:185px !important;
  }
  .welcome-content p{font-size:20px}
}

/* Grand écran : ne laisse jamais les photos devenir gigantesques */
@media (min-width:1000px){
  .grid .with-photo img{height:210px !important}
}

/* Catégories : 2 cases en haut + 2 cases en bas sur PC */
.cats{
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  width:100%;
  max-width:900px;
  margin-left:auto;
  margin-right:auto;
}
@media (max-width:700px){
  .cats{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    max-width:100%;
  }
}
@media (max-width:430px){
  .cats{
    grid-template-columns:1fr !important;
  }
}

/* Ajustements responsive PC + mobile */
* { box-sizing: border-box; }
img { max-width: 100%; }
.cats { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.cats button { min-width:0; overflow:hidden; }
.cats button img { width:100%; height:160px; object-fit:cover; display:block; }
.grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.grid article { min-width:0; overflow:hidden; }
.grid .with-photo { display:flex; align-items:center; gap:12px; }
.grid .with-photo img { width:clamp(84px, 18%, 150px); height:110px; flex:0 0 auto; object-fit:cover; border-radius:12px; }
.grid article div { min-width:0; }
.grid article b, .grid article small { overflow-wrap:anywhere; }
@media (min-width: 900px) {
  .cats { grid-template-columns:repeat(2,minmax(0,1fr)); max-width:1000px; margin-inline:auto; }
  .grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width: 700px) {
  .cats { grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; }
  .cats button img { height:100px; }
  .grid { grid-template-columns:1fr; gap:10px; }
  .grid .with-photo { align-items:center; }
  .grid .with-photo img { width:104px; height:96px; }
  .panel { width:100%; max-width:100%; overflow:hidden; }
  .phead h3 { font-size:1.15rem; }
  .welcome-card { max-width:calc(100vw - 24px); }
  header { flex-wrap:wrap; gap:10px; }
  nav { flex-wrap:wrap; }
}
@media (max-width: 380px) {
  .cats button img { height:82px; }
  .cats button b { font-size:.95rem; }
  .grid .with-photo img { width:88px; height:84px; }
}

/* Présentation soignée sur ordinateur, tablette et téléphone */
html { scroll-behavior: smooth; }
body { overflow-x: hidden; }
header, .hero, #menu, .photos, .infos { width: min(1180px, calc(100% - 32px)); margin-inline: auto; }
header { gap: clamp(12px, 2vw, 28px); }
nav { gap: clamp(8px, 1.2vw, 18px); }
.hero { gap: clamp(24px, 5vw, 64px); }
.hero > div { min-width: 0; }
.heroimg { width: min(48%, 520px); object-fit: cover; }
.panel { width: 100%; }
.panel .grid article { min-height: 96px; }
#burgers .grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
#burgers .grid article { display: flex; align-items: center; min-height: 94px; }
#burgers .grid article div { width: 100%; }
#burgers .grid article b { display:block; font-size: 1.05rem; }
#burgers .grid article strong { display:inline-block; margin-top:8px; }
.bar { flex-wrap: wrap; justify-content: center; gap: 12px 26px; }
.menu-photo { margin-top: 30px; text-align: center; }
.menu-photo h3 { margin-bottom: 6px; }
.menu-photo > img { display:block; width:100%; max-width:1100px; height:auto; margin:18px auto 0; border-radius:16px; box-shadow:0 12px 35px #0002; }
@media (max-width: 900px) {
  header, .hero, #menu, .photos, .infos { width: min(100% - 24px, 720px); }
  #burgers .grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .heroimg { width: 44%; }
}
@media (max-width: 700px) {
  .hero { display:flex; flex-direction:column; }
  .heroimg { width:100%; max-height:280px; }
  header { align-items:center; }
  nav { width:100%; justify-content:center; }
  #burgers .grid { grid-template-columns:1fr; }
  #burgers .grid article { min-height:76px; }
  .bar { padding-inline:12px; }
  .menu-photo > img { border-radius:10px; }
}
@media (min-width: 1200px) {
  .grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  #burgers .grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
}

/* Correctif final PC + mobile : cartes compactes, sans grands espaces vides */
#menu { padding: clamp(28px, 4vw, 64px) clamp(14px, 4vw, 56px); }
.cats { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.cats button { min-width: 0; }
.panel { width: 100%; max-width: 1200px; padding: clamp(14px, 2vw, 24px); }
.panel .grid { grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: stretch; gap: 14px; }
.panel .grid article { min-width: 0; min-height: 0; height: auto; align-content: start; align-items: start; }
.panel .grid article b { line-height: 1.25; }
.panel .grid article small { line-height: 1.4; }
.panel .grid article.with-photo { display: flex; flex-direction: column; align-items: stretch; gap: 0; padding: 0; }
.panel .grid article.with-photo img { display: block; width: 100%; height: 155px !important; max-height: 155px; flex: 0 0 155px; object-fit: cover; border-radius: 0; }
.panel .grid article.with-photo > div { padding: 14px; width: 100%; }
#burgers .grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
#burgers .grid article { display: block; min-height: 100px; padding: 18px; }
#burgers .grid article b { display: block; }
#burgers .grid article strong { display: inline-block; margin-top: 8px; }
@media (min-width: 1200px) {
  .panel .grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  #burgers .grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
  .cats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .panel .grid, #burgers .grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
  .panel .grid, #burgers .grid { grid-template-columns: 1fr; }
  .panel .grid article.with-photo { display: flex; flex-direction: row; align-items: center; }
  .panel .grid article.with-photo img { width: 105px; height: 100px !important; max-height: 100px; flex: 0 0 105px; }
  .panel .grid article.with-photo > div { padding: 12px; }
  .phead h3 { font-size: 23px; }
}