/* added by pradeep  */
@import url("https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&family=Philosopher:ital,wght@0,400;0,700;1,400;1,700&display=swap");

img {
  max-width: 100%;
  height: auto;
}
.event_img_custom {
  width: 240px;
  max-width: 45%;
}
footer p a {
  color: white;
}
@media (max-width: 767px) {
  .event_img_custom {
    float: none !important;
    width: 100%;
    max-width: 100%;
    margin: 0 0 18px 0 !important;
    display: block;
  }
  .hero-slider .slick-active .hero-title {
    font-size: 28px;
  }
  a.btn.btn-primary.btn-lg.btn_custom_yellow {
    margin-bottom: 34px;
  }
}
.btn-back-to-top {
  bottom: 100px !important; /* clears the floating call/whatsapp buttons */
  right: 30px !important;
}
.md__custom {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}
.home__custom::selection {
  background: #cd4226;
  color: white;
}
body {
  overflow-x: hidden !important;
}
.banner_text_custom h1 {
  font-size: 38px;
  margin-bottom: 20px;
}
p.mt_para {
  text-align: center;
}

.benefit-card__icon {
  width: 64px;
  height: 64px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 18px;
  color: var(--gold-lt); /* icon stroke colour — matches theme */
}

.benefit-card__icon svg {
  width: 100%;
  height: 100%;
}

/* optional: soft circular backdrop behind each icon */
.benefit-card__icon {
  background: rgba(123, 67, 151, 0.08);
  border-radius: 50%;
  padding: 12px;
  width: 72px;
  height: 72px;
}

.why-choose-section {
  padding: 90px 0;
  background: var(--cream);
}

.why-choose__panel {
  background: #fff;
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 22px 55px rgba(43, 20, 60, 0.14);
}

.why-choose__panel .row.no-gutters {
  margin-left: 0;
  margin-right: 0;
}

.why-choose__panel .col-lg-6 {
  padding: 0;
}

.why-choose .mb_custom_title {
  margin-bottom: 14px;
}

.why-choose .custom_ul {
  margin: 22px 0 30px;
}

/* --- Banner --- */
.why-choose__banner {
  position: relative;
  border-radius: 0;
  overflow: hidden;
  box-shadow: none;
  height: 100%;
  min-height: 460px;
}
.logo {
  height: auto;
  min-height: 44px;
  display: flex;
  align-items: center;
}
.why-choose__banner img {
  min-height: 460px;
  margin: 0;
}

.why-choose__banner img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* subtle gradient so the badge stays readable */
.why-choose__banner::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    180deg,
    rgba(43, 20, 60, 0) 55%,
    rgba(43, 20, 60, 0.55) 100%
  );
  pointer-events: none;
}

/* --- Floating experience badge --- */
.why-choose__badge {
  position: absolute;
  left: 22px;
  bottom: 22px;
  z-index: 2;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 20px;
  border-radius: 14px;
  background: #f4c430;
  color: #2b143c;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
}

.why-choose__badge-num {
  font-size: 32px;
  font-weight: 700;
  line-height: 1;
}

.why-choose__badge-txt {
  font-size: 13px;
  font-weight: 600;
  line-height: 1.25;
}

.brand-mark {
  display: flex;
  flex-direction: column;
  line-height: 1;
  text-decoration: none !important;
  padding: 4px 0;
}
.brand-mark__name {
  font-family: "Philosopher", sans-serif;
  font-weight: 700;
  font-size: 24px;
  letter-spacing: 0.5px;
  color: #fff;
  transition: color 0.3s ease;
}
.brand-mark__tag {
  font-family: "Lora", Georgia, serif;
  font-style: italic;
  font-size: 11px;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: var(--gold-lt);
  margin-top: 5px;
  transition: color 0.3s ease;
}

/* if your header gets a solid/light background class on scroll,
   e.g. .wrap-menu-header.is-scrolled, swap the text color here: */
.wrap-menu-header.is-scrolled .brand-mark__name {
  color: var(--ink);
}
.wrap-menu-header.is-scrolled .brand-mark__tag {
  color: var(--ember);
}

@media (max-width: 991.98px) {
  .why-choose__banner {
    margin-top: 0;
    min-height: 320px;
  }
  .why-choose__banner img {
    min-height: 320px;
  }
  .why-choose__panel {
    border-radius: 14px;
  }
  .why-choose-section {
    padding: var(--pad-md) 0;
  }
}
.custom__radius {
  border-radius: 4px !important;
  margin-bottom: 12px !important;
}
.location__custom {
  height: 45px !important;
  background: #f8f8f8 !important;
  margin-bottom: 15px !important;
}
.btn-block_custom {
  margin-top: 18px !important;
  font-size: 18px !important;
  font-weight: 600 !important;
}
.callme__custom {
  bottom: 14px !important;
  right: 77px !important;
}
.home__custom {
  font-family: "Philosopher", sans-serif;
  font-weight: 400;
  font-style: normal;
}
.carouselExampleCaptions__custom .carousel-item img {
  object-fit: cover;
  height: 100vh;
  object-position: 0% 100%;
}
.section-head_custom .section-title {
  margin-bottom: 34px !important;
  font-size: 28px;
  margin-top: 0 !important;
}
.btn-primary_custom {
  background: #f04d2c !important;
  border: 0 !important;
  color: white !important;
}
.btn-primary_custom_pdf {
  background: white !important;
  border: 1px solid #f04d2c !important;
  color: #f04d2c !important;
  height: 47px;
  margin-left: 20px;
}

.btn-primary_custom_pdf img {
  width: 20px !important;
  margin-right: 9px;
  margin-top: -6px;
}
.margin_btm_custom {
  margin-bottom: 20px !important;
}
img.banner_style_custom {
  width: 90%;
}
.view-group_custom .caption.card-body {
  height: 308px;
  position: relative;
}
.view-group_custom .card-body .row {
  position: absolute;
  bottom: 22px;
}
.bg_gray_custom {
  background: #ffff003d;
  padding: 60px 0px;
}
.custom_blog_card .img-event {
  position: relative;
  overflow: hidden;
}

.custom_blog_card .text-overlay {
  position: absolute;
  bottom: 15px;
  right: 15px;
  background: rgba(0, 0, 0, 0.6);
  padding: 10px 18px;
  border-radius: 10px;
  text-align: right;
  font-style: italic;
  border: 1px solid lightgray;
  min-width: 190px;
}

.custom_blog_card .text-overlay h3 {
  color: #fff;
  font-size: 18px;
  margin: 0;
}

.custom_blog_card .text-overlay p {
  color: #f3fe09;
  font-size: 20px;
  margin: 0;
  font-weight: 600;
}
.tabsa_block_custom {
  background: #eea808 !important;
  padding: 60px 0px;
  padding: 66px;
  margin: 0 !important;
}
section.accordian__custom.py-5 {
  background: #eea808 !important;
  padding: 60px 0px !important;
}
.section_head__custom .section-title {
  margin-left: 0 !important;
  margin-top: 0 !important;
  text-align: left !important;
}
.section_head__main .contact-location-item {
  align-items: flex-start !important;
}
.section_head__main .contact-icon i {
  width: 48px !important;
  height: 48px !important;
  line-height: 46px !important;
  font-size: 25px !important;
}
.marquee_custom {
  background: #ffde00;
  font-size: 16px;
  font-style: italic;
  display: flex;
  padding: 6px;
}
.applynow_custom {
  display: flex;
  gap: 10px;
  align-items: center;
  justify-content: center;
  display: none;
}
.applynow_custom p {
  margin-bottom: 0;
}
.banner_test_custom {
  padding: 0;
}
.headg__custom {
  margin-top: 8px;
  color: #cd4226;
  font-size: 21px;
  font-family: unset;
  display: none;
}
.custom_textinput {
  border-radius: 4px !important;
}
.location__custom_mb {
  border-radius: 4px !important;
}
select.mb-10.location__custom_mb {
  height: 40px;
  background: #f8f8f8;
  font-size: 14px;
}
#tabsa.tabsa_block_custom img {
  border-radius: 10px;
  width: 100%;
  height: auto;
}

.tabsa_block_custom .carousel-item {
  transition: transform 0.6s ease;
}

.custom-footer {
  font-size: 15px;
  background: #13303c;
  color: white;
}

.custom-footer h6 {
  color: white;
}

.custom-footer .footer-links a {
  color: #ffffffe6;
  text-decoration: none;
  transition: all 0.3s ease;
}

.custom-footer .footer-links a:hover {
  color: #f4b400; /* Yellow hover like Frameboxx */
}

.custom-footer .social-icons a {
  display: inline-block;
  color: #333;
  background: #fff;
  border-radius: 50%;
  padding: 8px 10px;
  transition: all 0.3s ease;
}

.custom-footer .social-icons a:hover {
  color: #f4b400;
  background: #f0f0f0;
}
.logo_custom {
  width: 70px;
}
.home_contact_section_custom {
  background: white !important;
  padding-bottom: 50px;
}
.custom-footer hr {
  border-top: 1px solid #ddd;
}
.custom-footer .social-icons a img {
  width: 18px;
  filter: contrast(0.5);
}
.students_placement_block {
  text-align: center;
}
.images_students {
  margin-bottom: 43px;
}
.images_students img {
  width: 70%;
}
section#tabsa.tabsa_block_custom {
  background: #13303c !important;
}

.google-review-slider h2 {
  font-size: 2rem;
  position: relative;
}

.google-review-slider h2::after,
.accordian__custom h2:after {
  content: "";
  display: block;
  width: 60px;
  height: 3px;
  background: #f6c90e;
  margin: 10px auto 0;
  border-radius: 2px;
}
.accordian__custom h2 {
  color: #000;
}
.review-card {
  transition:
    transform 0.3s ease,
    box-shadow 0.3s ease;
  color: black;
}
.review-card .text-muted {
  color: #181818 !important;
  font-size: 16px;
}
.review-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
}

#scrollTopBtn {
  display: none;
  position: fixed;
  background: lightgray;
  border: 0;
  bottom: 30px;
  right: 30px;
  z-index: 999;
  width: 40px;
  height: 40px;
  cursor: pointer;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
  transition: opacity 0.3s ease;
}
#scrollTopBtn img {
  width: 30px;
}
#scrollTopBtn:hover {
  opacity: 0.8;
}
.custom_up_arrow {
  width: 10px;
}

.module-card {
  border: 1px solid #f2b600;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.05);
  margin-bottom: 1rem;
  border-radius: 4px;
}
.module-card .card-header {
  background: #fff;
  cursor: pointer;
  font-size: 16px;
  padding: 15px 20px;
  border-bottom: 1px solid #f2b600;
}
.module-card .card-header:hover {
  background: #fdf8e3;
}
.accordian__custom .toggle-icon {
  font-size: 20px;
  color: #f2b600;
  font-weight: bold;
}
.accordian__custom .underline {
  width: 40px;
  height: 3px;
  background: #f2b600;
  margin: 6px auto 0;
  border-radius: 2px;
}
.accordian__custom .card {
  border: 1px solid #f4b63e;
  border-radius: 6px;
  transition: all 0.3s ease;
}

.accordian__custom .card-header {
  cursor: pointer;
  padding: 1rem 1.25rem;
  background-color: #fff;
}
.sticky_footer {
  display: none;
}
.tabsa_block_custom__section {
  padding: 60px 0;
}
.download_brochure_btn {
  border: 1px solid #2e2e2e4a;
  color: black;
  background: transparent;
  font-size: 16px;
}
.custom__width {
  width: 18px;
  filter: contrast(0.5);
}
.font_16 {
  font-size: 16px;
}
.accordian__custom .card-header:hover {
  background-color: #fffaf2;
}
.custom_blog_card .list-group-image {
  border: 2px solid gray;
}
.banner-test.banner_text_custom {
  width: 500px;
  max-width: 100%;
}
.text_yellow {
  color: #eea808;
}
.font_26 {
  font-size: 26px;
}
.foundation-section .underline {
  width: 60px;
  height: 3px;
  background-color: #fbc02d;
  border-radius: 2px;
  margin-top: 4px;
}

.software-icon {
  width: 40px;
  height: 40px;
  border: 2px solid #fbc02d;
  border-radius: 50%;
  padding: 3px;
  background: #fff;
}

.course-section h5,
.course-section h6 {
  color: #222;
}

.learn-box {
  border: 1px solid #eee;
  background: white !important;
}

.info-box {
  background: #fff;
  border: 1px solid #eee;
}

.course-section ul li {
  position: relative;
  padding-left: 24px;
  margin-bottom: 8px;
}

.course-section ul li::before {
  content: "✔";
  position: absolute;
  left: 0;
  color: #f9b100; /* orange underline color */
  font-weight: bold;
}
.software-icon {
  width: 35px;
  height: 35px;
  object-fit: contain;
}
.course-section .font-weight-bold {
  color: #000;
}

.font-weight-bolda {
  font-size: 26px;
  color: #ffffff;
}

.bgimg {
  align-items: center;
}

section.course-section.py-5 {
  background: #f5f5f5;
}
a.btn.btn-lg.btn_brochure_custom.feedback.show-modal {
  background: #daff0775;
  border: 0;
  color: black !important;
  height: 39px;
}
.social.flex-w.flex-l-m.p-r-20 a {
  visibility: hidden;
}
.social.flex-w.flex-l-m.p-r-20 .btn-show-sidebar {
  visibility: visible;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 22px;
  position: relative;
  cursor: pointer;
  border: 0;
  background: transparent;
}
/* fallback hamburger icon in case main.css's icon doesn't render */
.social.flex-w.flex-l-m.p-r-20 .btn-show-sidebar:before,
.social.flex-w.flex-l-m.p-r-20 .btn-show-sidebar:after,
.social.flex-w.flex-l-m.p-r-20 .btn-show-sidebar span {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  height: 2px;
  background: #fff;
  transition: all 0.3s ease;
}
.social.flex-w.flex-l-m.p-r-20 .btn-show-sidebar:before {
  top: 0;
}
.social.flex-w.flex-l-m.p-r-20 .btn-show-sidebar span {
  top: 50%;
  margin-top: -1px;
}
.social.flex-w.flex-l-m.p-r-20 .btn-show-sidebar:after {
  bottom: 0;
}

:root {
  --pad-xl: 100px; /* desktop hero-adjacent sections */
  --pad-lg: 90px; /* desktop standard sections */
  --pad-md: 64px; /* tablet / small-desktop (≤991px) */
  --pad-sm: 44px; /* phone (≤575px) */
}

/* =========================================================
   JAYRAJ BHATT — VISUAL SYSTEM v2
   ink · antique gold · ember
   ========================================================= */
:root {
  --ink: #100d18;
  --ink-2: #1b1526;
  --gold: #c9a227;
  --gold-lt: #e8c96a;
  --ember: #c2410c;
  --ember-lt: #f59331;
  --cream: #fdfaf3;
  --muted: #6b6257;
}

.hero-wrap img,
.svc-grid img,
.tabsa_block_custom img {
  float: none !important;
  margin: 0 !important;
}

/* ── shared: small serif italic kicker ───────────────────── */
.eyebrow {
  display: block;
  font-family: "Lora", Georgia, serif;
  font-style: italic;
  font-size: 16px;
  letter-spacing: 0.3px;
  color: var(--gold);
  margin-bottom: 14px;
}
.eyebrow:after {
  content: "";
  display: block;
  width: 46px;
  height: 1px;
  background: currentColor;
  opacity: 0.55;
  margin-top: 14px;
}

/* =========================================================
   1 · HERO
   ========================================================= */
.hero-wrap {
  position: relative;
  height: 100vh;
  height: 100svh;
  min-height: 560px;
  overflow: hidden;
  background: var(--ink);
}
.hero-slider,
.hero-slider .slick-list,
.hero-slider .slick-track,
.hero-slide {
  height: 100vh;
  height: 100svh;
  min-height: 560px;
}
.hero-slide {
  position: relative;
  display: flex !important;
  align-items: center;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.hero-slide--right {
  background-position: right center;
}
@media (max-width: 767px) {
  .hero-slide--right {
    background-position: center !important;
  }
}
.hero-slide:before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(
      97deg,
      rgba(16, 13, 24, 0.94) 0%,
      rgba(16, 13, 24, 0.78) 38%,
      rgba(16, 13, 24, 0.22) 78%,
      rgba(16, 13, 24, 0.45) 100%
    ),
    radial-gradient(
      120% 80% at 80% 20%,
      rgba(201, 162, 39, 0.16),
      transparent 60%
    );
}
/* thin gold frame inset — the signature */
.hero-wrap:after {
  content: "";
  position: absolute;
  inset: 26px;
  z-index: 4;
  pointer-events: none;
  border: 1px solid rgba(201, 162, 39, 0.3);
}
@media (min-width: 768px) {
  .hero-slider .slick-active.hero-slide {
    animation: heroDrift 11s ease-out forwards;
  }
}
@keyframes heroDrift {
  from {
    background-size: 106% auto;
  }
  to {
    background-size: 116% auto;
  }
}
@media (max-width: 767px) {
  .hero-slider .slick-active.hero-slide {
    background-size: cover !important;
    background-position: center !important;
  }
}

/* portrait photos (e.g. the diya) — framed whole, not cropped */
.hero-slide--photo {
  background-color: #100d18;
  background-size: auto 84%;
  background-position: 74% center;
}
@media (min-width: 768px) {
  .hero-slider .slick-active.hero-slide--photo {
    animation: heroDriftSoft 13s ease-out forwards;
  }
}
@keyframes heroDriftSoft {
  from {
    background-size: auto 86%;
  }
  to {
    background-size: auto 92%;
  }
}
@media (min-width: 1400px) {
  .hero-slide--photo {
    background-size: auto 88%;
    background-position: 72% center;
  }
  .hero-slider .slick-active.hero-slide--photo {
    animation: heroDriftSoftWide 13s ease-out forwards;
  }
}
@keyframes heroDriftSoftWide {
  from {
    background-size: auto 90%;
  }
  to {
    background-size: auto 96%;
  }
}
@media (max-width: 767px) {
  .hero-slide--photo {
    background-size: cover !important;
    background-position: 50% 32% !important;
  }
  .hero-slider .slick-active.hero-slide--photo {
    background-size: cover !important;
    background-position: 50% 32% !important;
  }
}

