/* perf: stand-in font sized like Poppins so text does not jump when Poppins loads */
@font-face{font-family:"Poppins Fallback";src:local("Arial"),local("Liberation Sans"),local("Helvetica");size-adjust:111.5%;ascent-override:94.2%;descent-override:31.4%;line-gap-override:9%}
:root {
  --primary: #00563F; /*#006039;*/ /*#357d52;*/ /*#D94F12;*/ /*#E8600C;*/ /* #e8281a; */
  --secondary: #f6a623; /*#d1490d;*/ /*#1f6335;*/ /*#D94F12;*/ /*#1a4724;*/ /*#F05E1C;*/ /* #f6a623; */
  --dark: #1a1a1a;
  --green: #003b2b; /*#2d6a4f;*/
  --yellow: #f6a623;
  --cream: #f7f5f5; /*#faf6ef;*/ /*#f7f6f5;*/  /*#fff8f0;*/
  --cream2: #fef0dc;
  --light: #f9f5f0;
  --shadow: 0 8px 40px rgba(0, 0, 0, 0.1);
  --shadow-lg: 0 20px 60px rgba(0, 0, 0, 0.18);
}
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
html {
  scroll-behavior: smooth;
}
body {
  font-family: "Poppins", "Poppins Fallback", sans-serif;
  color: #444;
  background: #fff;
  max-width: 100vw;
}
h1,
h2,
h3,
h4,
h5 {
  font-family: "Rubik";
  color: var(--dark);
}
a {
  text-decoration: none;
  transition: all 0.3s;
}
img {
  max-width: 100%;
}

/* ── Custom Scrollbar ── */
::-webkit-scrollbar {
  width: 10px;
}
::-webkit-scrollbar-track {
  background: #eee;
}
::-webkit-scrollbar-thumb {
  background: var(--green);
  border-radius: 10px;
  border: 2px solid #eee;
}
::-webkit-scrollbar-thumb:hover {
  background: var(--primary);
}

/* Firefox */
* {
  scrollbar-width: auto;
  scrollbar-color: var(--green) #eee;
}
/* ===================== TOP BAR ===================== */
#topbar {
  background: #111;
  padding: 8px 0;
  font-size: 0.82rem;
}
#topbar span {
  color: #aaa;
  margin-right: 16px;
}
#topbar span i {
  color: var(--secondary);
  margin-right: 5px;
}
#topbar .tsoc a {
  width: 27px;
  height: 27px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.08);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #bbb;
  font-size: 0.75rem;
  margin-left: 5px;
  transition: 0.3s;
}
#topbar .tsoc a:hover {
  background: var(--primary);
  color: #fff;
}
.ttag {
  background: var(--primary);
  color: #fff;
  padding: 2px 10px;
  border-radius: 20px;
  font-size: 0.7rem;
  font-weight: 600;
  text-transform: uppercase;
}

/* ===================== NAVBAR ===================== */
#nav {
  background: #fff;
  position: relative;
  z-index: 9995;
  box-shadow: 0 2px 20px rgba(0, 0, 0, 0.1);
  width: 100%;
}
/* Driven by an IntersectionObserver watching a 1px sentinel above the nav
   (see js/main.js) — this is the standard modern technique for a sticky
   header with extra logic. It runs off the main scroll thread, so there's
   no scroll-position math and no repeated layout reads to cause jank. */
#nav.nav-fixed {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
}
.navbar-brand {
  flex-shrink: 0;
  max-width: 60vw;
}
.nav-logo-img {
  height: 55px; /* 44px */
  width: auto;
  max-width: 100%;
  display: block;
}
@media (max-width: 480px) {
  .nav-logo-img {
    height: 40px;   /* 34px */
  }
}
.navbar-nav .nav-link {
  font-size: 0.87rem;
  font-weight: 500;
  color: #333 !important;  /* #333 */
  padding: 26px 13px !important;
  position: relative;
}
.navbar-nav .nav-link::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 0;
  height: 3px;
  background: var(--primary);
  border-radius: 3px 3px 0 0;
  transition: 0.3s;
}
.navbar-nav .nav-link:hover::after,
.navbar-nav .nav-link.active::after {
  width: 55%;
}
.navbar-nav .nav-link:hover {
  color: var(--primary) !important;
}
/* FIX 1 — Search btn in navbar */
#navSearchBtn {
  background: none;
  border: none;
  cursor: pointer;
  color: #555;
  font-size: 1rem;
  padding: 8px 10px;
  border-radius: 8px;
  transition: 0.3s;
}
#navSearchBtn:hover {
  background: rgba(232, 40, 26, 0.08);
  color: var(--primary);
}
.nav-cta {
 background: var(--primary); /*linear-gradient(135deg, var(--primary), #b01e14);*/ /*linear-gradient(135deg, var(--primary), #b01e14)*/  /*linear-gradient(135deg, var(--primary), #58761B);*/ /* linear-gradient(135deg, var(--primary), #c01e12); */
  color: #fff !important;
  border: none;
  border-radius: 50px;
  padding: 14px 24px !important;
  font-size: 0.85rem !important;   /* 0.84rem default */
  font-weight: 600 !important;
  /*box-shadow: 0 4px 15px rgba(232, 40, 26, 0.3);*/
  margin-left: 6px;
}
.nav-cta::after {
  display: none !important;
}
.nav-cta:hover {
  background: var(--green);
  transform: translateY(-2px);
  /*box-shadow: 0 8px 22px rgba(232, 40, 26, 0.4);*/
}
.navbar-toggler {
  background: var(--primary);              /* button background */
  border: 1px solid var(--primary); /* button border — color + width + style */
  border-radius: 8px;            /* optional: rounded corners */
}
.navbar-toggler.border-0 {
  border: 1px solid var(--primary) !important;
}
.navbar-toggler:focus {
  box-shadow: 0 0 0 0.2rem var(--primary); /* fallback: solid ring */
  box-shadow: 0 0 0 0.2rem var(--primary);
}
/* ===================== SECTION COMMONS ===================== */
section {
  padding: 70px 0;  /* 88px default */
}
.slbl {
  font-family: "Dancing Script", cursive;
  font-size: 1.35rem;
  color: var(--green);
  display: block;
  margin-bottom: 4px;
}
.stitle {
  font-size: clamp(1.9rem, 4vw, 2.7rem);
  font-weight: 900;
  line-height: 1.2;
  margin-bottom: 12px;
}
.stitle span {
  color: var(--yellow);
}
.sline {
  width: 58px;
  height: 4px;
  border-radius: 4px;
  background: linear-gradient(90deg, var(--primary), var(--secondary));
  margin: 0 auto 12px;
}
.sline.lft {
  margin-left: 0;
}
.sdesc {
  color: #777;
  font-size: 0.93rem;
  line-height: 1.8;
}
.btn-red {
  background: var(--green); /*linear-gradient(135deg, var(--primary), #c01e12);*/
  color: #fff;
  border: none;
  border-radius: 50px;
  padding: 14px 32px;
  font-weight: 600;
  font-size: 0.93rem;
  /*box-shadow: 0 8px 24px rgba(232, 40, 26, 0.35);*/
  transition: 0.3s;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  cursor: pointer;
  font-family: "Poppins", "Poppins Fallback", sans-serif;
}
.btn-red:hover {
  background: var(--primary);
  transform: translateY(-3px);
  /*box-shadow: 0 14px 34px rgba(232, 40, 26, 0.45);*/
  color: #fff;
}

/* ===================== HERO ===================== */
#hero {
  /*background-image: url('img/banner-img.jpg');
  background-size: cover;
  background-position: center;*/
  background: #fcfcf9;/*var(--cream);*/
  min-height: min(92vh, 800px);   /* min-height: 92vh; default */ 
  display: flex;
  align-items: center;
  position: relative;
  overflow: hidden;
}
#hero-thank-you {
  /*background-image: url('img/banner-img.jpg');
  background-size: cover;
  background-position: center;*/
  background: #fcfcf9;/*var(--cream);*/
  min-height: min(50vh, 800px);   /* min-height: 92vh; default */ 
  display: flex;
  align-items: center;
  position: relative;
  overflow: hidden;
}
.hbgtxt {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 22vw;
  font-weight: 900;
  font-family: "Playfair Display", serif;
  color: rgba(0, 0, 0, 0.04);
  pointer-events: none;
  white-space: nowrap;
  z-index: 0;
}
.hs {
  position: absolute;
  border-radius: 50%;
}
.hs1 {
  width: 480px;
  height: 480px;
  background: radial-gradient(circle, rgba(232, 40, 26, 0.07), transparent 70%);
  top: -90px;
  right: -80px;
  animation: fsh 8s ease-in-out infinite;
}
.hs2 {
  width: 280px;
  height: 280px;
  background: radial-gradient(
    circle,
    rgba(246, 166, 35, 0.09),
    transparent 70%
  );
  bottom: -50px;
  left: 8%;
  animation: fsh 10s ease-in-out infinite reverse;
}
@keyframes fsh {
  0%,
  100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-28px);
  }
}
.hbadge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: #fff;
  border-radius: 30px;
  padding: 6px 16px 6px 6px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
  margin-bottom: 22px;
}
.hbadge .hbi {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: var(--secondary); /*linear-gradient(135deg, var(--primary), var(--secondary));*/
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 0.78rem;
}
.hbadge span {
  font-size: 0.76rem;
  font-weight: 600;
  color: var(--dark);
}
.trc-award-card {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 10px;
  background: #fff;
  border-radius: 50px;
  padding: 10px 22px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
  margin-bottom: 22px;
}
.trc-award-img {
  height: 64px;
  width: auto;
  display: block;
  image-rendering: -webkit-optimize-contrast;
  image-rendering: high-quality;
}
@media (max-width: 991px) {
  /* Below this point the hero column itself goes full-width, so the badge
     should match that width instead of shrink-wrapping to its content and
     sitting stranded on one side of the screen. flex-basis + wrap (rather
     than a fixed percentage per image) means this keeps working cleanly
     no matter how many award images end up in the row. */
  .trc-award-card {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    justify-content: center;
    gap: 10px;
  }
  .trc-award-img {
    height: auto;
    flex: 1 1 100px;
    max-width: 130px;
    max-height: 64px;
    object-fit: contain;
  }
}
@media (max-width: 480px) {
  .trc-award-card {
    border-radius: 24px;
    padding: 10px 14px;
    gap: 8px;
  }
  .trc-award-img {
    flex-basis: 80px;
    max-width: 100px;
    max-height: 48px;
  }
}
.htitle {
  font-size: clamp(2.4rem, 4vw, 2.8rem);  /* 2.7rem 6vm 4.8rem default */
  font-weight: 900;
  line-height: 1.3;  /* 1.1 default */
  margin-bottom: 10px;      /*18px default*/
}
.htitle .hl {
  color: var(--secondary);
  position: relative;
  display: inline-block;
}
.htitle .hl::before {
  display: none;
}
.hdesc {
  font-size: 1rem;
  color: #666;
  line-height: 1.8;
  max-width: 520px;  /*470px default*/
  margin-bottom: 16px;
  text-align: justify;
}
.hdesc-thank-you {
  font-size: 1rem;
  color: #666;
  line-height: 1.8;
  max-width: ;  /*470px default*/
  margin: auto 20px 16px 20px;
  text-align: justify;
}
.hero__trust-pills {
  display: flex; flex-wrap: wrap; gap: 10px;
  margin-bottom: 16px;
}
.trust-pill {
  display: flex; align-items: center; gap: 6px;
  background: rgba(265, 166, 34, 0.1);   /* rgba(246,166,35,0.2) */
  border: 2px solid var(--green);
  padding: 6px 13px; border-radius: 8px;
  color: #333; font-size: 14px; font-weight: 500;
}

.hero__photo {
  margin-top: 32px;
}
.hero__photo img {
  width: 100%;
  display: block;
  border-radius: 10px;
  object-fit: cover;
}

/* FIX 2 — Video play button */
.btn-play {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  color: var(--dark);
  font-weight: 600;
  font-size: 0.9rem;
  padding: 10px 16px;
  transition: 0.3s;
  cursor: pointer;
}
.btn-play .pico {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: var(--yellow);
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.12);
  color: #fff;
  font-size: 0.95rem;
  transition: 0.3s;
  flex-shrink: 0;
  animation:pulse 1.2s ease-in-out infinite;
}
.btn-play:hover .pico {
  background: var(--green);
  color: #fff;
  transform: scale(1.1);
}
.btn-play:hover {
  color: var(--primary);
}
.hstats {
  display: flex;
  gap: 20px;
  flex-wrap: wrap;
  margin-top: 32px;
}
.hstat .snum {
  font-family: "Playfair Display", serif;
  font-size: 1.9rem;
  font-weight: 900;
  color: var(--dark);
  display: block;
  line-height: 1;
}
.hstat .snum em {
  color: var(--primary);
  font-style: normal;
}
.hstat small {
  font-size: 0.7rem;
  color: #aaa;
  text-transform: uppercase;
  letter-spacing: 1px;
}
.sdiv {
  width: 1px;
  background: #ddd;
  height: 38px;
  align-self: center;
}
.hcircle {
  width: 480px;
  height: 480px;
  border-radius: 50%;
  background: radial-gradient(circle at 40% 40%, #fff8f0, #ffe5c8);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto;
  position: relative;
  box-shadow: 0 28px 76px rgba(232, 40, 26, 0.14);
}
.hcircle img {
  width: 90%;
  height: 90%;
  object-fit: cover;
  border-radius: 50%;
}
/* Prevent hero circle from overflowing narrow viewports */
@media (max-width: 575px) {
  .hcircle {
    width: min(340px, 90vw) !important;
    height: min(340px, 90vw) !important;
  }
}
.hfcard {
  position: absolute;
  background: #fff;
  border-radius: 11px;
  padding: 10px 15px;
  box-shadow: var(--shadow);
  display: flex;
  align-items: center;
  gap: 9px;
}
.hfcard.fc1 {
  top: 55px;
  left: -15px;
  animation: fltc 4s ease-in-out infinite;
}
.hfcard.fc2 {
  bottom: 75px;
  right: -25px;
  animation: fltc 4s ease-in-out infinite 1.5s;
}
.hfcard.fc3 {
  top: 38%;
  right: -45px;
  animation: fltc 4s ease-in-out infinite 0.8s;
}
@keyframes fltc {
  0%,
  100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-9px);
  }
}
.fcoi {
  width: 34px;
  height: 34px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.95rem;
}
.fcoi.r {
  background: rgba(232, 40, 26, 0.11);
  color: var(--primary);
}
.fcoi.y {
  background: rgba(246, 166, 35, 0.14);
  color: var(--secondary);
}
.fcoi.g {
  background: rgba(45, 106, 79, 0.11);
  color: var(--green);
}
.fcnum {
  font-weight: 700;
  font-size: 0.92rem;
  color: var(--dark);
  display: block;
  line-height: 1;
}
.fcsm {
  font-size: 0.66rem;
  color: #999;
}

