@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@300;400;500;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');

/* Base reset */
body {
  margin: 0;
  padding: 0;
}

/* ===================== HEADER LAYOUT ===================== */
.site-header {
  background: url("../images/Main-Header.jpg") center/cover no-repeat;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  gap: clamp(16px, 3vw, 32px);
  padding: clamp(12px, 3vw, 24px) clamp(12px, 4vw, 40px);
}
.site-2nd-header {
  background: url("../images/Secondary-Header-2.jpg") top center/cover no-repeat;
  background-attachment: fixed;
  min-height: 40vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  gap: clamp(16px, 3vw, 32px);
  padding: clamp(12px, 3vw, 24px) clamp(12px, 4vw, 40px);
}
.topbar {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  text-transform: uppercase;
}

/* ===================== NAVIGATION (Desktop) ===================== */
#navigation {
  width: 100%;
  max-width: 920px;
  z-index: 1000;
  background: rgba(0, 0, 0, .50);
  height: auto;
  padding: 10px 20px;
  margin-top: 0;
  border-radius: 12px;
}

.menu,
.mod-menu__sub {
  list-style: none;
  margin: 0;
  padding: 0;
}

.menu {
  display: flex;
  align-items: center;
  gap: 2rem;
  flex-wrap: wrap;
  justify-content: center;
  row-gap: 1rem;
}

.menu > li {
  position: relative;
  flex: 0 1 auto;
  text-align: center;
}

.menu > li > a {
  display: block;
  white-space: nowrap;
  line-height: 1.2;
}

.menu a {
  display: inline-block;
  color: #fff;
  text-decoration: none;
  font-family: 'Montserrat', sans-serif;
  font-weight: 600;
  font-size: 16px;
  letter-spacing: 0.04em;
  padding: .25rem 0;
  transition: color .2s ease, opacity .2s ease;
}

.menu a:hover,
.menu a:focus {
  color: #ff7a00;
  outline: none;
}

.menu a:active {
  opacity: .8;
}

.menu .active > a,
.menu .active > span,
.menu .current-menu-item > a,
.menu .current_page_item > a {
  color: #ff7a00;
}

.menu a::after {
  content: "";
  display: block;
  height: 2px;
  background: transparent;
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform .25s ease, background-color .25s ease;
}

.menu a:hover::after,
.menu a:focus::after,
.menu .active > a::after,
.menu .current-menu-item > a::after,
.menu .current_page_item > a::after {
  background: #ff7a00;
  transform: scaleX(1);
}

/* Submenus */
.menu > li.parent { position: relative; }
.menu > li.parent > a { padding-right: 1.25em; }

.menu > li.parent::after {
  content: "";
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 0;
  height: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 6px solid #fff;
  pointer-events: none;
}

.menu > li.parent:hover::after,
.menu > li.parent:focus-within::after {
  transform: translateY(-50%) rotate(180deg);
  border-top-color: #ff7a00;
}

.mod-menu__sub {
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  min-width: 200px;
  padding: .5rem 0;
  background: rgba(255, 255, 255, .90);
  border: 1px solid rgba(255, 255, 255, .15);
  display: none;
  z-index: 1000;
  border-radius: 10px;
}

.menu > li > .mod-menu__sub {
  left: auto;
  right: 0;
  transform: none;
  transform-origin: right top;
}

.mod-menu__sub li { text-align: left; }

.mod-menu__sub li a {
  display: block;
  padding: .5rem .75rem;
  color: #000;
  white-space: nowrap;
  line-height: 1.2;
  font-family: 'Montserrat', sans-serif;
  font-weight: 600;
  text-decoration: none;
}

.mod-menu__sub li:hover,
.mod-menu__sub li:focus,
.mod-menu__sub .current-menu-item > a {
  background: rgba(255, 122, 0, .18);
  color: #ff7a00;
}

.parent:hover > .mod-menu__sub,
.parent:focus-within > .mod-menu__sub {
  display: block;
}