.hero-inner {
  position: relative;
  z-index: 3;
  width: 100%;
  max-width: 1160px;
  margin: 0 auto;
}
.hero-kicker {
  display: inline-block;
  font-family: "Lora", Georgia, serif;
  font-style: italic;
  font-size: 15px;
  letter-spacing: 0.4px;
  color: var(--gold-lt);
  padding: 0 0 0 54px;
  position: relative;
  margin-bottom: 26px;
  opacity: 0;
  transform: translateY(18px);
}
.hero-kicker:before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: 38px;
  height: 1px;
  background: var(--gold);
}
.hero-title {
  color: #fff;
  font-family: "Philosopher", sans-serif;
  font-weight: 700;
  font-size: 40px;
  line-height: 1.08;
  letter-spacing: -0.5px;
  margin: 0 0 22px;
  max-width: 15ch;
  opacity: 0;
  transform: translateY(24px);
}
.hero-title em {
  font-family: "Lora", Georgia, serif;
  font-style: italic;
  color: var(--gold-lt);
  font-weight: 400;
}
.hero-sub {
  color: rgba(255, 255, 255, 0.76) !important;
  font-size: clamp(15px, 1.45vw, 19px);
  line-height: 1.7;
  max-width: 46ch;
  text-align: left !important;
  margin: 0 0 38px;
  padding-left: 20px;
  border-left: 2px solid rgba(201, 162, 39, 0.45);
  opacity: 0;
  transform: translateY(24px);
}
.hero-cta {
  display: flex;
  flex-wrap: wrap;
  gap: 0;
  opacity: 0;
  transform: translateY(24px);
}
.hero-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 17px 34px;
  border-radius: 0;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  text-decoration: none !important;
  transition: all 0.3s ease;
}
.hero-btn--solid {
  background: var(--gold);
  color: var(--ink) !important;
  border: 1px solid var(--gold);
}
.hero-btn--solid:hover {
  background: var(--gold-lt);
  border-color: var(--gold-lt);
}
.hero-btn--ghost {
  background: transparent;
  color: #fff !important;
  border: 1px solid rgba(255, 255, 255, 0.28);
  border-left: 0;
}
.hero-btn--ghost:hover {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.55);
}

.hero-slider .slick-active .hero-kicker {
  animation: heroUp 0.8s 0.18s cubic-bezier(0.2, 0.7, 0.3, 1) forwards;
}
.hero-slider .slick-active .hero-title {
  animation: heroUp 0.8s 0.3s cubic-bezier(0.2, 0.7, 0.3, 1) forwards;
}
.hero-slider .slick-active .hero-sub {
  animation: heroUp 0.8s 0.44s cubic-bezier(0.2, 0.7, 0.3, 1) forwards;
}
.hero-slider .slick-active .hero-cta {
  animation: heroUp 0.8s 0.58s cubic-bezier(0.2, 0.7, 0.3, 1) forwards;
}
@keyframes heroUp {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* arrows — squared, bottom-right cluster */
.hero-arrow {
  position: absolute;
  bottom: 56px;
  z-index: 6;
  top: auto;
  transform: none;
  width: 56px;
  height: 52px;
  border-radius: 0;
  border: 1px solid rgba(201, 162, 39, 0.45);
  background: rgba(16, 13, 24, 0.55);
  color: var(--gold-lt);
  font-size: 19px;
  line-height: 1;
  cursor: pointer;
  transition: all 0.3s ease;
}
.hero-arrow:hover {
  background: var(--gold);
  color: var(--ink);
  border-color: var(--gold);
}
.hero-arrow--prev {
  right: 126px;
  left: auto;
}
.hero-arrow--next {
  right: 70px;
  border-left: 0;
}

/* dots — vertical ticks on the left rail */
.hero-slider .slick-dots {
  position: absolute;
  left: 70px;
  bottom: 58px;
  right: auto;
  display: flex !important;
  gap: 9px;
  list-style: none;
  margin: 0;
  padding: 0;
  z-index: 6;
}
.hero-slider .slick-dots li {
  width: auto;
  height: auto;
  margin: 0;
}
.hero-slider .slick-dots li button {
  width: 30px;
  height: 2px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: rgba(255, 255, 255, 0.3);
  text-indent: -9999px;
  overflow: hidden;
  cursor: pointer;
  transition: all 0.35s ease;
}
.hero-slider .slick-dots li button:before {
  display: none;
}
.hero-slider .slick-dots li.slick-active button {
  background: var(--gold-lt);
  width: 58px;
}

.hero-scroll {
  position: absolute;
  left: 70px;
  bottom: 90px;
  z-index: 6;
  display: flex;
  align-items: center;
  gap: 12px;
  transform: none;
  color: rgba(255, 255, 255, 0.5) !important;
  font-size: 10px;
  letter-spacing: 3px;
  text-transform: uppercase;
  text-decoration: none !important;
}
.hero-mouse {
  width: 34px;
  height: 1px;
  border: 0;
  border-radius: 0;
  background: rgba(255, 255, 255, 0.4);
  position: relative;
}
.hero-mouse:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 12px;
  height: 1px;
  background: var(--gold-lt);
  transform: none;
  animation: heroSlide 1.9s infinite ease-in-out;
}
@keyframes heroSlide {
  0% {
    left: 0;
    opacity: 0;
  }
  40% {
    opacity: 1;
  }
  100% {
    left: 22px;
    opacity: 0;
  }
}

@media (max-width: 1199px) {
  .hero-inner {
    padding: 120px 48px;
  }
  .hero-arrow--prev {
    right: 104px;
  }
  .hero-arrow--next {
    right: 48px;
  }
  .hero-slider .slick-dots,
  .hero-scroll {
    left: 48px;
  }
}
@media (max-width: 991px) {
  .hero-wrap:after {
    inset: 16px;
  }
  .hero-arrow {
    display: none !important;
  }
  .hero-inner {
    padding: 120px 34px;
  }
  .hero-title {
    max-width: none;
  }
  .hero-sub {
    max-width: none;
  }
  .hero-slider .slick-dots {
    left: 34px;
  }
  .hero-scroll {
    display: none;
  }
  .hero-slide:before {
    background: linear-gradient(
      180deg,
      rgba(16, 13, 24, 0.82),
      rgba(16, 13, 24, 0.6) 45%,
      rgba(16, 13, 24, 0.92)
    );
  }
}
@media (max-width: 600px) {
  h1.hero-title {
    font-size: 30px;
  }
  .hero-wrap,
  .hero-slider,
  .hero-slider .slick-list,
  .hero-slider .slick-track,
  .hero-slide {
    height: 92vh;
    min-height: 520px;
  }
  .hero-inner {
    padding: 110px 26px;
  }
  .hero-btn {
    padding: 15px 24px;
    font-size: 12px;
    letter-spacing: 1.4px;
  }
  .hero-btn--ghost {
    border-left: 1px solid rgba(255, 255, 255, 0.28);
  }
  .hero-cta {
    gap: 10px;
  }
  .hero-slider .slick-dots {
    left: 26px;
    bottom: 34px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .hero-slider .slick-active.hero-slide {
    animation: none;
  }
  .hero-kicker,
  .hero-title,
  .hero-sub,
  .hero-cta {
    opacity: 1 !important;
    transform: none !important;
    animation: none !important;
  }
}

/* =========================================================
   2 · EMBER INTRO BLOCK (.tabsa_block_custom)
   ========================================================= */
.tabsa_block_custom {
  position: relative;
  overflow: hidden;
  padding: 104px 0 !important;
  background: radial-gradient(
    90% 120% at 12% 0%,
    #f8a82f 0%,
    #ef7c14 38%,
    #c2410c 78%,
    #9a3009 100%
  ) !important;
}
/* faint concentric arcs — depth without noise */
.tabsa_block_custom:before {
  content: "";
  position: absolute;
  top: 50%;
  right: -260px;
  width: 760px;
  height: 760px;
  transform: translateY(-50%);
  border-radius: 50%;
  pointer-events: none;
  border: 1px solid rgba(255, 255, 255, 0.16);
  box-shadow:
    0 0 0 60px rgba(255, 255, 255, 0.055),
    0 0 0 140px rgba(255, 255, 255, 0.035);
}
.tabsa_block_custom:after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(
    180deg,
    rgba(0, 0, 0, 0.14),
    transparent 30%,
    rgba(0, 0, 0, 0.18)
  );
}
.tabsa_block_custom .container {
  position: relative;
  z-index: 2;
}
.tabsa_block_custom .font_16 {
  font-family: "Lora", Georgia, serif;
  font-style: italic;
  color: #ffe9c2 !important;
  font-size: 17px !important;
  letter-spacing: 0.2px;
  text-transform: none;
  font-weight: 400;
  margin-bottom: 16px !important;
}
.tabsa_block_custom .section-title {
  color: #fff;
  font-family: "Philosopher", sans-serif;
  font-size: clamp(27px, 3.1vw, 42px);
  line-height: 1.22;
  font-weight: 700;
  letter-spacing: -0.3px;
  padding-bottom: 22px;
  margin-bottom: 24px !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.28);
}
.tabsa_block_custom .section-title:after {
  display: none;
}
.tabsa_block_custom p {
  color: rgba(255, 255, 255, 0.9) !important;
  font-size: 17px;
  line-height: 1.85;
}
.tabsa_block_custom .mb_bottom span {
  color: rgba(255, 255, 255, 0.75);
  font-size: 15px;
}
.tabsa_block_custom .header-socials a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  margin-right: 6px;
  border-radius: 0;
  background: transparent;
  color: #fff !important;
  border: 1px solid rgba(255, 255, 255, 0.4);
  transition: all 0.3s ease;
}
.tabsa_block_custom .header-socials a:hover {
  background: #fff;
  color: #c2410c !important;
}
/* offset gold frame behind the portrait */
.tabsa_block_custom .col-lg-6.text-center {
  position: relative;
}
.tabsa_block_custom .ml_custom {
  position: relative;
  z-index: 2;
  border-radius: 0 !important;
  max-width: 92%;
  height: auto;
  box-shadow: 0 30px 60px rgba(84, 26, 4, 0.38);
}
.tabsa_block_custom .col-lg-6.text-center:before {
  content: "";
  position: absolute;
  z-index: 1;
  top: 26px;
  left: 26px;
  width: calc(92% - 6px);
  height: calc(100% - 96px);
  border: 1px solid rgba(255, 255, 255, 0.55);
}
.tabsa_block_custom .session_text_custom {
  display: inline-block;
  margin-top: 28px;
  background: var(--ink);
  color: var(--gold-lt) !important;
  padding: 16px 38px;
  border-radius: 0;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 2.2px;
  text-transform: uppercase;
  text-decoration: none !important;
  transition: all 0.3s ease;
}
.tabsa_block_custom .session_text_custom:hover {
  background: #fff;
  color: #c2410c !important;
}
@media (max-width: 991px) {
  .tabsa_block_custom {
    padding: var(--pad-md) 0 !important;
    text-align: center;
  }
  .tabsa_block_custom .section-title {
    text-align: center !important;
  }
  .tabsa_block_custom .mb_bottom {
    justify-content: center;
  }
  .tabsa_block_custom p {
    text-align: left;
  }
  .tabsa_block_custom .col-lg-6.text-center:before {
    display: none;
  }
  .tabsa_block_custom .ml_custom {
    max-width: 100%;
    margin-top: 34px !important;
  }
}

/* =========================================================
   4 · SERVICE TRIO
   ========================================================= */
.svc-grid {
  padding: 30px 0 96px;
  background: var(--cream);
}
.svc-grid .svc-head {
  max-width: 640px;
  margin: 0 0 56px;
}
.svc-grid .svc-head h2 {
  font-family: "Philosopher", sans-serif;
  font-size: clamp(26px, 2.9vw, 40px);
  color: var(--ink);
  font-weight: 700;
  line-height: 1.22;
  letter-spacing: -0.3px;
  margin: 0 0 14px;
}
.svc-grid .svc-head h2 em {
  font-family: "Lora", Georgia, serif;
  font-style: italic;
  color: var(--ember);
  font-weight: 400;
}
.svc-grid .svc-head h2:after {
  display: none;
}
.svc-grid .svc-head p {
  text-align: left !important;
  color: var(--muted);
  font-size: 17px;
  line-height: 1.8;
}

.svc-card {
  height: 100%;
  background: #fff;
  border-radius: 0;
  border: 1px solid #e9dfcd;
  border-top: 2px solid var(--ink);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  box-shadow: none;
  transition:
    transform 0.4s cubic-bezier(0.2, 0.7, 0.3, 1),
    box-shadow 0.4s ease,
    border-top-color 0.4s ease;
}
.svc-card:hover {
  transform: translateY(-10px);
  border-top-color: var(--ember);
  box-shadow: 0 26px 50px rgba(30, 20, 10, 0.13);
}
.svc-card__pic {
  position: relative;
  overflow: hidden;
  aspect-ratio: 4/3;
  background: #efe7da;
}
.svc-card__pic img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  filter: saturate(0.82) contrast(1.04);
  transition:
    transform 0.7s cubic-bezier(0.2, 0.7, 0.3, 1),
    filter 0.5s ease;
}
.svc-card:hover .svc-card__pic img {
  transform: scale(1.07);
  filter: saturate(1) contrast(1);
}
.svc-card__pic:after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 45%, rgba(16, 13, 24, 0.5));
}
/* index numeral instead of a pill badge */
.svc-card__tag {
  position: absolute;
  bottom: 16px;
  left: 20px;
  z-index: 2;
  background: none;
  color: rgba(255, 255, 255, 0.9);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 2.4px;
  text-transform: uppercase;
  padding: 0;
  border-radius: 0;
}
.svc-card__body {
  padding: 30px 26px 32px;
  display: flex;
  flex-direction: column;
  flex: 1;
  position: relative;
}
.svc-card__body:before {
  counter-increment: svc;
  content: "0" counter(svc);
  position: absolute;
  top: -54px;
  right: 22px;
  font-family: "Lora", Georgia, serif;
  font-size: 44px;
  font-style: italic;
  color: rgba(255, 255, 255, 0.85);
  line-height: 1;
}
.svc-grid .row {
  counter-reset: svc;
}
.svc-card__body h3 {
  font-size: 23px;
  font-weight: 700;
  margin: 0 0 14px;
  font-family: "Philosopher", sans-serif;
  line-height: 1.3;
}
.svc-card__body h3 a {
  color: var(--ink) !important;
  text-decoration: none !important;
  transition: color 0.3s ease;
}
.svc-card:hover .svc-card__body h3 a {
  color: var(--ember) !important;
}
.svc-card__body p {
  font-size: 16px !important;
  line-height: 1.8;
  color: var(--muted) !important;
  margin-bottom: 24px;
  flex: 1;
  text-align: left !important;
}
.svc-card__link {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--ember) !important;
  text-decoration: none !important;
  padding-top: 18px;
  border-top: 1px solid #eee3d2;
}
.svc-card__link i {
  transition: transform 0.35s ease;
}
.svc-card__link:hover i {
  transform: translateX(7px);
}
@media (max-width: 991px) {
  .svc-grid {
    padding: var(--pad-md) 0;
  }
  .svc-card {
    margin-bottom: 28px;
  }
}

/* =========================================================
   5 · WHY CHOOSE
   ========================================================= */
.why-choose {
  position: relative;
  overflow: hidden;
  background: var(--ink);
  border: 0;
  border-radius: 0;
  padding: 60px 52px;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.why-choose:before {
  content: "";
  position: absolute;
  inset: 14px;
  pointer-events: none;
  border: 1px solid rgba(201, 162, 39, 0.28);
}
.why-choose > * {
  position: relative;
  z-index: 2;
}
.why-choose h2 {
  margin: 0 0 6px !important;
  color: #fff !important;
  font-family: "Philosopher", sans-serif;
  font-size: clamp(24px, 2.6vw, 34px);
}
.why-choose > p {
  color: rgba(255, 255, 255, 0.6) !important;
  font-family: "Lora", Georgia, serif;
  font-style: italic;
  font-size: 17px;
}
.why-choose ul.custom_ul {
  list-style: none;
  padding-left: 0;
  margin: 26px 0 30px;
}
.why-choose ul.custom_ul li {
  position: relative;
  padding: 0 0 15px 40px;
  margin-bottom: 15px;
  font-size: 17px;
  color: rgba(255, 255, 255, 0.88);
  border-bottom: 1px solid rgba(255, 255, 255, 0.09);
  list-style: none !important;
}
.why-choose ul.custom_ul li:last-child {
  border-bottom: 0;
}
.why-choose ul.custom_ul li:before {
  content: "\2727";
  position: absolute;
  left: 0;
  top: -1px;
  color: var(--gold);
  font-size: 17px;
}
.why-choose .btn_custom_yellow,
.why-choose a.btn {
  background: var(--gold) !important;
  border: 1px solid var(--gold) !important;
  color: var(--ink) !important;
  border-radius: 0 !important;
  padding: 15px 34px !important;
  font-size: 13px !important;
  letter-spacing: 2px;
  text-transform: uppercase;
  font-weight: 700;
}
.why-choose .btn_custom_yellow:hover,
.why-choose a.btn:hover {
  background: var(--gold-lt) !important;
  border-color: var(--gold-lt) !important;
}

/* =========================================================
   3 · BENEFIT GRID (replaces .city_custom 2x2)
   ========================================================= */
.benefit-grid {
  position: relative;
  padding: 100px 0 88px;
  background: var(--ink);
  overflow: hidden;
}
/* faint gold grid-lines for texture */
.benefit-grid:before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: radial-gradient(
    70% 55% at 50% 0%,
    rgba(201, 162, 39, 0.13),
    transparent 62%
  );
}
.benefit-grid .container {
  position: relative;
  z-index: 2;
}

.benefit-head {
  max-width: 620px;
  margin: 0 0 58px;
}
.benefit-head .eyebrow {
  color: var(--gold);
}
.benefit-head h2 {
  font-family: "Philosopher", sans-serif;
  font-weight: 700;
  font-size: clamp(26px, 2.9vw, 40px);
  line-height: 1.22;
  color: #fff;
  letter-spacing: -0.3px;
  margin: 0;
}
.benefit-head h2 em {
  font-family: "Lora", Georgia, serif;
  font-style: italic;
  color: var(--gold-lt);
  font-weight: 400;
}