/* ===================== MARQUEE ===================== */
.mqsec {
  background: var(--green);
  padding: 13px 0;
  overflow: hidden;
}
.mqtrack {
  display: flex;
  gap: 38px;
  white-space: nowrap;
  animation: mqrun 22s linear infinite;
}
.mqitem {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: #fff;
  font-size: 0.86rem;
  font-weight: 500;
}
.mqitem i {
  color: rgba(246, 166, 35, 0.6);  /* rgba(255, 255, 255, 0.55) */
  font-size: 0.55rem;
}
@keyframes mqrun {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-50%);
  }
}

/* ===================== CATEGORY ===================== */
#category {
  background: var(--cream);
}
.catcard {
  background: #fff;
  border-radius: 15px;
  padding: 22px 14px;
  text-align: center;
  cursor: pointer;
  transition: 0.4s;
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.06);
  border: 2px solid transparent;
}
.catcard:hover,
.catcard.active {
  transform: translateY(-7px);
  box-shadow: 0 14px 38px rgba(232, 40, 26, 0.14);
  border-color: var(--green);
}
.catimg {
  width: 86px;
  height: 86px;
  border-radius: 50%;
  object-fit: cover;
  margin: 0 auto 12px;
  display: block;
  transition: 0.4s;
}
.catcard:hover .catimg {
  transform: scale(1.1) rotate(-4deg);
}
.catnm {
  font-size: 0.91rem;
  font-weight: 600;
  color: var(--dark);
  margin-bottom: 3px;
}
.catct {
  font-size: 0.77rem;
  color: #9c9c9c;
}

/* ===================== ABOUT ===================== */
#about {
  background: #fff;
}
.astack {
  position: relative;
}
.amain {
  border-radius: 18px;
  overflow: hidden;
  box-shadow: var(--shadow-lg);
}
.amain img {
  width: 100%;
  height: 440px;
  object-fit: cover;
  display: block;
}
.asm {
  position: absolute;
  bottom: -26px;
  right: -26px;
  width: 170px;
  height: 170px;
  border-radius: 14px;
  overflow: hidden;
  border: 5px solid #fff;
  box-shadow: var(--shadow);
}
.asm img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.aexp {
  position: absolute;
  top: 28px;
  left: -16px;
  background: var(--yellow);
  color: #fff;
  border-radius: 14px;
  padding: 18px 22px;
  text-align: center;
  box-shadow: 0 10px 28px rgba(232, 40, 26, 0.4);
}
.aexp .anum {
  font-family: "Playfair Display", serif;
  font-size: 2.3rem;
  font-weight: 900;
  line-height: 1;
  display: block;
}
.aexp small {
  font-size: 0.7rem;
  opacity: 0.9;
}
.fti {
  display: flex;
  align-items: flex-start;
  gap: 13px;
  margin-bottom: 18px;
}
.ftico {
  width: 46px;
  height: 46px;
  border-radius: 11px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.15rem;
  transition: 0.3s;
}
.ftico.r {
  background: rgba(232, 40, 26, 0.1);
  color: var(--primary);
}
.ftico.y {
  background: rgba(246, 166, 35, 0.11);
  color: var(--secondary);
}
.ftico.g {
  background: rgba(45, 106, 79, 0.1);
  color: var(--green);
}
.fti:hover .ftico {
  transform: scale(1.1);
}
.fti h6 {
  font-size: 0.9rem;
  font-weight: 700;
  color: var(--dark);
  margin-bottom: 2px;
  font-family: "Poppins", "Poppins Fallback", sans-serif;
}
.fti p {
  font-size: 0.8rem;
  color: #888;
  margin: 0;
  line-height: 1.6;
}

/* ===================== MENU ===================== */
#menu {
  background: var(--light);
}
/* FIX 3 — Filter buttons */
.filtbtn {
  border: 2px solid #e5e5e5;
  background: #fff;
  border-radius: 50px;
  padding: 8px 20px;
  font-size: 0.84rem;
  font-weight: 600;
  color: #666;
  cursor: pointer;
  transition: 0.3s;
  margin: 3px;
  font-family: "Poppins", "Poppins Fallback", sans-serif;
}
.filtbtn.active,
.filtbtn:hover {
  background: var(--primary);
  border-color: var(--primary);
  color: #fff;
  box-shadow: 0 5px 18px rgba(232, 40, 26, 0.24);
}
.mwrap {
  transition: 0.35s;
}
.mwrap.gone {
  display: none !important;
}
.mcard {
  background: #fff;
  border-radius: 18px;
  overflow: hidden;
  transition: 0.4s;
  box-shadow: 0 4px 22px rgba(0, 0, 0, 0.07);
  cursor: pointer;
}
.mcard:hover {
  transform: translateY(-9px);
  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.13);
}
.mimg {
  position: relative;
  overflow: hidden;
  height: 215px;
  background: var(--cream2);
}
.mimg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: 0.5s;
}
.mcard:hover .mimg img {
  transform: scale(1.09);
}
.mbdg {
  position: absolute;
  top: 13px;
  left: 13px;
  background: var(--primary);
  color: #fff;
  border-radius: 7px;
  padding: 3px 11px;
  font-size: 0.7rem;
  font-weight: 700;
}
.mbdg.new {
  background: var(--green);
}
.mbdg.hot {
  background: var(--secondary);
  color: var(--dark);
}
/* FIX 4 — Heart & Plus buttons stop propagation */
.mhrt {
  position: absolute;
  top: 13px;
  right: 13px;
  width: 33px;
  height: 33px;
  border-radius: 50%;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #ccc;
  cursor: pointer;
  transition: 0.3s;
  box-shadow: 0 2px 9px rgba(0, 0, 0, 0.1);
}
.mhrt:hover {
  color: var(--primary);
  transform: scale(1.18);
}
.mbody {
  padding: 18px;
}
.mcat {
  font-size: 0.7rem;
  font-weight: 600;
  color: var(--secondary);
  text-transform: uppercase;
  letter-spacing: 1px;
  margin-bottom: 5px;
}
.mtit {
  font-size: 1.05rem;
  font-weight: 700;
  margin-bottom: 5px;
  font-family: "Playfair Display", serif;
}
.mdesc {
  font-size: 0.78rem;
  color: #aaa;
  margin-bottom: 13px;
  line-height: 1.5;
}
.mfoot {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.mprice {
  font-size: 1.25rem;
  font-weight: 800;
  color: var(--primary);
  font-family: "Playfair Display", serif;
}
.mprice small {
  font-size: 0.72rem;
  font-weight: 400;
  color: #ccc;
  text-decoration: line-through;
  margin-left: 5px;
}
.mstars {
  font-size: 0.73rem;
  color: var(--yellow);
}
/* FIX 4 — Plus button opens detail popup */
.madd {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--primary), #c01e12);
  border: none;
  color: #fff;
  font-size: 1rem;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: 0.3s;
  box-shadow: 0 4px 11px rgba(232, 40, 26, 0.28);
}
.madd:hover {
  transform: scale(1.15) rotate(90deg);
}

/* ===================== SPECIAL OFFER ===================== */
#special {
  background: linear-gradient(135deg, #1a0000 0%, #2d0000 100%);
  position: relative;
  overflow: hidden;
}
.spbg {
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0.03;
  background: repeating-linear-gradient(
    45deg,
    #fff 0,
    #fff 1px,
    transparent 0,
    transparent 50%
  );
  background-size: 40px 40px;
}
.sptag {
  display: inline-block;
  background: var(--secondary);
  color: var(--dark);
  border-radius: 6px;
  padding: 4px 15px;
  font-size: 0.76rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 2px;
  margin-bottom: 14px;
}
.sptitle {
  font-size: clamp(2.3rem, 5vw, 3.8rem);
  font-weight: 900;
  color: #fff;
  line-height: 1.1;
}
.sptitle span {
  color: var(--secondary);
}
.spdesc {
  color: rgba(255, 255, 255, 0.62);
  margin: 18px 0;
  font-size: 0.93rem;
  line-height: 1.8;
}
.cdwrap {
  display: flex;
  gap: 14px;
  margin: 26px 0;
}
.cditem {
  text-align: center;
  background: rgba(255, 255, 255, 0.07);
  border: 1px solid rgba(255, 255, 255, 0.11);
  border-radius: 11px;
  padding: 13px 18px;
  min-width: 72px;
}
.cdnum {
  font-family: "Playfair Display", serif;
  font-size: 2.1rem;
  font-weight: 900;
  color: #fff;
  display: block;
  line-height: 1;
}
.cdlbl {
  font-size: 0.63rem;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: rgba(255, 255, 255, 0.48);
  margin-top: 3px;
  display: block;
}
.spimgw {
  position: relative;
  text-align: center;
}
.spglow {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 360px;
  height: 360px;
  border-radius: 50%;
  background: radial-gradient(
    circle,
    rgba(246, 166, 35, 0.24),
    transparent 70%
  );
}
.spimgw img {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: 440px;
  filter: drop-shadow(0 28px 56px rgba(246, 166, 35, 0.28));
  animation: fltimg 5s ease-in-out infinite;
}
@keyframes fltimg {
  0%,
  100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-17px);
  }
}
.sppbdg {
  position: absolute;
  top: 18px;
  left: 18px;
  z-index: 3;
  background: var(--primary);
  color: #fff;
  width: 86px;
  height: 86px;
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  box-shadow: 0 8px 24px rgba(232, 40, 26, 0.5);
  animation: plsbdg 2.5s ease-in-out infinite;
}
@keyframes plsbdg {
  0%,
  100% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.06);
    box-shadow: 0 12px 34px rgba(232, 40, 26, 0.7);
  }
}
.sppbdg .old {
  font-size: 0.68rem;
  text-decoration: line-through;
  opacity: 0.7;
}
.sppbdg .np {
  font-size: 1.25rem;
  font-weight: 900;
}

/* ===================== PARTNERS ===================== */
#partners {
  /*border: 2px solid blue;*/
  background: #fcfcf9; /*var(--cream);*/
  padding: 44px 0px 56px;
}
#partners .stitle {
  font-size: clamp(1.5rem, 3vw, 2.1rem);
}
.partnersSwiper {
  /*border: 2px solid red;
  max-width: 100%;*/
  padding: 8px 4px 6px;
}
.partnersSwiper .swiper-wrapper {
  align-items: stretch;
}
.partner-card {
  height: 96px;
  background: #fff; /*var(--light);*/
  border-radius: 15px;  /* 14px */
  display: flex;
  align-items: center;
  cursor: pointer;
  justify-content: center;
  padding: 16px 16px;  /* 16px 26px */
  /*box-shadow: ;*/ /*var(--shadow);*/  
  transition: 0.4s;
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.03);   /* 0.6 */
  border: 2px solid transparent;
}
.partner-card:hover,
.partner-card.active {
  transform: translateY(-7px);
  box-shadow: 0 14px 38px rgba(232, 40, 26, 0.14);
  border-color: var(--green);
}
.partner-card img {
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
}
@media (min-width: 992px) {
  .partnersSwiper {
    padding: 8px 0 6px;
  }
  .partner-card {
    height: 110px;
  }
}

/* ===================== GALLERY ===================== */
#gallery {
  background: var(--light);
}
.ggrid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: repeat(2, 215px);
  grid-auto-rows: 215px;
  gap: 13px;
}
.gitem {
  border-radius: 14px;
  overflow: hidden;
  position: relative;
  cursor: pointer;
}
.gitem:first-child {
  grid-row: span 2;
}
.gitem-img {
  position: absolute;
  inset: 0;
  overflow: hidden;
}
.gitem-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: 0.5s;
}
.gitem:hover .gitem-img img {
  transform: scale(1.08);
}
.gitem-play {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.55);
  border: 2px solid #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 18px;
  z-index: 2;
  transition: 0.25s;
}
.gitem-play i {
  margin-left: 3px; /* optically centers the play triangle */
}
.gitem-video:hover .gitem-play {
  background: var(--secondary);
  transform: translate(-50%, -50%) scale(1.1);
}
/* original behaviour: caption only appears on hover, transparent otherwise */
.gitem-cap {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(0, 0, 0, 0.76), transparent 60%);
  opacity: 0;
  transition: 0.4s;
  display: flex;
  align-items: flex-end;
  padding: 18px;
}
.gitem:hover .gitem-cap {
  opacity: 1;
}
.gitem-cap span {
  color: #fff;
  font-weight: 600;
  font-size: 0.88rem;
  display: flex;
  align-items: center;
}
.gitem-cap i {
  color: var(--secondary);
  margin-right: 5px;
  font-size: 0.8rem;
}
.gitem-desc {
  display: none; /* shown only on the mobile/tablet swipeable card layout */
}
.gswipehint {
  display: none; /* shown only on tablet/mobile */
  align-items: center;
  justify-content: center;
  gap: 7px;
  color: #aaa;
  font-size: 0.82rem;
  margin: -20px 0 18px;
  letter-spacing: 0.02em;
}
.gdesktophint,
.greadmore-wrap {
  display: none; /* shown only on desktop, see the min-width:992px block below */
}
@media (min-width: 992px) {
  .gdesktophint {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    color: #aaa;
    font-size: 0.82rem;
    margin: -20px 0 18px;
    letter-spacing: 0.02em;
  }
  .ggrid .gitem-extra {
    display: none !important;
  }
  .ggrid.g-expanded .gitem-extra {
    display: block !important;
  }
  .greadmore-wrap {
    display: block;
    text-align: center;
    margin-top: 26px;
  }
  .greadmore-btn {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    background: var(--secondary);
    color: var(--dark);
    border: none;
    border-radius: 50px;
    padding: 13px 32px;
    font-weight: 700;
    font-size: 0.92rem;
    cursor: pointer;
    font-family: "Poppins", "Poppins Fallback", sans-serif;
    transition: background .2s, transform .15s;
  }
  .greadmore-btn:hover {
    background: var(--primary);
    color: #fff;
    transform: translateY(-1px);
  }
  .greadmore-btn i {
    transition: transform .25s;
  }
  .greadmore-btn.g-open i {
    transform: rotate(180deg);
  }
}

/* ===================== HISTORY — FIX 8 ===================== */
#history {
  position: relative;
  background-image:
    linear-gradient(rgba(256, 256, 256, 0.85), rgba(256, 256, 256, 0.85)),
    url('../img/history.jpg');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