/* ===================== LOGO ===================== */
#logo { width: 100%; display: block; }

#logo img {
  display: block;
  margin-inline: auto;
  width: clamp(140px, 18vw, 220px);
  max-width: 220px;
  height: auto;
}

/* ===================== HERO ===================== */
#headerintro {
  font-size: clamp(40px, 8vw, 96px);
  font-family: "Cormorant Garamond", Sans-serif;
  font-weight: 600;
  line-height: 1.05;
  letter-spacing: -1.1px;
  color: #FFFFFF;
  text-align: center;
  margin: 0;
  text-wrap: balance;
}

/* ===================== Mobile menu ===================== */
@media (max-width: 800px) {
  #navigation { display: none; }
  .site-header {
  min-height: 60vh;
}
}@media (max-width: 460px) {
  .site-header {
  min-height: 50vh;
}
}

.mobile-toggle {
  display: none;
  position: relative;
  z-index: 1100;
  background: transparent;
  border: 0;
  width: 44px;
  height: 36px;
  padding: 0;
  cursor: pointer;
  margin: 8px 12px;
}

.mobile-toggle .bar {
  display: block;
  height: 3px;
  width: 100%;
  background: #fff;
  margin: 6px 0;
  transition: transform .25s ease, opacity .25s ease, background-color .25s ease;
}

@media (max-width: 800px) {
  .mobile-toggle {
    display: inline-block;
    position: absolute;
    margin-top: 30px;
  }
}

.mobile-toggle.is-open .bar:nth-child(1) { transform: translateY(9px) rotate(45deg); }
.mobile-toggle.is-open .bar:nth-child(2) { opacity: 0; }
.mobile-toggle.is-open .bar:nth-child(3) { transform: translateY(-9px) rotate(-45deg); }

.mobile-menu {
  position: absolute;
  left: 0; right: 0;
  top: 60px;
  background: #4c0c0c;
  border-top: 1px solid rgba(255, 255, 255, .15);
  z-index: 1090;
  display: none;
  padding: 10px 12px;
  backdrop-filter: saturate(110%) blur(2px);
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
  text-transform: uppercase;
}

.mobile-menu.is-open { display: block; }

@media (min-width: 801px) {
  .mobile-menu { display: none !important; }
}

.mobile-menu-list,
.mobile-menu-list .mod-menu__sub {
  list-style: none;
  margin: 0;
  padding: 0;
}

.mobile-menu-list > li {
  position: relative;
  border-bottom: 1px solid rgba(255, 255, 255, .15);
}

.mobile-menu-list > li:last-child { border-bottom: 0; }

.mobile-menu-list > li > a,
.mobile-menu-list > li > span {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  color: #fff;
  text-decoration: none;
  font-family: 'Montserrat', sans-serif;
  font-weight: 600;
  font-size: 16px;
  letter-spacing: 0.04em;
  padding: 12px 6px;
  white-space: nowrap;
  transition: color .2s ease, opacity .2s ease;
}

.mobile-menu-list > li > a:hover,
.mobile-menu-list > li > span:hover,
.mobile-menu-list > li > a:focus,
.mobile-menu-list > li > span:focus {
  color: #ff7a00;
}

.mobile-menu-list > li.parent > a::after,
.mobile-menu-list > li.parent > span::after {
  content: "";
  width: 0; height: 0;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-top: 7px solid #fff;
  transition: transform .2s ease, border-top-color .2s ease;
}

.mobile-menu-list > li.parent.open > a::after,
.mobile-menu-list > li.parent.open > span::after {
  transform: rotate(180deg);
  border-top-color: #ff7a00;
}

.mobile-menu-list .mod-menu__sub {
  display: none;
  background: white;
  border-left: 1px solid rgba(255, 255, 255, .15);
  margin-left: 8px;
  border-radius: 6px;
}