.benefit-row {
  counter-reset: bfit;
}
.benefit-card {
  position: relative;
  width: 100%;
  padding: 38px 28px 34px;
  background: rgba(255, 255, 255, 0.035);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-top: 2px solid rgba(201, 162, 39, 0.45);
  transition:
    transform 0.4s cubic-bezier(0.2, 0.7, 0.3, 1),
    background 0.4s ease,
    border-color 0.4s ease;
}
.benefit-card:hover {
  transform: translateY(-9px);
  background: rgba(255, 255, 255, 0.07);
  border-top-color: var(--ember-lt);
  border-color: rgba(255, 255, 255, 0.2);
}
/* index numeral, top-right */
.benefit-card:after {
  counter-increment: bfit;
  content: "0" counter(bfit);
  position: absolute;
  top: 20px;
  right: 22px;
  font-family: "Lora", Georgia, serif;
  font-style: italic;
  font-size: 26px;
  line-height: 1;
  color: rgba(201, 162, 39, 0.32);
  transition: color 0.4s ease;
}
.benefit-card:hover:after {
  color: rgba(232, 201, 106, 0.7);
}

/* icon sits in a gold hairline square — floats cleared */
.benefit-card__icon {
  width: 86px;
  height: 86px;
  margin: 0 0 26px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(201, 162, 39, 0.4);
  background: rgba(201, 162, 39, 0.06);
  transition: all 0.4s ease;
}
.benefit-card__icon img {
  float: none !important;
  margin: 0 !important;
  width: 52px;
  height: 52px;
  object-fit: contain;
  transition: transform 0.45s cubic-bezier(0.2, 0.7, 0.3, 1);
}
.benefit-card:hover .benefit-card__icon {
  border-color: var(--gold-lt);
  background: rgba(201, 162, 39, 0.13);
}
.benefit-card:hover .benefit-card__icon img {
  transform: scale(1.1);
}

.benefit-card h3 {
  font-family: "Philosopher", sans-serif;
  font-weight: 700;
  font-size: 21px;
  line-height: 1.3;
  letter-spacing: 0.2px;
  color: #fff;
  margin: 0 0 14px;
}
.benefit-card p {
  font-size: 15.5px !important;
  line-height: 1.82;
  color: rgba(255, 255, 255, 0.66) !important;
  text-align: left !important; /* kills the global justify */
  margin: 0;
}

/* =========================================================
   JAYRAJ BHATT — VISUAL SYSTEM v3
   Sections 6–11 · ink · antique gold · ember
   PASTE THIS AT THE VERY END OF custom_style.css
   ========================================================= */

/* kill the global `img { float:right }` inside every new block */
.gal-wall img,
.tst-wrap img,
.blog_data img,
.tagfaq-wrap img,
footer.bg1 img {
  float: none !important;
  margin: 0 !important;
}

/* =========================================================
   6 · GALLERY WALL  (replaces the 12-image award grid)
   full-bleed mosaic · zero gutters · gold hairline on hover
   ========================================================= */
.gal-wall {
  background: var(--cream);
  padding: 56px 0 0;
  overflow: hidden;
}
.gal-wall__head {
  max-width: 660px;
  margin: 0 auto 54px;
  padding: 0 24px;
  text-align: center;
}
.gal-wall__head .eyebrow {
  color: var(--ember);
}
.gal-wall__head .eyebrow:after {
  margin: 14px auto 0;
}
.gal-wall__head h2 {
  margin: 0;
  font-family: "Philosopher", sans-serif;
  font-weight: 700;
  font-size: clamp(26px, 2.9vw, 40px);
  line-height: 1.22;
  letter-spacing: -0.3px;
  color: var(--ink);
}
.gal-wall__head h2:after {
  display: none;
}
.gal-wall__more {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-top: 20px;
  padding-bottom: 3px;
  border-bottom: 1px solid rgba(201, 162, 39, 0.55);
  color: var(--ember) !important;
  font-family: "Lora", Georgia, serif;
  font-style: italic;
  font-size: 15px;
  letter-spacing: 0.4px;
  text-decoration: none !important;
  transition:
    color 0.3s ease,
    border-color 0.3s ease;
}
.gal-wall__more:hover {
  color: var(--ink) !important;
  border-bottom-color: var(--ink);
}
.gal-wall__more i {
  transition: transform 0.35s ease;
}
.gal-wall__more:hover i {
  transform: translateX(6px);
}

.gal-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-auto-rows: 21vw;
  grid-auto-flow: dense;
  gap: 0;
  width: 100%;
  background: var(--ink);
}
.gal-item {
  position: relative;
  display: block;
  overflow: hidden;
  background: var(--ink-2);
  text-decoration: none !important;
}
.gal-item--tall {
  grid-row: span 2;
}
.gal-item--wide {
  grid-column: span 2;
}
.gal-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  filter: saturate(0.82) contrast(1.04);
  transition:
    transform 0.8s cubic-bezier(0.2, 0.7, 0.3, 1),
    filter 0.5s ease;
}
/* scrim */
.gal-item:after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    180deg,
    rgba(16, 13, 24, 0.1) 0%,
    rgba(16, 13, 24, 0) 40%,
    rgba(16, 13, 24, 0.78) 100%
  );
  transition: opacity 0.4s ease;
}
/* inset gold frame — the house signature */
.gal-item:before {
  content: "";
  position: absolute;
  inset: 13px;
  z-index: 3;
  pointer-events: none;
  border: 1px solid rgba(232, 201, 106, 0);
  transition: border-color 0.4s ease;
}
.gal-item__cap {
  position: absolute;
  left: 26px;
  right: 26px;
  bottom: 24px;
  z-index: 4;
  color: #fff;
  font-family: "Lora", Georgia, serif;
  font-style: italic;
  font-size: 16px;
  line-height: 1.5;
  opacity: 0;
  transform: translateY(10px);
  transition:
    opacity 0.4s ease,
    transform 0.4s cubic-bezier(0.2, 0.7, 0.3, 1);
}
.gal-item:hover img,
.gal-item:focus-visible img {
  transform: scale(1.07);
  filter: saturate(1) contrast(1);
}
.gal-item:hover:before,
.gal-item:focus-visible:before {
  border-color: rgba(232, 201, 106, 0.72);
}
.gal-item:hover .gal-item__cap,
.gal-item:focus-visible .gal-item__cap {
  opacity: 1;
  transform: none;
}
.gal-item:focus-visible {
  outline: 2px solid var(--gold-lt);
  outline-offset: -2px;
}
li.list-inline-item i {
  margin-right: 0 !important;
}
.logo_element {
  width: 220px !important;
  margin-top: 10px;
}

@media (max-width: 991px) {
  .gal-wall {
    padding-top: var(--pad-md);
  }
  .gal-grid {
    grid-template-columns: repeat(3, 1fr);
    grid-auto-rows: 28vw;
  }
}
@media (max-width: 767px) {
  .gal-grid {
    grid-template-columns: repeat(2, 1fr);
    grid-auto-rows: 42vw;
  }
  h2.section-title.mb-4.text-left.mx-0.mt-0 {
    text-align: left !important;
  }
  .gal-item--tall,
  .gal-item--wide {
    grid-row: span 1;
    grid-column: span 1;
  }
  .gal-item__cap {
    font-size: 14px;
    left: 16px;
    right: 16px;
    bottom: 16px;
    opacity: 1;
    transform: none;
  }
  .gal-item:before {
    inset: 8px;
  }
}

/* =========================================================
   7 · TESTIMONIALS  (full-bleed ink band, quote cards)
   ========================================================= */
.tst-wrap {
  position: relative;
  width: 100vw;
  margin-left: calc(50% - 50vw);
  background: var(--ink);
  padding: 92px 0 96px;
  overflow: hidden;
}
.tst-wrap:before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: radial-gradient(
    65% 55% at 50% 0%,
    rgba(201, 162, 39, 0.14),
    transparent 62%
  );
}
.tst-wrap .container {
  position: relative;
  z-index: 2;
}
.tst-head {
  max-width: 640px;
  margin: 0 0 52px;
}
.tst-head .eyebrow {
  color: var(--gold);
}
.tst-head h2 {
  margin: 0 !important;
  font-family: "Philosopher", sans-serif;
  font-weight: 700;
  font-size: clamp(25px, 2.7vw, 36px);
  line-height: 1.25;
  color: #fff !important;
  text-align: left !important;
}
.tst-head h2:after {
  display: none;
}

.tst-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1px;
  background: rgba(255, 255, 255, 0.11);
  border: 1px solid rgba(255, 255, 255, 0.11);
}
.tst-card {
  position: relative;
  padding: 40px 36px 34px;
  background: var(--ink);
  transition: background 0.4s ease;
}
.tst-card:hover {
  background: var(--ink-2);
}
.tst-card:before {
  content: "\201C";
  display: block;
  font-family: "Lora", Georgia, serif;
  font-size: 58px;
  line-height: 0.6;
  color: rgba(201, 162, 39, 0.55);
  margin-bottom: 20px;
}
.tst-card p {
  margin: 0 0 24px;
  color: rgba(255, 255, 255, 0.82) !important;
  font-size: 17px !important;
  line-height: 1.85;
  text-align: left !important;
  max-width: 62ch;
}
.tst-by {
  display: flex;
  align-items: baseline;
  gap: 10px;
  padding-top: 18px;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.tst-by strong {
  color: var(--gold-lt);
  font-size: 15px;
  letter-spacing: 0.3px;
}
.tst-by span {
  color: rgba(255, 255, 255, 0.45);
  font-size: 14px;
  font-family: "Lora", Georgia, serif;
  font-style: italic;
}
.tst-cta {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  margin-top: 40px;
  padding: 16px 38px;
  background: var(--gold);
  color: var(--ink) !important;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  text-decoration: none !important;
  border: 1px solid var(--gold);
  transition: all 0.3s ease;
}
.tst-cta:hover {
  background: transparent;
  color: var(--gold-lt) !important;
}
@media (max-width: 767px) {
  .tst-wrap {
    padding: var(--pad-md) 0;
  }
  .tst-grid {
    grid-template-columns: 1fr;
  }
  .tst-card {
    padding: 32px 26px 28px;
  }
  .tst-cta {
    width: 100%;
    justify-content: center;
    padding: 16px 20px;
  }
}

/* =========================================================
   8 · JOURNAL / BLOG TRIO
   ========================================================= */
.blog_data {
  background: var(--cream) !important;
  padding: 56px 0 96px !important;
}
.blog_data .blog-head {
  max-width: 620px;
  margin: 0 0 50px;
}
.blog_data .blog-head .eyebrow {
  color: var(--ember);
}
.blog_data .blog-head h2 {
  margin: 0;
  font-family: "Philosopher", sans-serif;
  font-weight: 700;
  font-size: clamp(26px, 2.9vw, 40px);
  line-height: 1.22;
  color: var(--ink);
}
.blog_data .col-md-4 {
  display: flex;
  padding-top: 0 !important;
  margin-bottom: 28px;
}
.blog_data .blo1 {
  display: flex;
  flex-direction: column;
  width: 100%;
  background: #fff;
  border: 1px solid #e9dfcd;
  border-top: 2px solid #ec1d25;
  transition:
    transform 0.4s cubic-bezier(0.2, 0.7, 0.3, 1),
    box-shadow 0.4s ease,
    border-top-color 0.4s ease;
}
.blog_data .blo1:hover {
  transform: translateY(-10px);
  border-top-color: var(--ember);
  box-shadow: 0 26px 50px #ec1d25;
}
.blog_data .wrap-pic-blo1 {
  border-radius: 0 !important;
  aspect-ratio: 4/3;
  overflow: hidden;
  background: #efe7da;
}
.blog_data .wrap-pic-blo1 img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(0.82) contrast(1.04);
  transition:
    transform 0.7s cubic-bezier(0.2, 0.7, 0.3, 1),
    filter 0.5s ease;
}
.blog_data .blo1:hover .wrap-pic-blo1 img {
  transform: scale(1.07);
  filter: saturate(1) contrast(1);
}
.blog_data .wrap-text-blo1 {
  display: flex;
  flex-direction: column;
  flex: 1;
  padding: 30px 26px 32px !important;
}
.blog_data .wrap-text-blo1 h2,
.blog_data .wrap-text-blo1 .txt5 {
  margin: 0 0 14px !important;
  font-family: "Philosopher", sans-serif;
  font-size: 22px !important;
  font-weight: 700;
  line-height: 1.32;
  letter-spacing: 0 !important;
  text-transform: none !important;
  color: var(--ink) !important;
  transition: color 0.3s ease;
}
.blog_data .blo1:hover .wrap-text-blo1 h2 {
  color: var(--ember) !important;
}
.blog_data .wrap-text-blo1 p {
  flex: 1;
  margin: 0 0 24px !important;
  color: var(--muted) !important;
  font-size: 16px !important;
  line-height: 1.8;
  text-align: left !important;
}
/* neutralise the old inline blue/bold spans */
.blog_data .wrap-text-blo1 p span,
.blog_data .wrap-text-blo1 p strong,
.blog_data .wrap-text-blo1 p span strong {
  color: var(--ink) !important;
  font-weight: 700;
}
.blog_data .txt4 {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding-top: 18px;
  border-top: 1px solid #eee3d2;
  color: var(--ember) !important;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  text-decoration: none !important;
}
.blog_data .txt4 i {
  margin-left: 0 !important;
  transition: transform 0.35s ease;
}
.blog_data .txt4:hover i {
  transform: translateX(7px);
}
.blog_data .btn_custom_yellow {
  display: inline-block;
  margin-top: 20px;
  padding: 14px 30px !important;
  background: var(--ink) !important;
  border: 1px solid var(--ink) !important;
  border-radius: 0 !important;
  color: var(--gold-lt) !important;
  font-size: 13px !important;
  font-weight: 700;
  letter-spacing: 1.8px;
  text-transform: uppercase;
}
.blog_data .btn_custom_yellow:hover {
  background: var(--ember) !important;
  border-color: var(--ember) !important;
  color: #fff !important;
}
.blog_data .hide_br {
  display: none;
}
@media (max-width: 991px) {
  .blog_data {
    padding: var(--pad-md) 0 !important;
  }
}

/* =========================================================
   9 · TAGS + FAQ BAND
   ========================================================= */
.tagfaq-wrap {
  position: relative;
  background: var(--ink) !important;
  padding: 56px 0 !important;
  overflow: hidden;
}
.tagfaq-wrap:before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: radial-gradient(
    70% 55% at 20% 0%,
    rgba(201, 162, 39, 0.13),
    transparent 62%
  );
}
.tagfaq-wrap .container {
  position: relative;
  z-index: 2;
}
.tagfaq-wrap h5 {
  position: relative;
  margin: 0 0 30px !important;
  padding-bottom: 16px;
  font-family: "Philosopher", sans-serif;
  font-size: 24px;
  font-weight: 700;
  color: #fff;
}
.tagfaq-wrap h5:after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 46px;
  height: 1px;
  background: var(--gold);
}
/* tag chips */
.tagfaq-wrap .sidebar-widget.tags a {
  display: inline-block;
  margin: 0 8px 10px 0;
  padding: 0 17px;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.15);
  border-radius: 0;
  color: rgba(255, 255, 255, 0.72) !important;
  font-size: 13px;
  letter-spacing: 0.4px;
  text-decoration: none !important;
  transition: all 0.3s ease;
}
.tagfaq-wrap .sidebar-widget.tags a:hover {
  background: var(--gold);
  border-color: var(--gold);
  color: var(--ink) !important;
  transform: translateY(-2px);
}
.tagfaq-wrap .footer-socials {
  margin-top: 26px;
  padding-top: 24px;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.tagfaq-wrap .footer-socials a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  margin-right: 6px;
  border: 1px solid rgba(201, 162, 39, 0.4);
  color: var(--gold-lt) !important;
  transition: all 0.3s ease;
}
.tagfaq-wrap .footer-socials a:hover {
  background: var(--gold);
  border-color: var(--gold);
  color: var(--ink) !important;
}
/* accordion */
.tagfaq-wrap .accordion .card {
  margin-bottom: 12px;
  background: rgba(255, 255, 255, 0.04) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  border-radius: 0 !important;
  transition: border-color 0.3s ease;
}
.tagfaq-wrap .accordion .card:hover {
  border-color: rgba(201, 162, 39, 0.45) !important;
}
.tagfaq-wrap .accordion .card-header {
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}
.tagfaq-wrap .accordion .card-header h3 {
  margin: 0;
}
.accordion .btn-link:hover {
  background: unset !important;
}
.tagfaq-wrap .accordion .btn-link {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  width: 100%;
  padding: 20px 22px !important;
  font-family: "Philosopher", sans-serif;
  font-size: 18px;
  text-align: left;
  color: #fff !important;
  text-decoration: none !important;
  box-shadow: none !important;
  white-space: normal;
}
.tagfaq-wrap .accordion .btn-link:after {
  content: "\2013";
  flex: 0 0 auto;
  color: var(--gold);
  font-size: 22px;
  line-height: 1;
  transition: color 0.3s ease;
}
.tagfaq-wrap .accordion .btn-link.collapsed:after {
  content: "+";
}
.tagfaq-wrap .accordion .btn-link .width_accordian {
  width: auto;
}
.tagfaq-wrap .accordion .card-body {
  margin: 0 22px;
  padding: 18px 0 22px !important;
  border-top: 1px solid rgba(255, 255, 255, 0.09);
  color: rgba(255, 255, 255, 0.68) !important;
  font-size: 16px;
  line-height: 1.85;
}
@media (max-width: 991px) {
  .tagfaq-wrap {
    padding: var(--pad-md) 0 !important;
  }
  .tagfaq-wrap .col-md-6 + .col-md-6 {
    margin-top: 44px;
  }
}

/* =========================================================
   10 · FOOTER
   ========================================================= */