#history .stitle {
  color: #000;
}
#history .sdesc {
  color: rgba(0, 0, 0, 0.85);
}
#history .tlyear {
  color: var(--secondary);
}
#history .tl-left h5,
#history .tl-right h5 {
  color: #000;
}
#history .tl-left p,
#history .tl-right p {
  color: rgba(0, 0, 0, 0.8);
}
.timeline {
  position: relative;
  padding: 18px 0;
}
.timeline::before {
  content: "";
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  width: 2px;
  background: linear-gradient(to bottom, var(--secondary), var(--primary));
  top: 0;
  bottom: 0;
}
/* Grid: left-col | dot-col | right-col */
.tli {
  display: grid;
  grid-template-columns: 1fr 36px 1fr;
  margin-bottom: 50px;
  align-items: start;
}
.tl-left {
  padding-right: 32px;
  text-align: right;
}
.tl-center {
  display: flex;
  justify-content: center;
  padding-top: 5px;
}
.tl-right {
  padding-left: 32px;
  text-align: left;
}
/* ODD → show LEFT text, hide RIGHT */
.tli:nth-child(odd) .tl-right {
  visibility: hidden;
}
/* EVEN → hide LEFT, show RIGHT */
.tli:nth-child(even) .tl-left {
  visibility: hidden;
}
.tldot {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: var(--yellow);
  border: 4px solid #fff;
  box-shadow: 0 0 0 3px rgba(0, 59, 43, 0.5);  /*rgba(232, 40, 26, 0.3);*/
  flex-shrink: 0;
}
.tlyear {
  font-family: "Dancing Script", cursive;
  color: var(--green);
  font-size: 1.15rem;
  margin-bottom: 3px;
}
.tl-left h5,
.tl-right h5 {
  font-size: 1.05rem;
  font-weight: 700;
  margin-bottom: 7px;
  font-family: "Rubik", Playfair Display, serif;
  color: var(--dark);
}
.tl-left p,
.tl-right p {
  font-size: 0.83rem;
  color: #888;
  line-height: 1.7;
  margin: 0;
}
@media (max-width: 767px) {
  .timeline::before {
    left: 16px;
  }
  .tli {
    grid-template-columns: 32px 1fr;
    gap: 0;
  }
  .tl-left {
    display: none;
  }
  .tl-right {
    display: block !important;
    visibility: visible !important;
    padding-left: 18px;
    text-align: left;
  }
  .tl-center {
    padding-top: 5px;
  }
  .tli:nth-child(even) .tl-left {
    display: none;
  }
  .tli:nth-child(odd) .tl-right {
    visibility: visible !important;
  }
}

/* ===================== CHEFS ===================== */
#chefs {
  background: #fff;
}
.chcard {
  border-radius: 18px;
  overflow: hidden;
  background: #fff;
  transition: 0.4s;
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.07);
}
.chcard:hover {
  transform: translateY(-9px);
  box-shadow: var(--shadow-lg);
}
.chimg {
  position: relative;
  overflow: hidden;
  height: 268px;
  background: var(--cream2);
}
.chimg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top;
  transition: 0.5s;
}
.chcard:hover .chimg img {
  transform: scale(1.05);
}
.chsoc {
  position: absolute;
  bottom: -50px;
  left: 0;
  right: 0;
  display: flex;
  justify-content: center;
  gap: 7px;
  transition: 0.4s;
  padding: 10px 0;
  background: linear-gradient(to top, rgba(0, 0, 0, 0.7), transparent);
}
.chcard:hover .chsoc {
  bottom: 0;
}
.chsoc a {
  width: 33px;
  height: 33px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.2);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 0.78rem;
  transition: 0.3s;
}
.chsoc a:hover {
  background: var(--primary);
}
.chbody {
  padding: 18px;
  text-align: center;
}
.chnm {
  font-size: 1.05rem;
  font-weight: 700;
  margin-bottom: 2px;
}
.chrole {
  font-size: 0.78rem;
  color: var(--primary);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.8px;
}
.chexp {
  font-size: 0.76rem;
  color: #bbb;
  margin-top: 5px;
}

/* ===================== HOURS ===================== */
#hours {
  background: linear-gradient(135deg, var(--green), #1a4a35);
  position: relative;
  overflow: hidden;
}
.hrsbg {
  position: absolute;
  inset: 0;
  opacity: 0.05;
  background: repeating-linear-gradient(
    45deg,
    #fff 0,
    #fff 1px,
    transparent 0,
    transparent 50%
  );
  background-size: 28px 28px;
}
.hrscard {
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 18px;
  padding: 28px;
}
.hrsrow {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 13px 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.09);
}
.hrsrow:last-child {
  border: none;
}
.hrsday {
  color: rgba(255, 255, 255, 0.78);
  font-size: 0.9rem;
  font-weight: 500;
}
.hrstime {
  color: #fff;
  font-weight: 700;
  font-size: 0.9rem;
}
.hdot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
}
.hdot.on {
  background: #4ade80;
  box-shadow: 0 0 7px #4ade80;
}
.hdot.off {
  background: #ff6b6b;
}
.hrscta {
  background: var(--secondary);
  border-radius: 18px;
  padding: 28px;
  text-align: center;
  box-shadow: 0 18px 48px rgba(232, 40, 26, 0.4);
}
.hrscta h4 {
  color: #fff;
  font-size: 1.4rem;
  font-weight: 800;
}
.hrscta p {
  color: rgba(255, 255, 255, 0.78);
  font-size: 0.86rem;
  margin: 9px 0 18px;
}
.btnw {
  background: #fff;
  color: var(--green);
  border-radius: 50px;
  padding: 11px 28px;
  font-weight: 700;
  font-size: 0.88rem;
  display: inline-block;
  transition: 0.3s;
}
.btnw:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.2);
  color: var(--primary);
}

/* ===================== TESTIMONIALS ===================== */
#testimonials {
  background: #fff;
}
.tescard {
  background: var(--cream);
  border-radius: 18px;
  padding: 28px;
  position: relative;
  overflow: hidden;
  transition: 0.4s;
}
.tescard:hover {
  transform: translateY(-3px);
  box-shadow: var(--shadow);
}
.tesq {
  position: absolute;
  top: 18px;
  right: 22px;
  font-size: 4.5rem;
  color: rgba(232, 40, 26, 0.07);
  font-family: "Playfair Display", serif;
  line-height: 1;
}
.tess {
  color: var(--yellow);
  font-size: 1.45rem;
  margin: 12px auto;
}
.testxt {
  font-size: 0.88rem;
  color: #666;
  line-height: 1.8;
  margin-bottom: 10px;
}
.tesauth {
  display: flex;
  align-items: center;
  gap: 11px;
}
.tesauth img {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  object-fit: cover;
  border: 3px solid var(--secondary);
}
.tesnm {
  font-weight: 700;
  font-size: 1.15rem;
  color: var(--dark);
  margin-bottom: 1px;
  font-family: "Poppins", "Poppins Fallback", sans-serif;
}
.tesrl {
  font-size: 0.76rem;
  color: #888;
  font-weight: 600;
}
.tescard-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
.tes-google-badge {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  background: #fff;
  border-radius: 50%;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
  flex-shrink: 0;
}
.tes-google-icon {
  width: 35px;
  height: 35px;
  display: block;
}
.tesreply {
  margin-top: 14px;
  background: #fff;
  border-left: 3px solid var(--primary);
  border-radius: 8px;
  padding: 12px 14px;
}
.tesreply-head {
  font-weight: 700;
  color: var(--primary);
  font-size: 0.82rem;
  margin-bottom: 4px;
}
.tesreply-text {
  font-size: 0.83rem;
  color: #666;
  line-height: 1.6;
  margin: 0;
  font-style: italic;
}
.reviews__inner {}
.reviews__aggregate {
  display: flex; align-items: center; justify-content: center; gap: 20px;
  margin: 25px 0px 36px 0px; flex-wrap: wrap;
}
.reviews__aggregate-score {
  font-size: 64px; font-weight: 800; color:;
  line-height: 1; letter-spacing: -1px;
}
.reviews__aggregate-detail { display: flex; flex-direction: column; gap: 4px; }
.reviews__aggregate-stars { font-size: 26px; color: var(--yellow);}
.reviews__aggregate-count { font-size: 14px; color: #708090; font-weight: 500; }
.reviews__aggregate-platforms {
  display: flex; gap: 10px; flex-wrap: wrap; margin-top: 6px;
}
.plat-badge {
  display: flex; align-items: center; gap: 6px;
  background: var(--cream); border: 1px solid #d3d3d3;
  border-radius: 4px; padding: 7px 12px;
  font-size: 13px; font-weight: 600; color:;
}

/* ===================== RESERVATION — FIX 5 ===================== */
#reservation {
  background: var(--light);
}
.resico {
  width: 54px;
  height: 54px;
  border-radius: 13px;
  background: rgba(232, 40, 26, 0.1);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--primary);
  font-size: 1.25rem;
  flex-shrink: 0;
}
.flbl {
  font-size: 0.83rem;
  font-weight: 600;
  color: var(--dark);
  margin-bottom: 5px;
  display: block;
}
.fctrl {
  width: 100%;
  border: 2px solid #eee;
  border-radius: 9px;
  padding: 11px 15px;
  font-family: "Poppins", "Poppins Fallback", sans-serif;
  font-size: 0.88rem;
  outline: none;
  transition: 0.3s;
  color: var(--dark);
  background: #fff;
  appearance: auto;
}
.fctrl:focus {
  border-color: var(--primary);
}
.fcard {
  position: relative;
  background: #fff;
  border-radius: 18px;
  padding: 32px;
  box-shadow: 0 6px 30px rgba(0, 0, 0, 0.08);
}
.sucmsg {
  display: none;
  text-align: center;
  padding: 16px;
  background: rgba(45, 106, 79, 0.07);
  border-radius: 11px;
  margin-top: 14px;
}
.sucmsg i {
  color: var(--green);
  font-size: 1.7rem;
  display: block;
  margin-bottom: 7px;
}
.sucmsg p {
  color: var(--green);
  font-weight: 600;
  margin: 0;
  font-size: 0.88rem;
}

/* ===================== BLOG ===================== */
#blog {
  background: var(--light);
}
.blcard {
  background: #fff;
  border-radius: 18px;
  overflow: hidden;
  transition: 0.4s;
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.06);
}
.blcard:hover {
  transform: translateY(-7px);
  box-shadow: var(--shadow-lg);
}
.blimg {
  position: relative;
  height: 195px;
  overflow: hidden;
}
.blimg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: 0.5s;
}
.blcard:hover .blimg img {
  transform: scale(1.06);
}
.bldatebdg {
  position: absolute;
  top: 14px;
  left: 14px;
  background: var(--secondary);
  color: #fff;
  border-radius: 9px;
  padding: 5px 11px;
  text-align: center;
  line-height: 1.2;
}
.bldatebdg .bd {
  font-size: 1.15rem;
  font-weight: 800;
  display: block;
}
.bldatebdg .bm {
  font-size: 0.63rem;
  text-transform: uppercase;
  letter-spacing: 0.8px;
}
.blbody {
  padding: 20px;
}
.bltag {
  font-size: 0.7rem;
  font-weight: 600;
  color: var(--secondary);
  text-transform: uppercase;
  letter-spacing: 0.8px;
  margin-bottom: 7px;
}
.bltit {
  font-size: 1rem;
  font-weight: 700;
  margin-bottom: 9px;
  line-height: 1.4;
}
.bltit a {
  color: var(--dark);
}
.bltit a:hover {
  color: var(--primary);
}
.blmeta {
  display: flex;
  gap: 14px;
  font-size: 0.76rem;
  color: #bbb;
  margin-bottom: 13px;
}
.blmeta i {
  color: var(--secondary);
  margin-right: 3px;
}
.blmore {
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--primary);
  display: inline-flex;
  align-items: center;
  gap: 5px;
}
.blmore i {
  transition: 0.3s;
}
.blmore:hover {
  color: var(--secondary);
}
.blmore:hover i {
  transform: translateX(5px);
}

/* ===================== NEWSLETTER ===================== */
#newsletter {
  background: var(--primary);
  position: relative;
  overflow: hidden;
  padding: 80px 0;
}
.nlbg {
  position: absolute;
  inset: 0;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100'%3E%3Ccircle cx='50' cy='50' r='40' fill='none' stroke='white' stroke-width='.4' opacity='.1'/%3E%3C/svg%3E");
  background-size: 75px;
}
.nlw {
  position: relative;
  z-index: 2;
}
.nlw h2 {
  color: #fff;
  font-size: 2.1rem;
}
/* Newsletter form — fixed layout */
.nl-form-wrap {
  display: flex;
  gap: 10px;
  max-width: 560px;
  margin: 0 auto;
  align-items: center;
}
.nlinput {
  flex: 1;
  min-width: 0;
  border: none;
  border-radius: 50px;
  padding: 14px 22px;
  font-size: 0.9rem;
  outline: none;
  font-family: "Poppins", "Poppins Fallback", sans-serif;
  color: #333;
}
.nlbtn {
  flex-shrink: 0;
  background: var(--secondary);
  color: var(--dark);
  border: none;
  border-radius: 50px;
  padding: 14px 26px;
  font-weight: 700;
  font-size: 0.9rem;
  cursor: pointer;
  white-space: nowrap;
  transition: 0.3s;
  font-family: "Poppins", "Poppins Fallback", sans-serif;
}
.nlbtn:hover {
  transform: scale(1.05);
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.2);
}
@media (max-width: 540px) {
  .nl-form-wrap {
    flex-direction: column;
    padding: 0 10px;
  }
  .nlinput {
    width: 100%;
    border-radius: 12px;
  }
  .nlbtn {
    width: 100%;
    border-radius: 12px;
  }
}

/* ===================== CONTACT — FIX 6 ===================== */
#contact-section {
  background: #fff;
}
.ctdark {
  background: var(--dark);
  border-radius: 18px;
  padding: 38px;
  height: 100%;
}
.ctdark h4 {
  color: #fff;
  margin-bottom: 7px;
}
.ctdark .ctsub {
  color: rgba(255, 255, 255, 0.58);
  font-size: 0.88rem;
  margin-bottom: 26px;
}
.ctitem {
  display: flex;
  gap: 13px;
  margin-bottom: 20px;
  align-items: flex-start;
}
.cticon {
  width: 40px;
  height: 40px;
  border-radius: 9px;
  background: rgba(265, 166, 34, 0.18); /*rgba(232, 40, 26, 0.18);*/
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--secondary);
  font-size: 0.9rem;
  flex-shrink: 0;
}
.ctinfo strong {
  display: block;
  color: #aaa;
  font-size: 0.73rem;
  text-transform: uppercase;
  letter-spacing: 0.8px;
  margin-bottom: 1px;
  font-family: "Poppins", "Poppins Fallback", sans-serif;
}
.ctinfo span {
  color: #fff;
  font-size: 0.87rem;
}
.ctsocrow {
  display: flex;
  gap: 8px;
  margin-top: 14px;
}
.ctsocrow a {
  width: 35px;
  height: 35px;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.09);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #bbb;
  transition: 0.3s;
}
.ctsocrow a:hover {
  background: var(--secondary);
  color: #fff;
}