.mobile-menu-list .mod-menu__sub li a,
.mobile-menu-list .mod-menu__sub li span {
  display: block;
  color: black;
  padding: 10px 10px 10px 14px;
  font-size: 15px;
  line-height: 1.2;
  white-space: nowrap;
  font-family: 'Montserrat', sans-serif;
  font-weight: 600;
  text-decoration: none;
  border-top: 0.5px solid #acacab;
}

.mobile-menu-list .mod-menu__sub li a:hover,
.mobile-menu-list .mod-menu__sub li span:hover { color: #ff7a00; }

.mobile-menu-list li.open > .mod-menu__sub { display: block; }

.mobile-menu a,
.mobile-menu span,
.mobile-menu button {
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
}

.mobile-menu span { cursor: pointer; }

/* ===================== Misc. tweaks ===================== */
@media (max-width: 900px) { #logo { padding-top: 20px; } }

@media (max-width: 700px) {
  #logo img { width: clamp(120px, 28vw, 170px); }
}

@media (max-width: 800px) {
  #logo { margin-top: clamp(16px, 5vh, 56px); }
  .visually-hidden {
    position: absolute !important;
    height: 1px; width: 1px;
    overflow: hidden;
    clip: rect(1px, 1px, 1px, 1px);
    white-space: nowrap;
  }
}

@media (max-width: 768px) {
  .gridbox { min-height: 260px; }
}

#grid1 { background: url("../images/Terracotta-BG.jpg") top center/cover no-repeat; }
#grid2 { background: url("../images/Spices-BG.jpg") left/cover no-repeat; }
#grid3 { background: url("../images/LaSaj-Banquet-Room-2026-02-05-3.jpg") center/cover no-repeat; }
#grid4 { background: url("../images/Dishes-with-Hands-and-glasses.jpg") center/cover no-repeat; }
#grid5 { background: url("../images/Dishes-with-White-Plates.jpg") center/cover no-repeat; }
#grid6 { background: url("../images/Terracotta-BG.jpg") top center/cover no-repeat; }

.gridborder { border: 4px solid white; }

.gridcontent {
  flex: 1;
  height: 100%;
  display: flex;
  flex-direction: column;
  padding: 40px;
  border: 4px solid white;
  color: white;
  text-align: center;
}

.gridcontent h2 {
  font-size: clamp(40px, calc(1.2rem + 3vw), 120px);
  font-weight: 600;
  font-family: 'Cormorant Garamond',serif;
  line-height: 1.3em;
  text-transform: capitalize;
  margin: 0 0 10px 0;
}

.gridcontent p {
  font-size: 18px;
  font-weight: 200px;
  font-family: 'Montserrat', sans-serif;
  line-height: 1.5em;
  margin: 0 0 10px 0;
}

/*.grid-button-wrapper { margin-top: 20px; }*/

.grid-button-wrapper button {
  padding: 15px 30px;
  font-family: 'Montserrat', sans-serif;
  background-color: #F2BB33;
  color: white;
  border: none;
  text-transform: uppercase;
  font-size: 18px;
  font-weight: 600;
  cursor: pointer;
  transition: .5s ease;
  letter-spacing: 2px;
  margin-top: 10px;
}

.grid-button-wrapper button:hover {
  background-color: white;
  color: #F2BB33;
  border: none;
  text-transform: uppercase;
  cursor: pointer;
}

#menuorder {
  background: url("../images/Order-Background.jpg") center/cover no-repeat;
  padding: 100px 40px;
  text-align: center;
}

#menuorder h2 {
  font-size: clamp(40px, calc(1.2rem + 3vw), 120px);
  font-weight: 600;
  font-family: 'Cormorant Garamond',serif;
  line-height: 1.3em;
  text-transform: capitalize;
  margin: 0 0 10px 0;
  color: white;
}

footer {
  text-align: center;
  font-family: 'Montserrat', sans-serif;
  padding: 50px 40px 10px 40px !important;
  color: #991919;
}

footer nav { margin-left: auto; margin-right: auto; }

#copyright { line-height: 1.8em; font-size: 18px; font-weight: 500; }
#btmredlogo { 
  margin-bottom: 30px;
  max-width: 100px;
  width: 100%;
}