footer.bg1 {
  position: relative;
  background: var(--ink) !important;
}
footer.bg1:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(201, 162, 39, 0.75),
    transparent
  );
}
footer.bg1 .txt13 {
  position: relative;
  margin-bottom: 28px !important;
  padding-bottom: 15px;
  font-family: "Philosopher", sans-serif;
  font-size: 22px;
  font-weight: 700;
  color: #fff !important;
}
footer.bg1 .txt13:after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 44px;
  height: 1px;
  background: var(--gold);
}
footer.bg1 p,
footer.bg1 .txta15a {
  color: rgba(255, 255, 255, 0.66) !important;
  font-size: 15.5px;
  line-height: 1.85;
  text-align: left !important;
}
footer.bg1 ul {
  list-style: none;
  padding-left: 0;
  margin-bottom: 40px !important;
}
footer.bg1 a.txta15a {
  display: inline-block;
  text-decoration: none !important;
  transition: all 0.3s ease;
}
footer.bg1 a.txta15a:hover {
  color: var(--gold-lt) !important;
}
footer.bg1 .txt14 {
  margin-bottom: 12px !important;
}
/* serving areas as a clean index list */
footer.bg1 .serving_area p.txt14 {
  position: relative;
  margin-bottom: 0 !important;
  padding: 11px 0 11px 20px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.07);
}
footer.bg1 .serving_area p.txt14:before {
  content: "";
  position: absolute;
  left: 0;
  top: 19px;
  width: 8px;
  height: 1px;
  background: var(--gold);
  transition: width 0.3s ease;
}
footer.bg1 .serving_area p.txt14:hover:before {
  width: 14px;
}
footer.bg1 .serving_area a {
  font-size: 14px;
  letter-spacing: 0.6px;
}
footer.bg1 .serving_area hr {
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  margin: 18px 0;
}
/* footer photo grid */
footer .wrap-gallery-footer {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr);
  gap: 6px;
}
footer .item-gallery-footer {
  position: relative;
  overflow: hidden;
  aspect-ratio: 1/1;
  border: 1px solid rgba(201, 162, 39, 0.22);
  width: auto !important;
}
footer .item-gallery-footer img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: grayscale(0.4) contrast(1.05);
  transition:
    transform 0.6s cubic-bezier(0.2, 0.7, 0.3, 1),
    filter 0.4s ease;
}
footer .item-gallery-footer:hover img {
  transform: scale(1.1);
  filter: none;
}
footer .item-gallery-footer:hover {
  border-color: var(--gold-lt);
}
.end-footer.bg2 {
  background: #0a0810 !important;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}
.txt17 {
  color: rgba(255, 255, 255, 0.5) !important;
  font-size: 13px;
  letter-spacing: 0.4px;
}
.txt17 .fa-heart {
  color: var(--ember-lt);
}

.tabsa_block_custom .header-socials a {
  margin-right: 0 !important;
  align-items: center !important;
  justify-content: center !important;
}

@media (max-width: 767px) {
  footer.bg1 .wrap-gallery-footer {
    grid-template-columns: repeat(6, 1fr);
  }
}

/* =========================================================
   11 · FLOATING / STICKY CONTACT — match the system
   ========================================================= */
.float-btn {
  border-radius: 0 !important;
  width: 54px !important;
  height: 54px !important;
  box-shadow: 0 10px 24px rgba(16, 13, 24, 0.3) !important;
}
.call-btn {
  background: var(--gold) !important;
  color: var(--ink) !important;
}
.whatsapp-btn {
  background: var(--ink) !important;
  color: var(--gold-lt) !important;
  border: 1px solid rgba(201, 162, 39, 0.5);
}

.about-hero {
  position: relative;
  background-size: cover;
  background-position: center;
  overflow: hidden;
  min-height: 420px;
}
.about-hero:before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    180deg,
    rgba(16, 13, 24, 0.75),
    rgba(16, 13, 24, 0.55) 50%,
    rgba(16, 13, 24, 0.85)
  );
}
.about-hero:after {
  content: "";
  position: absolute;
  inset: 18px;
  border: 1px solid rgba(201, 162, 39, 0.35);
  pointer-events: none;
}
.about-hero__inner {
  position: relative;
  z-index: 2;
  text-align: center;
  max-width: 780px;
  margin: 0 auto;
}
.about-hero__title {
  font-family: "Philosopher", sans-serif;
  font-weight: 700;
  color: #fff !important;
  font-size: clamp(26px, 4vw, 42px);
  line-height: 1.28;
  margin: 10px 0 0;
}

.session_text_custom {
  display: inline-block;
  background: var(--ink);
  color: var(--gold-lt) !important;
  padding: 16px 38px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 2.2px;
  text-transform: uppercase;
  text-decoration: none !important;
  transition: all 0.3s ease;
}
.session_text_custom:hover {
  background: var(--gold);
  color: var(--ink) !important;
}

.btn_custom_yellow {
  display: inline-block;
  background: var(--gold) !important;
  border: 1px solid var(--gold) !important;
  color: var(--ink) !important;
  border-radius: 0 !important;
  padding: 15px 34px !important;
  font-size: 13px !important;
  letter-spacing: 2px;
  text-transform: uppercase;
  font-weight: 700;
  text-decoration: none !important;
  transition: all 0.3s ease;
}
.btn_custom_yellow:hover {
  background: var(--gold-lt) !important;
  border-color: var(--gold-lt) !important;
}

@media (max-width: 600px) {
  .about-hero {
    min-height: 320px;
    padding-top: 120px !important;
    padding-bottom: 50px !important;
  }
}

@media (max-width: 768px) {
  .sticky_footer .call_block {
    background: var(--gold) !important;
  }
  .sticky_footer .whatsapp_block {
    background: var(--ink) !important;
  }
  .sticky_footer .whatsapp_block a {
    color: var(--gold-lt) !important;
  }
  .sticky_footer a {
    letter-spacing: 1.6px;
    text-transform: uppercase;
  }
}

@media (prefers-reduced-motion: reduce) {
  .gal-item img,
  .gal-item__cap,
  .blog_data .blo1,
  .blog_data .wrap-pic-blo1 img,
  .tst-card {
    transition: none !important;
  }
  .blog_data .blo1:hover {
    transform: none;
  }
}
@media (max-width: 991px) {
  .benefit-grid {
    padding: var(--pad-md) 0;
  }
  .benefit-head {
    margin-bottom: 40px;
  }
  .benefit-card {
    margin-bottom: 26px;
    padding: 32px 24px 30px;
  }
}
@media (max-width: 575px) {
  .benefit-card__icon {
    width: 72px;
    height: 72px;
    margin-bottom: 20px;
  }
  .benefit-card__icon img {
    width: 44px;
    height: 44px;
  }
  .benefit-card h3 {
    font-size: 19px;
  }
}
@media (max-width: 600px) {
  .why-choose {
    padding: 34px 24px;
  }
  .why-choose:before {
    inset: 9px;
  }
}
@media (max-width: 575px) {
  .tabsa_block_custom,
  .svc-grid,
  .why-choose-section,
  .benefit-grid,
  .tst-wrap,
  .blog_data,
  .tagfaq-wrap {
    padding-top: var(--pad-sm) !important;
    padding-bottom: var(--pad-sm) !important;
  }
  .gal-wall {
    padding-top: var(--pad-sm) !important;
  }

  /* consistent heading sizes on phone across every section */
  .tabsa_block_custom .section-title,
  .svc-grid .svc-head h2,
  .why-choose h2,
  .benefit-head h2,
  .tst-head h2,
  .blog_data .blog-head h2,
  .gal-wall__head h2 {
    font-size: 24px !important;
    line-height: 1.28 !important;
  }

  /* consistent body copy size on phone across every section */
  .tabsa_block_custom p,
  .svc-grid .svc-head p,
  .why-choose > p,
  .benefit-card p,
  .svc-card__body p,
  .tst-card p,
  .blog_data .wrap-text-blo1 p {
    font-size: 15px !important;
    line-height: 1.7 !important;
  }

  /* consistent horizontal container padding on phone */
  .container {
    padding-left: 18px !important;
    padding-right: 18px !important;
  }
  .social.flex-w.flex-l-m.p-r-20 .btn-show-sidebar {
    width: 23px;
    height: 17px;
    float: right;
    position: absolute;
  }
}
@media (min-width: 992px) {
  .btn-show-sidebar {
    display: none !important;
  }
  .social.flex-w.flex-l-m.p-r-20 {
    display: none !important;
  }
}

/* =========================================================
   12 · SHARED INNER-PAGE SYSTEM  (v4)
   Used by index, about, all 4 service pages and contact.
   ========================================================= */

/* ---------- 12.0 base typography ------------------------------
   Replaces the old inline `p { font-size:18px; text-align:justify }`
   and `img { float:right }` hacks that were breaking layouts. */
body {
  font-family: "Philosopher", "Open Sans", sans-serif;
  font-size: 17px;
  line-height: 1.8;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
p {
  font-size: 17px;
  line-height: 1.85;
  color: var(--muted);
  text-align: left;
  margin: 0 0 18px;
}
img {
  float: none;
  margin: 0;
}

/* ---------- 12.1 shared type helpers -------------------------- */
.jb-eyebrow {
  display: block;
  font-family: "Lora", Georgia, serif;
  font-style: italic;
  font-size: 15px;
  letter-spacing: 0.4px;
  color: var(--ember);
  margin-bottom: 14px;
}
.jb-eyebrow--gold {
  color: var(--gold);
}
.jb-eyebrow--light {
  color: var(--gold-lt);
}
.jb-eyebrow:after {
  content: "";
  display: block;
  width: 46px;
  height: 1px;
  background: currentColor;
  opacity: 0.55;
  margin-top: 13px;
}
.jb-eyebrow--center:after {
  margin-left: auto;
  margin-right: auto;
}

.jb-h2 {
  font-family: "Philosopher", sans-serif;
  font-weight: 700;
  font-size: clamp(26px, 2.9vw, 40px);
  line-height: 1.22;
  letter-spacing: -0.3px;
  color: var(--ink);
  margin: 0 0 18px;
  text-align: left;
}
.jb-h2 em,
.jb-h2--light em {
  font-family: "Lora", Georgia, serif;
  font-style: italic;
  font-weight: 400;
}
.jb-h2 em {
  color: var(--ember);
}
.jb-h2--light {
  color: #fff;
}
.jb-h2--light em {
  color: var(--gold-lt);
}
.jb-h2:after {
  display: none;
}

.jb-h3 {
  font-family: "Philosopher", sans-serif;
  font-weight: 700;
  font-size: 21px;
  line-height: 1.34;
  color: var(--ink);
  margin: 0 0 12px;
  text-align: left;
}
.jb-h3--light {
  color: #fff;
}
.jb-h3:after {
  display: none;
}

.jb-lead {
  font-size: 18px;
  line-height: 1.85;
  color: var(--muted);
  max-width: 66ch;
  text-align: left;
}
.jb-lead--light {
  color: rgba(255, 255, 255, 0.74) !important;
}
.jb-center {
  text-align: center;
}
.jb-center .jb-eyebrow:after {
  margin-left: auto;
  margin-right: auto;
}

/* ---------- 12.2 header brand --------------------------------- */
.wrap-menu-header {
  border-top: 3px solid var(--gold);
  background: linear-gradient(rgba(16, 13, 24, 0.78), rgba(16, 13, 24, 0));
}
.header-fixed .wrap-menu-header {
  background: rgba(253, 250, 243, 0.94);
  border-top-color: var(--gold);
  box-shadow: 0 2px 20px rgba(16, 13, 24, 0.09);
}
.header-fixed .main_menu > li > a {
  color: var(--ink) !important;
}
.header-fixed .main_menu > li:hover > a,
.header-fixed .main_menu > li.active > a {
  color: var(--ember) !important;
}
.logo,
.logo > a {
  display: flex;
  align-items: center;
  height: auto;
  min-height: 0;
}
/* selector matches main.css `.logo > a > img` so it wins on cascade order */
.logo > a > img {
  float: none !important;
  margin: 0 !important;
  width: auto;
  height: 52px;
  max-height: none;
  vertical-align: middle;
  object-fit: contain;
  transition: transform 0.4s cubic-bezier(0.2, 0.7, 0.3, 1);
}
.logo a:hover img {
  transform: scale(1.04);
}
@media (max-width: 1199px) {
  .logo > a > img {
    height: 46px;
  }
}
.main_menu > li > a {
  font-size: 15px;
  letter-spacing: 0.2px;
}
.main_menu > li.active > a {
  color: var(--gold-lt) !important;
}
.header-fixed .main_menu > li.active > a {
  color: var(--ember) !important;
}
/* the old template burger block is replaced by .jb-burger */
.social.flex-w.flex-l-m.p-r-20 {
  display: none !important;
}

/* ---------- 12.3 burger + off-canvas mobile nav ---------------- */
.jb-burger {
  display: none;
  position: relative;
  width: 46px;
  height: 46px;
  margin-left: auto;
  padding: 0;
  border: 1px solid rgba(201, 162, 39, 0.55);
  background: rgba(16, 13, 24, 0.35);
  cursor: pointer;
  flex: 0 0 auto;
}
.jb-burger span {
  position: absolute;
  left: 50%;
  width: 20px;
  height: 2px;
  margin-left: -10px;
  background: var(--gold-lt);
  transition:
    transform 0.35s ease,
    opacity 0.25s ease;
}
.jb-burger span:nth-child(1) {
  top: 16px;
}
.jb-burger span:nth-child(2) {
  top: 22px;
}
.jb-burger span:nth-child(3) {
  top: 28px;
}
body.jb-nav-open .jb-burger span:nth-child(1) {
  transform: translateY(6px) rotate(45deg);
}
body.jb-nav-open .jb-burger span:nth-child(2) {
  opacity: 0;
}
body.jb-nav-open .jb-burger span:nth-child(3) {
  transform: translateY(-6px) rotate(-45deg);
}

.jb-nav__overlay {
  position: fixed;
  inset: 0;
  z-index: 10000;
  background: rgba(16, 13, 24, 0.66);
  opacity: 0;
  visibility: hidden;
  transition:
    opacity 0.35s ease,
    visibility 0.35s ease;
}
body.jb-nav-open .jb-nav__overlay {
  opacity: 1;
  visibility: visible;
}
body.jb-nav-open {
  overflow: hidden;
}

.jb-nav {
  position: fixed;
  top: 0;
  right: 0;
  z-index: 10001;
  display: flex;
  flex-direction: column;
  width: min(86vw, 370px);
  height: 100vh;
  height: 100dvh;
  padding: 30px 26px 40px;
  background: var(--ink);
  transform: translateX(101%);
  transition: transform 0.45s cubic-bezier(0.2, 0.7, 0.3, 1);
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
body.jb-nav-open .jb-nav {
  transform: none;
}
.jb-nav__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding-bottom: 22px;
  margin-bottom: 8px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}
span.jb-eyebrow.jb-eyebrow--light {
  display: none;
}
.jb-nav__top img {
  width: 132px;
  height: auto;
  float: none !important;
  /* background: var(--cream);
  border: 1px solid rgba(201, 162, 39, 0.45);
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.28); */
}
.jb-nav__close {
  width: 40px;
  height: 40px;
  border: 1px solid rgba(201, 162, 39, 0.5);
  background: transparent;
  color: var(--gold-lt);
  font-size: 20px;
  line-height: 1;
  cursor: pointer;
  flex: 0 0 auto;
}
.jb-nav__label {
  font-family: "Lora", Georgia, serif;
  font-style: italic;
  font-size: 12px;
  letter-spacing: 2.4px;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.4);
  margin: 22px 0 8px;
}
.jb-nav__list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.jb-nav__list a {
  display: block;
  padding: 12px 0;
  color: #fff;
  font-size: 17px;
  text-decoration: none !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.07);
  transition:
    color 0.25s ease,
    padding-left 0.25s ease;
}
.jb-nav__list a:hover,
.jb-nav__list a.is-active {
  color: var(--gold-lt);
  padding-left: 8px;
}
.jb-nav__list .is-sub a {
  padding-left: 18px;
  font-size: 15px;
  color: rgba(255, 255, 255, 0.78);
}
.jb-nav__cta {
  margin-top: auto;
  padding-top: 28px;
}
.jb-nav__cta a.jb-btn {
  width: 100%;
  justify-content: center;
  margin-bottom: 12px;
}
.jb-nav__calls {
  display: grid;
  gap: 10px;
}
.jb-nav__call {
  display: block;
  text-align: center;
  color: rgba(255, 255, 255, 0.62) !important;
  font-size: 14px;
  letter-spacing: 1.4px;
  text-transform: uppercase;
  text-decoration: none !important;
  padding: 14px;
  border: 1px solid rgba(255, 255, 255, 0.18);
}

@media (max-width: 991px) {
  .jb-burger {
    display: block;
  }
  .jb-nav {
    display: flex;
  }
}
@media (min-width: 992px) {
  .jb-nav,
  .jb-nav__overlay {
    display: none !important;
  }
}

/* ---------- 12.4 buttons -------------------------------------- */
.jb-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 16px 34px;
  background: var(--gold);
  border: 1px solid var(--gold);
  color: white !important;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  text-decoration: none !important;
  transition: all 0.3s ease;
  cursor: pointer;
}
.jb-btn:hover {
  background: var(--gold-lt);
  border-color: var(--gold-lt);
  color: var(--ink) !important;
}
.jb-btn--ghost {
  background: transparent;
  color: #fff !important;
  border-color: rgba(255, 255, 255, 0.3);
}
.jb-btn--ghost:hover {
  background: #fff;
  border-color: #fff;
  color: var(--ink) !important;
}
.jb-btn--ember {
  background: var(--ember);
  border-color: var(--ember);
  color: #fff !important;
}
.jb-btn--ember:hover {
  background: var(--ember-lt);
  border-color: var(--ember-lt);
  color: var(--ink) !important;
}
.jb-btn--ink {
  background: var(--ink);
  border-color: var(--ink);
  color: var(--gold-lt) !important;
}
.jb-btn--ink:hover {
  background: var(--ember);
  border-color: var(--ember);
  color: #fff !important;
}

/* ---------- 12.5 animated ticker (replaces <marquee>) --------- */
.jb-ticker {
  position: relative;
  background: var(--ink);
  border-top: 1px solid rgba(201, 162, 39, 0.28);
  border-bottom: 1px solid rgba(201, 162, 39, 0.28);
  padding: 15px 0;
  overflow: hidden;
}
.jb-ticker__track {
  display: flex;
  width: max-content;
  animation: jbTicker 42s linear infinite;
}
.jb-ticker:hover .jb-ticker__track {
  animation-play-state: paused;
}
.jb-ticker__group {
  display: flex;
  align-items: center;
  flex: 0 0 auto;
}
.jb-ticker span {
  color: rgba(255, 255, 255, 0.74);
  font-family: "Lora", Georgia, serif;
  font-style: italic;
  font-size: 15px;
  letter-spacing: 0.4px;
  padding: 0 20px;
  white-space: nowrap;
}
.jb-ticker span:after {
  content: "\25C6";
  color: var(--gold);
  margin-left: 40px;
  font-style: normal;
  font-size: 8px;
  vertical-align: middle;
}
@keyframes jbTicker {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-50%);
  }
}
@media (prefers-reduced-motion: reduce) {
  .jb-ticker__track {
    animation: none;
  }
}