/* ===================== FOOTER ===================== */
footer {
  background: var(--dark);
  padding: 68px 0 0;
}
.footer-logo-img {
  height: 52px;
  width: auto;
  max-width: 100%;
  display: block;
  margin-bottom: 18px;
}
.fdesc {
  color: #777;
  font-size: 0.86rem;
  line-height: 1.8;
  margin-top: 9px;
}
.fsoc {
  display: flex;
  gap: 9px;
  margin-top: 18px;
}
.fsoc a {
  width: 36px;
  height: 36px;
  border-radius: 9px;
  background: rgba(255, 255, 255, 0.06);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #777;
  font-size: 0.88rem;
  transition: 0.3s;
}
.fsoc a:hover {
  background: var(--secondary);
  color: #fff;
  transform: translateY(-3px);
}
.ftit {
  color: #fff;
  font-size: 0.95rem;
  font-weight: 700;
  margin-bottom: 18px;
  padding-bottom: 9px;
  border-bottom: 2px solid var(--secondary);
  display: inline-block;
  font-family: "Poppins", "Poppins Fallback", sans-serif;
}
.flinks li {
  list-style: none;
  margin-bottom: 9px;
}
.flinks a {
  color: #777;
  font-size: 0.86rem;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  transition: 0.3s;
}
.flinks a:hover {
  color: var(--secondary);
  padding-left: 5px;
}
.flinks a i {
  color: var(--secondary);
  font-size: 0.68rem;
}
.fci {
  display: flex;
  align-items: flex-start;
  gap: 11px;
  margin-bottom: 14px;
}
.fciico {
  width: 34px;
  height: 34px;
  border-radius: 7px;
  background: rgba(265, 166, 34, 0.18); /* rgba(232, 40, 26, 0.14); */
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--secondary);
  font-size: 0.82rem;
  flex-shrink: 0;
}
.fciinfo {
  color: #777;
  font-size: 0.83rem;
  line-height: 1.6;
}
.fciinfo strong {
  color: #bbb;
  display: block;
  font-size: 0.77rem;
}
.fbot {
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  padding: 18px 0;
  margin-top: 46px;
}
.fbot p {
  color: #555;
  font-size: 0.8rem;
  margin: 0;
}
.fbot span {
  color: var(--primary);
}
.fbot a {
  color: #555;
  font-size: 0.8rem;
  margin-left: 18px;
}
.fbot a:hover {
  color: var(--secondary);
}

/* ===================== UTILITIES ===================== */
#btt {
  position: fixed;
  bottom: 28px;
  right: 28px;
  z-index: 9995;
  width: 44px;
  height: 44px;
  border-radius: 11px;
  background: var(--green);
  color: #fff;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.95rem;
  /*box-shadow: 0 6px 18px rgba(232, 40, 26, 0.38);*/
  opacity: 0;
  transform: translateY(18px);
  transition: 0.4s;
}
#btt.show {
  opacity: 1;
  transform: translateY(0);
}
#btt:hover {
  transform: translateY(-4px) !important;
}
.cartfl {
  position: fixed;
  bottom: 28px;
  left: 28px;
  z-index: 9990;
  background: var(--secondary);
  border-radius: 50px;
  padding: 11px 18px;
  display: flex;
  align-items: center;
  gap: 9px;
  box-shadow: 0 7px 22px rgba(246, 166, 35, 0.38);
  cursor: pointer;
  transition: 0.3s;
  color: var(--dark);
  font-weight: 700;
  font-size: 0.88rem;
}
.cartfl:hover {
  transform: translateY(-4px);
}
.cartfl .ccount {
  background: var(--primary);
  color: #fff;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.68rem;
  font-weight: 800;
}

/* ====================================================
   ALL POPUP / MODAL STYLES
==================================================== */

/* --- FIX 1: SEARCH POPUP --- */
#searchOv {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 99999;
  background: rgba(5, 5, 5, 0.97);
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  padding-top: 78px;
}
#searchOv.open {
  display: flex;
  animation: fadeov 0.28s ease;
}
@keyframes fadeov {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
#searchOv .sovclose {
  position: absolute;
  top: 22px;
  right: 28px;
  background: rgba(255, 255, 255, 0.08);
  border: none;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 1.15rem;
  cursor: pointer;
  transition: 0.3s;
}
#searchOv .sovclose:hover {
  background: var(--primary);
}
.sovbox {
  width: 100%;
  max-width: 680px;
  padding: 0 18px;
}
.sovbox h4 {
  color: #fff;
  text-align: center;
  font-size: 1.5rem;
  margin-bottom: 26px;
  font-family: "Playfair Display", serif;
}
.sovinput {
  display: flex;
  border: 2px solid rgba(255, 255, 255, 0.18);
  border-radius: 60px;
  overflow: hidden;
  background: rgba(255, 255, 255, 0.05);
}
.sovinput input {
  flex: 1;
  background: transparent;
  border: none;
  padding: 17px 24px;
  color: #fff;
  font-size: 1.05rem;
  font-family: "Poppins", "Poppins Fallback", sans-serif;
  outline: none;
}
.sovinput input::placeholder {
  color: rgba(255, 255, 255, 0.38);
}
.sovinput button {
  background: var(--primary);
  border: none;
  padding: 0 26px;
  color: #fff;
  font-size: 1.1rem;
  cursor: pointer;
  transition: 0.3s;
}
.sovinput button:hover {
  background: #c01e12;
}
.sovcats {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  justify-content: center;
  margin-top: 28px;
}
.sovcat {
  background: rgba(255, 255, 255, 0.07);
  border: 1px solid rgba(255, 255, 255, 0.13);
  border-radius: 50px;
  padding: 7px 18px;
  color: rgba(255, 255, 255, 0.78);
  font-size: 0.83rem;
  cursor: pointer;
  transition: 0.3s;
  display: flex;
  align-items: center;
  gap: 7px;
  font-family: "Poppins", "Poppins Fallback", sans-serif;
}
.sovcat img {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  object-fit: cover;
}
.sovcat:hover,
.sovcat.active {
  background: var(--primary);
  border-color: var(--primary);
  color: #fff;
}
.sovtrend {
  text-align: center;
  margin-top: 26px;
}
.sovtrend p {
  color: rgba(255, 255, 255, 0.45);
  font-size: 0.8rem;
  margin-bottom: 9px;
}
.sovtrend .ttag {
  display: inline-block;
  margin: 3px;
  background: rgba(246, 166, 35, 0.13);
  border: 1px solid rgba(246, 166, 35, 0.28);
  color: var(--secondary);
  border-radius: 20px;
  padding: 3px 13px;
  font-size: 0.76rem;
  cursor: pointer;
  transition: 0.3s;
}
.sovtrend .ttag:hover {
  background: var(--secondary);
  color: var(--dark);
}

/* --- FIX 4: MENU DETAIL POPUP --- */
#menuPop {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 99999;
  background: rgba(0, 0, 0, 0.84);
  backdrop-filter: blur(5px);
  align-items: center;
  justify-content: center;
  padding: 18px;
}
#menuPop.open {
  display: flex;
  animation: fadeov 0.28s ease;
}
.mpbox {
  background: #fff;
  border-radius: 22px;
  max-width: 800px;
  width: 100%;
  max-height: 88vh;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: #ccc transparent;
  position: relative;
  display: flex;
  flex-wrap: wrap;
}
.mpbox::-webkit-scrollbar {
  width: 3px;
}
.mpbox::-webkit-scrollbar-thumb {
  background: var(--primary);
}
.mpbox .mpimg {
  width: 44%;
  background: var(--cream2);
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 22px 0 0 22px;
  overflow: hidden;
  min-height: 400px;
}
.mpbox .mpimg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.mpbox .mpbody {
  width: 56%;
  padding: 34px 30px;
}
.mpclose {
  position: absolute;
  top: 14px;
  right: 14px;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: #f2f2f2;
  border: none;
  font-size: 0.95rem;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: 0.3s;
  z-index: 2;
}
.mpclose:hover {
  background: var(--primary);
  color: #fff;
}
#mpCat {
  font-size: 0.7rem;
  font-weight: 700;
  color: var(--secondary);
  text-transform: uppercase;
  letter-spacing: 1.3px;
  margin-bottom: 7px;
}
#mpTitle {
  font-size: 1.7rem;
  font-weight: 900;
  margin-bottom: 9px;
  font-family: "Playfair Display", serif;
  color: var(--dark);
}
#mpStars {
  color: var(--secondary);
  font-size: 0.88rem;
  margin-bottom: 14px;
}
#mpDesc {
  font-size: 0.88rem;
  color: #777;
  line-height: 1.8;
  margin-bottom: 18px;
}
#mpPrice {
  font-size: 1.9rem;
  font-weight: 900;
  color: var(--primary);
  margin-bottom: 14px;
  font-family: "Playfair Display", serif;
}
#mpPrice small {
  font-size: 0.95rem;
  color: #ccc;
  text-decoration: line-through;
  margin-left: 7px;
}
.mpmeta {
  display: flex;
  gap: 12px;
  margin-bottom: 20px;
  flex-wrap: wrap;
}
.mpm {
  text-align: center;
  background: var(--light);
  border-radius: 9px;
  padding: 9px 14px;
}
.mpmv {
  font-weight: 700;
  font-size: 0.92rem;
  color: var(--dark);
}
.mpml {
  font-size: 0.68rem;
  color: #bbb;
}
.mpqty {
  display: flex;
  align-items: center;
  gap: 11px;
  margin-bottom: 18px;
}
.mpqbtn {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  border: 2px solid var(--primary);
  background: transparent;
  color: var(--primary);
  font-size: 1.05rem;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: 0.3s;
  font-weight: 700;
}
.mpqbtn:hover {
  background: var(--primary);
  color: #fff;
}
.mpqnum {
  font-size: 1.15rem;
  font-weight: 700;
  color: var(--dark);
  min-width: 30px;
  text-align: center;
}
.mptags {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-bottom: 20px;
}
.mptag {
  background: rgba(246, 166, 35, 0.11);
  color: var(--dark);
  border-radius: 20px;
  padding: 3px 11px;
  font-size: 0.73rem;
  font-weight: 600;
}
.mpaddcart {
  width: 100%;
  background: linear-gradient(135deg, var(--primary), #c01e12);
  color: #fff;
  border: none;
  border-radius: 12px;
  padding: 15px;
  font-size: 0.96rem;
  font-weight: 700;
  cursor: pointer;
  font-family: "Poppins", "Poppins Fallback", sans-serif;
  transition: 0.3s;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
}
.mpaddcart:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 28px rgba(232, 40, 26, 0.38);
}

/* --- FIX 7: GALLERY POPUP --- */
#galPop {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 99999;
  background: rgba(0, 0, 0, 0.96);
  padding: 60px 18px 30px;
  overflow-y: auto;
}
#galPop.open {
  display: flex;
  align-items: safe center;
  justify-content: safe center;
  animation: fadeov 0.28s ease;
}
.gpbox {
  max-width: 880px;
  width: 100%;
  margin: 0 auto;
  position: relative;
  text-align: center;
}
.gpbox img {
  width: 100%;
  max-height: 64vh;
  object-fit: contain;
  border-radius: 14px;
}
.gpbox video {
  display: block;
  width: auto;
  max-width: 100%;
  height: auto;
  max-height: 72vh;
  object-fit: contain;
  border-radius: 14px;
  background: #000;
  margin: 0 auto; /* Bootstrap's reset forces video to display:block, so
                     text-align:center on .gpbox alone can't center it —
                     a block element needs its own auto margins instead. */
}
.gpclose {
  position: absolute;
  top: -46px;
  right: 0;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.13);
  border: none;
  color: #fff;
  font-size: 1.1rem;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: 0.3s;
}
.gpclose:hover {
  background: var(--primary);
}
.gpcap {
  color: #fff;
  margin-top: 18px;
}
.gpcap h5 {
  font-size: 1.25rem;
  margin-bottom: 5px;
  color: #fff;
}
.gpcap p {
  color: rgba(255, 255, 255, 0.58);
  font-size: 0.88rem;
}
/* #gpDesc is a DIV (not a <p>) so it can safely hold nested <p> tags
   from multi-paragraph reviews without the browser breaking the markup
   apart. Clamped to 2 lines by default; "Read more" expands it with its
   own internal scrollbar so Prev/Next/Close never get pushed off screen. */
#gpDesc {
  margin: 0 auto;
  max-width: 620px;
  text-align: left;
  line-height: 1.5;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
#gpDesc p { margin: 0 0 8px; }
#gpDesc.expanded {
  -webkit-line-clamp: unset;
  display: block;
}
.gp-readmore {
  display: none;
  background: none;
  border: none;
  color: var(--secondary);
  font-weight: 700;
  font-size: 0.82rem;
  margin: 8px auto 0;
  cursor: pointer;
  padding: 0;
}
.gp-readmore:hover { text-decoration: underline; }
.gpnav {
  display: flex;
  justify-content: center;
  gap: 11px;
  margin-top: 14px;
}
.gpnav button {
  background: rgba(255, 255, 255, 0.09);
  border: 1px solid rgba(255, 255, 255, 0.18);
  color: #fff;
  border-radius: 50px;
  padding: 7px 20px;
  cursor: pointer;
  font-size: 0.83rem;
  font-family: "Poppins", "Poppins Fallback", sans-serif;
  transition: 0.3s;
}
.gpnav button:hover {
  background: var(--primary);
  border-color: var(--primary);
}

/* Magnific video override */
.mfp-bg {
  background: #000 !important;
  opacity: 0.93 !important;
}
.mfp-close {
  color: #fff !important;
}

/* ===================== RESPONSIVE ===================== */
@media (max-width: 991px) {
  .hcircle {
    width: 320px;
    height: 320px;
  }
  .hfcard.fc1,
  .hfcard.fc2,
  .hfcard.fc3 {
    transform: scale(0.82);
    transform-origin: center;
  }
  /* Gallery: fanned card stack — swipe the top card left/right (tablet/mobile only) */
  .gswipehint {
    display: flex;
  }
  .ggrid {
    position: relative;
    height: 460px;
    display: block;
    overflow: visible;
    padding: 0;
    margin: 0 46px 14px;
  }
  .gitem,
  .gitem:first-child {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    grid-row: unset;
    border-radius: 18px;
    touch-action: pan-y;
    will-change: transform;
    transition: transform 0.32s cubic-bezier(0.2, 0.8, 0.2, 1), opacity 0.32s ease;
  }
  /* transparent gradient caption, always visible (no hover on touch devices) */
  .gitem-cap {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.76), transparent 60%);
    opacity: 1;
    display: flex;
    align-items: flex-end;
    padding: 18px 20px;
    border-radius: 0;
  }
  .gitem-cap span {
    color: #fff;
    font-weight: 600;
    font-size: 0.95rem;
  }
  .gitem-cap i {
    color: var(--primary);
    margin-right: 8px;
  }
  .gitem-desc {
    display: none;
  }
  .asm {
    /*display: none;*/
    right: -9px;
  }
  .mpbox .mpimg,
  .mpbox .mpbody {
    width: 100%;
  }
  .mpbox .mpimg {
    border-radius: 22px 22px 0 0;
    min-height: 240px;
  }
  .mpbox .mpbody {
    padding: 22px 18px;
  }
  /* Timeline mobile: collapse to single column */
  .timeline::before {
    left: 16px;
  }
  .tli {
    grid-template-columns: 32px 1fr !important;
  }
  .tl-left {
    display: none !important;
  }
  .tl-right {
    display: block !important;
    visibility: visible !important;
    padding-left: 18px !important;
    text-align: left !important;
  }
  .tl-center {
    padding-top: 5px;
  }
  .tli:nth-child(odd) .tl-right,
  .tli:nth-child(even) .tl-right {
    visibility: visible !important;
    display: block !important;
  }