/*************** BOTTOM NAVIGATION ***************/
#btmnav {
  width: 100%;
  max-width: 1200px;
  z-index: 1000;
  height: auto;
  padding: 10px 20px 20px 20px;
  margin-top: 0;
}

.btmmenu,
.mod-menu__sub {
  list-style: none;
  margin: 0;
  padding: 0;
}

.btmmenu {
  display: flex;
  align-items: center;
  gap: 2rem;
  flex-wrap: wrap;
  justify-content: center;
  row-gap: 1rem;
}

.btmmenu > li {
  position: relative;
  flex: 0 1 auto;
  text-align: center;
}

.btmmenu > li > a,
.btmmenu > li > span {
  display: block;
  white-space: nowrap;
  line-height: 1.2;
}

.btmmenu a,
.btmmenu span {
  display: inline-block;
  color: #991919;
  text-decoration: none;
  font-family: 'Montserrat', sans-serif;
  font-weight: 500;
  font-size: 16px;
  letter-spacing: 0.04em;
  padding: .25rem 0;
  transition: color .2s ease, opacity .2s ease;
}

.btmmenu a:hover,
.btmmenu a:focus,
.btmmenu span:hover,
.btmmenu span:focus {
  color: #ff7a00;
  outline: none;
}

.btmmenu a:active,
.btmmenu span:active { opacity: .8; }

.btmmenu a::after,
.btmmenu span::after {
  content: "";
  display: block;
  height: 2px;
  background: transparent;
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform .25s ease, background-color .25s ease;
}

.btmmenu a:hover::after,
.btmmenu a:focus::after,
.btmmenu .active > a::after,
.btmmenu .current-menu-item > a::after,
.btmmenu .current_page_item > a::after,
.btmmenu span:hover::after,
.btmmenu span:focus::after,
.btmmenu .active > span::after,
.btmmenu .current-menu-item > span::after,
.btmmenu .current_page_item > span::after {
  background: #ff7a00;
  transform: scaleX(1);
}

/* Bottom submenus */
.btmmenu > li.parent { position: relative; }

.btmmenu > li.parent > a,
.btmmenu > li.parent > span { padding-right: 1.25em; }

.btmmenu > li.parent::after {
  content: "";
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 0; height: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 6px solid #991919;
  pointer-events: none;
}

.btmmenu > li.parent:hover::after,
.btmmenu > li.parent:focus-within::after {
  transform: translateY(-50%) rotate(180deg);
  border-top-color: #ff7a00;
}

.btmmenu .mod-menu__sub {
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  min-width: 200px;
  padding: .5rem 0;
  background: rgba(255, 255, 255, 1.0);
  border: 1px solid rgba(255, 255, 255, .15);
  display: none;
  z-index: 1000;
  box-shadow: 0 0 10px lightgray;
  border: thin solid #acacab;
  border-radius: 10px;
}

.btmmenu > li > .mod-menu__sub {
  left: auto;
  right: 0;
  transform: none;
  transform-origin: right top;
}

.btmmenu .mod-menu__sub li { text-align: center; }

.btmmenu .mod-menu__sub li a,
.btmmenu .mod-menu__sub li span {
  display: block;
  padding: .5rem .75rem;
  color: #000;
  white-space: nowrap;
  line-height: 1.2;
  font-family: 'Montserrat', sans-serif;
  font-weight: 600;
  text-decoration: none;
}

.btmmenu .mod-menu__sub li:hover,
.btmmenu .mod-menu__sub li:focus,
.btmmenu .mod-menu__sub .current-menu-item > a,
.btmmenu .mod-menu__sub .current-menu-item > span {
  background: rgba(255, 122, 0, .18);
  color: #ff7a00;
}

.btmmenu .parent:hover > .mod-menu__sub,
.btmmenu .parent:focus-within > .mod-menu__sub { display: block; }