/* ---------- 12.6 inner page hero ------------------------------- */
.page-hero {
  position: relative;
  display: flex;
  align-items: center;
  overflow: hidden;
  background-color: var(--ink);
  background-size: cover;
  background-position: center;
  min-height: 480px;
  padding: 190px 0 90px;
  text-align: center;
}
.page-hero:before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(
      180deg,
      rgba(16, 13, 24, 0.86),
      rgba(16, 13, 24, 0.62) 45%,
      rgba(16, 13, 24, 0.9)
    ),
    radial-gradient(
      110% 70% at 78% 25%,
      rgba(201, 162, 39, 0.18),
      transparent 62%
    );
}
.page-hero:after {
  content: "";
  position: absolute;
  inset: 20px;
  border: 1px solid rgba(201, 162, 39, 0.32);
  pointer-events: none;
}
.page-hero__inner {
  position: relative;
  z-index: 2;
  max-width: 860px;
  margin: 0 auto;
  padding: 0 24px;
}
.page-hero__title {
  font-family: "Philosopher", sans-serif;
  font-weight: 700;
  font-size: clamp(27px, 4vw, 46px);
  line-height: 1.22;
  letter-spacing: -0.4px;
  color: #fff;
  margin: 0 0 20px;
}
.page-hero__title em {
  font-family: "Lora", Georgia, serif;
  font-style: italic;
  font-weight: 400;
  color: var(--gold-lt);
}
.page-hero__lead {
  color: rgba(255, 255, 255, 0.76) !important;
  font-size: 17px;
  line-height: 1.8;
  max-width: 62ch;
  margin: 0 auto;
  text-align: center;
}
.jb-crumbs {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin: 0 0 22px;
  padding: 0;
  list-style: none;
  font-family: "Lora", Georgia, serif;
  font-style: italic;
  font-size: 14px;
  color: rgba(255, 255, 255, 0.5);
}
.jb-crumbs a {
  color: rgba(255, 255, 255, 0.62) !important;
  text-decoration: none !important;
  transition: color 0.25s ease;
}
.jb-crumbs a:hover {
  color: var(--gold-lt) !important;
}
.jb-crumbs li + li:before {
  content: "/";
  margin-right: 10px;
  color: var(--gold);
  font-style: normal;
}
/* left-aligned inner hero (about page) — the copy block lines up
   exactly with the .container edge used by every section below it */
.page-hero--left {
  text-align: left;
}
.page-hero--left .page-hero__inner {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 5px;
}
.page-hero--left .page-hero__title {
  margin: 0 0 20px;
  text-align: left;
  max-width: 17ch;
}
.page-hero--left .page-hero__lead {
  margin: 0;
  text-align: left;
  max-width: 58ch;
}
@media (max-width: 991px) {
  .page-hero {
    min-height: 400px;
    padding: 160px 0 70px;
  }
  .page-hero:after {
    inset: 12px;
  }
}
@media (max-width: 575px) {
  .page-hero--left .page-hero__inner {
    padding: 0 18px;
  }
}

/* ---------- 12.7 section shell -------------------------------- */
.jb-section {
  position: relative;
  padding: var(--pad-lg) 0;
  background: var(--cream);
}
.jb-section--paper {
  background: #fff;
}
.jb-section--ink {
  background: var(--ink);
  color: #fff;
}
.jb-section--tight {
  padding: var(--pad-md) 0;
}
.jb-section__head {
  max-width: 700px;
  margin: 0 0 52px;
}
.jb-section__head--center {
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}

/* ---------- 12.8 prose (about / long copy) ------------------- */
.prose h1,
.prose h2,
.prose h3 {
  font-family: "Philosopher", sans-serif;
  font-weight: 700;
  color: var(--ink);
  text-align: left;
  letter-spacing: -0.2px;
}
.prose h1 {
  font-size: clamp(25px, 3vw, 34px);
  line-height: 1.26;
  margin: 0 0 22px;
}
.prose h1:after,
.prose h2:after,
.prose h3:after {
  display: none;
}
.prose h2 {
  font-size: clamp(20px, 2.2vw, 26px);
  line-height: 1.3;
  margin: 46px 0 16px;
  padding-left: 18px;
  border-left: 3px solid var(--gold);
}
.prose h2:first-child {
  margin-top: 0;
}
.prose h3 {
  font-size: 19px;
  line-height: 1.35;
  margin: 30px 0 12px;
}
.prose p {
  margin: 0 0 20px;
  max-width: 74ch;
}
.prose strong {
  color: var(--ink);
  font-weight: 700;
}
.prose a:not(.jb-btn) {
  color: var(--ember);
  text-decoration: none;
  border-bottom: 1px solid rgba(194, 65, 12, 0.35);
  transition: border-color 0.25s ease;
}
.prose a:not(.jb-btn):hover {
  border-bottom-color: var(--ember);
}
.prose ul,
.prose ol {
  list-style: none;
  margin: 0 0 24px;
  padding: 0;
  max-width: 74ch;
}
.prose ul li {
  position: relative;
  padding-left: 30px;
  margin-bottom: 13px;
  color: var(--muted);
}
.prose ul li:before {
  content: "\2727";
  position: absolute;
  left: 0;
  top: 0;
  color: var(--gold);
  font-size: 15px;
}
.prose ol {
  counter-reset: proseol;
}
.prose ol li {
  position: relative;
  counter-increment: proseol;
  padding-left: 42px;
  margin-bottom: 13px;
  color: var(--muted);
}
.prose ol li:before {
  content: counter(proseol, decimal-leading-zero);
  position: absolute;
  left: 0;
  top: 2px;
  font-family: "Lora", Georgia, serif;
  font-style: italic;
  font-size: 15px;
  color: var(--gold);
}
.prose blockquote {
  margin: 34px 0;
  padding: 30px 34px;
  background: #fff;
  border-left: 3px solid var(--ember);
  box-shadow: 0 14px 34px rgba(30, 20, 10, 0.08);
}
.prose blockquote p {
  font-family: "Lora", Georgia, serif;
  font-style: italic;
  font-size: 19px;
  line-height: 1.75;
  color: var(--ink);
  margin: 0;
  max-width: none;
}

/* ---------- 12.9 split rows ----------------------------------- */
.jb-split {
  display: grid;
  grid-template-columns: 1.05fr 0.95fr;
  gap: 70px;
  align-items: center;
}
.jb-split + .jb-split {
  margin-top: 88px;
}
.jb-split--flip .jb-split__media {
  order: -1;
}
.jb-split__media {
  position: relative;
}
.jb-frame {
  position: relative;
}
.jb-frame img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 0 !important;
  box-shadow: 0 30px 60px rgba(30, 20, 10, 0.22);
}
/* offset gold frame — the house signature */
.jb-frame:before {
  content: "";
  position: absolute;
  top: 26px;
  left: 26px;
  z-index: 1;
  width: calc(100% - 6px);
  height: calc(100% - 66px);
  border: 1px solid var(--gold);
  opacity: 0.75;
  pointer-events: none;
}
.jb-split__body p:last-of-type {
  margin-bottom: 0;
}
.jb-points {
  list-style: none;
  margin: 28px 0 0;
  padding: 0;
  counter-reset: jbpoint;
}
.jb-points li {
  position: relative;
  padding: 0 0 16px 44px;
  margin-bottom: 16px;
  border-bottom: 1px solid #eee3d2;
  color: var(--muted);
  font-size: 16.5px;
  line-height: 1.75;
}
.jb-points li:last-child {
  border-bottom: 0;
}
.jb-points li strong {
  color: var(--ink);
  font-weight: 700;
}
.jb-points li:before {
  counter-increment: jbpoint;
  content: "0" counter(jbpoint);
  position: absolute;
  left: 0;
  top: 1px;
  font-family: "Lora", Georgia, serif;
  font-style: italic;
  font-size: 17px;
  color: var(--gold);
}
.jb-split__body .jb-btn {
  margin-top: 30px;
}
@media (max-width: 991px) {
  .jb-split {
    grid-template-columns: 1fr;
    gap: 44px;
  }
  .jb-split--flip .jb-split__media {
    order: 0;
  }
  .jb-split + .jb-split {
    margin-top: 60px;
  }
  .jb-frame:before {
    top: 14px;
    left: 14px;
  }
}

/* ---------- 12.10 feature cards ------------------------------- */
.jb-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 26px;
}
.jb-cards--2 {
  grid-template-columns: repeat(2, 1fr);
}
.jb-cards--4 {
  grid-template-columns: repeat(4, 1fr);
  gap: 22px;
}
.jb-card {
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid #e9dfcd;
  border-top: 2px solid var(--ink);
  padding: 36px 28px 32px;
  transition:
    transform 0.4s cubic-bezier(0.2, 0.7, 0.3, 1),
    box-shadow 0.4s ease,
    border-top-color 0.4s ease;
}
.jb-card:hover {
  transform: translateY(-9px);
  border-top-color: var(--ember);
  box-shadow: 0 26px 50px rgba(30, 20, 10, 0.13);
}
.jb-card__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 78px;
  height: 78px;
  margin: 0 0 24px;
  border: 1px solid rgba(201, 162, 39, 0.5);
  background: rgba(201, 162, 39, 0.07);
  color: var(--gold);
}
.jb-card__icon svg {
  width: 40px;
  height: 40px;
}
.jb-card p {
  margin: 0;
  font-size: 16px;
  line-height: 1.8;
}
.jb-card__pic {
  position: relative;
  overflow: hidden;
  aspect-ratio: 4/3;
  margin: -36px -28px 24px;
  background: #efe7da;
}
.jb-card__pic img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  filter: saturate(0.82) contrast(1.04);
  transition: transform 0.7s cubic-bezier(0.2, 0.7, 0.3, 1);
}
.jb-card:hover .jb-card__pic img {
  transform: scale(1.07);
}
.jb-card__num {
  display: block;
  margin-bottom: 12px;
  font-family: "Lora", Georgia, serif;
  font-style: italic;
  font-size: 24px;
  color: rgba(201, 162, 39, 0.5);
}
/* dark variant */
.jb-section--ink .jb-card {
  background: rgba(255, 255, 255, 0.04);
  border-color: rgba(255, 255, 255, 0.12);
  border-top-color: rgba(201, 162, 39, 0.5);
}
.jb-section--ink .jb-card:hover {
  background: rgba(255, 255, 255, 0.08);
  border-top-color: var(--ember-lt);
  box-shadow: 0 26px 50px rgba(0, 0, 0, 0.4);
}
.jb-section--ink .jb-card p {
  color: rgba(255, 255, 255, 0.68) !important;
}
@media (max-width: 991px) {
  .jb-cards,
  .jb-cards--4 {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 575px) {
  .jb-cards,
  .jb-cards--2,
  .jb-cards--4 {
    grid-template-columns: 1fr;
  }
}

/* ---------- 12.11 stat strip ---------------------------------- */
.jb-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1px;
  background: rgba(255, 255, 255, 0.12);
  border: 1px solid rgba(255, 255, 255, 0.12);
}
.jb-stats--paper {
  background: #e9dfcd;
  border-color: #e9dfcd;
}
.jb-stat {
  padding: 34px 24px;
  background: var(--ink);
  text-align: center;
}
.jb-stats--paper .jb-stat {
  background: #fff;
}
.jb-stat__num {
  display: block;
  font-family: "Philosopher", sans-serif;
  font-weight: 700;
  font-size: 40px;
  line-height: 1;
  color: var(--gold-lt);
  margin-bottom: 10px;
}
.jb-stats--paper .jb-stat__num {
  color: var(--ember);
}
.jb-stat__txt {
  display: block;
  font-family: "Lora", Georgia, serif;
  font-style: italic;
  font-size: 15px;
  line-height: 1.5;
  color: rgba(255, 255, 255, 0.6);
}
.jb-stats--paper .jb-stat__txt {
  color: var(--muted);
}
@media (max-width: 991px) {
  .jb-stats {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 575px) {
  .jb-stat {
    padding: 26px 14px;
  }
  .jb-stat__num {
    font-size: 30px;
  }
  .jb-stat__txt {
    font-size: 13px;
  }
}

/* ---------- 12.12 process steps ------------------------------- */
.jb-steps {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  counter-reset: jbstep;
}
.jb-step {
  position: relative;
  padding: 34px 26px 30px;
  border-top: 2px solid var(--gold);
  background: #fff;
  border-right: 1px solid #eee3d2;
  border-bottom: 1px solid #eee3d2;
  border-left: 1px solid #eee3d2;
}
.jb-step:last-child {
  border-right: 0;
}
.jb-step:before {
  counter-increment: jbstep;
  content: counter(jbstep, decimal-leading-zero);
  display: block;
  margin-bottom: 14px;
  font-family: "Lora", Georgia, serif;
  font-style: italic;
  font-size: 34px;
  line-height: 1;
  color: var(--gold);
}
.jb-step h3 {
  font-family: "Philosopher", sans-serif;
  font-weight: 700;
  font-size: 18px;
  line-height: 1.32;
  color: var(--ink);
  margin: 0 0 10px;
}
.jb-step p {
  margin: 0;
  font-size: 15.5px;
  line-height: 1.75;
}
@media (max-width: 991px) {
  .jb-steps {
    grid-template-columns: repeat(2, 1fr);
  }
  .jb-step:nth-child(2n) {
    border-right: 0;
  }
}
@media (max-width: 575px) {
  .jb-steps {
    grid-template-columns: 1fr;
  }
  .jb-step {
    border-right: 0;
  }
}

/* ---------- 12.13 CTA band ------------------------------------ */
.jb-cta {
  position: relative;
  overflow: hidden;
  background: radial-gradient(
    95% 130% at 8% 0%,
    #f8a82f 0%,
    #ef7c14 34%,
    #c2410c 76%,
    #8f2c08 100%
  );
  padding: 84px 0;
  text-align: center;
}
.jb-cta:before {
  content: "";
  position: absolute;
  top: 50%;
  right: -220px;
  width: 620px;
  height: 620px;
  transform: translateY(-50%);
  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, 0.16);
  box-shadow:
    0 0 0 52px rgba(255, 255, 255, 0.05),
    0 0 0 122px rgba(255, 255, 255, 0.032);
  pointer-events: none;
}
.jb-cta__inner {
  position: relative;
  z-index: 2;
  max-width: 720px;
  margin: 0 auto;
  padding: 0 24px;
}
.jb-cta h2 {
  font-family: "Philosopher", sans-serif;
  font-weight: 700;
  font-size: clamp(25px, 3.1vw, 40px);
  line-height: 1.24;
  color: #fff;
  margin: 0 0 16px;
}
.jb-cta h2:after {
  display: none;
}
.jb-cta h2 em {
  font-family: "Lora", Georgia, serif;
  font-style: italic;
  font-weight: 400;
  color: #ffe6b0;
}
.jb-cta p {
  color: rgba(255, 255, 255, 0.9) !important;
  font-size: 17px;
  line-height: 1.8;
  margin: 0 auto 34px;
  max-width: 58ch;
}
.jb-cta__btns {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  justify-content: center;
}
.jb-cta__btns .jb-btn--ink {
  background: var(--ink);
  border-color: var(--ink);
}
.jb-cta__btns .jb-btn--ghost {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.45);
  color: #fff !important;
}
.jb-cta__btns .jb-btn--ghost:hover {
  background: #fff;
  color: var(--ember) !important;
}

/* ---------- 12.14 contact page -------------------------------- */
.jb-contact-grid {
  display: grid;
  grid-template-columns: 0.92fr 1.08fr;
  gap: 54px;
  align-items: start;
}
.jb-info-list {
  list-style: none;
  margin: 0 0 30px;
  padding: 0;
}
.jb-info {
  display: flex;
  gap: 18px;
  padding: 22px 0;
  border-bottom: 1px solid #eee3d2;
}
.jb-info:first-child {
  border-top: 1px solid #eee3d2;
}
.jb-info__ico {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  border: 1px solid rgba(201, 162, 39, 0.55);
  background: rgba(201, 162, 39, 0.08);
  color: var(--ember);
  font-size: 21px;
}
.jb-info__lbl {
  display: block;
  margin-bottom: 4px;
  font-family: "Lora", Georgia, serif;
  font-style: italic;
  font-size: 13px;
  letter-spacing: 1.6px;
  text-transform: uppercase;
  color: var(--gold);
}
.jb-info__val {
  display: block;
  color: var(--ink);
  font-size: 17px;
  line-height: 1.6;
  text-decoration: none !important;
}
a.jb-info__val:hover {
  color: var(--ember) !important;
}
.jb-info__val small {
  color: var(--muted);
  font-size: 14px;
}

.jb-form {
  background: #fff;
  border: 1px solid #e9dfcd;
  border-top: 3px solid var(--gold);
  padding: 40px 38px 42px;
  box-shadow: 0 24px 54px rgba(30, 20, 10, 0.1);
}
.jb-form__row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
}
.jb-form__group {
  margin-bottom: 18px;
}
.jb-form label {
  display: block;
  margin-bottom: 8px;
  font-family: "Lora", Georgia, serif;
  font-style: italic;
  font-size: 14px;
  letter-spacing: 0.4px;
  color: var(--ink);
}
.jb-form label .req {
  color: var(--ember);
}
section.jb-shots.jb-section.jb-section--paper {
  padding-top: 0;
}
.jb-form .form-control {
  display: block;
  width: 100%;
  padding: 14px 16px;
  border: 1px solid #e2d8c6 !important;
  border-radius: 0;
  background: var(--cream);
  color: var(--ink);
  font-family: "Philosopher", sans-serif;
  font-size: 16px;
  line-height: 1.5;
  transition:
    border-color 0.25s ease,
    background 0.25s ease;
}
.jb-form .form-control:focus {
  outline: none;
  border-color: var(--gold);
  background: #fff;
}
.jb-form textarea.form-control {
  min-height: 140px;
  resize: vertical;
}
.jb-form .form-control::placeholder {
  color: #a79c8c;
}
.jb-form__note {
  margin: 16px 0 0;
  font-size: 14px;
  color: var(--muted);
}
.jb-form .jb-btn {
  width: 100%;
  margin-top: 6px;
  padding: 17px 30px;
}
/* the booking submit needs to read as the primary action against
   the white card, not as a washed-out gold block */