h3{font-size: 18px; margin-bottom: 10px;}
.htitle { text-align: center; }
.hdesc { max-width: 100%; text-align: center; }
.hero__trust-pills { justify-content: center; }
.hero-btn-row{ justify-content: center; }

}
@media (max-width: 767px) {
  section {
    padding: 36px 0; /*55px default*/
  }
  #topbar .top-contact span:last-child {
    display: none;
  }
  .hcircle {
    width: 260px;
    height: 260px;
  }
  .hero__trust-pills { gap: 6px; }
  .trust-pill { font-size: 12px; padding: 5px 10px; }

  /* keep a tall, portrait-feeling card on phone widths */
  .ggrid {
    height: 400px;
    margin: 0 30px 14px;
  }

  /* Hide only hero floating cards, NOT form cards */
  .hfcard.fc1,
  .hfcard.fc2,
  .hfcard.fc3 {
    display: none !important;
  }
  .hstats {
    display: none !important;
  }
  .cdwrap {
    gap: 8px;
  }
  .cditem {
    min-width: 56px;
    padding: 9px;
  }
  .nl-form-wrap {
    flex-direction: column;
    padding: 0 8px;
  }
  .nlinput,
  .nlbtn {
    width: 100%;
    border-radius: 12px;
  }
  .fcard {
    padding: 22px 18px;
  }
.reviews__aggregate { flex-direction: column; gap: 10px; }
.reviews__aggregate-score { font-size: 48px; }
.reviews__aggregate-detail { text-align: center;}
.reviews__aggregate-platforms { flex-direction: column; gap: 6px; }
}
@media (max-width: 480px) {
  .hcircle {
    width: 220px;
    height: 220px;
  }
  .htitle {
    font-size: 2.0rem;   /* 2.4rem default */
    text-align: center;
  }
  .hdesc {
    text-align: center;
  }
  .stitle {
    font-size: 1.9rem;
  }
.hero__trust-pills { justify-content: center; }
  .trust-pill { font-size: 11px; padding: 4px 8px; }
  .ggrid {
    height: 460px;   /*360px default*/
    margin: 0 30px 14px;
  }
.hero-btn-row{ justify-content: center; }
}

/* ===================== RESPONSIVE OVERFLOW FIXES ===================== */
/* Fix 1: Prevent horizontal scroll on all screen sizes */
/* NOTE: only applied to body (not html) — applying overflow-x:hidden to
   BOTH html and body at once breaks position:sticky on #nav in Chromium. */

body {
  overflow-x: hidden;
  max-width: 100%;
}

/* ── HERO MOBILE FIX ── */

/* Tablet and below (screens smaller than 992px) */

@media (max-width: 991px) {

/* Force both hero columns to full width — stops horizontal scroll */ 

#hero .row > div { width: 100% !important; max-width: 100% !important; flex: 0 0 100% !important; } 

/* Stack the columns vertically */ 

#hero .row { flex-direction: column; } 
#hero .row.g-5 {
  --bs-gutter-y: 1.25rem;
}

/* Form card — cap width and centre it on tablet (hero section only —
   the contact section's copy of this card needs to stay full width) */ 
#hero .trc-quote-card { width: 100%; max-width: 540px; margin-left: auto; margin-right: auto; } 
#hero {
  min-height: auto;
  padding: 36px 0 28px;
}

} 

/* Phone only (screens smaller than 576px) */ 
@media (max-width: 575px) { 
/* Form card — go full width on phone */ 
.trc-quote-card { max-width: 100% !important; margin-left: 0 !important; margin-right: 0 !important; } 
/* Move Date + Move Type fields — stack vertically instead of side by side */ 
.trc-form-row2 { grid-template-columns: 1fr !important; } 
}

/*  #hero .col-lg-6:first-child {order: 1; text-align: left;}
  #hero .col-lg-6:last-child {order: 2; margin-bottom: 30px;} */

  .hdesc {
    margin-left: 0;
    margin-right: 0;
  }
  .hbtn-group {
    justify-content: flex-start;
  }
  .hcircle {
    width: min(380px, 80vw) !important;
    height: min(380px, 80vw) !important;
  }
  /* Hero decorative blobs - prevent overflow */
  .hs1, .hs2 {
    max-width: 60vw;
    max-height: 60vw;
  }
}

@media (max-width: 767px) {
  .hcircle {
    width: min(320px, 85vw) !important;
    height: min(320px, 85vw) !important;
  }
}

@media (max-width: 480px) {
  .hcircle {
    width: min(280px, 88vw) !important;
    height: min(280px, 88vw) !important;
  }
}

/* Fix 3: Reservation form - ensure form card is fully visible */
#reservation .fcard {
  position: relative !important;
  width: 100%;
}

/* Fix 4: Prevent any absolute-positioned decorative elements from causing overflow */
#hero,
#special,
#about,
#gallery,
#history,
#chefs,
#hours,
#testimonials,
#reservation,
#blog,
#newsletter,
#contact-section {
  overflow-x: hidden;
}

/* Fix 6: Marquee track - prevent overflow */
.mqsec {
  overflow: hidden;
  max-width: 100%;
}

/* Fix 7: About and history section image overflow */
@media (max-width: 767px) {
  .aimg-wrap,
  .about-img {
    max-width: 100%;
    overflow: hidden;
  }
}

/* Fix 8: Topbar overflow on very small screens */
@media (max-width: 400px) {
  #topbar .container {
    padding-left: 10px;
    padding-right: 10px;
  }
  .top-contact {
    font-size: 0.72rem;
  }
}

/* Fix 9: Tables and wide content */
table,
.table {
  max-width: 100%;
  overflow-x: clip;
}

/* ── Hero button row — always same line ── */
.hero-btn-row {
  flex-wrap: nowrap;
  align-items: center;
}
@media (max-width: 480px) {
  .hero-btn-row {
    gap: 10px !important;   /* 10px default */
  }
  .hero-btn-row .btn-red {
    padding: 13px 22px;    /* 11px 16px */
    font-size: 0.82rem;
    white-space: nowrap;
  }
  .hero-btn-row .btn-play {
    padding: 8px 0;
    font-size: 0.82rem;
    gap: 8px;
    white-space: nowrap;
  }
  .hero-btn-row .btn-play .pico {
    width: 40px;
    height: 40px;
    font-size: 0.82rem;
    flex-shrink: 0;
  }
}

/* ------------------------------------------------------------------------- */

/* ── TRC Hero Quote Form ── */
.trc-quote-card {
  background: #fff;
  border-radius: 14px;
  box-shadow: 0 28px 80px rgba(0,0,0,.18);
  overflow: hidden;
  font-family: "Poppins", "Poppins Fallback", sans-serif;
  position: relative;
  z-index: 2;
  isolation: isolate;
}
.trc-qfc-head {
  background: var(--green); /*linear-gradient(135deg, var(--primary), #b01e14);*/
  border-top: 7px solid var(--secondary);
  border-radius: 14px 14px 0px 0px;
  padding: 26px 26px 22px;
  color: #fff;
}
.trc-qfc-head h2 {
  font-size: 1.2rem; font-weight: 800; margin: 0 0 5px;
  font-family: "Poppins", serif; color: #fff;
  line-height: 1.2;
}
.trc-qfc-head p {
  font-size: .85rem; opacity: .82; margin: 0;
}
.trc-live-badge {
  display: inline-flex; align-items: center; gap: 8px;
  background: rgba(255,255,255,.15); border: 1px solid rgba(255,255,255,.3);
  color: rgba(255,255,255,.9); font-size: 12px; font-weight: 600;
  padding: 5px 14px; border-radius: 20px; margin-bottom: 10px;
}
.trc-pulse {
  display: inline-block; width: 8px; height: 8px;
  background: var(--yellow); border-radius: 50%; flex-shrink: 0;
  box-shadow: 0 0 0 0 rgba(74,222,128,.6);
  animation: trc-pulse-anim 1.6s ease-out infinite;
}
@keyframes trc-pulse-anim {
  0%   { box-shadow: 0 0 0 0 rgba(74,222,128,.6); }
  70%  { box-shadow: 0 0 0 8px rgba(74,222,128,0); }
  100% { box-shadow: 0 0 0 0 rgba(74,222,128,0); }
}
.trc-qfc-body {
  padding: 22px 24px 24px; background: #fff;
}
.trc-form-field { margin-bottom: 14px; }
.trc-form-field label {
  display: block; font-size: 13px; font-weight: 600;
  color: #333; margin-bottom: 5px;
  font-family: "Poppins", "Poppins Fallback", sans-serif;
}
.trc-form-field label span { color: var(--primary); }
.trc-form-field input,
.trc-form-field select,
.trc-form-field textarea {
  width: 100%; padding: 10px 13px;
  border: 1.5px solid #ddd; border-radius: 8px;
  font-size: 14px; font-family: "Poppins", "Poppins Fallback", sans-serif;
  color: #333; background: #fff;
  transition: border-color .2s;
  box-sizing: border-box;
  -webkit-appearance: none; appearance: none;
}
.trc-form-field textarea {
  resize: vertical;
  height: auto;
}
.trc-form-field input:focus,
.trc-form-field select:focus,
.trc-form-field textarea:focus {
  outline: none; border-color: var(--primary);
  box-shadow: 0 0 0 3px rgba(232,40,26,.1);
}
.trc-form-row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
/* Error state */
.trc-form-field.trc-error input,
.trc-form-field.trc-error select {
  border-color: #ef4444 !important; background: #fff5f5 !important;
}
.trc-error-msg {
  display: block; font-size: 12px; color: #dc2626;
  font-weight: 600; margin-top: 4px;
}
/* Success message */
.trc-success-msg {
  display: none; margin-top: 14px;
  background: #f0fdf4; border: 1.5px solid #86efac;
  border-radius: 8px; padding: 16px 18px; text-align: center;
}
.trc-success-msg .trc-success-icon { font-size: 26px; margin-bottom: 6px; }
.trc-success-msg .trc-success-title {
  font-size: 15px; font-weight: 800; color: #166534; margin-bottom: 4px;
}
.trc-success-msg .trc-success-sub {
  font-size: 13px; color: #15803d; line-height: 1.5;
}
/* Submit button */
.trc-submit-btn {
  width: 100%; padding: 14px;
  background: var(--green); color: white;
  border: none; border-radius: 8px;
  font-size: 15px; font-weight: 700; cursor: pointer;
  margin-top: 6px; font-family: "Poppins", "Poppins Fallback", sans-serif;
  transition: background .2s, transform .15s;
}
.trc-submit-btn:hover { background: var(--primary); color: #fff; transform: translateY(-1px); }
.trc-form-secure {
  text-align: center; font-size: 12px; color: #888;
  margin: 10px 0 0; font-family: "Poppins", "Poppins Fallback", sans-serif;
}

/* On mobile stack the form below the text (hero section only) */
@media (max-width: 991px) {
  #hero .trc-quote-card { max-width: 560px; margin: 0 auto; }
  #hero .trc-form-row2  { grid-template-columns: 1fr; }
}

/* ── Mobile sticky CTA bar ── */
.mob-cta-bar {
  display: none;
  visibility: hidden;
  position: fixed; bottom: 0; left: 0; right: 0;
  z-index: 9990;
  background: #fff;
  box-shadow: 0 -4px 24px rgba(0,0,0,.15);
  border-top: 3px solid var(--secondary);
  padding: 10px 16px;
  font-family: "Poppins", "Poppins Fallback", sans-serif;
}
.mob-cta-inner {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 10px; max-width: 500px; margin: 0 auto;
}
.mob-cta-call {
  display: flex; align-items: center; justify-content: center; gap: 8px;
  background: var(--primary); color: #fff;
  border: none; border-radius: 8px;
  padding: 13px 10px; font-size: 14px; font-weight: 700;
  text-decoration: none; cursor: pointer;
  transition: background .2s;
}
.mob-cta-call:hover { background: #c0201a; color: #fff; }
.mob-cta-quote {
  display: flex; align-items: center; justify-content: center;
  background: var(--secondary); color: #fff;
  border: none; border-radius: 50px;
  padding: 10px 20px; font-size: 14px; font-weight: 600;
  /* box-shadow: 0 4px 15px rgba(232, 40, 26, 0.3); */
  cursor: pointer; transition: background .2s;
  font-family: "Poppins", "Poppins Fallback", sans-serif;
}
.mob-cta-quote:hover { background: var(--green); }
/* the CTA bar reuses the exact same pulsing .call-btn component as the
   navbar — it's only hidden elsewhere because .mob-cta-bar itself is
   display:none outside mobile/tablet, so force it visible here regardless
   of the navbar's own hide-on-mobile rule for .call-btn */
.mob-cta-call-btn {
  display: flex !important;
  width: 100%;
  justify-content: center;
  padding: 10px 14px;
}
@media (max-width: 991.98px) {   /* matches the navbar's own collapse breakpoint */
  .mob-cta-bar { display: block; visibility: visible; }
  footer { padding-bottom: 76px; }
  #btt { bottom: 92px; }
}

/* ── Popup modal overlay ── */
#quote-modal {
  position: fixed; inset: 0; z-index: 99999;
  display: flex; align-items: center; justify-content: center;
  padding: 16px;
}
#quote-modal-overlay {
  position: absolute; inset: 0;
  background: rgba(20,20,40,.75);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}
#quote-modal-box {
  position: relative; z-index: 1;
  width: 100%; max-width: 480px;
  max-height: 92vh; overflow-y: auto;
  border-radius: 14px;
  box-shadow: 0 28px 80px rgba(0,0,0,.4);
  animation: modal-in .22s cubic-bezier(.34,1.26,.64,1) both;
  font-family: "Poppins", "Poppins Fallback", sans-serif;
  scrollbar-width: none;          /* Firefox — hide the scrollbar visually */
}
#quote-modal-box::-webkit-scrollbar {
  display: none;                  /* Chrome/Safari/Edge — hide the scrollbar visually */
}
@keyframes modal-in {
  from { opacity:0; transform: scale(.93) translateY(18px); }
  to   { opacity:1; transform: scale(1) translateY(0); }
}
#quote-modal-close {
  position: absolute; top: 12px; right: 14px; z-index: 10;
  width: 34px; height: 34px;
  background: rgba(255,255,255,.2); border: none;
  border-radius: 50%; color: #fff;
  font-size: 16px; font-weight: 700;
  cursor: pointer; display: flex; align-items: center; justify-content: center;
  transition: background .15s; font-family: "Poppins", "Poppins Fallback", sans-serif;
}
#quote-modal-close:hover { background: rgba(255,255,255,.35); }

/* Modal form head */
.modal-qfc-head {
  background: var(--green);
  padding: 36px 26px 22px;
  color: #fff;
  border-top: 5px solid var(--secondary);
  border-radius: 14px 14px 0px 0px;
}
.modal-live-badge {
  display: inline-flex; align-items: center; gap: 8px;
  background: rgba(255,255,255,.15); border: 1px solid rgba(255,255,255,.3);
  border-radius: 20px; padding: 5px 14px;
  font-size: 12px; font-weight: 600; color: rgba(255,255,255,.9);
  margin-bottom: 10px;
}
.modal-pulse {
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--yellow); /*#4ade80;*/
  box-shadow: 0 0 0 0 rgba(74,222,128,.6);
  animation: pulse-ring 1.6s ease-out infinite;
  flex-shrink: 0;
}
@keyframes pulse-ring {
  0%   { box-shadow: 0 0 0 0 rgba(74,222,128,.6); }
  70%  { box-shadow: 0 0 0 8px rgba(74,222,128,0); }
  100% { box-shadow: 0 0 0 0 rgba(74,222,128,0); }
}
.modal-qfc-head h2 {
  font-size: 1.5rem; font-weight: 800; margin: 0 0 5px;
  font-family: "Poppins", Playfair Display, serif; color: #fff;
}
.modal-qfc-head p { font-size: .85rem; opacity: .82; margin: 0; }