.btmmenu .active > a,
.btmmenu .active > span,
.btmmenu .current-menu-item > a,
.btmmenu .current_page_item > a { color: #ff7a00 !important; }

.btmmenu .parent span {
  margin-right: 0 !important;
  padding-right: 0 !important;
}

/* ===== Bottom menu: vertical stack at 550px and below ===== */
@media (max-width: 550px) {
  #btmnav .btmmenu {
    flex-direction: column;
    align-items: center;
    gap: 8px;
  }

  #btmnav .btmmenu > li { text-align: center; }

  #btmnav .btmmenu > li > a,
  #btmnav .btmmenu > li > span {
    display: block;
    text-align: center;
    padding: 10px 0;
  }

  .btmmenu .parent { cursor: pointer; font-weight: 500; }

  #btmnav .btmmenu > li.parent::after { right: 10px; }

  .btmmenu > li > a,
  .btmmenu > li > span {
    display: inline-flex;
    align-items: center;
    gap: 0.35em;
  }

  .btmmenu > li.parent > a::before,
  .btmmenu > li.parent > span::before {
    content: "";
    width: 0; height: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 6px solid #991919;
  }

  .btmmenu > li.parent:hover > a::before,
  .btmmenu > li.parent:hover > span::before,
  .btmmenu > li.parent:focus-within > a::before,
  .btmmenu > li.parent:focus-within > span::before {
    border-top-color: #ff7a00;
    transform: rotate(180deg);
  }

  .btmmenu > li.parent::after { display: none; }

  .btmmenu > li.parent > a::before,
  .btmmenu > li.parent > span::before {
    position: static;
    margin: 0;
  }

  #btmnav .btmmenu {
    flex-direction: column;
    align-items: center;
    gap: 8px;
  }

  #btmnav .btmmenu > li { width: 100%; text-align: center; }

  #btmnav .btmmenu > li > a,
  #btmnav .btmmenu > li > span {
    display: inline-flex;
    justify-content: center;
    padding: 10px 0;
  }
}

/* Top & bottom – normalize clickable triggers */
.menu .parent > a,
.menu .parent > button,
.btmmenu .parent > a,
.btmmenu .parent > button,
.mobile-menu-list .parent > a,
.mobile-menu-list .parent > button,
.menu .parent > span,
.btmmenu .parent > span,
.mobile-menu-list .parent > span {
  display: inline-flex;
  align-items: center;
  gap: 0.35em;
  font-family: 'Montserrat', sans-serif;
  font-weight: 600;
  font-size: 16px;
  letter-spacing: .04em;
  color: white;
  text-decoration: none;
  background: transparent;
  border: 0;
  padding: .25rem 0;
  cursor: pointer;
}

.btmmenu .parent > span { margin-top: -1px; }

.btmmenu .parent > a,
.btmmenu .parent > span,
.btmmenu .parent > button {
  color: #991919;
  font-weight: 500;
}

.mobile-menu-list .parent > a,
.mobile-menu-list .parent > button { color: white; font-weight: 600; }

.mobile-menu-list .parent > button { margin-left: 5px; padding: 10px 0; }

/* Hover/focus colors (anchors & buttons) */
.menu .parent > a:hover,
.menu .parent > a:focus,
.menu .parent > button:hover,
.menu .parent > button:focus,
.btmmenu .parent > a:hover,
.btmmenu .parent > a:focus,
.btmmenu .parent > span:hover,
.btmmenu .parent > span:focus,
.btmmenu .parent > button:hover,
.btmmenu .parent > button:focus,
.mobile-menu-list .parent > a:hover,
.mobile-menu-list .parent > a:focus,
.mobile-menu-list .parent > button:hover,
.mobile-menu-list .parent > button:focus {
  color: #ff7a00;
  outline: none;
}

/* Underline for anchors and buttons */
.menu .parent > a::after,
.menu .parent > button::after,
.btmmenu .parent > a::after,
.btmmenu .parent > button::after,
.btmmenu .parent > span::after,
.mobile-menu-list .parent > a::after,
.mobile-menu-list .parent > button::after {
  content: "";
  display: block;
  height: 2px;
  background: transparent;
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform .25s ease, background-color .25s ease;
}

