body { margin: 0; background: #DCD6C8; overflow-x: hidden; }

#mobile-menu { display: none; }

@media (max-width: 1100px) {
  #menu-pages { display: none !important; }
  #mobile-menu { display: block; }
}

    @media print {
      #mobile-menu { display: none !important; }
      * { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
      @page { size: 1080px 1440px; margin: 0; }
      body { background: #F3EEE2; }
      #menu-pages { padding: 0 !important; gap: 0 !important; background: none !important; }
      .menu-page {
        box-shadow: none !important;
        border-radius: 0 !important;
        break-after: page;
        break-inside: avoid;
      }
      .menu-page:last-child { break-after: auto; }
    }

.ig-popup-overlay {
  position: fixed;
  inset: 0;
  background: rgba(35, 33, 32, 0.6);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  box-sizing: border-box;
  z-index: 9999;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.25s ease, visibility 0.25s ease;
}
.ig-popup-overlay.is-open { opacity: 1; visibility: visible; }
.ig-popup-card {
  position: relative;
  width: 420px;
  max-width: 100%;
  background: #F3EEE2;
  border: 2px solid #36622D;
  border-radius: 20px;
  padding: 36px 32px 32px;
  box-sizing: border-box;
  text-align: center;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.25);
  transform: scale(0.92) translateY(8px);
  transition: transform 0.25s ease;
}
.ig-popup-overlay.is-open .ig-popup-card { transform: scale(1) translateY(0); }
.ig-popup-close {
  position: absolute;
  top: 10px;
  right: 14px;
  border: none;
  background: none;
  font-size: 26px;
  line-height: 1;
  color: #3A3835;
  cursor: pointer;
  padding: 4px;
}
.ig-popup-close:hover { color: #BF200A; }
.ig-popup-logo { width: 120px; height: auto; display: block; margin: 0 auto 12px; }
.ig-popup-title { font-family: 'Baloo 2', sans-serif; font-weight: 800; font-size: 24px; color: #232120; }
.ig-popup-title-ar { font-family: 'Cairo', sans-serif; font-weight: 800; font-size: 20px; color: #36622D; margin-top: 2px; }
.ig-popup-handle { margin: 14px 0; }
.ig-popup-handle a { font-family: 'Baloo 2', sans-serif; font-weight: 800; font-size: 22px; color: #BF200A; text-decoration: none; }
.ig-popup-handle a:hover { text-decoration: underline; }
.ig-popup-divider { display: flex; align-items: center; gap: 8px; margin: 12px 0; }
.ig-popup-divider-line { flex: 1; height: 1px; background: #BF200A; }
.ig-popup-divider-dot { width: 8px; height: 8px; background: #BF200A; transform: rotate(45deg); flex-shrink: 0; }
.ig-popup-offer {
  font-family: 'Baloo 2', sans-serif;
  font-weight: 700;
  font-size: 16px;
  color: #3A3835;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 8px;
}
.ig-popup-offer-percent {
  display: inline-block;
  background: #36622D;
  color: #fff;
  font-weight: 800;
  font-size: 15px;
  padding: 4px 12px;
  border-radius: 20px;
}
.ig-popup-offer-ar { font-family: 'Cairo', sans-serif; font-size: 14px; color: #3A3835; direction: rtl; margin-top: 8px; }
.ig-popup-button {
  display: inline-block;
  margin-top: 20px;
  background: #36622D;
  border: 2px solid #BF200A;
  color: #fff;
  font-family: 'Baloo 2', sans-serif;
  font-weight: 800;
  font-size: 16px;
  letter-spacing: 0.5px;
  padding: 12px 32px;
  border-radius: 30px;
  text-decoration: none;
}
.ig-popup-button:hover { background: #2c4f24; }
@media print {
  .ig-popup-overlay { display: none !important; }
}

/* ---- Mobile menu (fluid, stacked layout for small viewports) ---- */

.m-wrap {
  max-width: 600px;
  margin: 0 auto;
  padding: 28px 16px 40px;
  background: #F3EEE2;
  box-sizing: border-box;
}

.m-header {
  text-align: center;
  padding-bottom: 18px;
  border-bottom: 2px solid #36622D;
  margin-bottom: 20px;
}
.m-header img { width: 96px; height: auto; display: block; margin: 0 auto 10px; }
.m-header-name { font-family: 'Baloo 2', sans-serif; font-weight: 800; font-size: 26px; color: #232120; }
.m-header-name-ar { font-family: 'Cairo', sans-serif; font-weight: 800; font-size: 21px; color: #36622D; margin-top: 2px; }
.m-header-tag { font-family: 'Baloo 2', sans-serif; font-weight: 700; font-size: 14px; color: #3A3835; margin-top: 8px; }
.m-header-tag-ar { font-family: 'Cairo', sans-serif; font-size: 14px; }
.m-header-phones {
  font-family: 'Baloo 2', sans-serif;
  font-weight: 700;
  font-size: 14px;
  color: #3A3835;
  margin-top: 8px;
  display: flex;
  justify-content: center;
  gap: 16px;
}

.m-card {
  background: #F9F5EE;
  border: 1px solid #E4DCC9;
  border-radius: 16px;
  padding: 16px 18px;
  margin-bottom: 16px;
}
.m-card-head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  border-bottom: 2px solid #BF200A;
  padding-bottom: 8px;
  margin-bottom: 4px;
  gap: 10px;
}
.m-card-title { font-family: 'Baloo 2', sans-serif; font-weight: 800; font-size: 18px; color: #232120; }
.m-card-title-ar { font-family: 'Cairo', sans-serif; font-weight: 800; font-size: 16px; color: #36622D; }

.m-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 0;
  border-bottom: 1px dotted #D8CFB9;
  gap: 10px;
}
.m-row:last-child { border-bottom: none; }
.m-row-en { font-family: 'Baloo 2', sans-serif; font-weight: 600; font-size: 15px; color: #232120; }
.m-row-side { display: flex; align-items: center; gap: 10px; flex-shrink: 0; }
.m-row-ar { font-family: 'Cairo', sans-serif; font-weight: 600; font-size: 15px; color: #232120; }
.m-row-price { font-family: 'Baloo 2', sans-serif; font-weight: 800; font-size: 15px; color: #BF200A; white-space: nowrap; }

.m-subheading {
  display: inline-block;
  background: #36622D;
  color: #fff;
  font-family: 'Baloo 2', sans-serif;
  font-weight: 700;
  font-size: 13px;
  padding: 4px 14px;
  border-radius: 16px;
  margin: 10px 0 6px;
}

.m-spirit-head {
  display: flex;
  justify-content: space-between;
  font-family: 'Baloo 2', sans-serif;
  font-weight: 800;
  font-size: 11px;
  letter-spacing: 0.3px;
  color: #8A8371;
  text-transform: uppercase;
  padding-bottom: 6px;
  gap: 8px;
}
.m-spirit-row { display: flex; justify-content: space-between; align-items: center; padding: 8px 0; border-bottom: 1px dotted #D8CFB9; gap: 8px; }
.m-spirit-row:last-child { border-bottom: none; }
.m-spirit-en { font-family: 'Baloo 2', sans-serif; font-weight: 600; font-size: 14px; color: #232120; }
.m-spirit-ar { font-family: 'Cairo', sans-serif; font-weight: 600; font-size: 14px; color: #232120; }
.m-spirit-prices { display: flex; gap: 8px; font-family: 'Baloo 2', sans-serif; font-weight: 800; font-size: 13px; color: #BF200A; flex-shrink: 0; white-space: nowrap; }

.m-photo { width: 100%; min-width: 0; height: 170px; object-fit: cover; border-radius: 14px; display: block; }
.m-photos-row { display: flex; gap: 10px; margin-bottom: 16px; }
.m-photos-row .m-photo { flex: 1 1 0; width: 0; min-width: 0; height: 130px; }
.m-photo-wide { margin-bottom: 16px; }

.m-formula-box { border: 2px solid #36622D; border-radius: 16px; padding: 16px; margin-bottom: 16px; }
.m-formula-head { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 6px; gap: 10px; }
.m-formula-name { font-family: 'Baloo 2', sans-serif; font-weight: 800; font-size: 21px; color: #BF200A; }
.m-formula-price { font-family: 'Baloo 2', sans-serif; font-weight: 800; font-size: 15px; color: #36622D; margin-left: 8px; }
.m-formula-note { font-family: 'Cairo', sans-serif; font-weight: 800; font-size: 17px; color: #232120; }
.m-formula-includes {
  display: flex;
  flex-direction: column;
  gap: 2px;
  font-family: 'Baloo 2', sans-serif;
  font-weight: 600;
  font-size: 12px;
  color: #3A3835;
  margin-bottom: 8px;
}
.m-formula-includes span[dir="rtl"] { font-family: 'Cairo', sans-serif; }
.m-formula-group { border: 1px solid #E4DCC9; border-radius: 10px; padding: 8px 10px; margin-bottom: 8px; background: #F9F5EE; }
.m-formula-group-label { display: flex; justify-content: space-between; font-family: 'Baloo 2', sans-serif; font-weight: 800; font-size: 13px; color: #BF200A; margin-bottom: 4px; }
.m-formula-group-label-ar { font-family: 'Cairo', sans-serif; font-size: 12px; color: #36622D; }
.m-formula-item { display: flex; justify-content: space-between; font-family: 'Baloo 2', sans-serif; font-weight: 600; font-size: 14px; color: #232120; padding: 2px 0; gap: 8px; }
.m-formula-item span[dir="rtl"] { font-family: 'Cairo', sans-serif; }
.m-formula-addon {
  display: flex;
  justify-content: space-between;
  font-family: 'Baloo 2', sans-serif;
  font-weight: 800;
  font-size: 15px;
  color: #BF200A;
  border-top: 2px solid #36622D;
  padding-top: 10px;
  margin-top: 4px;
}
.m-formula-addon span[dir="rtl"] { font-family: 'Cairo', sans-serif; }

.m-footer {
  text-align: center;
  padding-top: 18px;
  margin-top: 4px;
  border-top: 1px solid #C9C1AE;
  font-family: 'Baloo 2', sans-serif;
  font-weight: 700;
  font-size: 13px;
  color: #232120;
}
.m-footer div:first-child { margin-bottom: 4px; }
.m-footer span[dir="rtl"] { font-family: 'Cairo', sans-serif; }