/* Modal form body */
.modal-qfc-body { background: #fff; padding: 22px 24px 24px; }
.modal-form-field { margin-bottom: 14px; }
.modal-form-field label {
  display: block; font-size: 13px; font-weight: 600;
  color: #333; margin-bottom: 5px;
}
.modal-form-field label span { color: var(--primary); }
.modal-form-field input,
.modal-form-field select,
.modal-form-field textarea {
  width: 100%; padding: 10px 13px;
  border: 1.5px solid #ddd; border-radius: 8px;
  font-size: 14px; font-family: "Poppins", "Poppins Fallback", sans-serif;
  color: #333; background: #fff;
  transition: border-color .2s;
  box-sizing: border-box;
}
.modal-form-field textarea {
  resize: vertical;
  min-height: 70px;
}
.modal-form-field input:focus,
.modal-form-field select:focus,
.modal-form-field textarea:focus {
  outline: none; border-color: var(--primary);
}
.modal-form-row2 {
  display: grid; grid-template-columns: 1fr 1fr; gap: 12px;
}
.modal-submit-btn {
  width: 100%; padding: 14px;
  background: var(--green); color: #fff;
  border: none; border-radius: 8px;
  font-size: 15px; font-weight: 700;
  cursor: pointer; margin-top: 6px;
  font-family: "Poppins", "Poppins Fallback", sans-serif;
  transition: background .2s, transform .15s;
}
.modal-submit-btn:hover { background: var(--primary); transform: translateY(-1px); }
.modal-secure {
  font-size: 12px; color: #888; text-align: center;
  margin: 10px 0 0;
}

/* Modal field error */
.modal-form-field.field-error input,
.modal-form-field.field-error select {
  border-color: #ef4444 !important; background: #fff5f5 !important;
}
.field-error-msg {
  display: block; font-size: 12px;
  color: #dc2626; font-weight: 600; margin-top: 4px;
}

@media (max-width: 520px) {
  #quote-modal-box { max-height: 95vh; border-radius: 10px; }
  .modal-form-row2 { grid-template-columns: 1fr; }
  .modal-qfc-head { padding: 29px 18px 18px; }
  .modal-qfc-body { padding: 18px 16px 20px; }
}

/* ══ GLOBAL HORIZONTAL OVERFLOW FIX ══
   Bootstrap .g-5 rows use negative margins that exceed
   the viewport width on mobile. This resets gutters on
   small screens and clips overflow at section level.   */

@media (max-width: 991px) {
  .row.g-5,
  .row.gx-5 {
    --bs-gutter-x: 1rem;
  }
}

@media (max-width: 575px) {
  .row.g-5,
  .row.gx-5 {
    --bs-gutter-x: 0.5rem;
  }
}

section,
.section,
#hero,
#about,
#special,
#gallery,
#history,
#chefs,
#hours,
#testimonials,
#reservation,
#blog,
#newsletter,
#contact-section,
#pricing {
  overflow-x: clip;
  max-width: 100%;
}

/* ── Prevent AOS animated elements from overlapping sticky nav ── */
[data-aos] {
  z-index: auto !important;
}
[data-aos].aos-animate {
  z-index: auto !important;
}

/* ================================================================================================================================================================
								TRUCK PRICING SECTION + POPUP
								Paste at the BOTTOM of your style.css
================================================================================================================================================================ */

/* ── Section ── */
#pricing { background: #f9f5f0; padding: 30px 0; }   /* 90px default */

/* ══════════════════════════════════════════════════
   PRICE CARDS
══════════════════════════════════════════════════ */
.trk-card {
  background: #fff;
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 4px 22px rgba(0,0,0,.07);
  cursor: pointer;
  transition: .35s;
  display: flex;
  flex-direction: column;
  height: 100%;
  position: relative;
}
.trk-card:hover {
  transform: translateY(-9px);
  z-index: 1;         /* ← keeps card below nav (9995) and CTA bar (9990) */
  position: relative;
  box-shadow: 0 18px 48px rgba(0,0,0,.14);
}
.trk-popular { border: 3px solid var(--secondary); box-shadow: 0 14px 38px rgba(232, 40, 26, 0.14);}
.trk-popular-banner {
  background: #e8281a;
  color: #fff;
  font-size: .72rem;
  font-weight: 700;
  text-align: center;
  padding: 6px 0;
  letter-spacing: 1px;
}
.trk-img {
  position: relative;
  height: 190px;
  overflow: hidden;
  background: #fef0dc;
  padding: ;
}
.trk-img img {
  width: 100%; height: 100%;
  object-fit: stretch;/*contain;*/
  transition: .5s;
}
.trk-card:hover .trk-img img { transform: scale(1.08); }
.trk-badge {
  position: absolute;
  top: 12px; left: 12px;
  color: #fff;
  border-radius: 7px;
  padding: 3px 12px;
  font-size: .7rem;
  font-weight: 700;
  z-index: 2;
}
.trk-body {
  padding: 18px;
  display: flex;
  flex-direction: column;
  flex: 1;
}
.trk-size {
  font-size: .68rem; font-weight: 700;
  color: #f6a623; text-transform: uppercase;
  letter-spacing: 1.2px; margin-bottom: 3px;
}
.trk-name {
  font-size: 1.1rem; font-weight: 800;
  color: #1a1a1a; margin-bottom: 12px;
  font-family: "Rubik", serif;
}
.trk-desc {
  font-size: .82rem; color: #aaa; text-align: justify;
  line-height: 1.5; margin-bottom: 14px; flex: 1;
}
.trk-specs {
  display: flex; gap: 8px;
  flex-wrap: wrap; margin-bottom: 14px;
}
.trk-specs span {
  font-size: .68rem; font-weight: 600; color: #666;
  background: #f9f5f0; border-radius: 6px;
  padding: 3px 8px;
  display: flex; align-items: center; gap: 4px;
}
.trk-specs span i { color: var(--primary); font-size: .62rem; }
.trk-foot {
  display: flex; align-items: center;
  justify-content: space-between; margin-top: auto;
}
.trk-price {
  font-size: 1.3rem; font-weight: 900;
  color: var(--secondary);
  font-family: "Rubik", serif; line-height: 1;
}
.trk-price s { font-size: .73rem; color: #ccc; font-weight: 400; margin-left: 4px; }
.trk-per { font-size: .67rem; color: #aaa; margin-top: 2px; }
.trk-btn {
  background: var(--primary); /*linear-gradient(135deg, #e8281a, #c01e12);*/
  color: #fff; border: none; border-radius: 9px;
  padding: 9px 14px; font-size: .75rem; font-weight: 700;
  cursor: pointer; font-family: "Poppins", "Poppins Fallback", sans-serif;
  transition: .3s; white-space: nowrap;
}
.trk-btn:hover {
  transform: scale(1.06);
  box-shadow: 0 6px 18px rgba(232,40,26,.32);
}


.trk-img-services {
  position: relative;
  height: 190px;
  overflow: hidden;
  background: #fef0dc;
  padding: ;
}
.trk-img-services img {
  width: 100%; height: 100%;
  object-fit: cover;/*contain;*/
  transition: .5s;
}
.trk-card:hover .trk-img-services img { transform: scale(1.08); }


/* ══════════════════════════════════════════════════
   TRUCK DETAIL POPUP
   — No scroll on outer overlay
   — Image panel: fixed height, left side
   — Body panel: scrollable independently inside popup
   — Entire popup fits within 100vh at all times
══════════════════════════════════════════════════ */

/* Overlay */
#trkPop {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 999999;
  background: rgba(0,0,0,.88);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  padding: 16px;
  overflow-y: auto;           /* the WHOLE card scrolls here now */
  scrollbar-width: none;      /* hide visually, scroll still works */
  -ms-overflow-style: none;
}
#trkPop::-webkit-scrollbar { display: none; }
#trkPop.open {
  display: flex;
  align-items: safe center;
  justify-content: safe center;
  animation: trkFadeIn .22s cubic-bezier(.34,1.26,.64,1);
}
@keyframes trkFadeIn {
  from { opacity: 0; transform: scale(.94) translateY(12px); }
  to   { opacity: 1; transform: scale(1)   translateY(0); }
}

/* Popup box
   Key trick: height = 100% of available space (capped),
   display:flex so both panels stretch to same height.
   Image panel: fixed, no scroll.
   Body panel: overflow-y auto, independently scrollable. */
.trkpbox {
  background: #fff;
  border-radius: 20px;
  width: 100%;
  max-width: 520px;
  height: auto;
  display: flex;
  flex-direction: column;
  position: relative;
  overflow: hidden; /* clips rounded corners */
  box-shadow: 0 32px 80px rgba(0,0,0,.45);
}

/* ── Top: image banner — full width, fixed height (no scroll) ── */
.trkpimg {
  width: 100%;
  height: 260px;
  flex-shrink: 0;
  background: #e8d5b0;
  position: relative;
  overflow: hidden;
}
.trkpimg img {
  width: 100%; height: 100%;
  object-fit: stretch;
  display: block;
}
.trkp-top-badge {
  display: none;
  position: absolute;
  top: 14px; left: 14px;
  background: #111; color: #fff;
  font-size: .65rem; font-weight: 800;
  letter-spacing: 1px; border-radius: 6px;
  padding: 4px 11px; z-index: 2;
}
.trkp-top-badge.show { display: block; }