.menu .parent > a:hover::after,
.menu .parent > a:focus::after,
.menu .parent > button:hover::after,
.menu .parent > button:focus::after,
.btmmenu .parent > a:hover::after,
.btmmenu .parent > a:focus::after,
.btmmenu .parent > span:hover::after,
.btmmenu .parent > span:focus::after,
.btmmenu .parent > button:hover::after,
.btmmenu .parent > button:focus::after,
.mobile-menu-list .parent > a:hover::after,
.mobile-menu-list .parent > a:focus::after,
.mobile-menu-list .parent > button:hover::after,
.mobile-menu-list .parent > button:focus::after {
  background: #ff7a00;
  transform: scaleX(1);
}

/* Caret beside text (on ::before to avoid clashing with underline on ::after) */
.menu .parent > a::before,
.menu .parent > button::before,
.btmmenu .parent > a::before,
.btmmenu .parent > span::before,
.btmmenu .parent > button::before,
.mobile-menu-list .parent > a::before,
.mobile-menu-list .parent > button::before {
  content: "";
  width: 0; height: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 6px solid currentColor;
  transition: transform .2s ease;
}

/* Flip caret */
.menu li.parent:hover > a::before,
.menu li.parent:hover > button::before,
.menu li.parent:focus-within > a::before,
.menu li.parent:focus-within > button::before,
.menu li.parent.open > a::before,
.menu li.parent.open > button::before,
.btmmenu li.parent:hover > a::before,
.btmmenu li.parent:hover > span::before,
.btmmenu li.parent:hover > button::before,
.btmmenu li.parent:focus-within > a::before,
.btmmenu li.parent:focus-within > span::before,
.btmmenu li.parent:focus-within > button::before,
.btmmenu li.parent.open > a::before,
.btmmenu li.parent.open > span::before,
.btmmenu li.parent.open > button::before,
.mobile-menu-list li.parent:hover > a::before,
.mobile-menu-list li.parent:hover > button::before,
.mobile-menu-list li.parent:focus-within > a::before,
.mobile-menu-list li.parent:focus-within > button::before,
.mobile-menu-list li.parent.open > a::before,
.mobile-menu-list li.parent.open > button::before {
  transform: rotate(180deg);
}

/* Remove legacy caret on <li> itself */
.menu > li.parent::after,
.btmmenu > li.parent::after,
.mobile-menu-list > li.parent::after { display: none; }

#socialicons img {
  width: 30px;
  margin: 10px 0;
}

/* Top menu color + spacing (kept for specificity; hover is handled above) */
#topmenu > li > a,
#topmenu li span {
  color: white !important;
  line-height: .75;
}

/* If you used the absolute underline spacing approach for top menu */
#topmenu > li > a,
#topmenu > li > span { position: relative; }