.jb-form .jb-form__submit {
  background: var(--ink);
  border-color: var(--ink);
  color: var(--gold-lt) !important;
  font-family: "Philosopher", sans-serif;
  font-size: 14px;
  letter-spacing: 2.4px;
  box-shadow: 0 12px 26px rgba(16, 13, 24, 0.18);
}
.jb-form .jb-form__submit:hover,
.jb-form .jb-form__submit:focus-visible {
  background: var(--gold);
  border-color: var(--gold);
  color: var(--ink) !important;
  box-shadow: 0 16px 34px rgba(194, 65, 12, 0.24);
  transform: translateY(-2px);
}
@media (max-width: 991px) {
  .jb-contact-grid {
    grid-template-columns: 1fr;
    gap: 38px;
  }
}
@media (max-width: 575px) {
  .jb-form {
    padding: 28px 20px 30px;
  }
  .jb-form__row {
    grid-template-columns: 1fr;
    gap: 0;
  }
}

/* ---------- 12.15 FAQ (service pages) ------------------------- */
.jb-faq {
  max-width: 900px;
  margin: 0 auto;
}
.jb-faq .card {
  margin-bottom: 12px;
  background: #fff !important;
  border: 1px solid #e9dfcd !important;
  border-radius: 0 !important;
  transition: border-color 0.3s ease;
}
.jb-faq .card:hover {
  border-color: var(--gold) !important;
}
.jb-faq .card-header {
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}
.jb-faq .card-header h3 {
  margin: 0;
}
.jb-faq .btn-link {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  width: 100%;
  padding: 21px 24px !important;
  font-family: "Philosopher", sans-serif;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.4;
  text-align: left;
  color: var(--ink) !important;
  text-decoration: none !important;
  box-shadow: none !important;
  white-space: normal;
}
.jb-faq .btn-link:hover,
.jb-faq .btn-link:focus {
  color: var(--ember) !important;
}
.jb-faq .btn-link:after {
  content: "+";
  flex: 0 0 auto;
  color: var(--gold);
  font-size: 24px;
  line-height: 1;
}
.jb-faq .btn-link.collapsed:after {
  content: "\2013";
}
.jb-faq .card-body {
  margin: 0 24px;
  padding: 18px 0 24px !important;
  border-top: 1px solid #eee3d2;
  color: var(--muted) !important;
  font-size: 16.5px;
  line-height: 1.85;
}
.jb-faq .card-body p {
  font-size: 16.5px;
  line-height: 1.85;
}

/* ---------- 12.16 pill / chip list --------------------------- */
.jb-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 26px 0 0;
  padding: 0;
  list-style: none;
}
.jb-chips li {
  padding: 9px 18px;
  border: 1px solid #e2d8c6;
  background: #fff;
  color: var(--ink);
  font-size: 14px;
  letter-spacing: 0.3px;
  transition: all 0.25s ease;
}
.jb-chips li:hover {
  background: var(--gold);
  border-color: var(--gold);
  color: var(--ink);
}

/* ---------- 12.17 not-found / note --------------------------- */
.jb-note {
  display: flex;
  gap: 14px;
  align-items: flex-start;
  padding: 22px 24px;
  margin: 28px 0 0;
  background: rgba(201, 162, 39, 0.1);
  border-left: 3px solid var(--gold);
  color: var(--ink);
  font-size: 16px;
  line-height: 1.75;
}
.jb-note i {
  color: var(--gold);
  font-size: 19px;
  flex: 0 0 auto;
  margin-top: 2px;
}

/* ---------- 12.18 phone heading / body scale ----------------- */
@media (max-width: 575px) {
  .jb-h2,
  .page-hero__title {
    font-size: 25px !important;
    line-height: 1.28 !important;
  }
  .jb-lead,
  .page-hero__lead {
    font-size: 15.5px !important;
    line-height: 1.75 !important;
  }
  .jb-section {
    padding: var(--pad-sm) 0;
  }
  .jb-cta {
    padding: var(--pad-sm) 0;
  }
  .jb-cta__btns .jb-btn {
    width: 100%;
  }
  .jb-split__body .jb-btn,
  .prose .jb-btn {
    width: 100%;
  }
  .jb-points li {
    padding-left: 38px;
    font-size: 15.5px;
  }
}

/* ---------- 12.19 global focus visibility -------------------- */
.jb-nav a:focus-visible,
.jb-btn:focus-visible,
.jb-burger:focus-visible,
.jb-nav__close:focus-visible {
  outline: 2px solid var(--gold-lt);
  outline-offset: 3px;
}
a:focus-visible,
button:focus-visible {
  outline: 2px solid var(--gold);
  outline-offset: 2px;
}

/* ---------- 12.20 floating buttons + mobile sticky bar ------- */
.floating-contact-container {
  position: fixed;
  bottom: 30px;
  right: 30px;
  z-index: 9999;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.float-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 54px;
  height: 54px;
  border-radius: 0;
  box-shadow: 0 10px 24px rgba(16, 13, 24, 0.3);
  text-decoration: none !important;
  font-size: 24px;
  transition:
    transform 0.3s ease,
    background 0.3s ease,
    color 0.3s ease;
}
.float-btn:hover {
  transform: scale(1.08);
}
.call-btn {
  background: var(--gold) !important;
  color: var(--ink) !important;
}
.whatsapp-btn {
  background: var(--ink) !important;
  color: var(--gold-lt) !important;
  border: 1px solid rgba(201, 162, 39, 0.5);
}
.btn-back-to-top {
  bottom: 100px !important;
  right: 30px !important;
}

.sticky_footer {
  display: none;
}
@media (max-width: 768px) {
  .floating-contact-container {
    display: none !important;
  }
  .btn-back-to-top {
    bottom: 84px !important;
    right: 16px !important;
  }
  .sticky_footer {
    display: flex;
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    z-index: 99999;
    box-shadow: 0 -2px 12px rgba(16, 13, 24, 0.22);
  }
  .sticky_footer .call_block,
  .sticky_footer .whatsapp_block {
    flex: 1;
    text-align: center;
  }
  .sticky_footer a {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 14px 0;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 1.6px;
    text-transform: uppercase;
    text-decoration: none !important;
  }
  .call_block {
    background: var(--gold) !important;
  }
  .call_block a {
    color: var(--ink) !important;
  }
  .whatsapp_block {
    background: var(--ink) !important;
  }
  .whatsapp_block a {
    color: var(--gold-lt) !important;
  }
  body {
    padding-bottom: 50px;
  }
}

/* ---------- 12.21 small helpers restored ---------------------- */
.mb_14 {
  margin-bottom: 14px !important;
}
.mb_18 {
  margin-bottom: 18px !important;
}
.why-choose .jb-btn {
  margin-top: 4px;
}
.why-choose .jb-btn .icofont-phone {
  margin-right: 4px;
}

/* bottom bar of the footer */
.end-footer.bg2 {
  background: #0a0810 !important;
  background-image: none !important;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  padding: 0;
}
.end-footer p {
  margin: 0;
}

/* ---------- 12.22 lightbox2 sprite repair --------------------
   vendor/lightbox2/images/ is empty in this repo, so the default
   prev/next/close/loading sprites 404. Redraw them inline. */
.lb-prev,
.lb-next {
  width: 64px;
  height: 64px;
  border: 1px solid rgba(201, 162, 39, 0.5);
  background: rgba(16, 13, 24, 0.55);
  transition:
    opacity 0.3s ease,
    background 0.3s ease;
}
.lb-prev {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23e8c96a' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 5l-7 7 7 7'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
}
.lb-next {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23e8c96a' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 5l7 7-7 7'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
}
.lb-prev:hover,
.lb-next:hover {
  background-color: rgba(201, 162, 39, 0.9);
}
.lb-prev:hover {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23100d18' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 5l-7 7 7 7'/%3E%3C/svg%3E");
}
.lb-next:hover {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23100d18' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 5l7 7-7 7'/%3E%3C/svg%3E");
}
.lb-close {
  width: 34px;
  height: 34px;
  border: 1px solid rgba(201, 162, 39, 0.5);
  background-color: rgba(16, 13, 24, 0.55);
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23e8c96a' stroke-width='1.8' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  opacity: 1;
}
.lb-close:hover {
  opacity: 1;
  background-color: rgba(201, 162, 39, 0.9);
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23100d18' stroke-width='1.8' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E");
}
/* swap the missing loading sprite for a CSS spinner */
.lb-loading,
.lb-loader {
  background: none !important;
  border: 2px solid rgba(232, 201, 106, 0.25);
  border-top-color: var(--gold-lt);
  border-radius: 50%;
  animation: lbSpin 0.9s linear infinite;
}
@keyframes lbSpin {
  to {
    transform: rotate(360deg);
  }
}
.lb-container {
  background: rgba(10, 8, 16, 0.94) !important;
  padding: 34px;
}
.lb-dataContainer {
  border-radius: 0;
}
.lb-caption {
  font-family: "Lora", Georgia, serif;
  font-style: italic;
  color: rgba(255, 255, 255, 0.72);
  padding-top: 16px;
}
.lb-number {
  color: rgba(255, 255, 255, 0.45);
  font-family: "Lora", Georgia, serif;
  font-style: italic;
}
.lb-nav a {
  outline: none;
}

/* =========================================================
   12.23 SOCIAL ICONS ON LIGHT SECTIONS
   .tabsa_block_custom keeps its own white/gold styling
   ========================================================= */
.header-socials li a,
.header-socials li a i {
  color: var(--ink) !important;
}
.header-socials li a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  margin: 0 10px 0 0;
  background: #fff;
  border: 1px solid #e2d8c6;
  border-radius: 0;
  font-size: 18px;
  text-decoration: none !important;
  transition:
    background 0.3s ease,
    border-color 0.3s ease,
    transform 0.3s ease;
}
.header-socials li a i {
  font-size: 18px;
  margin: 0;
}
.header-socials li a:hover {
  background: var(--gold);
  border-color: var(--gold);
  transform: translateY(-4px);
}

/* =========================================================
   12.24 STORY SECTION - image top-aligned with the copy
   The heading sits above the two columns, so the frame lines
   up exactly with the first line of the paragraph.
   ========================================================= */
.jb-section__head--story {
  max-width: 760px;
  margin: 0 0 46px;
}
.jb-split--top {
  align-items: start;
}
.jb-frame--tall {
  aspect-ratio: 3 / 4;
  overflow: hidden;
}
.jb-frame--tall img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 22%;
}
@media (max-width: 991px) {
  .jb-section__head--story {
    margin-bottom: 34px;
  }
  .jb-split--top {
    align-items: stretch;
  }
  .jb-frame--tall {
    aspect-ratio: 4 / 5;
  }
}

/* =========================================================
   12.25 "IN PRACTICE" JUSTIFIED GALLERY  (about page)
   Rows of equal-height frames that fill the width edge to
   edge, with the captions set underneath - unlike the home
   page's full-bleed .gal-wall mosaic with hover-only labels.
   ========================================================= */
.jb-shots__head {
  display: grid;
  grid-template-columns: 1.05fr 0.95fr;
  gap: 54px;
  align-items: end;
  margin: 0 0 48px;
  padding-bottom: 34px;
  border-bottom: 1px solid #e9dfcd;
}
.jb-shots__head .jb-h2 {
  margin: 0;
}
.jb-shots__head-r {
  margin: 0;
  max-width: 52ch;
}

.jb-just__row {
  display: flex;
  gap: 20px;
  margin-bottom: 20px;
}
.jb-just__row:last-child {
  margin-bottom: 0;
}

.jb-shot {
  display: block;
  flex: var(--r, 1) 1 0%;
  min-width: 0;
  text-decoration: none !important;
}
.jb-shot__pic {
  position: relative;
  display: block;
  aspect-ratio: var(--r, 1.5);
  overflow: hidden;
  background: #efe7da;
  border: 1px solid #e9dfcd;
}
/* faint gold inset frame, brightens on hover */
.jb-shot__pic:before {
  content: "";
  position: absolute;
  inset: 12px;
  z-index: 2;
  pointer-events: none;
  border: 1px solid rgba(232, 201, 106, 0);
  transition: border-color 0.4s ease;
}
.jb-shot:hover .jb-shot__pic:before,
.jb-shot:focus-visible .jb-shot__pic:before {
  border-color: rgba(201, 162, 39, 0.75);
}
.jb-shot__pic img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  filter: saturate(0.84) contrast(1.04);
  transition:
    transform 0.75s cubic-bezier(0.2, 0.7, 0.3, 1),
    filter 0.45s ease;
}
.jb-shot:hover .jb-shot__pic img,
.jb-shot:focus-visible .jb-shot__pic img {
  transform: scale(1.06);
  filter: saturate(1) contrast(1);
}
.jb-shot__cap {
  display: block;
  margin: 14px 0 4px;
  font-family: "Philosopher", sans-serif;
  font-weight: 700;
  font-size: 17px;
  line-height: 1.35;
  color: var(--ink);
  transition: color 0.3s ease;
}
.jb-shot:hover .jb-shot__cap {
  color: var(--ember);
}
.jb-shot__meta {
  display: block;
  padding-top: 9px;
  border-top: 1px solid #eee3d2;
  font-family: "Lora", Georgia, serif;
  font-style: italic;
  font-size: 13.5px;
  line-height: 1.5;
  color: var(--muted);
}
.jb-shot:focus-visible {
  outline: 2px solid var(--gold);
  outline-offset: 4px;
}

.jb-shots__foot {
  margin-top: 44px;
  text-align: center;
}
.jb-shots__foot .jb-btn {
  margin-top: 0;
}

/* =========================================================
   12.27 MEDIA PAGE  (structure per the reference layout,
   colours, type and framing from this theme)
   ========================================================= */
.jb-media {
  padding: var(--pad-lg) 0;
  background: var(--cream);
}
.jb-media__head {
  max-width: 720px;
  margin: 0 auto 46px;
  text-align: center;
}
.jb-media__head .jb-h2 {
  margin: 0 0 12px;
}
.jb-media__sub {
  margin: 0;
  font-family: "Lora", Georgia, serif;
  font-style: italic;
  font-size: 17px;
  color: var(--muted);
}
/* the long-form copy sits in one readable column */
.jb-media__copy {
  max-width: 840px;
  margin: 0 auto 62px;
}
.jb-media__copy h2 {
  font-size: clamp(19px, 2vw, 24px);
}
.jb-media__copy p {
  max-width: 74ch;
}

/* square thumbnail grid */
.jb-media__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
  gap: 20px;
}
.jb-media__item {
  position: relative;
  display: block;
  overflow: hidden;
  aspect-ratio: 1 / 1;
  background: #efe7da;
  border: 1px solid #e9dfcd;
  box-shadow: 0 10px 26px rgba(30, 20, 10, 0.09);
  transition:
    transform 0.4s cubic-bezier(0.2, 0.7, 0.3, 1),
    box-shadow 0.4s ease,
    border-color 0.4s ease;
}
.jb-media__item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
  display: block;
  filter: saturate(0.85) contrast(1.04);
  transition:
    transform 0.7s cubic-bezier(0.2, 0.7, 0.3, 1),
    filter 0.45s ease;
}
.jb-media__item:hover {
  transform: translateY(-8px);
  border-color: var(--gold);
  box-shadow: 0 26px 50px rgba(30, 20, 10, 0.16);
}
.jb-media__item:hover img {
  transform: scale(1.07);
  filter: saturate(1) contrast(1);
}
/* caption rises from the bottom on hover, in the house gold */
.jb-media__cap {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 2;
  padding: 16px 18px;
  background: linear-gradient(
    180deg,
    rgba(16, 13, 24, 0),
    rgba(16, 13, 24, 0.88) 62%
  );
  color: #fff;
  font-family: "Lora", Georgia, serif;
  font-style: italic;
  font-size: 14.5px;
  line-height: 1.5;
  opacity: 0;
  transform: translateY(12px);
  transition:
    opacity 0.35s ease,
    transform 0.35s ease;
}
.jb-media__item:hover .jb-media__cap,
.jb-media__item:focus-visible .jb-media__cap {
  opacity: 1;
  transform: translateY(0);
}
.jb-media__item:focus-visible {
  outline: 2px solid var(--gold);
  outline-offset: 3px;
}
.jb-media__foot {
  margin-top: 46px;
  text-align: center;
}
.jb-media__foot .jb-btn {
  margin-top: 0;
}
@media (max-width: 991px) {
  .jb-media {
    padding: var(--pad-md) 0;
  }
  .jb-media__copy {
    margin-bottom: 46px;
  }
}
@media (max-width: 575px) {
  .jb-media__grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 14px;
  }
  .jb-media__cap {
    display: none;
  }
  .jb-media__foot .jb-btn {
    width: 100%;
  }
}

@media (max-width: 991px) {
  .jb-shots__head {
    grid-template-columns: 1fr;
    gap: 18px;
  }
  .jb-just__row {
    flex-direction: column;
    gap: 30px;
  }
  .jb-shot {
    flex: 0 0 auto;
  }
  .jb-shot__pic {
    aspect-ratio: 4 / 3;
  }
}
@media (max-width: 575px) {
  .jb-shot__pic {
    aspect-ratio: 3 / 2;
  }
  .jb-shot__cap {
    font-size: 16px;
  }
  .jb-shots__foot .jb-btn {
    width: 100%;
  }
}

/* =========================================================
   12.26 CONTACT PAGE
   ========================================================= */
/* crumbs follow the left-aligned hero copy */
.page-hero--left .jb-crumbs {
  justify-content: flex-start;
}

/* every section heading on the contact page is centred */
.jb-contact-page .jb-h2 {
  text-align: center;
}

/* the booking band is the dark half of the page, so the form
   card reads as the bright object sitting on it */