/* ── Close button ── */
.trkpclose {
  position: absolute;
  top: 12px; right: 12px;
  width: 32px; height: 32px;
  border-radius: 50%;
  background: var(--yellow); /*rgba(255,255,255,.9);*/
  color: #fff;
  border: none; font-size: .9rem;
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: .25s; z-index: 20;
  box-shadow: 0 2px 8px rgba(0,0,0,.15);
}
.trkpclose:hover { background: var(--green); color: #fff; }

/* ── Content panel — flows naturally; the OUTER popup scrolls the whole card ── */
.trkpbody {
  width: 100%;
  height: auto;
  padding: 24px 26px 22px;
  display: flex;
  flex-direction: column;
}

/* Body content — compact spacing */
.trkp-cat {
  font-size: .64rem; font-weight: 700;
  color: #f6a623; text-transform: uppercase;
  letter-spacing: 1.5px; margin-bottom: 4px;
}
.trkp-title {
  font-size: 1.65rem; font-weight: 900; line-height: 1.15;
  color: #1a1a1a; margin-bottom: 6px;
  font-family: "Rubik", serif;
}
.trkp-stars {
  font-size: .82rem; color: #f6a623; margin-bottom: 10px;
}
.trkp-desc {
  font-size: .8rem; color: #777;
  line-height: 1.65; margin-bottom: 12px;
}

/* Price */
.trkp-price-block { margin-bottom: 14px; }
.trkp-price-main {
  font-size: 2rem; font-weight: 900;
  color: var(--primary); line-height: 1;
  font-family: "Rubik", serif;
  display: inline; margin-left: 8px;
}
.trkp-price-old {
  font-size: 1.3rem; color: #ccc;
  text-decoration: line-through; margin-left: ;   /* 8px default*/
}
.trkp-price-lbl { font-size: 1.5rem; font-weight: 900; color: var(--primary); line-height: 1; font-family: "Rubik", serif; margin-left: 3px; }

/* Spec boxes */
.trkp-specs-row {
  display: flex; gap: 8px;
  margin-bottom: 12px;
}
.trkp-spec-box {
  flex: 1;
  background: var(--cream); border-radius: 9px;
  padding: 8px 6px; text-align: center;
}
.trkp-spec-val { font-size: .88rem; font-weight: 800; color: #1a1a1a; }
.trkp-spec-lbl {
  font-size: .56rem; color: #aaa;
  text-transform: uppercase; letter-spacing: 1px; margin-top: 2px;
}

/* Ideal for */
.trkp-ideal {
  background: var(--cream);
  border-left: 4px solid var(--secondary);
  border-radius: 0 7px 7px 0;
  padding: 8px 12px;
  font-size: .78rem; color: #555;
  margin-bottom: 12px;
}
.trkp-ideal strong {
  color: var(--secondary); text-transform: uppercase;
  font-size: .6rem; letter-spacing: 1px;
  display: inline; margin-right: 6px;
}

/* Included checklist */
.trkp-included { margin-bottom: 12px; }
.trkp-inc-title {
  font-size: .63rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: 1.2px;
  color: #bbb; margin-bottom: 8px;
}
.trkp-inc-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4px 12px;
}
.trkp-inc-item {
  font-size: .75rem; color: #555;
  display: flex; align-items: center; gap: 6px;
  line-height: 1.4;
}
.trkp-inc-item i { color: #2d6a4f; font-size: .65rem; flex-shrink: 0; }

/* Tags */
.trkp-tags { display: flex; flex-wrap: wrap; gap: 5px; margin-bottom: 14px; }
.trkp-tag {
  border: 1.5px solid var(--secondary);/*#e0e0e0;*/ border-radius: 20px;
  padding: 3px 11px; font-size: .68rem;
  font-weight: 600; color: #666;
}

/* Book button — opens quote form */
.trkp-book {
  display: flex; align-items: center;
  justify-content: center; gap: 10px;
  width: 100%;
  background: var(--secondary);
  color: #fff; border: none; border-radius: 11px;
  padding: 14px; font-size: .95rem; font-weight: 700;
  font-family: "Poppins", "Poppins Fallback", sans-serif;
  transition: .3s; cursor: pointer;
  margin-top: auto; /* pushes to bottom of flex column */
  text-decoration: none; flex-shrink: 0;
}
.trkp-book:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 28px rgba(232,40,26,.4);
  color: #fff;
}

/* ══════════════════════════════════════════════════
   RESPONSIVE
══════════════════════════════════════════════════ */

/* Tablet: stack image on top, body below — both fit in screen */
@media (max-width: 767px) {
  .trkpbox {
    flex-direction: column;
    height: auto;
    max-width: 480px;
  }
  .trkpimg {
    width: 100%;
    height: 200px;        /* fixed image height on tablet */
    flex-shrink: 0;
  }
  .trkpbody {
    width: 100%;
    height: auto;   /*calc(100% - 200px);  remaining space */
    padding: 18px 18px 18px;
  }
  .trkp-title { font-size: 1.4rem; }
  .trkp-price-main { font-size: 1.7rem; }
  .trkp-inc-grid { grid-template-columns: 1fr; gap: 3px; }
  .trkp-desc { display: none; } /* hide desc on tablet to save space */
  .foot{ padding: 0px 50px; }

.trk-img { height: 280px; }

}

/* Mobile */
@media (max-width: 480px) {
  #trkPop { padding: 10px; }
  .trkpbox {
     height: auto;
    /*height: calc(100vh - 20px);*/
    border-radius: 16px;
    max-width: 100%;
  }
  .trkpimg { height: 195px; }    /* 170px default*/
  .trkpbody { height: auto; padding: 14px 14px 14px; }
  .trkp-title { font-size: 1.25rem; }
  .trkp-price-main { font-size: 1.5rem; }
  .trkp-specs-row { gap: 5px; }
  .trkp-spec-box { padding: 6px 4px; }
  .trkp-spec-val { font-size: .78rem; }
  .trkp-book { padding: 12px; font-size: .88rem; }
  .trk-foot { flex-direction: column; align-items: flex-start; gap: 10px; }
  .trk-btn  { width: ; text-align: center; padding: 10px 34px;}
}

/* ===============================================================================================================================================================
									SUBURBS CSS
=============================================================================================================================================================== */

#areas { background: linear-gradient(180deg, var(--cream), var(--light)); color:var(--dark); padding:70px 0; }
  #areas .wrap { max-width:1000px; margin:0 auto; padding:0 24px; text-align:center; }
  /*.areas-lbl { display:block; font-size:.82rem; font-weight:700; letter-spacing:2px; text-transform:uppercase; color:var(--primary); margin-bottom:12px; }*/
  /*.areas-title { font-size:clamp(1.7rem,3vw,2.3rem); font-weight:800; margin-bottom:14px; color:var(--dark); }*/
  .areas-desc { color:#665f5a; font-size:.95rem; max-width:560px; margin:0 auto 32px; line-height:1.7; }

  .areas-tabs-row { display:flex; align-items:center; gap:10px; margin-bottom:26px; }
  .areas-tabs-arrow {
    flex-shrink:0; width:38px; height:38px; border-radius:50%;
    background:var(--green); border:1.5px solid var(--green); color:#fff;
    display:flex; align-items:center; justify-content:center; cursor:pointer;
    font-size:.85rem; transition:.2s;
  }
  .areas-tabs-arrow:hover { background:var(--primary); color:#fff; }
  .areas-tabs {
    display:flex; gap:9px; flex-wrap:nowrap;
    overflow-x:auto; scroll-behavior:smooth;
    scrollbar-width:none; -ms-overflow-style:none;
    flex:1;
  }
  .areas-tabs::-webkit-scrollbar { display:none; }
  .areas-tab {
    background:#fff; border:1.5px solid #e8ddd2; color:var(--dark);
    padding:9px 18px; border-radius:30px; font-size:.83rem; font-weight:600; cursor:pointer;
    transition:.2s; font-family:inherit; white-space:nowrap;
  }
  .areas-tab.active, .areas-tab:hover { background:var(--primary); border-color:var(--primary); color:#fff; }

  .areas-panel {
    background:#fff; border:1px solid #eee2d6;
    border-radius:14px; padding:26px; text-align:left;
    max-height:460px; overflow-y:auto;
    box-shadow: 0 8px 30px rgba(0,0,0,.05);
  }
  .areas-panel::-webkit-scrollbar { width:6px; }
  .areas-panel::-webkit-scrollbar-thumb { background:var(--primary); border-radius:10px; }

  .areas-chips { display:none; flex-wrap:wrap; gap:9px; justify-content:center; }
  .areas-chips.show { display:flex; }
  .areas-chip {
    background:var(--light); border:1px solid #ede2d5;
    padding:8px 15px; border-radius:7px; font-size:.83rem; color:#3a332f;
    display:inline-flex; align-items:center; gap:6px; white-space:nowrap;
  }
  .areas-chip i { color:var(--secondary); font-size:.78rem; }

  .areas-count {
    font-size:.78rem; color:#9c9088; margin-top:16px; text-align:center;
  }

  .areas-btn-row { display:flex; justify-content:center; gap:14px; flex-wrap:wrap; margin-top:32px; }
  /*.btn-outline { background:transparent; border:2px solid var(--dark); color:var(--dark); padding:12px 24px; border-radius:6px; font-weight:700; font-size:.9rem; cursor:pointer; font-family:inherit; }
  .btn-outline:hover { background:var(--dark); color:#fff; }
  .btn-solid { background:var(--primary); color:#fff; border:none; padding:12px 24px; border-radius:6px; font-weight:700; font-size:.9rem; display:inline-flex; align-items:center; gap:8px; text-decoration:none; }
  .btn-solid:hover { background:#c01e12; }*/

  @media (max-width: 560px) {
    .areas-panel { max-height:300px; padding:18px; }
    .areas-btn-row { flex-direction:column; }
    .btn-outline, .btn-solid { width:100%; justify-content:center; text-align: center; }
  }

/* ================================================================================================================================================================
										FAQ's CSS
================================================================================================================================================================ */

#faq { padding: 80px 0; background: #fff; }
  #faq .wrap { max-width: 860px; margin: 0 auto; padding: 0 24px; }



  /* ── Open/close accordion, no images ── */
  .faq-item {
    border-bottom: 1px solid #eee2d6;
  }
  .faq-item:first-child { border-top: 1px solid #eee2d6; }

  .faq-q {
    width: 100%;
    background: none;
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 22px 4px;
    font-family: inherit;
    font-size: 1.02rem;
    font-weight: 700;
    color: var(--dark);
    text-align: left;
  }
  .faq-q .chev {
    flex-shrink: 0;
    width: 30px; height: 30px;
    border-radius: 50%;
    background: var(--green);
    color: #fff;
    display: flex; align-items: center; justify-content: center;
    font-size: .8rem;
    transition: transform .25s, background .25s, color .25s;
  }
  .faq-item.open .faq-q .chev {
    transform: rotate(180deg);
    background: var(--yellow);
    color: #fff;
  }
  .faq-a {
    max-height: 0;
    overflow: hidden;
    transition: max-height .3s ease;
  }
  .faq-a p {
    padding: 0 4px 22px;
    color: #665f5a;
    font-size: .93rem;
    line-height: 1.75;
  }

  @media (max-width: 560px) {
    #faq { padding: 56px 0; }
    .faq-q { font-size: .95rem; }
  }

/* =======================================================================FINAL CTA BUTTON ======================================================================== */

  .cta-btn-row {
    display: flex;
    justify-content: center;
    align-items: stretch;
    gap: 16px;
    flex-wrap: wrap;
  }
  .cta-btn-solid {
    background: #fff;
    color: var(--dark);
    border: none;
    border-radius: 8px;
    padding: 18px 30px;
    font-weight: 800;
    font-size: 1rem;
    cursor: pointer;
    font-family: "Poppins", "Poppins Fallback", sans-serif;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    transition: .25s;
  }
.cta-btn-solid:hover { transform: translateY(-2px); box-shadow: 0 10px 26px rgba(0,0,0,.25); }
.cta-btn-outline {
    background: rgba(255,255,255,.08);
    border: 1.5px solid rgba(255,255,255,.5);
    border-radius: 8px;
    padding: 12px 30px;
    color: #fff;
    text-decoration: none;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3px;
    transition: .25s;
  }
  .cta-btn-outline:hover { background: rgba(255,255,255,.16); border-color: #fff; }
  .cta-btn-outline-top { font-size: .72rem; color: rgba(255,255,255,.75); }
  .cta-btn-outline-num { font-size: 1.15rem; font-weight: 800; color: #fff; display:flex; align-items:center; gap:8px; }

  @media (max-width: 540px) {
    .cta-btn-row { flex-direction: column; align-items: stretch; }
    .cta-btn-solid, .cta-btn-outline { justify-content: center; text-align: center; }
  }

/* ================================================================= FOOTER ======================================================================================= */
.footer__nap {
  font-size: 13px; color: rgba(255,255,255,.45); line-height: 1.8;
}
.footer__nap a { color: rgba(255,255,255,.6); }
.footer__badges { display: flex; gap: 10px; flex-wrap: wrap; }
.footer__badge {
  background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.1);
  border-radius: 4px; padding: 5px 10px;
  font-size: 12px; font-weight: 600; color: rgba(255,255,255,.4);
}
@media (max-width: 400px) {
  .footer__badges { flex-wrap: wrap; }
}

/* ===================== SERVICES DETAIL POPUP ===================== */
#services {
  background: var(--cream);
}
#svcPop {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 999999;
  background: rgba(0,0,0,.88);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  align-items: center;
  justify-content: center;
  padding: 16px;
}
#svcPop.open {
  display: flex;
  animation: trkFadeIn .22s cubic-bezier(.34,1.26,.64,1);
}
.svcpbox {
  background: #fff;
  border-radius: 20px;
  width: 100%;
  max-width: 860px;
  height: auto;
  max-height: calc(100dvh - 28px);
  display: flex;
  flex-direction: row;
  position: relative;
  overflow: hidden;
  box-shadow: 0 32px 80px rgba(0,0,0,.45);
}

/* ── Left: image panel — fixed, no scroll ── */
.svcpimg {
  width: 40%;
  flex-shrink: 0;
  background: #e8d5b0;
  position: relative;
  overflow: hidden;
}
.svcpimg img {
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
}

/* ── Close button ── */
.svcpclose {
  position: absolute;
  top: 12px; right: 12px;
  width: 32px; height: 32px;
  border-radius: 50%;
  background: var(--yellow); /*rgba(255,255,255,.9);*/
  color: #fff;
  border: none; font-size: .9rem;
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: .25s; z-index: 20;
  box-shadow: 0 2px 8px rgba(0,0,0,.15);
}
.svcpclose:hover { background: var(--green); color: #fff; }

/* ── Right: body panel — THIS scrolls independently ── */
.svcpbody {
  width: 60%;
  height: 100%;
  overflow-y: auto;
  padding: 28px 28px 24px;
  display: flex;
  flex-direction: column;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.svcpbody::-webkit-scrollbar { display: none; }

.svcpico {
  width: 44px; height: 44px; margin-bottom: 15px;
  border-radius: 10px;
  background: var(--secondary);
  display: flex; align-items: center; justify-content: center;
  font-size: 1.15rem;
  color: #fff;
  flex-shrink: 0;
}
.svcptitle {
  font-size: 1.35rem; font-weight: 800; color: #1a1a1a;
  margin-bottom: 10px; font-family: "Rubik", serif;
}
.svcpdesc { color: #555; font-size: .9rem; line-height: 1.75; margin-bottom: 18px; }
.svcpfeatures { list-style: none; margin-bottom: 22px; padding: 0; }
.svcpfeatures li {
  display: flex; align-items: flex-start; gap: 10px;
  font-size: .87rem; color: #333; margin-bottom: 10px;
}
.svcpfeatures li i { color: var(--primary); margin-top: 3px; }
.svcp-quote-btn {
  width: 100%;
  background: var(--secondary);
  color: #fff; border: none; border-radius: 9px;
  padding: 14px; font-weight: 700; font-size: .95rem;
  cursor: pointer; font-family: "Poppins", "Poppins Fallback", sans-serif;
  transition: .3s;
  margin-top: auto;
}
.svcp-quote-btn:hover { transform: scale(1.02); box-shadow: 0 8px 20px rgba(232,40,26,.32); }

/* Tablet and below: stack image on top, body below (matches your
   menu popup's own tablet breakpoint of 991px) */
@media (max-width: 991px) {
  .svcpbox { flex-direction: column; overflow-y: auto; }
  .svcpimg { width: 100%; height: 260px; }
  .svcpbody { width: 100%; height: auto; overflow-y: visible; padding: 22px 20px 24px; }
}

.trust-ico {
    width: 44px; height: 44px; margin-bottom: 15px;
    border-radius: 10px;
    background: var(--secondary);
    display: flex; align-items: center; justify-content: center;
    font-size: 1.15rem;
    color: #fff;
    flex-shrink: 0;
}

/* =================================================================== NAV MENU RED BORDER ========================================================================*/

@media (max-width: 991.98px) {
  .navbar-nav .nav-link::after {
    display: none;
  }
}

  /* ---------- pulsing call button ---------- */
  .call-btn{
    display:flex;align-items:center;gap:10px;
    background:var(--primary);
    color: #fff;
    text-decoration:none;
    padding:10px 20px 10px 14px;
    border-radius:50px;
    font-size:.85rem;font-weight:600;
    white-space:nowrap;
    position:relative;
    transition:background .25s, transform .2s;
  }
  .call-btn:hover{background:var(--green);transform:translateY(-1px);}
  .call-btn:active{transform:translateY(0);}

  .ring-wrap{
    position:relative;
    width:30px;height:30px;
    flex-shrink:0;
    display:flex;align-items:center;justify-content:center;
  }
  .ring-wrap .icon-circle{
    width:30px;height:30px;border-radius:50%;
    background:var(--yellow);
    display:flex;align-items:center;justify-content:center;
    animation:pulse 1.2s ease-in-out infinite;
  }
  .ring-wrap .icon-circle svg{
    width:14px;height:14px;
    fill:var(--charcoal);
  }
  @keyframes pulse{
    0%, 100%{transform:scale(1);}
    50%{transform:scale(1.22);}
  }

  /* respect reduced motion */
  @media (prefers-reduced-motion: reduce){
    .icon-circle{animation:none;}
    .nav-links a::after{transition:none;}
  }

  @media (max-width:991.98px){
    .call-btn{display:none;}
  }

  /* keyboard focus visibility */
  a:focus-visible, button:focus-visible{
    outline:2px solid var(--yellow);outline-offset:3px;
  }

/* ===================== COMPARISON SECTION (TRC vs Other Removalists) ===================== */
#comparison{
  background:#fff;
}
#comparison .stitle{

}
@media (max-width:480px){
  #comparison .stitle{font-size:1.5rem;}
}
#comparison .comp-table{
  max-width:1024px;
  margin:0 auto;
}
#comparison .comp-row{
  display:grid;
  grid-template-columns:minmax(0,1.55fr) minmax(0,1fr) minmax(0,1fr);
  align-items:stretch;
}
#comparison .comp-row + .comp-row > .comp-feature{
  border-top:2px solid #eee;
}
#comparison .comp-row + .comp-row > .comp-mark:not(.trc-col){
  border-top:2px solid #eee;
}
#comparison .comp-row + .comp-row > .comp-mark.trc-col{
  border-top:2px solid rgba(255,255,255,0.28);
}
#comparison .comp-feature{
  padding:20px 22px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:4px;
}
#comparison .comp-feature .comp-title{
  font-family:"Rubik", Playfair Display, serif;
  font-weight:700;
  font-size:16px;
  color:var(--dark);
}
#comparison .comp-feature .comp-desc{
  color:#777;
  font-size:14px;
  line-height:1.6;
}
#comparison .comp-head-row{
  align-items:stretch;
}
#comparison .comp-head-blank{
  display:flex;
  align-items:flex-end;
  padding:0 22px 18px;
}
#comparison .comp-head-blank small{
  color:#888;
  font-size:14px;
  letter-spacing:.06em;
  text-transform:uppercase;
  font-weight:600;
}
#comparison .comp-col-head{
  position:relative;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-end;
  padding: 36px 12px 15px;    /*34px*/
  text-align:center;
}
#comparison .comp-col-head.trc{
  background:var(--secondary);
  color:#fff;
  border-radius:18px 18px 0 0;
  padding-top:45px;    /*36px*/
}
#comparison .comp-logo{
  max-width:120px;
  height:auto;
  display:block;
  margin:5px auto;
}
.comp-badge {
  /*position: absolute;*/
  /*top: 12px; left: 12px;*/
  margin: 0 auto;
  color: #fff;
  border-radius: 7px;
  padding: 3px 12px;
  font-size: .7rem;
  font-weight: 700;
  z-index: 2;
}