#topmenu a::after,
#topmenu span::after {
  position: absolute;
  left: 0; right: 0;
  bottom: -4px;
  margin: 0;
}
/* correct the hover color highlight on topmenu */
#topmenu > li > a:hover,
#topmenu > li > a:focus,
#topmenu > li > span:hover,
#topmenu > li > span:focus {
  color: #ff7a00 !important;
}
/* Fixing the padding of Parent menu items on mobile menu list */
.mobile-menu-list .parent > span {
  padding: 12px 6px;
}
main {
  background-image: url("../images/Header-Option-scaled.jpg");
}
/*************** FOOD MENU STYLES ********************/
#foodmenu .grid-button-wrapper {
  text-align: center;
}
#foodmenu .grid-button-wrapper button {
  margin: 20px 10px;
}
@media (max-width: 1089px) {
  #foodmenu .grid-button-wrapper button {
    margin: 10px 10px 10px 10px;
  }
  #foodmenu .grid-button-wrapper {
    padding-top: 30px;
  }
}
#foodmenu .grid-button-wrapper a {
  text-decoration: none;
}
.foodsection {
  padding: 0px 20px;
  font-family: 'Montserrat',sans-serif;
}
.section {
  font-size: 40px;
  font-size: 1.8823529411765rem;
  font-weight: 900;
  font-family: 'Cormorant Garamond',serif;
  line-height: 1.3em;
  text-transform: capitalize;
  margin-bottom: 0px;
  color: black;
}
.policy {
  font-size: 15px;
  line-height: 1.3;
  margin: 0 0 8px 0;
  color: black;
}
.fooditem {
  font-size: 25px;
  font-weight: 900;
  color: #AC0000;
  font-family: 'Cormorant Garamond',serif;
  margin-top: 12px;
  margin-bottom: 2px;
}
.item-desc {
  font-size: 15px;
  font-weight: 500;
  line-height: 1.3;
  margin: 0 0 8px 0;
  color: #770202;
  margin-top: 0px;
  margin-bottom: 0px;
}
#menuverbage, #caterintro {
  padding: 20px;
  margin: 30px auto 40px auto;
  border-radius: 12px;
  background-color: rgba(255, 255, 255, 0.3);
}
/************** ABOUT US PAGE *******************/
.whatissaj {
  background: url("../images/FB-Vegetables-Dip-Image-1.jpg") center/cover no-repeat;
  width: 100%;
}
.aboutlasaj h2,
.aboutlasaj p {
  text-align: left !important;
}
.locationinfo strong {
  display: inline-block;
  font-size: 22px;
  margin-top: 10px;
}
.locationmap {
  padding: 0px !important;
  height: 500px;
}
.locationmap iframe {
  width: 100%;
  height: 100%;
}
#specials .gridcontent, 
#banquetpage .gridcontent {
  padding: 0px;
}
#specials .gridcontent h2, 
#banquetpage .gridcontent h2 {
  font-size: clamp(36px, calc(1.2rem + 1vw), 56px);
  margin-top: 20px;
}
#banquetpage .gridcontent h2 {
  margin-top: 0px !important;
}
#specials .gridcontent p,
#banquetpage .gridcontent p {
  margin-bottom: 20px;
  margin-left: 20px;
  margin-right: 20px;
}
#specials, #banquet {
  /*margin-top: 20px;
  display: flex;*/
  padding: 30px 0px;
  margin: 0 px 10px;
}
.specialbox {
  background-color: rgba(149, 4, 4, 0.5);
  padding; 10px;
}
.specialimages {
  margin: 0px;
  padding: 0px;
  width: 100%;
}
#lasaj-gallery-wrap {
  padding: 20px;
}
#cateringwrap, #menuverbage {
  padding: 32px; 0px;
}
#cateringwrap p, #menuverbage p {
  font-size: 18px;
  font-weight: 200px;
  font-family: 'Montserrat', sans-serif;
  line-height: 1.5em;
  margin: 0 0 10px 0;
}
#caterintro {
  padding: 20px 36px;
}
/* Panels hidden when [hidden] is present */
#foodmenu [role="tabpanel"][hidden] {
  display: none !important;
}

/* Visual active state for selected tab button */
.grid-button-wrapper .grid-btn button[aria-selected="true"] {
  outline: 0;
  /* Example highlight styles — adjust as needed */
  background: #b8860b;  /* gold-ish */
  color: #fff;
  border-color: #b8860b;
}
@media (max-width: 575px) {
  #menuverbage, #caterintro {
    border-radius: 0px;
    margin-bottom: 0px;
  }
  #caterintro {
    border-radius: 12px;
    margin-bottom: 10px;
  }
}

@media (max-width: 785px) {
  .site-2nd-header {
    background: url("../images/Secondary-Header-without-plates.jpg") top center/cover no-repeat;
    background-size: 100% auto;
  }
}
#banquettoastwraper {
  display: flex;
}
#menuverbage p {
  font-size: 14px !important;
}
#banquet h2 span {
  font-size: 22px;
}