.jb-contact-page #booking {
  background: var(--ink);
  color: #fff;
  overflow: hidden;
}
.jb-contact-page #booking:before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(
      52% 60% at 8% 4%,
      rgba(201, 162, 39, 0.18),
      transparent 64%
    ),
    radial-gradient(
      48% 55% at 96% 96%,
      rgba(194, 65, 12, 0.22),
      transparent 62%
    );
}
.jb-contact-page #booking .jb-contact-grid {
  position: relative;
  z-index: 2;
}
.jb-contact-page .jb-section--ink .jb-h2 {
  color: #fff;
  text-align: left;
}
.jb-contact-page .jb-section--ink .jb-h2 em {
  color: var(--gold-lt);
}
.jb-contact-page .jb-section--ink .jb-eyebrow {
  color: var(--gold-lt);
}
.jb-contact-page .jb-section--ink .jb-lead {
  color: rgba(255, 255, 255, 0.72) !important;
}
.jb-contact-page .jb-section--ink .jb-info,
.jb-contact-page .jb-section--ink .jb-info:first-child {
  border-color: rgba(255, 255, 255, 0.13);
}
.jb-contact-page .jb-section--ink .jb-info__ico {
  border-color: rgba(201, 162, 39, 0.45);
  background: rgba(201, 162, 39, 0.12);
  color: var(--gold-lt);
}
.jb-contact-page .jb-section--ink .jb-info__lbl {
  color: var(--gold-lt);
}
.jb-contact-page .jb-section--ink .jb-info__val {
  color: #fff;
}
.jb-contact-page .jb-section--ink .jb-info__val small {
  color: rgba(255, 255, 255, 0.55);
}
.jb-contact-page .jb-section--ink a.jb-info__val:hover {
  color: var(--gold-lt) !important;
}
.jb-contact-page .jb-section--ink .jb-form {
  border-top-color: var(--gold);
  box-shadow: 0 30px 70px rgba(0, 0, 0, 0.45);
}

/* selects: the native control arrow sat on top of the longer
   option text, so the field looks trimmed */
.jb-form select.form-control {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  display: block;
  width: 100%;
  min-height: 53px;
  padding: 14px 48px 14px 16px;
  line-height: 1.5;
  color: var(--ink);
  background-color: var(--cream);
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c2410c' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 16px center;
  background-size: 16px 16px;
  cursor: pointer;
}
.jb-form select.form-control option {
  color: var(--ink);
  background: #fff;
}
.jb-form select.form-control:focus {
  background-color: #fff;
}

/* =========================================================
   12.28 SERVICES PAGE  (long copy + sidebar, per the
   reference layout; colours and framing from this theme)
   ========================================================= */
.svc-layout {
  display: grid;
  grid-template-columns: 1fr 320px;
  gap: 56px;
  align-items: start;
}
.svc-main {
  max-width: none;
}
.svc-main p {
  max-width: 78ch;
}
.svc-figure {
  margin: 34px 0 38px;
}
.svc-figure img {
  aspect-ratio: 3 / 2;
  object-fit: cover;
}
.svc-hr {
  margin: 44px 0;
  border: 0;
  border-top: 1px solid #e9dfcd;
}
.svc-call {
  margin: 34px 0 6px !important;
  font-family: "Philosopher", sans-serif;
  font-size: 19px;
  color: var(--ink) !important;
}
.svc-main .jb-btn {
  margin-top: 4px;
}

/* testimonial block inside the copy */
.svc-tst {
  margin: 48px 0 42px;
  padding: 42px 40px 38px;
  background: var(--ink);
  border-top: 3px solid var(--gold);
  box-shadow: 0 26px 56px rgba(30, 20, 10, 0.18);
}
.svc-tst__h {
  margin: 0 0 28px;
  font-family: "Philosopher", sans-serif;
  font-size: 24px;
  color: #fff;
  text-align: left;
}
.svc-tst .tst-grid {
  grid-template-columns: 1fr;
  gap: 1px;
  background: rgba(255, 255, 255, 0.11);
  border: 1px solid rgba(255, 255, 255, 0.11);
}
.svc-tst .tst-card {
  padding: 32px 34px 28px;
}
.svc-tst .tst-card:before {
  font-size: 46px;
  margin-bottom: 16px;
}
.svc-tst__end {
  margin: 26px 0 0;
  color: rgba(255, 255, 255, 0.7) !important;
  font-family: "Lora", Georgia, serif;
  font-style: italic;
}
.svc-tst__end a {
  color: var(--gold-lt) !important;
  text-decoration: none !important;
  border-bottom: 1px solid rgba(232, 201, 106, 0.5);
}

/* sidebar */
.svc-side__box {
  margin-bottom: 34px;
  padding: 30px 28px 32px;
  background: #fff;
  border: 1px solid #e9dfcd;
  border-top: 2px solid var(--ink);
  box-shadow: 0 16px 38px rgba(30, 20, 10, 0.07);
}
.svc-side__h {
  margin: 0 0 24px;
  padding-bottom: 14px;
  border-bottom: 1px solid #eee3d2;
  font-family: "Philosopher", sans-serif;
  font-size: 20px;
  font-weight: 700;
  color: var(--ink);
  text-align: left;
}
.svc-side__list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.svc-side__list li {
  display: flex;
  gap: 14px;
  align-items: center;
  padding: 14px 0;
  border-bottom: 1px solid #f2ece0;
}
.svc-side__list li:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}
.svc-side__thumb {
  flex: 0 0 auto;
  display: block;
  width: 74px;
  height: 74px;
  overflow: hidden;
  background: #efe7da;
}
.svc-side__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  filter: saturate(0.85);
  transition: transform 0.5s cubic-bezier(0.2, 0.7, 0.3, 1);
}
.svc-side__thumb:hover img {
  transform: scale(1.08);
}
.svc-side__txt {
  min-width: 0;
}
.svc-side__link {
  display: block;
  margin-bottom: 4px;
  font-family: "Philosopher", sans-serif;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.3;
  color: var(--ink) !important;
  text-decoration: none !important;
  transition: color 0.25s ease;
}
.svc-side__link:hover {
  color: var(--ember) !important;
}
.svc-side__sub {
  display: block;
  font-family: "Lora", Georgia, serif;
  font-style: italic;
  font-size: 13.5px;
  line-height: 1.45;
  color: var(--muted);
}
.svc-side__list li.is-current {
  padding-left: 12px;
  border-left: 2px solid var(--ember);
}
.svc-side__list li.is-current .svc-side__link {
  color: var(--ember) !important;
}
.svc-side__list li.is-current .svc-side__thumb {
  outline: 2px solid var(--ember);
  outline-offset: 2px;
}
.svc-side__tags {
  margin: 0;
}
.svc-side__tags li {
  font-size: 13px;
  padding: 8px 14px;
}
.svc-side__btn {
  width: 100%;
}

/* belief band */
.svc-belief {
  position: relative;
  overflow: hidden;
  padding: 78px 0;
  text-align: center;
  background: radial-gradient(80% 120% at 50% 0%, #1b1730, var(--ink) 70%);
}
.svc-belief:before {
  content: "";
  position: absolute;
  inset: 18px;
  border: 1px solid rgba(201, 162, 39, 0.28);
  pointer-events: none;
}
.svc-belief .container {
  position: relative;
  z-index: 2;
}
.svc-belief__l1 {
  display: block;
  margin-bottom: 10px;
  font-family: "Philosopher", sans-serif;
  font-size: clamp(22px, 2.6vw, 32px);
  color: var(--gold-lt);
}
.svc-belief__l2 {
  margin: 0;
  font-family: "Philosopher", sans-serif;
  font-weight: 700;
  font-size: clamp(26px, 3.4vw, 44px);
  line-height: 1.24;
  color: #fff;
}
.svc-belief__l2 em {
  font-family: "Lora", Georgia, serif;
  font-style: italic;
  font-weight: 400;
  color: var(--gold-lt);
}
.svc-belief__l2:after {
  display: none;
}
header .nav-item .dropdown-toggle::after {
  display: none !important;
}
/* service card CTA inside the deep-dive cards */
.svc-card__cta {
  margin-top: 24px;
  color: var(--ink) !important;
}

@media (max-width: 1199px) {
  .svc-layout {
    grid-template-columns: 1fr 290px;
    gap: 40px;
  }
}
@media (max-width: 991px) {
  .svc-layout {
    grid-template-columns: 1fr;
    gap: 46px;
  }
  .svc-side {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
  }
  .svc-side__box {
    margin-bottom: 0;
  }
  .svc-side__btn {
    grid-column: 1 / -1;
  }
}
@media (max-width: 767px) {
  .svc-side {
    grid-template-columns: 1fr;
  }
  .svc-tst {
    padding: 30px 22px 28px;
  }
  .svc-main .jb-btn {
    width: 100%;
  }
  .svc-belief {
    padding: var(--pad-sm) 0;
  }
}

/* =========================================================
   12.29 ASTRO CONSULTATION SLIDER  (home — three 30%
   frames at a time, first frame is 8.jpeg)
   ========================================================= */
.jb-consult {
  position: relative;
}
.jb-consult__head {
  max-width: 720px;
  margin-bottom: 26px;
}
.jb-consult__head .jb-h2 {
  margin: 0;
}
.jb-consult__copy {
  max-width: 82ch;
  margin: 0 0 30px;
  font-family: "Lora", Georgia, serif;
  font-size: 17px;
  line-height: 1.85;
  color: rgba(16, 13, 24, 0.78);
}
.jb-consult__copy em,
.jb-consult__copy strong {
  color: var(--ink);
  font-style: normal;
  font-weight: 700;
}
.jb-consult__cta {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin: 0 0 8px;
}
.jb-consult__cta .btn {
  margin-bottom: 0;
}
.jb-consult__slider {
  margin: 46px 0 6px;
}
.jb-consult__slide {
  height: auto;
}
.jb-consult__slide > a {
  display: block;
  text-decoration: none !important;
}
.jb-consult__pic {
  display: block;
  overflow: hidden;
  background: #efe7da;
  border: 1px solid #e9dfcd;
  box-shadow: 0 16px 34px rgba(30, 20, 10, 0.1);
}
.jb-consult__pic img {
  display: block;
  width: 100%;
  height: 100%;
  aspect-ratio: 3 / 2;
  object-fit: cover;
  filter: saturate(0.92);
  transition:
    transform 0.6s cubic-bezier(0.2, 0.7, 0.3, 1),
    filter 0.4s ease;
}
.jb-consult__slide > a:hover .jb-consult__pic img {
  transform: scale(1.06);
  filter: saturate(1);
}
.jb-consult__cap {
  display: block;
  margin-top: 14px;
  font-family: "Philosopher", sans-serif;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.35;
  color: var(--ink);
  transition: color 0.25s ease;
}
.jb-consult__slide > a:hover .jb-consult__cap {
  color: var(--ember);
}

/* Frames: slick sizes each slide to a third of the row on desktop, half on
   tablet and full width on phones. The gutter is padding inside the slide
   (with border-box) so each picture reads as ~30% of the row. A percentage
   width on .slick-slide would resolve against the wide .slick-track instead
   of the visible .slick-list and blow the layout out, so it is not used. */
.jb-consult__slider .slick-list {
  margin: 0 -14px;
  padding: 4px 0;
}
.jb-consult__slider .slick-slide {
  box-sizing: border-box;
  padding: 0 14px;
  height: auto;
}
@media (max-width: 767px) {
  .jb-consult {
    padding-bottom: var(--pad-sm);
  }
  .jb-consult__slider .slick-list {
    margin: 0 -8px;
  }
  .jb-consult__slider .slick-slide {
    padding: 0 8px;
  }
  .jb-consult__cta .btn {
    width: 100%;
  }
}

/* arrows + dots, themed to match the site */
.jb-consult__slider {
  position: relative;
}
.jb-consult__slider .slick-arrow {
  position: absolute;
  top: 44%;
  z-index: 5;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  padding: 0;
  transform: translateY(-50%);
}
.jb-consult__arrow--prev {
  left: 2px;
}
.jb-consult__arrow--next {
  right: 2px;
}
@media (min-width: 1300px) {
  .jb-consult__arrow--prev {
    left: -56px;
  }
  .jb-consult__arrow--next {
    right: -56px;
  }
}
.jb-consult__arrow i {
  color: var(--ink);
  font-size: 17px;
  line-height: 1;
  transition: color 0.25s ease;
}
.jb-consult__arrow:hover i {
  color: #fff;
}
.jb-consult__slider .slick-dots {
  display: flex !important;
  justify-content: center;
  gap: 2px;
  margin: 26px 0 0;
  padding: 0;
}
.jb-consult__slider .slick-dots li {
  width: 26px;
  height: 20px;
  margin: 0 2px;
}
.jb-consult__slider .slick-dots li button {
  width: 26px;
  height: 20px;
}
.jb-consult__slider .slick-dots li button:before {
  width: 10px;
  height: 10px;
  top: 5px;
  left: 8px;
  border-radius: 50%;
  background: rgba(30, 20, 10, 0.22);
  transition: background 0.25s ease;
}
.jb-consult__slider .slick-dots li.slick-active button:before {
  background: var(--ember);
}
.jb-consult__arrow {
  width: 46px;
  height: 46px;
  border-radius: 50%;
  background: #fff;
  border: 1px solid #e9dfcd;
  box-shadow: 0 10px 24px rgba(30, 20, 10, 0.12);
  color: var(--ink);
  font-size: 18px;
  line-height: 1;
  cursor: pointer;
  transition:
    background 0.25s ease,
    color 0.25s ease,
    transform 0.25s ease;
}
.jb-consult__arrow:hover {
  background: var(--ember);
  color: #fff;
  transform: translateY(-2px);
}
.jb-consult__arrow.slick-disabled {
  opacity: 0.4;
  cursor: default;
}
.jb-consult__arrow.slick-disabled:hover {
  background: #fff;
  color: var(--ink);
  transform: none;
}

/* =========================================================
   12.31 CONSULTATION LIST SECTION (home)
   "What people consult Jayraj Bhatt for" — themed to the
   same scale as every other inner block: Philosopher heading,
   Lora 17px body, numbered .jb-points list, framed image.
   ========================================================= */
.jb-conslist .jb-split__body > p {
  max-width: 60ch;
  margin: 0 0 6px;
  font-family: "Lora", Georgia, serif;
  font-size: 17px;
  line-height: 1.85;
  color: rgba(16, 13, 24, 0.78);
}
.jb-conslist .jb-points {
  margin-top: 24px;
}
.jb-conslist .jb-points li {
  font-size: 16px;
  line-height: 1.7;
}

/* =========================================================
   12.32 "WHY CHOOSE" — full-bleed panel on small screens
   The container's side padding made the panel sit inset on
   phones; drop it so the panel runs edge to edge.
   ========================================================= */
@media (max-width: 991px) {
  .why-choose-section > .container {
    max-width: none;
    padding-right: 0 !important;
    padding-left: 0 !important;
  }
  .why-choose__panel {
    border-radius: 0;
  }
  .why-choose__banner {
    height: clamp(280px, 52vw, 430px);
    min-height: 0;
  }
  .why-choose__banner img {
    height: 100%;
    min-height: 0;
  }
}
.why-choose h2 {
  margin: 0 0 14px;
  font-family: "Philosopher", sans-serif;
  font-size: clamp(24px, 2.6vw, 34px);
  font-weight: 700;
  line-height: 1.22;
  letter-spacing: -0.2px;
  color: #fff;
}

/* =========================================================
   12.33 ASTRO CONSULTATION SLIDER — pagination
   Five numbered images, so the control is a row of tick
   buttons rather than dots: wider touch target, an obvious
   active state, a visible focus ring, and a label per tick
   ("Show image 3 of 5") added by the init script.
   ========================================================= */
.jb-consult__slider .slick-dots {
  display: flex !important;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin: 28px 0 0;
  padding: 0;
}
.jb-consult__slider .slick-dots li {
  width: auto;
  height: 26px;
  margin: 0;
  padding: 0;
  line-height: 1;
}
.jb-consult__slider .slick-dots li button {
  position: relative;
  width: 24px;
  height: 26px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  text-indent: -9999px;
  overflow: hidden;
  cursor: pointer;
  transition: width 0.3s ease;
}
.jb-consult__slider .slick-dots li button:before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 12px;
  height: 2px;
  background: rgba(16, 13, 24, 0.24);
  transition: background 0.25s ease;
}
.jb-consult__slider .slick-dots li button:hover:before {
  background: rgba(16, 13, 24, 0.5);
}
.jb-consult__slider .slick-dots li button:focus-visible {
  outline: 1px solid var(--ember);
  outline-offset: 2px;
}
.jb-consult__slider .slick-dots li.slick-active button {
  width: 46px;
}
.jb-consult__slider .slick-dots li.slick-active button:before {
  background: var(--ember);
}
@media (max-width: 767px) {
  .jb-consult__slider .slick-dots {
    margin-top: 22px;
  }
  .jb-consult__slider .slick-dots li button {
    width: 26px;
  }
  .jb-consult__slider .slick-dots li.slick-active button {
    width: 48px;
  }
}
/* =========================================================
   12.34 ASTROLOGY JOURNAL (blog.php)
   Featured article, article rows, sidebar rail and the
   closing band. Uses the existing theme scale: Philosopher
   headings, Lora 17px body, cream/ink/gold/ember palette,
   sharp corners and gold-ruled frames.
   ========================================================= */
.jb-blog {
  padding-bottom: var(--pad-md);
}
.jb-blog__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 330px;
  gap: 64px;
  align-items: start;
}
.jb-blog__main > .jb-eyebrow {
  margin-bottom: 18px;
}

/* ── featured article ─────────────────────────────────── */
.jb-post--lead {
  margin-bottom: 64px;
  padding-bottom: 60px;
  border-bottom: 1px solid #e9dfcd;
}
.jb-post__media {
  display: block;
  position: relative;
  overflow: hidden;
  background: #efe7da;
  border: 1px solid #e9dfcd;
  box-shadow: 0 26px 54px rgba(30, 20, 10, 0.12);
}
.jb-post__media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(0.94);
  transition:
    transform 0.7s cubic-bezier(0.2, 0.7, 0.3, 1),
    filter 0.4s ease;
}
.jb-post:hover .jb-post__media img {
  transform: scale(1.05);
  filter: saturate(1);
}
.jb-post--lead .jb-post__media {
  aspect-ratio: 16 / 9;
  margin-bottom: 30px;
}
.jb-tag {
  display: inline-block;
  margin-bottom: 14px;
  padding: 6px 14px;
  border: 1px solid rgba(201, 162, 39, 0.55);
  background: rgba(201, 162, 39, 0.08);
  font-family: "Lora", Georgia, serif;
  font-style: italic;
  font-size: 12.5px;
  letter-spacing: 1.4px;
  text-transform: uppercase;
  color: var(--ember);
}
.jb-post__title {
  margin: 0 0 12px;
  font-family: "Philosopher", sans-serif;
  font-weight: 700;
  line-height: 1.24;
  letter-spacing: -0.3px;
  color: var(--ink);
}
.jb-post--lead .jb-post__title {
  font-size: clamp(26px, 3vw, 38px);
}
.jb-post--row .jb-post__title {
  font-size: clamp(20px, 2vw, 25px);
}
.jb-post__title a {
  color: inherit;
  text-decoration: none !important;
  transition: color 0.25s ease;
}
.jb-post:hover .jb-post__title a {
  color: var(--ember);
}
.jb-post__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin: 0 0 16px;
  font-family: "Lora", Georgia, serif;
  font-size: 13px;
  letter-spacing: 1.1px;
  text-transform: uppercase;
  color: rgba(16, 13, 24, 0.5);
}
.jb-post__excerpt {
  max-width: 68ch;
  margin: 0;
  font-family: "Lora", Georgia, serif;
  font-size: 16.5px;
  line-height: 1.8;
  color: rgba(16, 13, 24, 0.76);
}