#comparison .comp-tape{
  position:absolute;
  top:16px;
  left:-6%;
  width:112%;
  background: var(--primary);  /*linear-gradient(135deg, #ffd873, var(--secondary) 55%, #d98d0d);*/
  color:#fff;
  font-family:"Poppins", "Poppins Fallback", sans-serif;
  font-weight:600;
  font-size:10.5px;
  letter-spacing:.13em;
  text-transform:uppercase;
  text-align:center;
  padding:7px 0;
  /*transform:rotate(-3deg);*/
  box-shadow:0 8px 16px -6px rgba(0,0,0,.8), inset 0 1px 0 rgba(255,255,255,.5);
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
}
#comparison .comp-tape i{
  font-size:9px;
  color:#a5670a;
}
#comparison .comp-tape::before,
#comparison .comp-tape::after{
  content:"";
  position:absolute;
  top:0;
  width:0;
  height:0;
  border-top:14px solid var(--primary);   /*#b9760b*/
}
#comparison .comp-tape::before{
  left:-1px;
  border-left:7px solid transparent;
}
#comparison .comp-tape::after{
  right:-1px;
  border-right:7px solid transparent;
}
#comparison .comp-col-head .comp-brand{
  font-family:"Rubik", Playfair Display, serif;
  font-weight:800;
  font-size:21px;
  letter-spacing:-0.01em;
}
#comparison .comp-col-head .comp-brand-sub{
  font-size:10.5px;
  letter-spacing:.1em;
  text-transform:uppercase;
  opacity:.75;
  margin-top:2px;
}
#comparison .comp-col-head.other{
  color:#777;
}
#comparison .comp-col-head.other .comp-brand{
  color:#9aa0a6;
}
#comparison .comp-mark{
  display:flex;
  align-items:center;
  justify-content:center;
  padding:16px 8px;
}
#comparison .comp-mark.trc-col{
  background:var(--secondary);
}
#comparison .comp-check,
#comparison .comp-cross{
  width:30px;height:30px;
  border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  flex-shrink:0;
}
#comparison .comp-check{
  background:#fff;
  color:var(--primary);
  box-shadow:0 3px 8px rgba(0,0,0,.18);
}
#comparison .comp-row:last-child .comp-mark.trc-col{
  border-radius:0 0 18px 18px;
}
#comparison .comp-cross{
  border:2px solid #d5d5d5;
}
#comparison .comp-check svg{width:15px;height:15px;}
#comparison .comp-cross svg{width:12px;height:12px;}
#comparison .comp-footnote{
  text-align:center;
  color:#888;
  font-size:13px;
  margin-top:22px;
}
#comparison .comp-cta-row{
  display:flex;
  justify-content:center;
  margin-top:32px;
}

@media (max-width:767.98px){
  #comparison .comp-row{grid-template-columns:minmax(0,1.3fr) minmax(0,.85fr) minmax(0,.85fr);}
  #comparison .comp-col-head .comp-brand{font-size:15px;}
  #comparison .comp-logo{max-width:80px;}
  #comparison .comp-feature{padding:16px 12px;}
  #comparison .comp-feature .comp-desc{display:none;}
  #comparison .comp-col-head{padding:26px 6px 14px;}
  #comparison .comp-tape{font-size:8px;top:11px;}
  #comparison .comp-check,
  #comparison .comp-cross{width:26px;height:26px;}
}

/* ===================== INVENTORY CALCULATOR ===================== */
#inv-hero{
  background:var(--cream);
  padding:60px 0 40px;
  text-align:center;
}
#inv-hero h1{
  font-family:"Playfair Display",serif;
  font-weight:800;
  font-size:clamp(1.9rem,4vw,2.7rem);
  color:var(--dark);
  margin-bottom:10px;
}
#inv-hero p{
  color:#666;
  max-width:560px;
  margin:0 auto;
  font-size:15px;
}

#inv-calculator{
  padding:50px 0 80px;
  background:#fff;
}
.inv-layout{
  display:grid;
  grid-template-columns:220px 1fr 300px;
  gap:24px;
  align-items:start;
}

/* Room tab list */
.inv-room-list{
  display:flex;
  flex-direction:column;
  gap:6px;
  position:sticky;
  top:100px;
}
.inv-room-btn{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  background:var(--cream);
  border:1px solid transparent;
  border-radius:10px;
  padding:11px 14px;
  font-family:"Poppins", "Poppins Fallback", sans-serif;
  font-size:13.5px;
  font-weight:600;
  color:var(--dark);
  text-align:left;
  cursor:pointer;
  transition:.15s ease;
}
.inv-room-btn:hover{background:var(--cream2);}
.inv-room-btn.active{
  background:var(--primary);
  color:#fff;
}
.inv-room-count{
  background:rgba(0,0,0,.12);
  color:inherit;
  font-style:normal;
  font-size:11px;
  font-weight:700;
  border-radius:20px;
  padding:1px 8px;
  display:none;
}
.inv-room-btn.active .inv-room-count{background:rgba(255,255,255,.25);}

/* Item panel */
.inv-item-panel{
  background:var(--cream);
  border-radius:16px;
  padding:26px;
  min-height:400px;
}
.inv-panel-heading{
  font-family:"Rubik", serif;
  font-weight:700;
  font-size:19px;
  color:var(--dark);
  margin:0 0 18px;
  padding-bottom:12px;
  border-bottom:2px solid var(--secondary);
  display:inline-block;
}
.inv-item-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(260px,1fr));
  gap:10px;
}
.inv-item-row{
  background:#fff;
  border:1px solid #ececec;
  border-radius:10px;
  padding:12px 14px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.inv-item-name{
  font-size:13px;
  font-weight:600;
  color:var(--dark);
  display:flex;
  flex-direction:column;
  gap:2px;
}
.inv-item-vol{
  font-size:10.5px;
  font-weight:500;
  color:#999;
}
.inv-stepper{
  display:flex;
  align-items:center;
  gap:0;
  flex-shrink:0;
  border:1px solid #ddd;
  border-radius:8px;
  overflow:hidden;
}
.inv-step-btn{
  width:30px;height:30px;
  background:var(--cream);
  border:none;
  font-size:16px;
  font-weight:700;
  color:var(--primary);
  cursor:pointer;
  line-height:1;
}
.inv-step-btn:hover{background:var(--secondary);color:#fff;}
.inv-step-val{
  width:32px;
  text-align:center;
  font-weight:700;
  font-size:14px;
  color:var(--dark);
}

/* Sticky summary sidebar */
.inv-summary-card{
  position:sticky;
  top:100px;
  background:var(--primary);
  color:#fff;
  border-radius:16px;
  padding:26px;
}
.inv-summary-card h4{
  font-family:"Poppins", "Poppins Fallback", sans-serif;
  font-size:12px;
  letter-spacing:.1em;
  text-transform:uppercase;
  opacity:.75;
  margin:0 0 6px;
}
.inv-summary-cbm{
  font-family:"Rubik", serif;
  font-size:42px;
  font-weight:800;
  line-height:1;
  margin-bottom:2px;
}
.inv-summary-cbm span{font-size:18px;font-weight:600;opacity:.8;}
.inv-summary-items{
  font-size:13px;
  opacity:.85;
  margin-bottom:20px;
}
.inv-truck-box{
  background:rgba(255,255,255,.12);
  border-radius:10px;
  padding:14px;
  margin-bottom:20px;
}
.inv-truck-box .inv-truck-label{
  font-weight:700;
  font-size:15px;
  margin-bottom:2px;
}
.inv-truck-box .inv-truck-note{
  font-size:12px;
  opacity:.8;
}
.inv-summary-actions{display:flex;flex-direction:column;gap:8px;}
.inv-btn-continue{
  background:var(--secondary);
  color:#fff;
  border:none;
  border-radius:10px;
  padding:12px;
  font-weight:700;
  font-size:14px;
  cursor:pointer;
}
.inv-btn-reset{
  background:transparent;
  color:#fff;
  border:1px solid rgba(255,255,255,.4);
  border-radius:10px;
  padding:10px;
  font-weight:600;
  font-size:13px;
  cursor:pointer;
}

/* Extra items + details section */
#invDetailsSection{
  max-width:720px;
  margin:60px auto 0;
  padding:0 20px;
}
.inv-extra-box{
  background:var(--cream);
  border-radius:14px;
  padding:22px;
  margin-bottom:30px;
}
.inv-extra-box label{
  font-weight:700;
  font-size:13.5px;
  display:block;
  margin-bottom:8px;
}
.inv-extra-box textarea{
  width:100%;
  border:1px solid #ddd;
  border-radius:8px;
  padding:10px 12px;
  font-family:inherit;
  font-size:13.5px;
  resize:vertical;
}
#invFormError{
  display:none;
  background:#fdecea;
  color:#b3261e;
  padding:10px 14px;
  border-radius:8px;
  font-size:13px;
  margin-bottom:14px;
}
#invSuccessPanel{
  display:none;
  background:var(--cream2);
  border-radius:16px;
  padding:30px;
  text-align:center;
}
#invSuccessPanel h3{
  font-family:"Playfair Display",serif;
  color:var(--primary);
  margin-bottom:10px;
}
#invSummaryText{
  text-align:left;
  white-space:pre-wrap;
  background:#fff;
  border-radius:10px;
  padding:16px;
  font-size:12.5px;
  color:#555;
  max-height:260px;
  overflow-y:auto;
  margin:16px 0;
}
.inv-summary-meta{
  text-align:left;
  font-size:13.5px;
  margin-bottom:10px;
}
.inv-summary-meta strong{color:var(--primary);}

@media (max-width:991.98px){
  .inv-layout{grid-template-columns:1fr;}
  .inv-room-list{
    position:static;
    flex-direction:row;
    overflow-x:auto;
    padding-bottom:6px;
  }
  .inv-room-btn{flex-shrink:0;}
  .inv-summary-card{position:static;}
}
@media (max-width:575.98px){
  .inv-item-grid{grid-template-columns:1fr;}
  .inv-item-panel{padding:18px;}
}
.btn-outline{
  display:inline-block;
  border:2px solid var(--primary);
  color:var(--primary);
  background:transparent;
  padding:10px 20px;
  border-radius:8px;
  font-weight:700;
  font-size:14px;
  text-decoration:none;
}
.btn-outline:hover{background:var(--primary);color:#fff;}


/* ====================================== Date Calendar ============================================================= */
input[type="date"] {
  cursor: pointer;
}

/* perf: keep intrinsic-ratio images responsive when width/height attrs are present */
:where(img[width][height]){height:auto}

/* perf: skip drawing off-screen sections until the visitor scrolls near them (sizes match real heights so the page does not jump) */
#testimonials{content-visibility:auto;contain-intrinsic-size:auto 1403px}
#pricing{content-visibility:auto;contain-intrinsic-size:auto 2396px}
#comparison{content-visibility:auto;contain-intrinsic-size:auto 959px}
#about{content-visibility:auto;contain-intrinsic-size:auto 1290px}
#services{content-visibility:auto;contain-intrinsic-size:auto 2844px}
#history{content-visibility:auto;contain-intrinsic-size:auto 842px}
#areas{content-visibility:auto;contain-intrinsic-size:auto 761px}
#faq{content-visibility:auto;contain-intrinsic-size:auto 1570px}
#hours{content-visibility:auto;contain-intrinsic-size:auto 1362px}
@media (min-width:992px){
#testimonials{contain-intrinsic-size:auto 1474px}
#pricing{contain-intrinsic-size:auto 625px}
#comparison{contain-intrinsic-size:auto 1229px}
#about{contain-intrinsic-size:auto 805px}
#services{contain-intrinsic-size:auto 1244px}
#history{contain-intrinsic-size:auto 869px}
#areas{contain-intrinsic-size:auto 784px}
#faq{contain-intrinsic-size:auto 1367px}
#hours{contain-intrinsic-size:auto 796px}
}

/* a11y: bigger tap areas for small links and slider dots */
.swiper-pagination-bullet{width:10px;height:10px;margin:0 7px!important}
a[href^="tel:"]:not([class]),a[href^="mailto:"]:not([class]),footer a{display:inline-block;min-height:24px;line-height:24px;padding:0 2px}

/* a11y: text colours with enough contrast (same look, slightly deeper tones) */
.catct,.tesrl,.gswipehint,.trc-form-secure,.areas-count,.reviews__aggregate-count,.sdesc,.comp-brand-sub,.comp-brand,.tlbody p,#about p,.cdesc{color:#5f5f5f}
.trk-desc{color:#5f5f5f}
.trk-card s,.trk-price s,s{color:#767676}
.footer__badge{color:#b5b5b5}
.footer__nap,.fdesc{color:#b0b0b0}
.fbot p,.fbot a,.fbot span{color:#b0b0b0}
.anum,.anum+small,.abadge small{color:#1a1a1a}

#ct-quote-submit-btn,.mob-cta-quote{color:#1a1a1a!important}
#comparison .comp-col-head.other .comp-brand{color:#666}

/* review popup title must always be white */
#galPop #gpTitle,#galPop .gpcap h5{color:#fff!important}

/* a11y: headings re-levelled so none skip a level; hfx classes keep the original look */
.hfx-8fbc34{font-family:Rubik;font-size:20px;font-weight:500;font-style:normal;line-height:24px;letter-spacing:normal;text-transform:none;text-align:center;color:rgb(255, 255, 255);margin-top:0px;margin-bottom:5px;margin-left:0px;margin-right:0px;padding-top:0px;padding-bottom:0px;padding-left:0px;padding-right:0px;text-decoration-line:none;text-shadow:none}
.hfx-ff9f8d{font-family:Rubik, serif;font-size:17.6px;font-weight:800;font-style:normal;line-height:21.12px;letter-spacing:normal;text-transform:none;text-align:start;color:rgb(26, 26, 26);margin-top:0px;margin-bottom:12px;margin-left:0px;margin-right:0px;padding-top:0px;padding-bottom:0px;padding-left:0px;padding-right:0px;text-decoration-line:none;text-shadow:none}
.hfx-c203d8{font-family:Poppins, "Poppins Fallback", sans-serif;font-size:14.4px;font-weight:700;font-style:normal;line-height:17.28px;letter-spacing:normal;text-transform:none;text-align:start;color:rgb(26, 26, 26);margin-top:0px;margin-bottom:2px;margin-left:0px;margin-right:0px;padding-top:0px;padding-bottom:0px;padding-left:0px;padding-right:0px;text-decoration-line:none;text-shadow:none}
.hfx-1e447f{font-family:Rubik, "Playfair Display", serif;font-size:16.8px;font-weight:700;font-style:normal;line-height:20.16px;letter-spacing:normal;text-transform:none;text-align:right;color:rgb(0, 0, 0);margin-top:0px;margin-bottom:7px;margin-left:0px;margin-right:0px;padding-top:0px;padding-bottom:0px;padding-left:0px;padding-right:0px;text-decoration-line:none;text-shadow:none}
.hfx-3e5bd4{font-family:Rubik, "Playfair Display", serif;font-size:16.8px;font-weight:700;font-style:normal;line-height:20.16px;letter-spacing:normal;text-transform:none;text-align:left;color:rgb(0, 0, 0);margin-top:0px;margin-bottom:7px;margin-left:0px;margin-right:0px;padding-top:0px;padding-bottom:0px;padding-left:0px;padding-right:0px;text-decoration-line:none;text-shadow:none}