/* ── article rows ─────────────────────────────────────── */
.jb-blog__list > .jb-eyebrow {
  margin-bottom: 8px;
}
.jb-post--row {
  display: grid;
  grid-template-columns: 268px minmax(0, 1fr);
  gap: 30px;
  padding: 34px 0;
  border-bottom: 1px solid #eee3d2;
}
.jb-post--row .jb-post__media {
  aspect-ratio: 4 / 3;
}
.jb-post--row .jb-post__body {
  min-width: 0;
}
.jb-blog__note {
  margin: 30px 0 0;
  padding: 20px 24px;
  border-left: 2px solid var(--gold);
  background: rgba(201, 162, 39, 0.06);
  font-family: "Lora", Georgia, serif;
  font-style: italic;
  font-size: 15.5px;
  line-height: 1.7;
  color: rgba(16, 13, 24, 0.72);
}

/* ── sidebar ──────────────────────────────────────────── */
.jb-blog__side {
  position: sticky;
  top: 110px;
  display: grid;
  gap: 24px;
}
.jb-card__title {
  margin: 0 0 16px;
  font-family: "Philosopher", sans-serif;
  font-size: 21px;
  font-weight: 700;
  line-height: 1.3;
  color: var(--ink);
}
.jb-card p {
  margin: 0 0 20px;
  font-family: "Lora", Georgia, serif;
  font-size: 15.5px;
  line-height: 1.75;
  color: rgba(16, 13, 24, 0.74);
}
.jb-card--ink {
  background: var(--ink);
  border-color: rgba(201, 162, 39, 0.35);
}
.jb-card--ink .jb-card__title {
  color: #fff;
}
.jb-card--ink p {
  color: rgba(255, 255, 255, 0.72);
}
.jb-card--ink .jb-btn {
  margin-bottom: 18px;
}
.jb-blog__calls {
  display: grid;
  gap: 9px;
  padding-top: 16px;
  border-top: 1px solid rgba(255, 255, 255, 0.14);
}
.jb-blog__calls a {
  display: flex;
  align-items: center;
  gap: 10px;
  font-family: "Philosopher", sans-serif;
  font-size: 15.5px;
  color: var(--gold-lt);
  text-decoration: none !important;
  transition: color 0.25s ease;
}
.jb-blog__calls a:hover {
  color: #fff;
}
.jb-blog__calls i {
  font-size: 14px;
}
.jb-blog__topics {
  list-style: none;
  margin: 0;
  padding: 0;
}
.jb-blog__topics li {
  border-bottom: 1px solid #eee3d2;
}
.jb-blog__topics li:last-child {
  border-bottom: 0;
}
.jb-blog__topics a {
  display: block;
  padding: 11px 0;
  font-family: "Lora", Georgia, serif;
  font-size: 15.5px;
  color: rgba(16, 13, 24, 0.8);
  text-decoration: none !important;
  transition:
    color 0.25s ease,
    padding-left 0.25s ease;
}
.jb-blog__topics a:hover {
  padding-left: 8px;
  color: var(--ember);
}
.jb-blog__facts {
  list-style: none;
  margin: 0;
  padding: 0;
}
.jb-blog__facts li {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
  font-family: "Lora", Georgia, serif;
  font-size: 15px;
  color: rgba(16, 13, 24, 0.72);
}
.jb-blog__facts i {
  color: var(--gold);
}

/* ── closing band ─────────────────────────────────────── */
.jb-cta-band {
  background: var(--ink);
}
.jb-cta-band__inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 34px;
}
.jb-cta-band__inner .jb-h2 {
  margin: 0;
  max-width: 22ch;
}
.jb-cta-band__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
}

/* ── responsive ───────────────────────────────────────── */
@media (max-width: 1100px) {
  .jb-blog__grid {
    grid-template-columns: 1fr;
    gap: 52px;
  }
  .jb-blog__side {
    position: static;
    grid-template-columns: repeat(3, 1fr);
    align-items: start;
  }
}
@media (max-width: 767px) {
  .jb-blog {
    padding-bottom: var(--pad-sm);
  }
  .jb-post--lead {
    margin-bottom: 44px;
    padding-bottom: 40px;
  }
  .jb-post--row {
    grid-template-columns: 1fr;
    gap: 18px;
    padding: 26px 0;
  }
  .jb-blog__side {
    grid-template-columns: 1fr;
  }
  .jb-cta-band__actions .jb-btn {
    width: 100%;
  }
}
/* =========================================================
   12.36 PAGE HERO — half height on inner pages
   The hero used a fixed 190px/90px padding with a 480px
   floor, which pushed it to 70–80% of a laptop screen.
   It is now 50vh with the type scale tightened to match
   the rest of the theme, so the copy still sits inside the
   panel with no clipping. The home page hero (.hero-wrap)
   is deliberately untouched.
   ========================================================= */
.page-hero {
  min-height: 50vh;
  padding: 140px 0 48px;
}
.page-hero__inner {
  max-width: 1000px;
}

.page-hero__title {
  font-size: clamp(24px, 2.8vw, 34px);
  line-height: 1.24;
}
.page-hero--left .page-hero__title {
  max-width: 20ch;
}
.page-hero__lead {
  font-size: 16px;
  line-height: 1.72;
  max-width: 66ch;
}
@media (max-width: 991px) {
  .page-hero {
    min-height: 46vh;
    padding: 128px 0 44px;
  }
  .page-hero__title {
    font-size: clamp(21px, 5.4vw, 27px) !important;
  }
  .page-hero__lead {
    font-size: 15px !important;
    line-height: 1.7 !important;
  }
}

@media (max-width: 575px) {
  .page-hero {
    min-height: 44vh;
    padding: 122px 0 36px;
  }
}

/* =========================================================
   12.37 PAGE HERO — fixed height, no flicker between pages
   The hero was sized by its own copy (min-height + auto),
   so every page was a slightly different height and moving
   between pages made the layout jump. The height is now a
   constant 50vh with a floor for short screens, and the copy
   scale below is sized to fit inside it without clipping.
   ========================================================= */
.page-hero {
  height: 50vh;
  min-height: 440px;
  padding: 130px 0 40px;
}
@media (max-width: 1199px) and (min-width: 992px) {
  .page-hero__lead {
    font-size: 15.5px !important;
  }
}
@media (max-width: 991px) {
  .page-hero {
    height: 50vh;
    min-height: 400px;
    padding: 124px 0 34px;
  }
}
@media (max-width: 575px) {
  .page-hero {
    min-height: 380px;
    padding: 120px 0 28px;
  }
}

/* =========================================================
   12.38 PAGE HERO — 50vh on every screen height
   The 440px floor made the hero 55–62% of the screen on
   shorter laptops. Type and padding are tightened so the
   tallest hero copy still clears a 380px panel, which lets
   the height stay a true 50vh from 1920x1080 down to
   760px-tall windows with identical height on every page.
   ========================================================= */
.page-hero {
  height: 50vh;
  min-height: 380px;
  padding: 124px 0 30px;
}
.page-hero__title {
  font-size: clamp(22px, 2.5vw, 30px);
  line-height: 1.24;
}
.page-hero--left .page-hero__title {
  max-width: 22ch;
}
.page-hero__lead {
  font-size: 15.5px;
  line-height: 1.68;
}
@media (max-width: 991px) {
  .page-hero {
    height: 50vh;
    min-height: 360px;
    padding: 120px 0 26px;
  }
  .page-hero__title {
    font-size: clamp(20px, 4.8vw, 25px) !important;
  }
  .page-hero__lead {
    font-size: 15px !important;
    line-height: 1.65 !important;
  }
}
@media (max-width: 575px) {
  .page-hero {
    min-height: 340px;
    padding: 118px 0 22px;
  }
}
/* =========================================================
   12.39 ABOUT PAGE ONLY
   Three scoped helpers used by about.php: a full-width
   left-aligned section head, a full-width closing band and
   a tighter rhythm into the FAQ block. Nothing here applies
   to any other page because these class names are only used
   on about.php.
   ========================================================= */
.jb-section__head--wide {
  max-width: none;
  margin-left: 0;
  margin-right: 0;
  text-align: left;
}
.jb-section__head--wide .jb-lead {
  max-width: none;
  margin-left: 0;
  margin-right: 0;
  text-align: left;
}
.jb-cta__inner--wide {
  max-width: 1080px;
}
.jb-cta__inner--wide p {
  max-width: none;
  margin-left: 0;
  margin-right: 0;
}
.jb-faq-section {
  padding-top: 44px;
}
.jb-faq-section .jb-section__head {
  margin-bottom: 32px;
}
@media (max-width: 991px) {
  .jb-faq-section {
    padding-top: 34px;
  }
  .jb-faq-section .jb-section__head {
    margin-bottom: 26px;
  }
  .jb-cta__inner--wide {
    max-width: 100%;
  }
}
/* =========================================================
   12.40 MEDIA PAGE — coverage copy full width
   "Our Media Coverage" was held to 720px for the head and
   840px/74ch for the copy. These classes exist only on
   media.php, so the section can simply span the container.
   .prose rules are left untouched so service pages keep
   their reading measure.
   ========================================================= */
.jb-media__head {
  max-width: none;
}
.jb-media__copy {
  max-width: none;
}
.jb-media__copy p {
  max-width: none;
}

/* =========================================================
   12.41 STICKY SERVICE SIDEBAR + FULL-WIDTH HEADS
   .svc-side is the "Most Popular / tags / Book a …" rail on
   kp-astrology.php, vedic-astrology.php and
   dasha-and-event-timing.php. It sits in the second column of
   .svc-layout, which is already align-items: start, so sticky
   works without touching the grid. The rail measures ~865px on a
   1440x900 screen, taller than the viewport, so it becomes a column
   that scrolls internally inside the space under the fixed header,
   with the closing "Book a …" button pinned to its bottom edge.
   Below 992px the layout is a single column and the rail is left in
   normal flow.
   ========================================================= */
@media (min-width: 992px) {
  .svc-side {
    position: sticky;
    top: 110px;
    max-height: calc(100vh - 132px);
    display: flex;
    flex-direction: column;
    padding-right: 6px;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: #ddd0b6 transparent;
  }
  .svc-side::-webkit-scrollbar {
    width: 6px;
  }
  .svc-side::-webkit-scrollbar-track {
    background: transparent;
  }
  .svc-side::-webkit-scrollbar-thumb {
    background: #ddd0b6;
  }
  .svc-side::-webkit-scrollbar-thumb:hover {
    background: var(--gold);
  }
  /* the closing "Book a …" button rides the bottom of the rail so it
     stays in view while the popular-links box scrolls inside it */
  .svc-side > * {
    flex: 0 0 auto;
  }
  .svc-side__btn {
    position: sticky;
    bottom: 0;
    z-index: 2;
    margin-top: 12px;
    box-shadow: 0 -12px 16px -10px rgba(255, 255, 255, 0.95),
      0 12px 26px rgba(194, 65, 12, 0.2);
  }
}

/* ---------- 12.41b full-width centred section head ----------- */
.jb-section__head--full {
  max-width: none;
}
.jb-section__head--full .jb-lead {
  max-width: 82ch;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}
@media (max-width: 767px) {
  .jb-section__head--full .jb-lead {
    font-size: 16px !important;
  }
}

/* ---------- 12.41c FAQ spanning the container ----------------- */
.jb-faq--wide {
  max-width: none;
}

/* ---------- 12.41d compact booking form on small screens ----- */
.jb-form__intro {
  margin: 0 0 24px;
  font-size: 15.5px;
}
@media (max-width: 767px) {
  .jb-form {
    padding: 20px 18px 22px;
  }
  .jb-form__intro {
    margin-bottom: 12px;
    font-size: 14.5px;
  }
  .jb-form__group {
    margin-bottom: 10px;
  }
  /* name + phone stay side by side so the whole form still fits on
     one phone screen; both labels are short enough not to wrap */
  .jb-form__row {
    grid-template-columns: 1fr 1fr;
    gap: 10px;
  }
  .jb-form label {
    margin-bottom: 4px;
    font-size: 13px;
  }
  .jb-form .form-control {
    padding: 10px 12px;
    font-size: 15px;
  }
  .jb-form textarea.form-control {
    min-height: 72px;
  }
  .jb-form .jb-btn {
    margin-top: 4px;
    padding: 13px 22px;
  }
  .jb-form .jb-form__note {
    margin-top: 12px;
  }
  .jb-form__status {
    margin-top: 10px;
    padding: 10px 13px;
    font-size: 14px;
  }
  .jb-form__alt {
    margin-top: 10px;
    font-size: 13px;
  }
}

/* =========================================================
   12.42 BLOG — previous / next post switcher
   Sits under the "articles are published here as they go live"
   note. All seven articles live on this one page, so the two
   buttons walk the reader through the list (wrapping at both
   ends), mark the article they land on, and name the article
   each button will move to. The counter is aria-live so the
   move is announced.
   ========================================================= */
.jb-postnav {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: stretch;
  gap: 14px;
  margin: 22px 0 0;
  padding: 0;
  border: 0;
}
.jb-postnav__btn {
  display: flex;
  align-items: center;
  gap: 14px;
  min-width: 0;
  padding: 14px 18px;
  background: #fff;
  border: 1px solid #e9dfcd;
  border-top: 2px solid var(--ink);
  border-radius: 0;
  font-family: "Philosopher", sans-serif;
  color: var(--ink);
  text-align: left;
  cursor: pointer;
  transition: border-color 0.25s ease, transform 0.25s ease, box-shadow 0.25s ease;
}
.jb-postnav__btn--next {
  justify-content: flex-end;
  border-top-color: var(--gold);
  text-align: right;
}
.jb-postnav__btn i {
  flex: 0 0 auto;
  font-size: 17px;
  color: var(--ember);
}
.jb-postnav__txt {
  display: block;
  min-width: 0;
}
.jb-postnav__label {
  display: block;
  margin-bottom: 3px;
  font-family: "Lora", Georgia, serif;
  font-style: italic;
  font-size: 12.5px;
  letter-spacing: 0.4px;
  color: var(--muted);
}
.jb-postnav__title {
  display: block;
  font-size: 15.5px;
  font-weight: 700;
  line-height: 1.35;
  color: var(--ink);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.jb-postnav__btn:hover,
.jb-postnav__btn:focus-visible {
  border-top-color: var(--ember);
  transform: translateY(-2px);
  box-shadow: 0 14px 30px rgba(30, 20, 10, 0.1);
}
.jb-postnav__btn:focus-visible {
  outline: 2px solid var(--gold);
  outline-offset: 2px;
}
.jb-postnav__count {
  align-self: center;
  margin: 0;
  font-family: "Philosopher", sans-serif;
  font-size: 14px;
  letter-spacing: 2px;
  color: var(--muted);
  white-space: nowrap;
}
.jb-post.is-current {
  background: rgba(201, 162, 39, 0.07);
}
.jb-post--row.is-current {
  box-shadow: inset 3px 0 0 var(--ember);
}
.jb-post--lead.is-current {
  box-shadow: inset 0 3px 0 var(--ember);
}
.jb-post.is-current .jb-post__title a {
  color: var(--ember) !important;
}
.jb-post:focus {
  outline: none;
}
@media (max-width: 767px) {
  .jb-postnav {
    grid-template-columns: 1fr 1fr;
    gap: 10px;
  }
  .jb-postnav__count {
    grid-column: 1 / -1;
    order: -1;
  }
  .jb-postnav__btn {
    padding: 12px 14px;
  }
  .jb-postnav__title {
    font-size: 14.5px;
    white-space: normal;
  }
}

/* =========================================================
   12.43 BOOKING FORM — mail hand-off to contact-handler.php
   The honeypot sits off-screen rather than display:none, because
   bots skip hidden inputs; the status line, the WhatsApp escape
   hatch and the "request received" panel are all new states of
   the same form, so the JS only swaps which one is visible.
   ========================================================= */
.jb-hp {
  position: absolute;
  left: -9999px;
  top: auto;
  width: 1px;
  height: 1px;
  overflow: hidden;
}
.jb-form__status {
  margin: 14px 0 0;
  padding: 12px 15px;
  border-left: 2px solid var(--gold);
  background: rgba(201, 162, 39, 0.08);
  font-family: "Lora", Georgia, serif;
  font-size: 14.5px;
  line-height: 1.6;
  color: var(--ink);
}
.jb-form__status.is-wait {
  border-left-color: var(--muted);
  background: rgba(16, 13, 24, 0.05);
  color: var(--muted);
}
.jb-form__status.is-error {
  border-left-color: var(--ember);
  background: rgba(194, 65, 12, 0.08);
  color: #7a2706;
}
.jb-form__alt {
  margin: 14px 0 0;
  font-family: "Lora", Georgia, serif;
  font-style: italic;
  font-size: 14px;
  line-height: 1.6;
  color: var(--muted);
  text-align: center;
}
.jb-form__alt a {
  font-style: normal;
  font-weight: 700;
  color: var(--ember) !important;
  text-decoration: underline !important;
}
.jb-done .jb-btn {
  width: 100%;
  margin-top: 4px;
  padding: 17px 30px;
}
.jb-done .jb-form__intro {
  margin-bottom: 22px;
}
.jb-done:focus {
  outline: none;
}
.jb-form .jb-btn:disabled {
  opacity: 0.65;
  cursor: progress;
  transform: none;
}
@media (max-width: 767px) {
  .jb-done .jb-btn {
    padding: 14px 22px;
  }
  .jb-form__alt {
    font-size: 13.5px;
  }
}