/* assets/css/footer-blocks.css */
/**
 * Johnny Detail — unified footer block layout (all location variants).
 * Scoped to basic blocks rendered in .footer-bottom.
 *
 * Loaded LATE (after theme Custom CSS) via martis_get_late_theme_css() so
 * front page / path-frontpage rules cannot be beaten by stale custom_css.
 */

/* --------------------------------------------------------------------------
 * Header phone CTA — match reference layout site (plain text on green bar).
 * Late CSS so it always applies on / and city pages alike.
 * CONTACT US label + phone: centered stack on desktop and mobile.
 * -------------------------------------------------------------------------- */
#block-call-to-order,
#block-call-to-order .container-wrap,
#block-call-to-order .block-content,
#block-call-to-order .field-item {
  text-align: center !important;
}
#block-call-to-order .field-item {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.1rem !important;
  width: 100% !important;
  margin: 0 auto !important;
}
#block-call-to-order p.call-phone,
#block-call-to-order .call-phone,
#block-call-to-order p {
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  text-align: center !important;
  width: 100% !important;
}
#block-call-to-order strong.text-sm,
#block-call-to-order .text-sm {
  display: block !important;
  width: 100% !important;
  margin: 0 0 0.1rem !important;
  padding: 0 !important;
  text-align: center !important;
  font-size: 0.72rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.06em !important;
  line-height: 1.2 !important;
  color: #ffffff !important;
  background: transparent !important;
  background-color: transparent !important;
  text-transform: uppercase !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.45) !important;
}
#block-call-to-order a.call-phone-link,
#block-call-to-order .call-phone a {
  display: block !important;
  width: auto !important;
  margin: 0 auto !important;
  padding: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: #ffffff !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  text-align: center !important;
  text-decoration: none !important;
  line-height: 1.2 !important;
  min-width: 0 !important;
  min-height: 0 !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.45) !important;
}

/* Header info + CONTACT US layout (late so it wins over media.css + custom_css) */
.header-item.header-right,
.header-right {
  display: block !important;
  visibility: visible !important;
  text-align: center !important;
}
.header-info,
.header-info .header-info-container {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  gap: 0.35rem 1.25rem !important;
}
.header-info .header-info-item {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin-left: 0 !important;
}

@media (max-width: 767.98px) {
  /* Brand left (1rem inset via container padding); cart/hamburger absolute right */
  .navbar.header-center > .container {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: flex-start !important;
    align-items: center !important;
    position: relative !important;
    padding: 0.5rem 1rem !important;
    box-sizing: border-box !important;
  }
  .header-side.navbar-brand {
    width: auto !important;
    max-width: calc(100% - 5.75rem) !important;
    flex: 1 1 auto !important;
    order: 1 !important;
    text-align: left !important;
    justify-content: flex-start !important;
    margin: 0 !important;
    padding: 0 5.5rem 0 0 !important;
    min-height: 56px;
  }
  #block-martis-branding .container-wrap,
  .site-branding .container-wrap,
  .site-branding {
    justify-content: flex-start !important;
    text-align: left !important;
    width: 100% !important;
    margin: 0 !important;
  }
  .brand.logo {
    margin: 0 !important;
  }
  .brand.site-name {
    text-align: left !important;
    align-items: flex-start !important;
  }

  /* City/service info ABOVE Contact Us phone */
  .header-main-wrap,
  .header-item.header-main,
  .header-main {
    display: block !important;
    visibility: visible !important;
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
    order: 2 !important;
    margin: 0.15rem 0 0 !important;
    padding: 0.25rem 0 !important;
    text-align: left !important;
  }

  /* Contact Us / phone under info row; cart/hamburger stay absolute top-right */
  .header-right-wrap {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
    order: 3 !important;
    margin: 0.15rem 0 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
    position: static !important;
  }
  .header-item.header-right,
  .header-right {
    width: 100% !important;
    margin: 0 auto !important;
    text-align: center !important;
  }
  .header-element {
    position: absolute !important;
    top: 0.5rem !important;
    right: 1rem !important;
    z-index: 30 !important;
  }

  /* Hide "Call Us" phone column on mobile (phone is in Contact Us below) */
  .header-info .header-info-item--phone {
    display: none !important;
  }

  /* Location left, hours right */
  .header-info,
  .header-info .header-info-container {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: flex-start !important;
    justify-content: space-between !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    gap: 0.5rem 0.75rem !important;
  }
  .header-info .header-info-item {
    margin: 0 !important;
  }
  .header-info .header-info-item--location {
    flex: 1 1 auto !important;
    justify-content: flex-start !important;
    text-align: left !important;
    max-width: 58% !important;
  }
  .header-info .header-info-item--hours {
    flex: 0 1 auto !important;
    justify-content: flex-end !important;
    text-align: right !important;
    max-width: 42% !important;
  }
  .header-info .header-info-item--location .header-info-desc {
    text-align: left !important;
  }
  .header-info .header-info-item--hours .header-info-desc {
    text-align: right !important;
  }
  .header-info .header-info-desc {
    font-size: 0.72rem !important;
    line-height: 1.3 !important;
  }
  .header-info .header-info-desc span,
  .header-info .header-info-desc strong {
    display: block !important;
  }
  .header-info .header-info-item i {
    font-size: 1rem !important;
    margin-right: 0.35rem !important;
  }
}

/* --------------------------------------------------------------------------
 * City / front page H1 title blocks (content-wide-top).
 * Bare <h1> in custom blocks were white-on-white (global h1 { color:#fff }).
 * Match Johnny Detail badge style used by .row.layout.layout--onecol h1:
 * brand green fill, white type, black border, centered, mobile-readable.
 * -------------------------------------------------------------------------- */
#content-wide-top .block-block-content .field-item > h1,
#content-wide-top .block-block-content .field-body > h1,
#content-wide-top [id*="frontpagetitle"] h1,
#content-wide-top [id*="pagetitle"] h1,
#block-martis-frontpagetitle h1,
[id^="block-martis-frontpagetitle"] h1 {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0.75rem auto 1rem !important;
  padding: 0.85rem 1.15rem !important;
  background-color: #b781e3 !important;
  background: #b781e3 !important;
  color: #ffffff !important;
  border: 2px solid #000000 !important;
  border-radius: 5px !important;
  text-align: center !important;
  font-size: 1.65rem !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  letter-spacing: 0.01em !important;
  text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000 !important;
  word-wrap: break-word !important;
  overflow-wrap: anywhere !important;
  hyphens: auto !important;
  z-index: 2 !important;
  position: relative !important;
}

/* Title block spacing: avoid negative margins collapsing into the slider */
#content-wide-top [id*="frontpagetitle"],
#content-wide-top [id*="pagetitle"],
#block-martis-frontpagetitle,
[id^="block-martis-frontpagetitle"] {
  margin-top: 0.35rem !important;
  margin-bottom: 0.5rem !important;
  padding-left: 0.75rem !important;
  padding-right: 0.75rem !important;
  max-width: 100% !important;
  overflow: visible !important;
}

#content-wide-top [id*="frontpagetitle"] .container-wrap,
#content-wide-top [id*="pagetitle"] .container-wrap,
#block-martis-frontpagetitle .container-wrap,
[id^="block-martis-frontpagetitle"] .container-wrap {
  max-width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

@media (max-width: 991.98px) {
  #content-wide-top .block-block-content .field-item > h1,
  #content-wide-top .block-block-content .field-body > h1,
  #content-wide-top [id*="frontpagetitle"] h1,
  #content-wide-top [id*="pagetitle"] h1,
  #block-martis-frontpagetitle h1,
  [id^="block-martis-frontpagetitle"] h1 {
    font-size: 1.35rem !important;
    padding: 0.75rem 0.9rem !important;
    margin: 0.5rem auto 0.85rem !important;
    line-height: 1.35 !important;
  }
}

@media (max-width: 575.98px) {
  #content-wide-top .block-block-content .field-item > h1,
  #content-wide-top .block-block-content .field-body > h1,
  #content-wide-top [id*="frontpagetitle"] h1,
  #content-wide-top [id*="pagetitle"] h1,
  #block-martis-frontpagetitle h1,
  [id^="block-martis-frontpagetitle"] h1 {
    font-size: 1.15rem !important;
    padding: 0.65rem 0.75rem !important;
    margin: 0.4rem auto 0.75rem !important;
    line-height: 1.35 !important;
  }

  #content-wide-top [id*="frontpagetitle"],
  #content-wide-top [id*="pagetitle"],
  #block-martis-frontpagetitle,
  [id^="block-martis-frontpagetitle"] {
    padding-left: 0.5rem !important;
    padding-right: 0.5rem !important;
  }

  #block-call-to-order a.call-phone-link,
  #block-call-to-order .call-phone a {
    font-size: 1.15rem !important;
  }
}

.footer-bottom .jd-site-footer {
  width: 100%;
  max-width: 100%;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

.footer-bottom .jd-site-footer,
.footer-bottom .jd-site-footer p,
.footer-bottom .jd-site-footer a,
.footer-bottom .jd-site-footer li {
  color: #ccc;
}

.footer-bottom .jd-site-footer a {
  text-decoration: none;
  transition: color 0.2s ease;
}

.footer-bottom .jd-site-footer a:hover,
.footer-bottom .jd-site-footer a:focus {
  color: #b781e3;
}

.footer-bottom .footer-bottom-first,
.footer-bottom .footer-bottom-first .block {
  width: 100%;
  max-width: 100%;
  flex: 0 0 100%;
}

footer.jd-site-footer .jd-footer__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

@media (max-width: 575.98px) {
  footer.jd-site-footer .jd-footer__grid,
  .footer-bottom .jd-site-footer .jd-footer__grid,
  .footer-bottom .jd-site-footer > .row:first-of-type {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  footer.jd-site-footer .jd-footer__col {
    width: 100%;
    max-width: 100%;
  }
}
.footer-bottom .jd-site-footer .jd-footer__grid,
.footer-bottom .jd-site-footer > .row:first-of-type {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.75rem 1.5rem;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto 2rem;
  padding: 0;
}

.footer-bottom .jd-site-footer .jd-footer__col {
  min-width: 0;
  text-align: center;
}

.footer-bottom .jd-site-footer .headin5_amrc {
  font-size: 15px;
  font-weight: 600;
  text-align: center;
  margin: 0 0 0.75rem;
  padding-top: 0;
}

.footer-bottom .jd-site-footer .jd-footer__col p {
  margin: 0 0 0.5rem;
  font-size: 12px;
  line-height: 1.5;
}

.footer-bottom .jd-site-footer .footer_ul_amrc {
  list-style: none;
  margin: 0;
  padding: 0;
}

.footer-bottom .jd-site-footer .footer_ul_amrc li {
  padding: 0 0 0.35rem;
  text-align: center !important;
}

.footer-bottom .jd-site-footer .footer_ul_amrc li a {
  display: inline-block;
  font-size: 13px;
  line-height: 1.4;
}

/* ---- Bottom stack (social, legal, reviews, service areas) ---- */
.footer-bottom .jd-site-footer .jd-footer__bottom {
  width: 100%;
  max-width: 520px;
  margin: 0 auto;
  padding: 0 0 1rem;
  text-align: center;
  box-sizing: border-box;
}

.footer-bottom .jd-site-footer .jd-footer__blog-link,
.footer-bottom .jd-site-footer .jd-footer__forum-link,
.footer-bottom .jd-site-footer .jd-footer__careers-link {
  font-size: 12px;
  margin: 0;
  text-align: center;
}

.footer-bottom .jd-site-footer .jd-footer__careers-link {
  margin-bottom: 1.25rem;
}

html body[class*="path-"] #wrapper #footer .jd-site-footer .jd-footer__careers-link a:focus-visible {
  outline: 2px solid #b781e3 !important;
  outline-offset: 3px;
  border-radius: 2px;
}

.footer-bottom .jd-site-footer .logo-container,
.footer-bottom .jd-site-footer .jd-footer__payments {
  background-image: url("https://www.antistat.com/wp-content/uploads/2017/03/Credit-Card-Logos-Payment-Black-Revolver-copy.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  width: 100px;
  height: 95px;
  margin: 0 auto 1rem;
}

.footer-bottom .jd-site-footer .social_footer_ul {
  display: flex !important;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 0.75rem 1rem;
  list-style: none;
  margin: 0 auto !important;
  margin-bottom: 1rem !important;
  padding: 0 !important;
  scale: none !important;
  float: none !important;
}

#footer .footer-bottom footer.jd-site-footer ul.social_footer_ul {
  margin-bottom: 1rem !important;
  margin-top: 0 !important;
}

.footer-bottom .jd-site-footer .social_footer_ul li {
  float: none !important;
  padding: 0 !important;
  margin: 0;
}

.footer-bottom .jd-site-footer .social_footer_ul li a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  padding: 0;
  margin: 0;
  border-radius: 50%;
  overflow: visible !important;
  border: 2px solid rgba(255, 255, 255, 0.15);
}

.footer-bottom .jd-site-footer .social_footer_ul img {
  width: 100%;
  height: 100%;
  max-width: 44px;
  max-height: 44px;
  object-fit: cover;
  display: block;
  padding: 0 !important;
  scale: 2 !important;
}

.footer-bottom .jd-site-footer .copyright-footer {
  font-size: 15px;
  margin: 0.75rem auto !important;
  text-align: center;
  max-width: 100%;
}

html body[class*="path-"] #wrapper #footer .jd-site-footer .jd-footer__credit {
  font-size: 12px;
  line-height: 1.6;
  margin: 0.5rem auto 1rem;
  max-width: 100%;
  text-align: center;
}

html body[class*="path-"] #wrapper #footer .jd-site-footer .jd-footer__credit a {
  text-decoration: underline;
  text-underline-offset: 0.16em;
}

html body[class*="path-"] #wrapper #footer .jd-site-footer .jd-footer__credit a:focus-visible {
  outline: 2px solid #9d4edd;
  outline-offset: 3px;
  border-radius: 2px;
}

.footer-bottom .jd-site-footer .jd-footer__disclaimer {
  font-size: 12px;
  margin: 0.5rem auto 1rem;
  line-height: 1.45;
  max-width: 100%;
}

.footer-bottom .jd-site-footer .jd-footer__reviews {
  margin-top: 0.5rem;
  text-align: center;
}

.footer-bottom .jd-site-footer .jd-footer__reviews p {
  margin: 0 0 0.65rem;
  font-size: 13px;
}

.footer-bottom .jd-site-footer .jd-footer__btn-trailer {
  display: inline-block;
  background-color: #1877f2;
  border-radius: 5px;
  border: none;
  color: #fff;
  cursor: pointer;
  margin: 0 0.5rem 0.5rem 0;
  padding: 0.55rem 1rem;
  font-size: 13px;
  line-height: 1.35;
  text-align: center;
  white-space: normal;
  max-width: 100%;
  box-sizing: border-box;
}

.footer-bottom .jd-site-footer img.protest {
  display: block;
  width: min(280px, 100%) !important;
  height: auto;
  max-width: 100%;
  margin-top: -3rem !important;
  margin-bottom: -3rem !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding: 0 !important;
  /* Match reference layout site: white circular frame + white fill behind image */
  background-color: #ffffff !important;
  border: 2px solid #ffffff !important;
  border-radius: 50% !important;
  box-sizing: border-box;
}

/* About Us tel/mailto: no extra padding/min-height (JD has tight stacked lines). */
.footer-bottom .jd-site-footer .jd-footer__col p,
.footer-bottom .jd-site-footer .jd-footer__col--about p {
  margin: 0 0 0.5rem !important;
  padding: 0 !important;
  line-height: 1.5 !important;
}
.footer-bottom .jd-site-footer .jd-footer__col a[href^="tel:"],
.footer-bottom .jd-site-footer .jd-footer__col a[href^="mailto:"],
.footer-bottom .jd-site-footer .jd-footer__col a[href*="email-protection"],
#footer .footer-bottom footer.jd-site-footer a[href^="tel:"],
#footer .footer-bottom footer.jd-site-footer a[href^="mailto:"],
#footer .footer-bottom footer.jd-site-footer a[href*="email-protection"] {
  display: inline !important;
  padding: 0 !important;
  margin: 0 !important;
  min-width: 0 !important;
  min-height: 0 !important;
  line-height: inherit !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  vertical-align: baseline;
}

/* Service areas grid */
.footer-bottom .jd-site-footer .footer_ul_amrc.service-areas {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.35rem 1rem;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0.5rem auto 0 !important;
  margin-left: 0 !important;
  padding: 0;
  column-count: unset !important;
}

.footer-bottom .jd-site-footer .footer_ul_amrc.service-areas li {
  margin: 0;
  text-align: center;
}

.footer-bottom .jd-site-footer .footer_ul_amrc.service-areas li a {
  font-weight: 500;
  border-bottom: 1px solid transparent;
}

.footer-bottom .jd-site-footer .footer_ul_amrc.service-areas li a:hover,
.footer-bottom .jd-site-footer .footer_ul_amrc.service-areas li a:focus {
  color: #b781e3;
  border-bottom-color: #b781e3;
}

/* ---- Tablet ---- */
@media (min-width: 576px) {
  .footer-bottom .jd-site-footer .jd-footer__grid,
  .footer-bottom .jd-site-footer > .row:first-of-type {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .footer-bottom .jd-site-footer .footer_ul_amrc.service-areas {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

/* ---- Desktop ---- */
@media (min-width: 992px) {
  .footer-bottom .jd-site-footer .jd-footer__grid,
  .footer-bottom .jd-site-footer > .row:first-of-type {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 2rem;
  }

  .footer-bottom .jd-site-footer .jd-footer__col {
    text-align: left;
  }

  .footer-bottom .jd-site-footer .headin5_amrc {
    text-align: left;
  }
}

/* ---- Overrides for legacy theme rules ---- */
.footer-bottom .jd-site-footer .row.justify-content-center,
.footer-bottom .jd-site-footer > .row {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  margin-bottom: 0 !important;
}

.footer-bottom .col-5.text-center {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  flex: none !important;
}

/* Wins over theme Custom CSS (inline, ~347KB) — keep at end of file. */
@media (max-width: 991.98px) {
  #footer .footer-bottom footer.jd-site-footer .jd-footer__grid,
  .footer-bottom footer.jd-site-footer .jd-footer__grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    margin-bottom: 3rem !important;
  }

  .footer-bottom footer.jd-site-footer .jd-footer__blog-link,
  #footer .footer-bottom footer.jd-site-footer .jd-footer__blog-link,
  .footer-bottom footer.jd-site-footer .jd-footer__forum-link,
  #footer .footer-bottom footer.jd-site-footer .jd-footer__forum-link,
  .footer-bottom footer.jd-site-footer .jd-footer__careers-link,
  #footer .footer-bottom footer.jd-site-footer .jd-footer__careers-link {
    display: flex !important;
    justify-content: center !important;
  }

  .footer-bottom footer.jd-site-footer .jd-footer__blog-link,
  #footer .footer-bottom footer.jd-site-footer .jd-footer__blog-link,
  .footer-bottom footer.jd-site-footer .jd-footer__forum-link,
  #footer .footer-bottom footer.jd-site-footer .jd-footer__forum-link {
    margin-bottom: 0.25rem !important;
  }

  .footer-bottom footer.jd-site-footer .jd-footer__careers-link,
  #footer .footer-bottom footer.jd-site-footer .jd-footer__careers-link {
    margin-bottom: 1.5rem !important;
  }

  #footer .footer-bottom footer.jd-site-footer .logo-container,
  #footer .footer-bottom footer.jd-site-footer .jd-footer__payments,
  .footer-bottom footer.jd-site-footer .logo-container,
  .footer-bottom footer.jd-site-footer .jd-footer__payments {
    margin: 0 auto 1.5rem !important;
  }

  .footer-bottom .jd-site-footer .footer_ul_amrc li a {
    font-size: 12px !important;
  }

  .footer-bottom .jd-site-footer .jd-footer__col p {
    font-size: 10px !important;
  }

  #footer .footer-bottom footer.jd-site-footer img.protest,
  .footer-bottom .jd-site-footer img.protest {
    scale: 0.5 !important;
    background-color: #ffffff !important;
    border: 2px solid #ffffff !important;
    border-radius: 50% !important;
    margin-top: -4rem !important;
    margin-bottom: -4rem !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  footer.footer.jd-site-footer,
  .footer-bottom footer.jd-site-footer {
    margin-top: 2rem !important;
  }

  /* Kill extra spacing on About tel/email on mobile (match JD). */
  .footer-bottom .jd-site-footer .jd-footer__col p {
    margin-bottom: 0.35rem !important;
  }
  .footer-bottom .jd-site-footer .jd-footer__col a[href^="tel:"],
  .footer-bottom .jd-site-footer .jd-footer__col a[href^="mailto:"],
  .footer-bottom .jd-site-footer .jd-footer__col a[href*="email-protection"] {
    display: inline !important;
    padding: 0 !important;
    min-height: 0 !important;
  }
}

#footer .footer-bottom footer.jd-site-footer .footer_ul_amrc li {
  text-align: center !important;
}

#footer .footer-bottom footer.jd-site-footer ul.social_footer_ul {
  display: flex !important;
  scale: 1 !important;
  margin-bottom: 1rem !important;
  margin-top: 0 !important;
  float: none !important;
}

#footer .footer-bottom footer.jd-site-footer .social_footer_ul li a {
  overflow: visible !important;
}

#footer .footer-bottom footer.jd-site-footer .social_footer_ul img {
  scale: 2 !important;
}

#footer .footer-bottom footer.jd-site-footer img.protest {
  margin-top: -3rem !important;
  margin-bottom: -3rem !important;
  margin-left: auto !important;
  margin-right: auto !important;
  width: min(280px, 100%) !important;
  background-color: #ffffff !important;
  border: 2px solid #ffffff !important;
  border-radius: 50% !important;
}

#footer .footer-bottom footer.jd-site-footer .footer_ul_amrc.service-areas {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
}

@media (max-width: 991.98px) {
  #footer .footer-bottom footer.jd-site-footer .jd-footer__grid {
    margin-bottom: 3rem !important;
  }

  #footer .footer-bottom footer.jd-site-footer ul.social_footer_ul {
    margin-top: 0 !important;
  }
}

@media (min-width: 992px) {
  #footer .footer-bottom footer.jd-site-footer img.protest,
  .footer-bottom .jd-site-footer img.protest {
    scale: 0.5 !important;
    background-color: #ffffff !important;
    border: 2px solid #ffffff !important;
    border-radius: 50% !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  #footer .footer-bottom footer.jd-site-footer .jd-footer__blog-link,
  #footer .footer-bottom footer.jd-site-footer .jd-footer__forum-link,
  #footer .footer-bottom footer.jd-site-footer .jd-footer__careers-link,
  .footer-bottom footer.jd-site-footer .jd-footer__blog-link,
  .footer-bottom footer.jd-site-footer .jd-footer__forum-link,
  .footer-bottom footer.jd-site-footer .jd-footer__careers-link {
    display: flex !important;
    justify-content: center !important;
    width: 100%;
  }

  #footer .footer-bottom footer.jd-site-footer .jd-footer__blog-link a,
  #footer .footer-bottom footer.jd-site-footer .jd-footer__forum-link a,
  #footer .footer-bottom footer.jd-site-footer .jd-footer__careers-link a {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  footer.footer.jd-site-footer,
  #footer .footer-bottom footer.jd-site-footer {
    margin-top: 3rem !important;
  }
}

/* --------------------------------------------------------------------------
 * Front page: neutralize legacy path-frontpage footer hacks so home matches
 * other pages / reference layout site (same jd-footer layout everywhere).
 * -------------------------------------------------------------------------- */
.path-frontpage #footer .footer-bottom,
.path-frontpage #footer .footer-bottom .container,
.path-frontpage #footer .footer-bottom .footer-bottom-first,
.path-frontpage .footer-bottom .jd-site-footer {
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  max-width: 100% !important;
  width: 100% !important;
}
.path-frontpage #footer .footer-bottom .container {
  margin-left: auto !important;
  margin-right: auto !important;
}
.path-frontpage #wrapper #footer .footer-bottom footer.jd-site-footer img.protest,
.path-frontpage .footer-bottom .jd-site-footer img.protest {
  margin-left: auto !important;
  margin-right: auto !important;
  background-color: #ffffff !important;
  border: 2px solid #ffffff !important;
  border-radius: 50% !important;
}
.path-frontpage .footer .container .row.justify-content-center .col-5.text-center p {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Keep Bootstrap's negative row gutters inside the full-width home footer. */
html body.path-frontpage #wrapper #footer .footer-bottom > .container > .row {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

html body.path-frontpage #wrapper #content-wide-top #block-martis-frontpagetitle .row.layout--onecol {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* Service areas follow the reference's centered wrapping rows in every footer. */
html body[class*="path-"] #wrapper #footer .footer-bottom footer.jd-site-footer .footer_ul_amrc.service-areas {
  display: flex !important;
  flex-wrap: wrap;
  justify-content: center;
  grid-template-columns: none;
}

html body[class*="path-"] #wrapper #footer .footer-bottom footer.jd-site-footer .footer_ul_amrc.service-areas li {
  display: flex;
  justify-content: center;
  flex: 0 0 calc((100% - 1rem) / 2);
  min-width: 0;
}

html body[class*="path-"] #wrapper #footer .footer-bottom footer.jd-site-footer .jd-footer__reviews > .headin5_amrc {
  text-align: center !important;
}

@media (min-width: 576px) {
  html body[class*="path-"] #wrapper #footer .footer-bottom footer.jd-site-footer .footer_ul_amrc.service-areas li {
    flex-basis: calc((100% - 2rem) / 3);
  }
}

/* assets/css/partners-page.css */
/**
 * Johnny Detail — Partner full-page layout (Cyberlytics-inspired structure).
 * Attached only on node--type-partners. Brand purple, not Cyberlytics green.
 */

.partners-page,
.node--type-partners {
  max-width: 72rem;
  width: 100%;
  margin: 0 auto;
  padding: 1.25rem 1rem 2.5rem;
  box-sizing: border-box;
  color: #1a1a1a;
}

.partner-page-shell {
  display: block;
}

/* ----- Hero ----- */
.partner-hero {
  display: grid;
  grid-template-columns: minmax(140px, 200px) minmax(0, 1fr);
  gap: 1.5rem 2rem;
  align-items: start;
  padding: 1.5rem 1.5rem 1.75rem;
  margin-bottom: 1.75rem;
  background: #ffffff;
  border: 2px solid #000;
  border-radius: 16px;
  box-sizing: border-box;
}

.partner-hero__logo-wrap {
  display: flex;
  justify-content: center;
  align-items: flex-start;
}

.partner-hero__logo.logo-circle,
.partner-hero .logo-circle {
  width: 160px !important;
  height: 160px !important;
  min-width: 160px !important;
  min-height: 160px !important;
  max-width: 160px !important;
  max-height: 160px !important;
  border-radius: 50% !important;
  border: 2px solid #000 !important;
  background: #fff !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: hidden !important;
  padding: 0.55rem !important;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1) !important;
  box-sizing: border-box !important;
  aspect-ratio: 1 / 1 !important;
}

/* Circle is the well — never put border-radius:50% on the img (ovals 116×56 logos) */
.partner-hero__logo img,
.partner-hero .logo-circle img,
html body.page-node-type-partners .partner-hero__logo img,
html body.page-node-type-partners .logo-circle img {
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: contain !important;
  object-position: center !important;
  border-radius: 0 !important;
  border: 0 !important;
  background: transparent !important;
  padding: 0 !important;
  margin: 0 !important;
  box-shadow: none !important;
}

.partner-hero__eyebrow {
  display: inline-block;
  margin: 0 0 0.55rem;
  padding: 0.28rem 0.75rem;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #3b0a5c;
  background: #f3e8ff;
  border: 1px solid #e9d5ff;
  border-radius: 999px;
}

/* Beat global white-on-white H1 rules on partner pages */
html body.path-node .partners-page h1.partner-hero__title,
html body.page-node-type-partners h1.partner-hero__title,
.partners-page h1.node-name-title.partner-hero__title {
  margin: 0 0 0.75rem !important;
  padding: 0 !important;
  font-size: clamp(1.5rem, 2.5vw, 2.1rem) !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  color: #1a1a1a !important;
  -webkit-text-fill-color: #1a1a1a !important;
  background: none !important;
  text-shadow: none !important;
}

.partner-hero__deck {
  margin: 0 0 1.15rem;
  padding: 0;
  font-size: 1.05rem;
  line-height: 1.55;
  color: #1a1a1a;
  max-width: 42rem;
  background: transparent;
  border: 0;
  box-shadow: none;
}

/* ----- CTAs ----- */
.partner-cta-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem 0.65rem;
  align-items: center;
}

.partner-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0.5rem 1rem;
  border-radius: 6px;
  border: 2px solid #000;
  font-size: 0.9rem;
  font-weight: 600;
  text-decoration: none !important;
  line-height: 1.2;
  box-sizing: border-box;
  transition: background 0.15s ease, color 0.15s ease, transform 0.1s ease;
}

.partner-cta:hover,
.partner-cta:focus-visible {
  outline: 2px solid #7b2cbf;
  outline-offset: 2px;
}

.partner-cta--primary {
  background: #7b2cbf;
  color: #fff !important;
}

.partner-cta--primary:hover {
  background: #5a1f8f;
  color: #fff !important;
}

.partner-cta--secondary {
  background: #1a1a1a;
  color: #fff !important;
}

.partner-cta--secondary:hover {
  background: #333;
  color: #fff !important;
}

.partner-cta--ghost {
  background: #fff;
  color: #7b2cbf !important;
}

.partner-cta--ghost:hover {
  background: #f3e8ff;
  color: #5a1f8f !important;
}

/* ----- Long body ----- */
.partner-body {
  padding: 0.25rem 0.15rem 1.5rem;
  font-size: 1.02rem;
  line-height: 1.65;
  color: #222;
}

.partner-body p {
  margin: 0 0 1rem;
}

.partner-body h2,
.partner-body h3 {
  margin: 1.5rem 0 0.65rem;
  color: #1a1a1a;
  font-weight: 700;
  line-height: 1.3;
}

.partner-body h2 {
  font-size: 1.35rem;
  border-bottom: 2px solid #f3e8ff;
  padding-bottom: 0.35rem;
}

.partner-body h3 {
  font-size: 1.15rem;
  color: #7b2cbf;
}

.partner-body ul,
.partner-body ol {
  margin: 0 0 1.1rem;
  padding-left: 1.35rem;
}

.partner-body li {
  margin-bottom: 0.4rem;
}

.partner-body a {
  color: #7b2cbf;
  font-weight: 600;
  text-underline-offset: 2px;
}

/* ----- Related nav ----- */
.partner-related {
  margin-top: 0.5rem;
  padding: 1.25rem 1.35rem;
  border: 2px solid #000;
  border-radius: 12px;
  background: #faf8fc;
}

.partner-related__title {
  margin: 0 0 0.75rem !important;
  font-size: 1.15rem !important;
  color: #1a1a1a !important;
  font-weight: 700 !important;
}

.partner-related__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 0.75rem;
}

.partner-related__list li {
  margin: 0;
}

.partner-related__list a {
  display: inline-flex;
  align-items: center;
  min-height: 40px;
  padding: 0.35rem 0.75rem;
  border: 1px solid #7b2cbf;
  border-radius: 999px;
  color: #7b2cbf !important;
  font-weight: 600;
  font-size: 0.9rem;
  text-decoration: none !important;
  background: #fff;
}

.partner-related__list a:hover,
.partner-related__list a:focus-visible {
  background: #7b2cbf;
  color: #fff !important;
}

/* Teaser listing */
.partner-teaser-card {
  text-align: center;
}

.partner-teaser-link {
  text-decoration: none !important;
  color: inherit;
}

.partner-teaser-title {
  display: block;
  margin-top: 0.5rem;
  font-weight: 600;
  color: #7b2cbf;
}

/* ----- Mobile ----- */
@media (max-width: 767.98px) {
  .partners-page,
  .node--type-partners {
    padding: 0.75rem 0.65rem 2rem;
  }

  .partner-hero {
    grid-template-columns: 1fr;
    justify-items: center;
    text-align: center;
    padding: 1.15rem 1rem 1.35rem;
    gap: 1rem;
  }

  .partner-hero__main {
    width: 100%;
  }

  .partner-hero__deck {
    margin-left: auto;
    margin-right: auto;
  }

  .partner-cta-row {
    justify-content: center;
  }

  .partner-hero__logo.logo-circle,
  .partner-hero .logo-circle {
    width: 130px;
    height: 130px;
  }

  .partner-related__list {
    flex-direction: column;
    align-items: stretch;
  }

  .partner-related__list a {
    justify-content: center;
  }
}


/* partner detail circle nuclear */
@media (max-width: 767.98px) {
  html body.page-node-type-partners .partner-hero__logo.logo-circle,
  html body.page-node-type-partners .partner-hero .logo-circle,
  .partners-page .partner-hero__logo.logo-circle {
    width: 140px !important;
    height: 140px !important;
    min-width: 140px !important;
    min-height: 140px !important;
    max-width: 140px !important;
    max-height: 140px !important;
    aspect-ratio: 1 / 1 !important;
    border-radius: 50% !important;
    background: #fff !important;
  }
  html body.page-node-type-partners .partner-hero__logo img,
  html body.page-node-type-partners .logo-circle img {
    border-radius: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
  }
}

/* assets/css/service-hubs.css */
/**
 * Johnny Detail — Automotive & Marine service hub polish
 * Cyberlytics hub structure (intro + package CTAs), JD purple brand.
 * Scope: path hubs + city service hubs; not leaf service nodes.
 */

/* ---- Scope tokens ---- */
body.path-automotive-services,
body.path-marine-and-rv-services,
body[class*="-automotive-services"]:not(.page-node-type-service),
body[class*="-marine-and-rv-services"]:not(.page-node-type-service) {
  --jd-hub-purple: #7b2cbf;
  --jd-hub-purple-deep: #5a1f8f;
  --jd-hub-purple-dark: #3b0a5c;
  --jd-hub-purple-mid: #6716aa;
  --jd-hub-leaf: #b781e3;
  --jd-hub-soft: #f3e8ff;
  --jd-hub-mist: #faf8fc;
  --jd-hub-ink: #1a0a24;
}

/* ---- Hub intro (under H1 title block) ---- */
html body.path-automotive-services .jd-hub-intro,
html body.path-marine-and-rv-services .jd-hub-intro,
html body[class*="-automotive-services"]:not(.page-node-type-service) .jd-hub-intro,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) .jd-hub-intro {
  max-width: 46rem;
  margin: 0.35rem auto -0.25rem;
  padding: 1.15rem 1.35rem 1.25rem;
  background: var(--jd-hub-mist);
  border: 2px solid #000;
  border-radius: 12px;
  box-sizing: border-box;
  text-align: left;
  color: var(--jd-hub-ink);
}

html body.path-automotive-services .jd-hub-intro__deck,
html body.path-marine-and-rv-services .jd-hub-intro__deck,
html body[class*="-automotive-services"]:not(.page-node-type-service) .jd-hub-intro__deck,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) .jd-hub-intro__deck {
  margin: 0 0 0.85rem;
  font-size: 1.05rem;
  line-height: 1.55;
  color: #222;
}

html body.path-automotive-services .jd-hub-intro__list,
html body.path-marine-and-rv-services .jd-hub-intro__list,
html body[class*="-automotive-services"]:not(.page-node-type-service) .jd-hub-intro__list,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) .jd-hub-intro__list {
  margin: 0 0 1rem;
  padding-left: 1.25rem;
  list-style: disc;
}

html body.path-automotive-services .jd-hub-intro__list li,
html body.path-marine-and-rv-services .jd-hub-intro__list li,
html body[class*="-automotive-services"]:not(.page-node-type-service) .jd-hub-intro__list li,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) .jd-hub-intro__list li {
  margin: 0 0 0.45rem;
  font-size: 0.98rem;
  line-height: 1.45;
  color: #333;
}

html body.path-automotive-services .jd-hub-intro__list strong,
html body.path-marine-and-rv-services .jd-hub-intro__list strong,
html body[class*="-automotive-services"]:not(.page-node-type-service) .jd-hub-intro__list strong,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) .jd-hub-intro__list strong {
  color: var(--jd-hub-purple);
  font-weight: 700;
}

html body.path-automotive-services .jd-hub-intro__cta,
html body.path-marine-and-rv-services .jd-hub-intro__cta,
html body[class*="-automotive-services"]:not(.page-node-type-service) .jd-hub-intro__cta,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) .jd-hub-intro__cta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem 0.65rem;
  margin: 0;
  align-items: center;
}

html body.path-automotive-services .jd-hub-intro__btn,
html body.path-marine-and-rv-services .jd-hub-intro__btn,
html body[class*="-automotive-services"]:not(.page-node-type-service) .jd-hub-intro__btn,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) .jd-hub-intro__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0.5rem 1.05rem;
  border: 2px solid #000;
  border-radius: 6px;
  background: var(--jd-hub-purple);
  color: #fff !important;
  font-weight: 600;
  font-size: 0.92rem;
  text-decoration: none !important;
  line-height: 1.2;
  box-sizing: border-box;
  transition: background 0.15s ease, color 0.15s ease;
}

html body.path-automotive-services .jd-hub-intro__btn:hover,
html body.path-automotive-services .jd-hub-intro__btn:focus-visible,
html body.path-marine-and-rv-services .jd-hub-intro__btn:hover,
html body.path-marine-and-rv-services .jd-hub-intro__btn:focus-visible,
html body[class*="-automotive-services"]:not(.page-node-type-service) .jd-hub-intro__btn:hover,
html body[class*="-automotive-services"]:not(.page-node-type-service) .jd-hub-intro__btn:focus-visible,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) .jd-hub-intro__btn:hover,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) .jd-hub-intro__btn:focus-visible {
  background: var(--jd-hub-purple-deep);
  color: #fff !important;
  outline: 2px solid var(--jd-hub-leaf);
  outline-offset: 2px;
}

html body.path-automotive-services .jd-hub-intro__btn--ghost,
html body.path-marine-and-rv-services .jd-hub-intro__btn--ghost,
html body[class*="-automotive-services"]:not(.page-node-type-service) .jd-hub-intro__btn--ghost,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) .jd-hub-intro__btn--ghost {
  background: #fff;
  color: var(--jd-hub-purple) !important;
}

html body.path-automotive-services .jd-hub-intro__btn--ghost:hover,
html body.path-automotive-services .jd-hub-intro__btn--ghost:focus-visible,
html body.path-marine-and-rv-services .jd-hub-intro__btn--ghost:hover,
html body.path-marine-and-rv-services .jd-hub-intro__btn--ghost:focus-visible,
html body[class*="-automotive-services"]:not(.page-node-type-service) .jd-hub-intro__btn--ghost:hover,
html body[class*="-automotive-services"]:not(.page-node-type-service) .jd-hub-intro__btn--ghost:focus-visible,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) .jd-hub-intro__btn--ghost:hover,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) .jd-hub-intro__btn--ghost:focus-visible {
  background: var(--jd-hub-soft);
  color: var(--jd-hub-purple-deep) !important;
}

/* ---- Teaser titles (package cards) ---- */
html body.path-automotive-services #wrapper .feat-container.service-teaser.service-teaser2 h2.service-title,
html body.path-marine-and-rv-services #wrapper .feat-container.service-teaser.service-teaser2 h2.service-title,
html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .feat-container.service-teaser.service-teaser2 h2.service-title,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .feat-container.service-teaser.service-teaser2 h2.service-title {
  margin: 0.65rem 0 0.55rem !important;
  font-size: clamp(1.15rem, 2.2vw, 1.4rem) !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  text-align: center !important;
}

html body.path-automotive-services #wrapper .feat-container.service-teaser.service-teaser2 h2.service-title a,
html body.path-marine-and-rv-services #wrapper .feat-container.service-teaser.service-teaser2 h2.service-title a,
html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .feat-container.service-teaser.service-teaser2 h2.service-title a,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .feat-container.service-teaser.service-teaser2 h2.service-title a,
html body.path-automotive-services .feat-container.service-teaser.service-teaser2 h2.service-title a,
html body.path-marine-and-rv-services .feat-container.service-teaser.service-teaser2 h2.service-title a,
html body[class*="-automotive-services"]:not(.page-node-type-service) .feat-container.service-teaser.service-teaser2 h2.service-title a,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) .feat-container.service-teaser.service-teaser2 h2.service-title a {
  color: #1a0a24 !important;
  color: var(--jd-hub-ink, #1a0a24) !important;
  text-decoration: none !important;
  font-weight: 700 !important;
  transition: color 0.15s ease;
}

html body.path-automotive-services #wrapper .feat-container.service-teaser.service-teaser2 h2.service-title a:hover,
html body.path-automotive-services #wrapper .feat-container.service-teaser.service-teaser2 h2.service-title a:focus-visible,
html body.path-marine-and-rv-services #wrapper .feat-container.service-teaser.service-teaser2 h2.service-title a:hover,
html body.path-marine-and-rv-services #wrapper .feat-container.service-teaser.service-teaser2 h2.service-title a:focus-visible,
html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .feat-container.service-teaser.service-teaser2 h2.service-title a:hover,
html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .feat-container.service-teaser.service-teaser2 h2.service-title a:focus-visible,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .feat-container.service-teaser.service-teaser2 h2.service-title a:hover,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .feat-container.service-teaser.service-teaser2 h2.service-title a:focus-visible {
  color: var(--jd-hub-purple) !important;
  text-decoration: underline !important;
  text-underline-offset: 3px;
}

/* ---- Package CTA button (replaces plain Read More) ---- */
html body.path-automotive-services #wrapper .feat-container.service-teaser.service-teaser2 a.jd-service-cta,
html body.path-marine-and-rv-services #wrapper .feat-container.service-teaser.service-teaser2 a.jd-service-cta,
html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .feat-container.service-teaser.service-teaser2 a.jd-service-cta,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .feat-container.service-teaser.service-teaser2 a.jd-service-cta,
html body.path-automotive-services .feat-container.service-teaser.service-teaser2 a.jd-service-cta,
html body.path-marine-and-rv-services .feat-container.service-teaser.service-teaser2 a.jd-service-cta,
html body[class*="-automotive-services"]:not(.page-node-type-service) .feat-container.service-teaser.service-teaser2 a.jd-service-cta,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) .feat-container.service-teaser.service-teaser2 a.jd-service-cta {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 44px !important;
  margin: 0.35rem auto 0.25rem !important;
  padding: 0.55rem 1.15rem !important;
  background: #7b2cbf !important;
  background: var(--jd-hub-purple, #7b2cbf) !important;
  color: #fff !important;
  border: 2px solid #000 !important;
  border-radius: 6px !important;
  font-weight: 700 !important;
  font-size: 0.95rem !important;
  line-height: 1.2 !important;
  text-decoration: none !important;
  text-align: center !important;
  box-sizing: border-box !important;
  transition: background 0.15s ease, transform 0.1s ease;
}

html body.path-automotive-services #wrapper .feat-container.service-teaser.service-teaser2 .post-content,
html body.path-marine-and-rv-services #wrapper .feat-container.service-teaser.service-teaser2 .post-content,
html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .feat-container.service-teaser.service-teaser2 .post-content,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .feat-container.service-teaser.service-teaser2 .post-content {
  text-align: center !important;
}

html body.path-automotive-services #wrapper .feat-container.service-teaser.service-teaser2 a.jd-service-cta:hover,
html body.path-automotive-services #wrapper .feat-container.service-teaser.service-teaser2 a.jd-service-cta:focus-visible,
html body.path-marine-and-rv-services #wrapper .feat-container.service-teaser.service-teaser2 a.jd-service-cta:hover,
html body.path-marine-and-rv-services #wrapper .feat-container.service-teaser.service-teaser2 a.jd-service-cta:focus-visible,
html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .feat-container.service-teaser.service-teaser2 a.jd-service-cta:hover,
html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .feat-container.service-teaser.service-teaser2 a.jd-service-cta:focus-visible,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .feat-container.service-teaser.service-teaser2 a.jd-service-cta:hover,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .feat-container.service-teaser.service-teaser2 a.jd-service-cta:focus-visible {
  background: var(--jd-hub-purple-deep) !important;
  color: #fff !important;
  outline: 2px solid var(--jd-hub-leaf) !important;
  outline-offset: 2px !important;
}

/* Body blurb under title */
html body.path-automotive-services #wrapper .feat-container.service-teaser.service-teaser2 .post-content .mb-3,
html body.path-marine-and-rv-services #wrapper .feat-container.service-teaser.service-teaser2 .post-content .mb-3,
html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .feat-container.service-teaser.service-teaser2 .post-content .mb-3,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .feat-container.service-teaser.service-teaser2 .post-content .mb-3 {
  margin-bottom: 0.75rem !important;
  font-size: 0.95rem !important;
  line-height: 1.5 !important;
  color: #333 !important;
  text-align: center !important;
}

/* ---- Mobile ---- */
@media (max-width: 991.98px) {
  html body.path-automotive-services .jd-hub-intro,
  html body.path-marine-and-rv-services .jd-hub-intro,
  html body[class*="-automotive-services"]:not(.page-node-type-service) .jd-hub-intro,
  html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) .jd-hub-intro {
    margin: 0.25rem 0.5rem 1.35rem;
    padding: 1rem 1rem 1.1rem;
    max-width: none;
  }

  html body.path-automotive-services .jd-hub-intro__cta,
  html body.path-marine-and-rv-services .jd-hub-intro__cta,
  html body[class*="-automotive-services"]:not(.page-node-type-service) .jd-hub-intro__cta,
  html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) .jd-hub-intro__cta {
    flex-direction: column;
    align-items: stretch;
  }

  html body.path-automotive-services .jd-hub-intro__btn,
  html body.path-marine-and-rv-services .jd-hub-intro__btn,
  html body[class*="-automotive-services"]:not(.page-node-type-service) .jd-hub-intro__btn,
  html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) .jd-hub-intro__btn {
    width: 97%;
  }

  html body.path-automotive-services #wrapper .feat-container.service-teaser.service-teaser2 a.jd-service-cta,
  html body.path-marine-and-rv-services #wrapper .feat-container.service-teaser.service-teaser2 a.jd-service-cta,
  html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .feat-container.service-teaser.service-teaser2 a.jd-service-cta,
  html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .feat-container.service-teaser.service-teaser2 a.jd-service-cta {
    width: calc(100% - 1rem) !important;
    max-width: 22rem !important;
  }

  html body.path-automotive-services #wrapper .feat-container.service-teaser.service-teaser2 h2.service-title,
  html body.path-marine-and-rv-services #wrapper .feat-container.service-teaser.service-teaser2 h2.service-title,
  html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .feat-container.service-teaser.service-teaser2 h2.service-title,
  html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .feat-container.service-teaser.service-teaser2 h2.service-title {
    font-size: 1.15rem !important;
    padding: 0 0.35rem !important;
  }
}

/* Fallback when HTML filter strips classes (should not apply if full_html) */
html body.path-automotive-services #block-martis-automotiveservicestitle .field-body > p:first-of-type,
html body.path-marine-and-rv-services #block-martis-marineandrvdetailingservicestitle .field-body > p:first-of-type {
  max-width: 46rem;
  margin: 0.75rem auto 0.85rem;
  font-size: 1.05rem;
  line-height: 1.55;
  color: #222;
  text-align: left;
}

html body.path-automotive-services #block-martis-automotiveservicestitle .field-body > p a,
html body.path-marine-and-rv-services #block-martis-marineandrvdetailingservicestitle .field-body > p a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  margin: 0.25rem 0.35rem 0.25rem 0;
  padding: 0.5rem 1rem;
  border: 2px solid #000;
  border-radius: 6px;
  background: #7b2cbf;
  color: #fff !important;
  font-weight: 600;
  text-decoration: none !important;
}

html body.path-automotive-services #block-martis-automotiveservicestitle .field-body > p a[href^="tel:"],
html body.path-marine-and-rv-services #block-martis-marineandrvdetailingservicestitle .field-body > p a[href^="tel:"] {
  background: #fff;
  color: #7b2cbf !important;
}

/* assets/css/testimonials-slideshow.css */
/**
 * Johnny Detail — Testimonials Views Slideshow (block 1).
 * Loaded after theme Custom CSS. Resets margin-hacks + grid layout.
 */

/* ========== Block shell ========== */
#block-martis-views-block-testimonials-block-1 {
  border: 0 !important;
  padding-top: 3rem !important;
  padding-bottom: 1.5rem !important;
  margin-top: 0.75rem !important;
  margin-bottom: 1.25rem !important;
  max-width: 100%;
  overflow-x: clip;
  box-sizing: border-box;
}

#block-martis-views-block-testimonials-block-1 .block-title-wrap.clearfix {
  padding-left: 15px !important;
  padding-right: 15px !important;
}

#block-martis-views-block-testimonials-block-1 .block-subtitle {
  margin-bottom: 1.25rem !important;
}

#block-martis-views-block-testimonials-block-1 .block-content.clearfix {
  padding-left: 15px;
  padding-right: 15px;
  max-width: 100%;
}

#block-martis-views-block-testimonials-block-1 #views_slideshow_cycle_main_testimonials-block_1,
#block-martis-views-block-testimonials-block-1 #views_slideshow_cycle_teaser_section_testimonials-block_1 {
  width: 100% !important;
  max-width: 100% !important;
  padding: 0 !important;
  display: block !important;
  overflow: visible !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  background: transparent !important;
  justify-content: center !important;
  display: flex !important;
}

#block-martis-views-block-testimonials-block-1 [id^="views_slideshow_cycle_div_testimonials-block_1_"] {
  height: auto !important;
  min-height: 0 !important;
  overflow: visible !important;
}

#block-martis-views-block-testimonials-block-1 .views_slideshow_cycle_slide {
  position: relative !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  background: #fff !important;
  border-radius: 16px !important;
}

/* ========== Slide grid (2×2: profile | testimony / rating | vehicle) ========== */
#block-martis-views-block-testimonials-block-1 .views_slideshow_cycle_slide .views-row,
#block-martis-views-block-testimonials-block-1 [id^="views_slideshow_cycle_div_testimonials-block_1_"] .views-row {
  display: grid !important;
  width: 100% !important;
  max-width: 1140px !important;
  margin: 0 auto !important;
  box-sizing: border-box !important;
  flex-direction: unset !important;
  flex-wrap: unset !important;
  align-items: stretch !important;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
  grid-template-rows: auto auto minmax(0, 1fr) !important;
  grid-template-areas: none !important;
  column-gap: 1rem !important;
  row-gap: 0.75rem !important;
  padding: 0.75rem !important;
}

@media (min-width: 992px) {
  #block-martis-views-block-testimonials-block-1 .views_slideshow_cycle_slide .views-row,
  #block-martis-views-block-testimonials-block-1 [id^="views_slideshow_cycle_div_testimonials-block_1_"] .views-row {
    column-gap: 1.5rem !important;
    row-gap: 0 !important;
    padding: 1rem 1.25rem !important;
  }
}

/* Nuclear margin reset */
#block-martis-views-block-testimonials-block-1 [id^="views_slideshow_cycle_div_testimonials-block_1_"] .views-field,
#block-martis-views-block-testimonials-block-1 .views_slideshow_cycle_slide .views-field {
  margin: 0 !important;
  width: auto !important;
  max-width: 100% !important;
  order: unset !important;
  position: static !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  float: none !important;
}

#block-martis-views-block-testimonials-block-1 [id^="views_slideshow_cycle_div_testimonials-block_1_"] .views-field .field-content,
#block-martis-views-block-testimonials-block-1 [id^="views_slideshow_cycle_div_testimonials-block_1_"] .views-field .views-label {
  margin: 0 !important;
  margin-left: 0 !important;
  margin-top: 0 !important;
  padding-left: 0 !important;
}

/* ========== Field placement (2×2 cells via explicit lines) ========== */
#block-martis-views-block-testimonials-block-1 .views-field.views-field-field-image {
  grid-column: 1 !important;
  grid-row: 1 !important;
  display: block !important;
  justify-self: stretch !important;
  align-self: stretch !important;
  width: 100% !important;
  max-width: 100% !important;
  text-align: center !important;
  padding: 0.65rem 0.6rem 0.25rem !important;
  border: 0 !important;
  border-radius: 12px 12px 0 0 !important;
  background: #fff !important;
  box-sizing: border-box !important;
  margin: 0 !important;
}

#block-martis-views-block-testimonials-block-1 .views-field.views-field-title {
  grid-column: 1 !important;
  grid-row: 2 !important;
  display: block !important;
  justify-self: stretch !important;
  align-self: stretch !important;
  width: 100% !important;
  max-width: 100% !important;
  text-align: center !important;
  flex-direction: unset !important;
  align-items: unset !important;
  font-size: 1rem !important;
  line-height: 1.35 !important;
  color: #1a1a1a !important;
  margin: 0 !important;
  padding: 0.25rem 0.6rem 0.65rem !important;
  border: 0 !important;
  border-radius: 0 0 12px 12px !important;
  background: #fff !important;
  box-sizing: border-box !important;
}

#block-martis-views-block-testimonials-block-1 .views-field.views-field-body {
  grid-column: 2 !important;
  grid-row: 1 / span 2 !important;
  align-self: stretch !important;
  height: 100% !important;
  min-height: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  border: 2px solid #000 !important;
  border-radius: 12px !important;
  padding: 2rem 0.5rem !important;
  background: rgba(123, 44, 191, 0.18) !important;
  box-sizing: border-box !important;
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
}

#block-martis-views-block-testimonials-block-1 .views-field.views-field-field-rating {
  grid-column: 1 !important;
  grid-row: 3 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  width: 100% !important;
  height: 100% !important;
  align-self: stretch !important;
  padding: 0rem !important;
  border: 0 !important;
  border-radius: 12px !important;
  background: #fff !important;
  box-sizing: border-box !important;
  margin-top: 0 !important;
  min-height: 0 !important;
}

#block-martis-views-block-testimonials-block-1 .views-field.views-field-field-vehicle-detailed {
  grid-column: 2 !important;
  grid-row: 3 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  width: 100% !important;
  max-width: 100% !important;
  height: 100% !important;
  align-self: stretch !important;
  padding: 0rem !important;
  border: 0 !important;
  border-radius: 12px !important;
  background: #fff !important;
  box-sizing: border-box !important;
  margin-top: 0 !important;
  min-height: 0 !important;
}

/* ========== Labels & typography ========== */
#block-martis-views-block-testimonials-block-1 .views-label {
  display: block !important;
  font-size: 0.85rem !important;
  font-weight: 700 !important;
  color: #7b2cbf !important;
  margin: 0 0 0.35rem !important;
}

#block-martis-views-block-testimonials-block-1 .views-field.views-field-title .views-label-title,
#block-martis-views-block-testimonials-block-1 .views-field.views-field-title .field-content {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
  font-size: 1.05rem !important;
  font-weight: 600 !important;
  color: #1a1a1a !important;
}

#block-martis-views-block-testimonials-block-1 h2.views-label.views-label-field-image,
#block-martis-views-block-testimonials-block-1 div.views-label.views-label-field-image,
#block-martis-views-block-testimonials-block-1 .views-label.views-label-field-image {
  display: none !important;
  font-size: clamp(2rem, 3.5vw, 3rem) !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  margin: 0.15rem 0 0.5rem !important;
  padding: 0 0.25rem !important;
  text-align: center !important;
  color: #7b2cbf !important;
  -webkit-text-stroke: 1.5px rgba(0, 0, 0, 0.28);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  overflow: visible !important;
  white-space: nowrap;
}

#block-martis-views-block-testimonials-block-1 .views-field.views-field-body .views-label-body {
  font-size: 0.95rem !important;
  margin-bottom: 0.5rem !important;
  text-align: center !important;
}

#block-martis-views-block-testimonials-block-1 .views-field.views-field-body .field-content {
  display: block !important;
  text-align: left !important;
  color: #222 !important;
}

#block-martis-views-block-testimonials-block-1 .views-field.views-field-body .field-content p {
  display: block !important;
  margin: 0 !important;
  font-size: 0.95rem !important;
  line-height: 1.55 !important;
  text-align: left !important;
}

#block-martis-views-block-testimonials-block-1 .views-field.views-field-field-rating .views-label-field-rating,
#block-martis-views-block-testimonials-block-1 .views-field.views-field-field-vehicle-detailed .views-label-field-vehicle-detailed {
  text-align: center !important;
}

#block-martis-views-block-testimonials-block-1 .views-field.views-field-field-rating .field-content,
#block-martis-views-block-testimonials-block-1 .views-field.views-field-field-vehicle-detailed .field-content {
  display: flex !important;
  flex: 1 1 auto !important;
  justify-content: center !important;
  align-items: center !important;
  width: 100% !important;
  min-height: 0 !important;
}

#block-martis-views-block-testimonials-block-1 .views-field.views-field-field-rating img {
  max-width: 200px !important;
  width: auto !important;
  height: auto !important;
  margin: 0 auto !important;
  display: block !important;
}

#block-martis-views-block-testimonials-block-1 .views-field.views-field-field-vehicle-detailed img {
  max-width: 100% !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 120px !important;
  max-height: 220px !important;
  object-fit: cover !important;
  margin: 0 auto !important;
  display: block !important;
  border: 2px solid #000 !important;
  border-radius: 8px !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12) !important;
}

/* ========== Avatar ========== */
#block-martis-views-block-testimonials-block-1 .views-field-field-image .field-content {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  margin: 0 auto !important;
}

#block-martis-views-block-testimonials-block-1 .views-field-field-image .field-content img {
  width: 110px !important;
  height: 110px !important;
  max-width: 110px !important;
  max-height: 110px !important;
  object-fit: cover !important;
  border-radius: 50% !important;
  border: 2px solid #000 !important;
  background: #fff !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12) !important;
  margin: 0 auto !important;
  display: block !important;
}

/* ========== Controls (counter always centered above buttons) ========== */
#block-martis-views-block-testimonials-block-1 .views-slideshow-controls-top.clearfix {
  display: inline-grid !important;
  grid-template-columns: 1fr !important;
  grid-template-rows: auto auto !important;
  justify-items: center !important;
  align-items: center !important;
  gap: 0.5rem !important;
  border-bottom: 2px solid #f3e8ff !important;
  padding: 0 0 0.85rem !important;
  margin-left: auto !important;
  width: 100% !important;
}

#block-martis-views-block-testimonials-block-1 #views_slideshow_slide_counter_testimonials-block_1,
#block-martis-views-block-testimonials-block-1 .views_slideshow_slide_counter {
  margin: 0 !important;
  padding: 0 !important;
  font-size: 0.95rem !important;
  font-weight: 600 !important;
  min-width: 0 !important;
  text-align: center !important;
  justify-self: center !important;
  grid-row: 1 !important;
  order: unset !important;
}

#block-martis-views-block-testimonials-block-1 #views_slideshow_controls_text_testimonials-block_1,
#block-martis-views-block-testimonials-block-1 .views_slideshow_controls_text {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.5rem !important;
  grid-row: 2 !important;
  justify-self: center !important;
}

#block-martis-views-block-testimonials-block-1 .views-slideshow-controls-top.clearfix a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 44px !important;
  min-width: 44px !important;
  padding: 0.45rem 0.9rem !important;
  background-color: #7b2cbf !important;
  border: 2px solid #000 !important;
  border-radius: 5px !important;
  color: #fff !important;
  font-size: 0.875rem !important;
  font-weight: 600 !important;
  text-decoration: none !important;
}

#block-martis-views-block-testimonials-block-1 .views-slideshow-controls-top.clearfix a:hover,
#block-martis-views-block-testimonials-block-1 .views-slideshow-controls-top.clearfix a:focus-visible {
  background-color: #6716aa !important;
  outline: 2px solid #fff !important;
  outline-offset: 2px !important;
}

/* ========== Mobile (same 2×2 grid, tighter spacing) ========== */
@media (max-width: 991.98px) {
  #block-martis-views-block-testimonials-block-1 {
    padding-top: 3rem !important;
    padding-bottom: 1rem !important;
  }

  #block-martis-views-block-testimonials-block-1 .views_slideshow_cycle_slide .views-row,
  #block-martis-views-block-testimonials-block-1 [id^="views_slideshow_cycle_div_testimonials-block_1_"] .views-row {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    grid-template-rows: auto auto minmax(0, 1fr) !important;
    column-gap: 0.45rem !important;
    row-gap: 0.45rem !important;
    padding: 0.45rem !important;
  }

  #block-martis-views-block-testimonials-block-1 .views-field.views-field-field-image {
    padding: 0.45rem 0.4rem 0.2rem !important;
  }

  #block-martis-views-block-testimonials-block-1 .views-field.views-field-title {
    padding: 0.2rem 0.4rem 0.45rem !important;
  }

  #block-martis-views-block-testimonials-block-1 .views-field.views-field-field-rating,
  #block-martis-views-block-testimonials-block-1 .views-field.views-field-field-vehicle-detailed {
    margin-top: 0 !important;
    padding: 0rem !important;
  }

  #block-martis-views-block-testimonials-block-1 #views_slideshow_cycle_main_testimonials-block_1,
  #block-martis-views-block-testimonials-block-1 #views_slideshow_cycle_teaser_section_testimonials-block_1 {
    overflow: visible !important;
    height: auto !important;
    margin-bottom: 0 !important;
    background: transparent !important;
  }

  #block-martis-views-block-testimonials-block-1 [id^="views_slideshow_cycle_div_testimonials-block_1_"] {
    overflow: visible !important;
    height: auto !important;
  }

  #block-martis-views-block-testimonials-block-1 .views-field.views-field-body {
    padding: 2rem 0.5rem !important;
    overflow-wrap: break-word !important;
    word-break: break-word !important;
  }

  #block-martis-views-block-testimonials-block-1 .views-field.views-field-body .field-content,
  #block-martis-views-block-testimonials-block-1 .views-field.views-field-body .field-content p {
    text-align: center !important;
    font-size: 0.85rem !important;
    line-height: 1.45 !important;
  }

  #block-martis-views-block-testimonials-block-1 h2.views-label.views-label-field-image,
#block-martis-views-block-testimonials-block-1 div.views-label.views-label-field-image,
#block-martis-views-block-testimonials-block-1 .views-label.views-label-field-image {
    font-size: clamp(1.35rem, 5vw, 2rem) !important;
  }

  #block-martis-views-block-testimonials-block-1 .views-field-field-image .field-content img {
    width: 96px !important;
    height: 96px !important;
    max-width: 96px !important;
    max-height: 96px !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  #block-martis-views-block-testimonials-block-1 .views-field.views-field-field-rating img {
    max-width: min(100%, 140px) !important;
  }

  #block-martis-views-block-testimonials-block-1 .views-field.views-field-field-vehicle-detailed img {
    min-height: 100px !important;
    max-height: 130px !important;
  }

  #block-martis-views-block-testimonials-block-1 .views-slideshow-controls-top.clearfix {
    gap: 0.4rem !important;
    padding-bottom: 0.65rem !important;
    margin-bottom: 0.5rem !important;
  }

  #block-martis-views-block-testimonials-block-1 .views-label {
    font-size: 0.75rem !important;
  }

  #block-martis-views-block-testimonials-block-1 .views-field.views-field-title .field-content {
    font-size: 0.9rem !important;
  }

  /* Beat per-slide Custom CSS */
  #block-martis-views-block-testimonials-block-1 #views_slideshow_cycle_teaser_section_testimonials-block_1 [id^="views_slideshow_cycle_div_testimonials-block_1_"] .views-field.views-field-title,
  #block-martis-views-block-testimonials-block-1 #views_slideshow_cycle_teaser_section_testimonials-block_1 [id^="views_slideshow_cycle_div_testimonials-block_1_"] .views-field.views-field-field-image,
  #block-martis-views-block-testimonials-block-1 #views_slideshow_cycle_teaser_section_testimonials-block_1 [id^="views_slideshow_cycle_div_testimonials-block_1_"] .views-field.views-field-field-rating,
  #block-martis-views-block-testimonials-block-1 #views_slideshow_cycle_teaser_section_testimonials-block_1 [id^="views_slideshow_cycle_div_testimonials-block_1_"] .views-field.views-field-body,
  #block-martis-views-block-testimonials-block-1 #views_slideshow_cycle_teaser_section_testimonials-block_1 [id^="views_slideshow_cycle_div_testimonials-block_1_"] .views-field.views-field-field-vehicle-detailed {
    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-top: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    text-align: center !important;
  }

  #block-martis-views-block-testimonials-block-1 #views_slideshow_cycle_main_testimonials-block_1 .views-field,
  #block-martis-views-block-testimonials-block-1 #views_slideshow_cycle_main_testimonials-block_1 .views-label,
  #block-martis-views-block-testimonials-block-1 #views_slideshow_cycle_main_testimonials-block_1 .views-field .field-content {
    margin-left: 0 !important;
    margin-right: 0 !important;
    left: auto !important;
    right: auto !important;
    max-width: 100% !important;
  }
}

/* ========== Desktop field alignment (2×2) ========== */
@media (min-width: 992px) {
  #block-martis-views-block-testimonials-block-1 .views-field.views-field-body .field-content,
  #block-martis-views-block-testimonials-block-1 .views-field.views-field-body .field-content p {
    text-align: center !important;
  }

  #block-martis-views-block-testimonials-block-1 .views-field.views-field-title .views-label-title,
  #block-martis-views-block-testimonials-block-1 .views-field.views-field-title .field-content {
    text-align: center !important;
  }

  #block-martis-views-block-testimonials-block-1 .views-field.views-field-field-vehicle-detailed img {
    max-height: 260px !important;
    min-height: 140px !important;
  }

  #block-martis-views-block-testimonials-block-1 #views_slideshow_cycle_teaser_section_testimonials-block_1 [id^="views_slideshow_cycle_div_testimonials-block_1_"] .views-field.views-field-title,
  #block-martis-views-block-testimonials-block-1 #views_slideshow_cycle_teaser_section_testimonials-block_1 [id^="views_slideshow_cycle_div_testimonials-block_1_"] .views-field.views-field-field-image,
  #block-martis-views-block-testimonials-block-1 #views_slideshow_cycle_teaser_section_testimonials-block_1 [id^="views_slideshow_cycle_div_testimonials-block_1_"] .views-field.views-field-field-rating,
  #block-martis-views-block-testimonials-block-1 #views_slideshow_cycle_teaser_section_testimonials-block_1 [id^="views_slideshow_cycle_div_testimonials-block_1_"] .views-field.views-field-body,
  #block-martis-views-block-testimonials-block-1 #views_slideshow_cycle_teaser_section_testimonials-block_1 [id^="views_slideshow_cycle_div_testimonials-block_1_"] .views-field.views-field-field-vehicle-detailed {
    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-top: 0 !important;
    max-width: 100% !important;
  }

  #block-martis-views-block-testimonials-block-1 #views_slideshow_cycle_main_testimonials-block_1 .views-field,
  #block-martis-views-block-testimonials-block-1 #views_slideshow_cycle_main_testimonials-block_1 .views-field .field-content {
    margin-left: 0 !important;
    margin-right: 0 !important;
    left: auto !important;
    right: auto !important;
  }
}

/* Slide counter + controls — beat Custom CSS */
#block-martis-views-block-testimonials-block-1 .views-slideshow-controls-top.clearfix,
#block-martis-views-block-testimonials-block-1 #views_slideshow_cycle_main_testimonials-block_1 .views-slideshow-controls-top.clearfix {
  display: grid !important;
  grid-template-columns: 1fr !important;
  justify-items: center !important;
}

#block-martis-views-block-testimonials-block-1 #views_slideshow_slide_counter_testimonials-block_1,
#block-martis-views-block-testimonials-block-1 #views_slideshow_cycle_main_testimonials-block_1 .views_slideshow_slide_counter {
  text-align: center !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

#block-martis-views-block-testimonials-block-1 #views_slideshow_cycle_teaser_section_testimonials-block_1 .views-field.views-field-title,
#block-martis-views-block-testimonials-block-1 #views_slideshow_cycle_teaser_section_testimonials-block_1 [id^="views_slideshow_cycle_div_testimonials-block_1_"] .views-field.views-field-title,
#block-martis-views-block-testimonials-block-1 #views_slideshow_cycle_teaser_section_testimonials-block_1 .views-field.views-field-title .views-label-title,
#block-martis-views-block-testimonials-block-1 #views_slideshow_cycle_teaser_section_testimonials-block_1 .views-field.views-field-title .field-content,
#block-martis-views-block-testimonials-block-1 #views_slideshow_cycle_teaser_section_testimonials-block_1 [id^="views_slideshow_cycle_div_testimonials-block_1_"] .views-field.views-field-title .views-label-title,
#block-martis-views-block-testimonials-block-1 #views_slideshow_cycle_teaser_section_testimonials-block_1 [id^="views_slideshow_cycle_div_testimonials-block_1_"] .views-field.views-field-title .field-content {
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
  width: 100% !important;
}

/* ===== JD2 testimonial-author-link ===== */
#block-martis-views-block-testimonials-block-1 .testimonial-author-link,
#block-martis-views-block-testimonials-block-1 .views-field.views-field-title .testimonial-author-link,
#block-martis-views-block-testimonials-block-1 .views-field.views-field-title .field-content a.testimonial-author-link,
.testimonial-title .testimonial-author-link,
.node-name-title .testimonial-author-link {
  color: inherit !important;
  -webkit-text-fill-color: inherit !important;
  text-decoration: underline !important;
  text-underline-offset: 0.16em !important;
  text-decoration-thickness: 1.5px !important;
  font-weight: 700 !important;
}

/* Keep both fading slides full-width instead of sharing a flex row. */
html body:is(.path-frontpage, .path-taxonomy) #wrapper #block-martis-views-block-testimonials-block-1 #views_slideshow_cycle_teaser_section_testimonials-block_1 {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr);
}
html body:is(.path-frontpage, .path-taxonomy) #wrapper #block-martis-views-block-testimonials-block-1 .views_slideshow_cycle_slide {
  grid-area: 1 / 1;
  min-width: 0;
}

/* assets/css/a11y-perf.css */
/* Low-risk a11y / PSI helpers — no visual layout changes to design system */

/* Skip link: show when focused (Drupal visually-hidden.focusable pattern) */
a.skip-link.visually-hidden.focusable:focus,
a.skip-link.visually-hidden.focusable:active,
a.visually-hidden.focusable.skip-link:focus,
a.visually-hidden.focusable.skip-link:active {
  position: fixed !important;
  top: 0;
  left: 0;
  z-index: 100000;
  overflow: visible !important;
  clip: auto !important;
  clip-path: none !important;
  width: auto !important;
  height: auto !important;
  margin: 0;
  padding: 0.75rem 1.25rem;
  background: #000;
  color: #fff;
  font-size: 1rem;
  font-weight: 600;
  text-decoration: none;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.35);
}

/* Expand phone/email touch targets to ≥44×44 without changing visible size */
.header a[href^="tel:"],
.header a[href^="mailto:"],
.header-top a[href^="tel:"],
.header-top a[href^="mailto:"],
.jd-site-footer a[href^="tel:"],
.jd-site-footer a[href^="mailto:"],
footer a[href^="tel:"],
footer a[href^="mailto:"] {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  min-height: 44px;
  padding: 10px 4px;
  margin: -20px 0;
}

/* main landmark: block-level, no visual change */
main#main-content {
  display: block;
  outline: none;
}

/* assets/css/hub-intro-partners-page.css */
/* JD2: remapped Cyberlytics green → Johnny Detail purple. Do not paste leftover CY greens. */
/**
 * Hub intro blocks (national + city) and partner full-page layout.
 * Mobile-first; readable contrast on desktop and phone.
 */

/* ---------- Hub intro ---------- */
.hub-intro {
  max-width: 48rem;
  margin: 0.75rem auto 1.5rem;
  padding: 1rem 1.1rem 1.15rem;
  background: #f5f0fa;
  border: 1px solid rgba(0, 0, 0, 0.12);
  border-left: 4px solid #7b2cbf;
  border-radius: 10px;
  color: #1a1a1a;
  font-size: 1.05rem;
  line-height: 1.6;
}

.hub-intro p {
  margin: 0 0 0.85rem;
  color: #1a1a1a;
}

.hub-intro h2 {
  margin: 1.1rem 0 0.55rem;
  font-size: clamp(1.15rem, 2.5vw, 1.4rem);
  font-weight: 700;
  color: #3b0a5c;
  line-height: 1.3;
}

.hub-intro ul {
  margin: 0 0 1rem 1.15rem;
  padding: 0;
}

.hub-intro li {
  margin-bottom: 0.4rem;
}

.hub-intro__links {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem 0.65rem;
  margin: 1rem 0 0 !important;
  align-items: center;
}

.hub-intro__btn,
.hub-intro a.button {
  display: inline-block;
  padding: 0.55rem 0.95rem;
  border-radius: 6px;
  border: 2px solid #000;
  background: #7b2cbf;
  color: #fff !important;
  font-weight: 600;
  text-decoration: none !important;
  line-height: 1.25;
}

.hub-intro__btn--secondary,
.hub-intro a.button.hub-intro__btn--secondary {
  background: #fff;
  color: #3b0a5c !important;
}

/* Single primary CTA in hub summaries — high-intent token (high-intent-cta.css wins last) */
.hub-intro__btn--consult,
.hub-intro a.hub-intro__btn--consult,
.hub-intro a.button.hub-intro__btn.hub-intro__btn--consult {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(180deg, #9b4dd4 0%, #6716aa 55%, #3b0a5c 100%) !important;
  color: #fff !important;
  border: 2px solid #000 !important;
  border-radius: 999px !important;
  font-size: 1.05rem;
  font-weight: 800;
  padding: 0.75rem 1.35rem !important;
  box-shadow: 0 3px 0 #000, 0 8px 18px rgba(123, 44, 191, 0.35);
}

.hub-intro__btn--consult:hover,
.hub-intro a.hub-intro__btn--consult:hover,
.hub-intro a.button.hub-intro__btn.hub-intro__btn--consult:hover {
  filter: brightness(1.05);
  transform: translateY(-2px);
}

.hub-intro__btn:hover,
.hub-intro a.button:hover {
  filter: brightness(0.95);
}

/* Hide any secondary hub-intro buttons if residual markup remains */
.hub-intro__links .hub-intro__btn--secondary {
  display: none !important;
}

/* Title blocks often center H1; keep intro readable full-width under H1 */
#content-wide-top .block-block-content .field-item > h1 + .hub-intro,
#content-wide-top .block-block-content .field-item .hub-intro {
  text-align: left;
}

@media (min-width: 768px) {
  .hub-intro {
    padding: 1.25rem 1.5rem 1.35rem;
    margin-bottom: 1.75rem;
    font-size: 1.08rem;
  }
}

@media (max-width: 575.98px) {
  .hub-intro {
    margin-left: 0;
    margin-right: 0;
    border-radius: 8px;
    font-size: 1rem;
  }

  .hub-intro__links {
    flex-direction: column;
    align-items: stretch;
  }

  .hub-intro__btn,
  .hub-intro a.button {
    text-align: center;
    width: 100%;
  }
}

/* Ensure view header intro retains hub-intro styling when rendered inside Views */
.view-header .partners-listing-intro.hub-intro,
html body[class*="-partners"] .view-header .partners-listing-intro.hub-intro,
html body.path-partners .view-header .partners-listing-intro.hub-intro {
  display: block !important;
  max-width: 48rem !important;
  margin: 0.5rem auto 1.75rem !important;
  padding: 1.25rem 1.35rem 1.35rem !important;
  background: #ffffff !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  border: 1px solid #e9d5ff !important;
  border-left: 5px solid #6716aa !important;
  border-radius: 14px !important;
  box-shadow: 0 4px 14px rgba(59, 10, 92, 0.08) !important;
  box-sizing: border-box !important;
}

html body[class*="-partners"] .view-header .partners-listing-intro .hub-intro__deck,
.view-header .partners-listing-intro .hub-intro__deck {
  margin: 0 0 0.85rem !important;
  font-size: 1.05rem !important;
  line-height: 1.6 !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
}

html body[class*="-partners"] .view-header .partners-listing-intro .hub-intro__links,
.view-header .partners-listing-intro .hub-intro__links {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 0.55rem 0.65rem !important;
  margin-top: 0.85rem !important;
}

/* Fallback: when the intro wrapper is missing, style the direct hub-intro elements inside the view header */
.view-header .hub-intro__deck,
html body[class*="-partners"] .view-header .hub-intro__deck,
html body.path-partners .view-header .hub-intro__deck {
  display: block !important;
  max-width: 48rem !important;
  margin: 0.5rem auto 0.5rem !important;
  padding: 1.15rem 1.25rem !important;
  background: #ffffff !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  border: 1px solid #e9d5ff !important;
  border-left: 5px solid #6716aa !important;
  border-radius: 12px !important;
  box-shadow: 0 4px 14px rgba(59, 10, 92, 0.06) !important;
  box-sizing: border-box !important;
}

html body[class*="-partners"] .view-header .hub-intro__links,
html body.path-partners .view-header .hub-intro__links,
html body[class*="-partners"] .partners-listing-view .view-header .hub-intro__links,
html body.path-partners .partners-listing-view .view-header .hub-intro__links,
html body.page-spring-tx-partners .view-header .hub-intro__links,
html body.page-cypress-tx-partners .view-header .hub-intro__links,
html body.page-katy-tx-partners .view-header .hub-intro__links,
html body.page-jersey-village-tx-partners .view-header .hub-intro__links,
.view-header .hub-intro__links {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 0.55rem 0.65rem !important;
  margin: 0.75rem auto 0 !important;
  max-width: 48rem !important;
}

html body[class*="-partners"] .view-header .hub-intro__btn,
html body.path-partners .view-header .hub-intro__btn,
html body[class*="-partners"] .partners-listing-view .view-header .hub-intro__btn,
html body.path-partners .partners-listing-view .view-header .hub-intro__btn,
html body.page-spring-tx-partners .view-header .hub-intro__btn,
html body.page-cypress-tx-partners .view-header .hub-intro__btn,
html body.page-katy-tx-partners .view-header .hub-intro__btn,
html body.page-jersey-village-tx-partners .view-header .hub-intro__btn,
.view-header .hub-intro__btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 44px !important;
  padding: 0.5rem 1.1rem !important;
  border: 2px solid #000 !important;
  border-radius: 999px !important;
  background: linear-gradient(135deg, #6716aa 0%, #7b2cbf 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  font-size: 0.95rem !important;
}

html body[class*="-partners"] .view-header .hub-intro__btn--ghost,
html body.path-partners .view-header .hub-intro__btn--ghost,
html body[class*="-partners"] .partners-listing-view .view-header .hub-intro__btn--ghost,
html body.path-partners .partners-listing-view .view-header .hub-intro__btn--ghost,
.view-header .hub-intro__btn--ghost {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 44px !important;
  padding: 0.5rem 1.1rem !important;
  border: 2px solid #000 !important;
  border-radius: 999px !important;
  background: #ffffff !important;
  color: #5b21b6 !important;
  -webkit-text-fill-color: #5b21b6 !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  font-size: 0.95rem !important;
}
/* ---------- Partner full pages (desktop + mobile) ---------- */
.partners-page {
  color: #1a1a1a;
}

.partners-page .partner-page-shell {
  max-width: 1100px;
  margin: 0 auto 2rem;
  padding: 0 0.25rem 1rem;
}

.partners-page .partner-hero {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.25rem;
  align-items: start;
  padding: 1.25rem 1.15rem 1.35rem;
  margin-bottom: 1.5rem;
  background: linear-gradient(165deg, #f3faf6 0%, #ffffff 55%, #f8faf9 100%);
  border: 2px solid #000;
  border-radius: 18px;
  box-shadow: 0 8px 0 rgba(0, 0, 0, 0.06);
}

.partners-page .partner-hero__logo-wrap {
  display: flex;
  justify-content: center;
}

.partners-page .logo-circle,
.partners-page .partner-hero__logo {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: min(100%, 200px);
  max-width: 200px;
  min-height: 140px;
  padding: 1rem;
  border: 2px solid #000;
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 4px 0 #000;
}

.partners-page .logo-circle img,
.partners-page .partner-hero__logo img {
  max-width: 100%;
  height: auto;
  display: block;
}

.partners-page .partner-hero__eyebrow {
  margin: 0 0 0.4rem;
  font-size: 0.8rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #7b2cbf;
}

.partners-page h1.node-name-title,
.partners-page .partner-hero__title {
  margin: 0 0 0.65rem;
  font-size: clamp(1.55rem, 4vw, 2.15rem);
  line-height: 1.2;
  font-weight: 800;
  color: #2e1065 !important;
  -webkit-text-fill-color: #2e1065 !important;
}

.partners-page .partner-hero__deck {
  margin: 0 0 1.1rem;
  font-size: 1.05rem;
  line-height: 1.55;
  color: #2a2a2a;
  max-width: 38rem;
}

.partners-page .partner-cta-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem 0.65rem;
  align-items: center;
}

.partners-page .partner-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.7rem 1.15rem;
  border: 2px solid #000;
  border-radius: 999px;
  font-weight: 800;
  font-size: 0.98rem;
  line-height: 1.2;
  text-decoration: none !important;
  cursor: pointer;
  transition: transform 0.15s ease, box-shadow 0.15s ease, filter 0.15s ease;
}

.partners-page .partner-cta--primary {
  background: linear-gradient(180deg, #9b4dd4 0%, #7b2cbf 55%, #6716aa 100%);
  color: #fff !important;
  box-shadow: 0 3px 0 #000, 0 8px 16px rgba(123, 44, 191, 0.28);
}

.partners-page .partner-cta--secondary {
  background: #fff;
  color: #2e1065 !important;
  box-shadow: 0 2px 0 #000;
}

.partners-page .partner-cta--ghost {
  background: transparent;
  color: #3b0a5c !important;
  border-style: dashed;
}

.partners-page .partner-cta:hover {
  transform: translateY(-2px);
  filter: brightness(1.03);
}

.partners-page .partner-body-wrap {
  padding: 0 0.15rem;
}

.partners-page .partner-body {
  max-width: 72rem;
  width: 100%;
  font-size: 1.08rem;
  line-height: 1.7;
  color: #1a1a1a !important;
}

.partners-page .partner-body p {
  margin: 0 0 1rem;
  color: #1a1a1a;
}

.partners-page .partner-body h2 {
  margin: 1.75rem 0 0.65rem;
  padding-left: 0.75rem;
  border-left: 4px solid #7b2cbf;
  font-size: clamp(1.2rem, 2.5vw, 1.45rem);
  font-weight: 800;
  line-height: 1.3;
  color: #2e1065 !important;
}

.partners-page .partner-body ul,
.partners-page .partner-body ol {
  margin: 0 0 1.1rem 1.25rem;
  padding: 0;
}

.partners-page .partner-body li {
  margin-bottom: 0.45rem;
}

.partners-page .partner-body a {
  color: #3b0a5c !important;
  font-weight: 700;
  text-decoration: underline;
}

.partners-page .partner-page-footer {
  margin-top: 2rem;
  padding: 1.15rem 1rem;
  border-top: 2px solid rgba(0, 0, 0, 0.12);
  background: #f5f0fa;
  border-radius: 12px;
}

.partners-page .partner-teaser {
  text-align: center;
}

.partners-page .partner-teaser__title {
  margin-top: 0.5rem;
  font-weight: 700;
  color: #2e1065;
}

/* Desktop hero: logo | copy */
@media (min-width: 768px) {
  .partners-page .partner-hero {
    grid-template-columns: minmax(200px, 260px) minmax(0, 1fr);
    gap: 1.75rem 2rem;
    padding: 1.75rem 1.75rem 1.85rem;
  }

  .partners-page .partner-hero__logo-wrap {
    justify-content: flex-start;
  }

  .partners-page .logo-circle,
  .partners-page .partner-hero__logo {
    width: 100%;
    max-width: 240px;
    min-height: 180px;
  }

  .partners-page .partner-body {
    font-size: 1.1rem;
  }
}

/* Mobile: full-width CTAs */
@media (max-width: 767.98px) {
  .partners-page .partner-page-shell {
    padding-left: 0;
    padding-right: 0;
  }

  .partners-page .partner-hero {
    border-radius: 14px;
    padding: 1.1rem 0.95rem 1.2rem;
  }

  .partners-page .partner-cta-row {
    flex-direction: column;
    align-items: stretch;
  }

  .partners-page .partner-cta {
    width: 100%;
    text-align: center;
  }

  .partners-page .partner-body {
    font-size: 1.02rem;
  }

  .partners-page .logo-circle,
  .partners-page .partner-hero__logo {
    max-width: 160px;
    min-height: 120px;
  }
}

/* Legacy class hooks still used elsewhere */
.partners-page .partners-content {
  align-items: flex-start;
}

.partners-page .partner-website-btn {
  display: none;
}

/* ==========================================================================
   Partner pages — force readable text (beat global field-body { color: white })
   2026-08-08
   ========================================================================== */
html body.page-node-type-partners #wrapper .partners-page,
html body.page-node-type-partners #wrapper .partners-page .partner-page-shell,
html body.page-node-type-partners #wrapper .partners-page .partner-body,
html body.page-node-type-partners #wrapper .partners-page .partner-body-wrap,
html body.page-node-type-partners #wrapper .partners-page .partner-body .field,
html body.page-node-type-partners #wrapper .partners-page .partner-body .field-item,
html body.page-node-type-partners #wrapper .partners-page .field.field-body,
html body.page-node-type-partners #wrapper .partners-page .field.field-body .field-item,
html body.page-node-type-partners #wrapper .partners-page .field.field-body.field-type-text-with-summary.field-label-hidden.field-item,
html body.page-node-type-partners #wrapper .partners-page .field.field-type-text-with-summary .field-item,
html body.page-node-type-partners #wrapper .partners-page p,
html body.page-node-type-partners #wrapper .partners-page li,
html body.page-node-type-partners #wrapper .partners-page ul,
html body.page-node-type-partners #wrapper .partners-page ol,
html body.page-node-type-partners #wrapper .partners-page .partner-hero__deck {
  color: #1a1a1a !important;
  -webkit-text-fill-color: #1a1a1a !important;
  text-shadow: none !important;
  opacity: 1 !important;
}

html body.page-node-type-partners #wrapper .partners-page h1,
html body.page-node-type-partners #wrapper .partners-page h1.node-name-title,
html body.page-node-type-partners #wrapper .partners-page .partner-hero__title,
html body.page-node-type-partners #wrapper .partners-page h1 span,
html body.page-node-type-partners #wrapper .partners-page h1 *,
html body.page-node-type-partners #wrapper .partners-page h2,
html body.page-node-type-partners #wrapper .partners-page h2 *,
html body.page-node-type-partners #wrapper .partners-page .partner-body h2,
html body.page-node-type-partners #wrapper .partners-page .partner-body h2 *,
html body.page-node-type-partners #wrapper .partners-page h3,
html body.page-node-type-partners #wrapper .partners-page h3 * {
  color: #2e1065 !important;
  -webkit-text-fill-color: #2e1065 !important;
  text-shadow: none !important;
  background: transparent !important;
  opacity: 1 !important;
}

html body.page-node-type-partners #wrapper .partners-page .partner-hero__eyebrow {
  color: #7b2cbf !important;
  -webkit-text-fill-color: #7b2cbf !important;
}

html body.page-node-type-partners #wrapper .partners-page .partner-body a,
html body.page-node-type-partners #wrapper .partners-page .partner-body a * {
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  text-decoration: underline !important;
}

html body.page-node-type-partners #wrapper .partners-page .partner-cta--secondary,
html body.page-node-type-partners #wrapper .partners-page .partner-cta--secondary * {
  color: #2e1065 !important;
  -webkit-text-fill-color: #2e1065 !important;
  background: #ffffff !important;
}

html body.page-node-type-partners #wrapper .partners-page .partner-cta--ghost,
html body.page-node-type-partners #wrapper .partners-page .partner-cta--ghost * {
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  background: transparent !important;
}

/* Primary CTA: keep white text on green */
html body.page-node-type-partners #wrapper .partners-page .partner-cta--primary,
html body.page-node-type-partners #wrapper .partners-page .partner-cta--primary * {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  text-decoration: none !important;
}

/* Ensure hero panel stays light so dark text has contrast */
html body.page-node-type-partners #wrapper .partners-page .partner-hero {
  background: #ffffff !important;
  background-image: none !important;
  color: #1a1a1a !important;
}

html body.page-node-type-partners #wrapper .partners-page .partner-hero__eyebrow {
  display: inline-flex !important;
  width: fit-content !important;
  max-width: 100% !important;
  margin: 0 0 0.55rem !important;
  padding: 0.28rem 0.75rem !important;
  background: #f3e8ff !important;
  background-image: none !important;
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  border: 1px solid #e9d5ff !important;
  border-radius: 999px !important;
  box-shadow: none !important;
}

html body.page-node-type-partners #wrapper .partners-page .partner-hero__deck,
html body.page-node-type-partners #wrapper .partners-page .partner-hero p {
  background: #ffffff !important;
  background-image: none !important;
  color: #1a1a1a !important;
  -webkit-text-fill-color: #1a1a1a !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
}

html body.page-node-type-partners #wrapper .partners-page,
html body.page-node-type-partners #wrapper .partners-page .partner-body,
html body.page-node-type-partners #wrapper .partners-page .partner-body-wrap {
  width: 100% !important;
  max-width: 72rem !important;
}

html body.page-node-type-partners #wrapper .partners-page .partner-body p,
html body.page-node-type-partners #wrapper .partners-page .partner-body-wrap p,
html body.page-node-type-partners #wrapper .partners-page .partner-body .field-item > p {
  background: #f3e8ff !important;
  background-color: #f3e8ff !important;
  background-image: none !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  border: 0 !important;
  border-left: 4px solid #6716aa !important;
  border-radius: 12px !important;
  box-shadow: none !important;
  padding: 1rem 1.15rem !important;
  margin: 0 0 1rem !important;
}

html body.page-node-type-partners #wrapper .partners-page .partner-body-wrap,
html body.page-node-type-partners #wrapper .partners-page .partner-page-footer {
  background-color: transparent;
}

html body.page-node-type-partners #wrapper .partners-page .partner-page-footer {
  background: #f5f0fa !important;
  color: #1a1a1a !important;
}

/* END partner white-text fix */

/* assets/css/chrome-layout-fix.css */
/**
 * chrome-layout-fix.css
 * Loaded LAST (after theme Custom CSS) via martis_get_late_theme_css().
 * Fixes:
 *  - Header logo + site name + slogan alignment (desktop + mobile)
 *  - Header info visibility/alignment across pages
 *  - City-page carousel CTA staying inside the slide image on mobile
 *  - Promo modal skip/close actually hiding the dialog
 */

/* ==========================================================================
   1) Site branding: logo + name + slogan
   ========================================================================== */

#block-martis-branding.site-branding,
.site-branding#block-martis-branding,
.header-side.navbar-brand .site-branding,
.navbar-brand .site-branding {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  width: auto !important;
  max-width: 100% !important;
}

#block-martis-branding .container-wrap,
.site-branding .container-wrap {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 0.55rem 0.75rem !important;
  width: auto !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}

/* Kill fragile absolute/negative-margin brand layout */
#block-martis-branding .brand.logo,
.site-branding .brand.logo,
.brand.logo {
  display: block !important;
  position: relative !important;
  float: none !important;
  flex: 0 0 auto !important;
  max-width: 72px !important;
  width: auto !important;
  margin: 0 !important;
  margin-left: 0 !important;
  margin-top: 0 !important;
  line-height: 1 !important;
}

#block-martis-branding .brand.logo a,
.site-branding .brand.logo a,
.site-branding-logo {
  display: block !important;
  line-height: 0 !important;
}

#block-martis-branding .brand.logo img,
.site-branding .brand.logo img,
.site-branding-logo img {
  display: block !important;
  width: 100% !important;
  max-width: 72px !important;
  height: auto !important;
  scale: 1 !important;
  transform: none !important;
}

#block-martis-branding .brand.site-name,
.site-branding .brand.site-name,
.brand.site-name {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  align-items: flex-start !important;
  position: relative !important;
  float: none !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
  max-width: 100% !important;
  margin: 0 !important;
  margin-left: 0 !important;
  margin-top: 0 !important;
  padding: 0 !important;
  font-size: 1.05rem !important;
  line-height: 1.2 !important;
}

.site-branding-name,
.site-branding-name a,
.brand.site-name a {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  color: #ffffff !important;
  font-weight: 700 !important;
  font-size: 1.15rem !important;
  line-height: 1.15 !important;
  text-decoration: none !important;
  white-space: nowrap !important;
}

/* Slogan base — match JD appearance (light under name) */
.site-branding-slogan,
.brand.site-name .site-branding-slogan,
.header .brand.site-name .site-branding-slogan {
  display: block !important;
  visibility: visible !important;
  opacity: 0.9 !important;
  color: #ffffff !important;
  font-size: 0.8rem !important;
  font-weight: 400 !important;
  line-height: 1.25 !important;
  margin: 0.15rem 0 0 !important;
  margin-bottom: 0 !important;
  max-width: none !important;
  width: auto !important;
  white-space: nowrap !important;
  text-wrap: nowrap !important;
  text-shadow: -1px -1px 0 #000, 0 0 0 #000, 0 0 0 #000, 0 0 0 #000 !important;
}

/* Desktop brand row sits cleanly in the green header bar */
@media (min-width: 768px) {
  .navbar.header-center > .container {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
  }

  .header-side.navbar-brand {
    display: flex !important;
    align-items: center !important;
    flex: 0 1 auto !important;
    max-width: 42% !important;
    min-width: 0 !important;
  }

  .header-main-wrap {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
  }

  .header-right-wrap {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    flex: 0 0 auto !important;
  }

  .header-info,
  .header-info .header-info-container {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    align-items: center !important;
    justify-content: center !important;
    flex-wrap: wrap !important;
  }
}

/* Mobile: brand left 1rem; location left + hours right; Contact Us phone below */
@media (max-width: 767.98px) {
  .navbar.header-center > .container {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: flex-start !important;
    align-items: center !important;
    position: relative !important;
    padding: 0.5rem 1rem !important;
    box-sizing: border-box !important;
  }

  .header-side.navbar-brand {
    width: auto !important;
    max-width: calc(100% - 5.75rem) !important;
    flex: 1 1 auto !important;
    order: 1 !important;
    display: flex !important;
    justify-content: flex-start !important;
    text-align: left !important;
    margin: 0 !important;
    padding: 0 5.5rem 0 0 !important;
    min-height: 56px;
  }

  #block-martis-branding .container-wrap,
  .site-branding .container-wrap {
    justify-content: flex-start !important;
    width: 100% !important;
    text-align: left !important;
  }

  #block-martis-branding .brand.site-name,
  .site-branding .brand.site-name,
  .brand.site-name {
    align-items: flex-start !important;
    text-align: left !important;
  }

  #block-martis-branding .brand.logo,
  .site-branding .brand.logo,
  .brand.logo {
    max-width: 58px !important;
    margin: 0 !important;
  }

  #block-martis-branding .brand.logo img,
  .site-branding-logo img {
    max-width: 58px !important;
  }

  .site-branding-name a {
    font-size: 1.05rem !important;
  }

  /* Mobile slogan: JD size/weight/nowrap so it stays one line under the name */
  .site-branding-slogan,
  .brand.site-name .site-branding-slogan,
  .header .brand.site-name .site-branding-slogan {
    font-size: 0.72rem !important;
    font-weight: 400 !important;
    line-height: 1.25 !important;
    margin-top: 0.1rem !important;
    margin-bottom: 0 !important;
    opacity: 0.9 !important;
    white-space: nowrap !important;
    text-wrap: nowrap !important;
    max-width: none !important;
    width: max-content !important;
  }

  #block-martis-branding .brand.site-name,
  .header .brand.site-name,
  .site-branding .brand.site-name {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    width: auto !important;
    max-width: none !important;
    overflow: visible !important;
  }

  .header-item.header-main,
  .header-main,
  .header-main-wrap {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
    order: 2 !important;
    justify-content: flex-start !important;
    text-align: left !important;
    margin: 0.15rem 0 0 !important;
    padding: 0.25rem 0 !important;
  }

  .header-info {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  .header-info .header-info-container {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 100% !important;
    max-width: 100% !important;
    justify-content: space-between !important;
    align-items: flex-start !important;
    gap: 0.5rem 0.75rem !important;
  }

  /* Mobile: restore container gap on taxonomy/products/store paths.
     A max-width:991.98px rule sets gap:0 with higher specificity
     (html body.path-* #wrapper ...), jamming the divider against text.
     Same specificity, later source order -> wins on mobile only. */
  html body.path-taxonomy #wrapper .header .header-info .header-info-container,
  html body.path-products #wrapper .header .header-info .header-info-container,
  html body.path-product #wrapper .header .header-info .header-info-container,
  html body.path-store #wrapper .header .header-info .header-info-container {
    gap: 0.5rem 0.75rem !important;
    column-gap: 0.75rem !important;
  }

  .header-info .header-info-item--phone {
    display: none !important;
  }

  .header-info .header-info-item--location {
    flex: 1 1 auto !important;
    max-width: 58% !important;
    justify-content: flex-start !important;
  }

  .header-info .header-info-item--hours {
    flex: 0 1 auto !important;
    max-width: 42% !important;
    justify-content: flex-end !important;
  }

  .header-info .header-info-item--location .header-info-desc {
    text-align: left !important;
  }

  .header-info .header-info-item--hours .header-info-desc {
    text-align: right !important;
  }

  .header-info .header-info-desc span,
  .header-info .header-info-desc strong {
    display: block !important;
  }

  .header-right-wrap {
    display: flex !important;
    flex-direction: column !important;
    visibility: visible !important;
    opacity: 1 !important;
    order: 3 !important;
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
    justify-content: center !important;
    align-items: center !important;
    text-align: center !important;
    margin: 0.15rem 0 0 !important;
    padding: 0 !important;
    position: static !important;
  }

  .header-item.header-right,
  .header-right {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 100% !important;
    justify-content: center !important;
    text-align: center !important;
  }

  .header-element {
    position: absolute !important;
    top: 0.5rem !important;
    right: 1rem !important;
    z-index: 30 !important;
  }
}

/* ==========================================================================
   2) City page slide carousel — keep CTA inside the image on mobile
   ========================================================================== */

.slide-carousel .slide-carousel-hero {
  position: relative !important;
  overflow: hidden !important;
}

.slide-carousel .slide-content-wrap,
.slide-carousel .slide-carousel-hero .slide-content-wrap {
  position: absolute !important;
  inset: 0 !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  /* Keep overlay content clipped to the hero image bounds */
  overflow: hidden !important;
  z-index: 3 !important;
  transform: none !important;
  text-align: center !important;
}

.slide-carousel .container.slide-wrap,
.slide-carousel .slide-content,
.slide-carousel .slide-content-main,
.slide-carousel .slide-carousel-hero .container.slide-wrap,
.slide-carousel .slide-carousel-hero .slide-content,
.slide-carousel .slide-carousel-hero .slide-content-main {
  max-width: 100% !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

/* Desktop/base: center field-items inside content-wrap (appearance only) */
.slide-carousel .slide-content-main,
.slide-carousel .slide-content-main.float-center,
.slide-carousel .slide-content-main.float-center.text-left {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
  float: none !important;
}
.slide-carousel .slide-content-wrap .field-items,
.slide-carousel .slide-content-wrap .field-item,
.slide-carousel .heading-text,
.slide-carousel .heading-text .field-item,
.slide-carousel .pre-heading-text,
.slide-carousel .pre-heading-text .field-item,
.slide-carousel .slide-content-body,
.slide-carousel .slide-content-body .field-item {
  text-align: center !important;
}

.slide-carousel .nav.menu.alt-button.mt-4.slide-button,
.slide-carousel .slide-button {
  display: flex !important;
  justify-content: center !important;
  flex-wrap: wrap !important;
  margin-top: 0.65rem !important;
  overflow: visible !important;
  position: relative !important;
  z-index: 4 !important;
}

.slide-carousel a.button.slide-button-link {
  display: inline-block !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  white-space: normal !important;
  word-break: break-word !important;
  text-align: center !important;
}

/* Owl nav arrows: stay over the image, not pushed below it */
.slide-carousel.owl-carousel .owl-nav button.owl-prev,
.slide-carousel.owl-carousel .owl-nav button.owl-next,
.slide-block .owl-next,
.slide-block .owl-prev {
  margin-top: 0 !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
}

@media (max-width: 1000px) {
  .slide-carousel.owl-carousel .owl-nav button.owl-prev,
  .slide-carousel.owl-carousel .owl-nav button.owl-next,
  .owl-next,
  .owl-prev {
    margin-top: 0 !important;
  }
}

@media (max-width: 767.98px) {
  /* Match martis-custom: aspect hero + full overlay text with Y-scroll */
  .slide-carousel .slide-carousel-hero {
    min-height: 260px !important;
    max-height: none !important;
    height: 0 !important;
    padding-bottom: 68% !important;
    overflow: hidden !important;
  }

  .slide-carousel .slide-carousel-hero .slide-image img,
  .slide-carousel .slide-carousel-hero .slide-image picture img {
    min-height: 0 !important;
    max-height: none !important;
    object-fit: cover !important;
  }

  .slide-carousel .slide-content-wrap,
  .slide-carousel .slide-carousel-hero .slide-content-wrap {
    padding: 0.55rem 0.75rem !important;
    overflow: hidden !important;
    align-items: center !important;
    justify-content: center !important;
    transform: none !important;
  }

  .slide-carousel .container.slide-wrap,
  .slide-carousel .slide-carousel-hero .container.slide-wrap {
    top: 0 !important;
    padding: 0 !important;
    max-width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  /* Scroll lives on .slide-content; main is auto-margin centered (JD) */
  .slide-carousel .slide-content,
  .slide-carousel .slide-carousel-hero .slide-content {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;
    text-align: center !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    height: 100% !important;
    max-height: 100% !important;
    min-height: 0 !important;
  }

  .slide-carousel .slide-content-main,
  .slide-carousel .slide-carousel-hero .slide-content-main,
  .slide-carousel .slide-content-main.float-center,
  .slide-carousel .slide-content-main.float-center.text-left {
    margin-top: auto !important;
    margin-bottom: auto !important;
    margin-left: auto !important;
    margin-right: auto !important;
    max-height: none !important;
    height: auto !important;
    min-height: 0 !important;
    flex: 0 0 auto !important;
    overflow: visible !important;
    pointer-events: auto !important;
    justify-content: center !important;
    align-items: center !important;
    text-align: center !important;
    display: flex !important;
    flex-direction: column !important;
  }

  .slide-carousel .pre-heading-text {
    font-size: 0.78rem !important;
    margin-bottom: 0.2rem !important;
    text-align: center !important;
  }

  .slide-carousel .heading-text,
  .slide-carousel .heading-text .field-item,
  .slide-carousel .slide-h1 {
    font-size: clamp(1rem, 4.6vw, 1.45rem) !important;
    line-height: 1.15 !important;
    margin: 0 0 0.25rem !important;
    text-align: center !important;
  }

  .slide-carousel .slide-content-body,
  .hero .slide-content-body,
  .slide-content .slide-button {
    font-size: 0.78rem !important;
    line-height: 1.35 !important;
    margin-top: 0.2rem !important;
    text-align: center !important;
  }

  /* Full body copy on mobile carousel — never clamp lines */
  .slide-carousel .slide-content-body,
  .slide-carousel .owl-item .slide-content-body,
  .hero.slide-carousel .slide-content-body {
    max-height: none !important;
    overflow: visible !important;
  }
  .slide-carousel .pre-heading-text .field-items,
  .slide-carousel .pre-heading-text .field-item,
  .slide-carousel .heading-text .field-item,
  .slide-carousel .slide-content-body .field-item {
    text-align: center !important;
  }

  .slide-carousel .nav.menu.alt-button.mt-4.slide-button,
  .slide-carousel .slide-button {
    margin-top: 0.4rem !important;
    max-width: 100% !important;
  }

  .slide-carousel a.button.slide-button-link {
    font-size: 0.78rem !important;
    padding: 0.42rem 0.85rem !important;
    line-height: 1.2 !important;
    max-width: min(100%, 18rem) !important;
  }

  /* Additional content stays below hero; do not let it look like a broken CTA */
  .slide-carousel .slide-additional-content {
    position: static !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    box-sizing: border-box !important;
  }
}

@media (max-width: 480px) {
  .slide-carousel .slide-carousel-hero {
    min-height: 240px !important;
    max-height: none !important;
  }

  .slide-carousel .slide-content-body,
  .slide-carousel .owl-item .slide-content-body {
    max-height: none !important;
    overflow: visible !important;
  }

  .slide-carousel a.button.slide-button-link {
    font-size: 0.74rem !important;
    padding: 0.38rem 0.7rem !important;
  }
}

/* ==========================================================================
   3) Promo modal — Skip / Close must hide (custom_css forced display:block)
   ========================================================================== */

/* Default: hidden. Only visible when Bootstrap .show is present. */
#js-modal-page-show-modal.modal,
#js-modal-page-show-modal {
  display: none !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

#js-modal-page-show-modal.modal.show,
#js-modal-page-show-modal.show {
  display: block !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  z-index: 1050 !important;
}

#js-modal-page-show-modal.modal.fade:not(.show),
#js-modal-page-show-modal.fade:not(.show) {
  display: none !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

/* Keep dialog usable when open */
#js-modal-page-show-modal.show .modal-page-dialog,
#js-modal-page-show-modal.show .modal-page-content {
  pointer-events: auto !important;
}

#js-modal-page-show-modal .modal-header-right .close,
#js-modal-page-show-modal .js-modal-page-left-button,
#js-modal-page-show-modal .js-modal-page-ok-button,
#js-modal-page-show-modal [data-dismiss="modal"] {
  pointer-events: auto !important;
  cursor: pointer !important;
  position: relative !important;
  z-index: 2 !important;
}

/* Ensure close "×" is tappable and not covered */
#js-modal-page-show-modal .modal-header-right .close {
  min-width: 2.5rem !important;
  min-height: 2.5rem !important;
  line-height: 1 !important;
  opacity: 1 !important;
  color: #fff !important;
}

/* Backdrop should not trap the page if modal is closed */
body:not(.modal-open) .modal-backdrop {
  display: none !important;
}

/* Keep additional-content slide nav visible in carousels (late override) */
.slide-carousel .slide-additional-nav {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  width: 100% !important;
  margin: 0 0 1rem !important;
  z-index: 5 !important;
  pointer-events: auto !important;
}
.slide-carousel .slide-additional-nav__btn {
  pointer-events: auto !important;
  cursor: pointer !important;
  display: inline-flex !important;
}

/* ==========================================================================
   Mobile hamburger + menu readability + carousel center (late override)
   Wins over theme custom_css cascade.
   ========================================================================== */
@media (max-width: 767.98px) {
  /* Hamburger 3-line button: dark green, white icon, no jump/rotate */
  .header .header-element .navbar-toggler.nav-button,
  button.navbar-toggler.nav-button,
  .navbar-toggler.nav-button.collapsed,
  .navbar-toggler.nav-button[aria-expanded="true"],
  .navbar-toggler.nav-button[aria-expanded="false"] {
    background: #3b0a5c !important;
    background-color: #3b0a5c !important;
    border: 2px solid #000 !important;
    color: #ffffff !important;
    transform: none !important;
    -webkit-transform: none !important;
    top: auto !important;
    margin-top: 0 !important;
  }
  .navbar-toggler.nav-button i,
  .navbar-toggler.nav-button .ti-menu,
  .navbar-toggler.nav-button [class*="ti-"],
  .header .header-element .navbar-toggler.nav-button i {
    color: #ffffff !important;
  }

  /*
   * Open main menu — match JD structure:
   * dark panel + light pill links (JD purple/#b781e3 → CY dark green/#b781e3)
   * active-trail = lighter green; links centered on mobile.
   */
  #main-menu.collapse.show,
  #main-menu.show,
  .header #main-menu.collapse.show,
  .header #main-menu.show,
  #main-menu.navbar-collapse.collapse.show {
    display: block !important;
    background: #3b0a5c !important;
    background-color: #3b0a5c !important;
    color: #ffffff !important;
    padding: 0.5rem 0.75rem 0.75rem !important;
  }
  #main-menu.show .primary-menu,
  #main-menu.show .mega-menu,
  #main-menu.show .mega-menu > ul,
  #main-menu.show ul.menu.menu-parent,
  #main-menu.show .nav.menu.menu-parent,
  #block-martis-main-menu ul.nav.menu.menu-parent {
    background: transparent !important;
    background-color: transparent !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  #main-menu.show .menu-item,
  #main-menu.collapse.show .menu-item,
  #main-menu.show li.menu-item,
  #main-menu .menu-item,
  #block-martis-main-menu .menu-item {
    background: transparent !important;
    background-color: transparent !important;
    border-bottom: 0 !important;
    list-style: none !important;
    margin: 0 0 0.4rem !important;
    padding: 0 !important;
    width: 100% !important;
  }
  /* Light-green link pills (JD light-purple equivalent) */
  #wrapper #main-menu.show a,
  #wrapper .header #main-menu.show .mega-menu > ul > li > a,
  #wrapper .header #main-menu.show .main-menu .nav > li > a,
  #wrapper .header #main-menu.show a,
  #main-menu.show .mega-menu > ul > li > a,
  #main-menu.show .main-menu .nav > li > a,
  #main-menu.show a,
  #main-menu.show .menu-item a,
  #block-martis-main-menu .menu-item a {
    color: #ffffff !important;
    background-color: #b781e3 !important;
    background: #b781e3 !important;
    border-radius: 10px !important;
    border: 2px solid #000 !important;
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    padding: 0.65rem 1rem !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    opacity: 1 !important;
    visibility: visible !important;
    text-decoration: none !important;
    font-weight: 600 !important;
  }
  /* Active trail / current page — lighter green (JD lighter purple) */
  #main-menu.show .menu-item--active-trail > a,
  #main-menu.show li.menu-item--active-trail > a,
  #main-menu.show .menu-item--active-trail a.is-active,
  #main-menu.show a.is-active,
  #block-martis-main-menu .menu-item--active-trail > a,
  #block-martis-main-menu a.is-active {
    background-color: #c9a0e8 !important;
    background: #c9a0e8 !important;
    color: white !important;
    -webkit-text-fill-color: white !important;
    border-color: #000 !important;
  }
  #main-menu.show a:hover,
  #main-menu.show a:focus,
  #block-martis-main-menu .menu-item a:hover,
  #block-martis-main-menu .menu-item a:focus {
    background-color: #c9a0e8 !important;
    background: #c9a0e8 !important;
    color: #ffffff !important;
    text-decoration: none !important;
  }

  /* Carousel overlay: true center in hero (X + Y) — match reference layout site */
  .slide-carousel .slide-content-wrap,
  .slide-carousel .slide-carousel-hero .slide-content-wrap,
  .slide-carousel .container.slide-wrap,
  .slide-carousel .slide-carousel-hero .container.slide-wrap {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
  }
  .slide-carousel .slide-content,
  .slide-carousel .slide-carousel-hero .slide-content {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;
    text-align: center !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }
  .slide-carousel .slide-content-main,
  .slide-carousel .slide-carousel-hero .slide-content-main,
  .slide-carousel .slide-content-main.float-center,
  .slide-carousel .slide-content-main.float-center.text-left,
  .slide-carousel .slide-content-main.text-left {
    margin-top: auto !important;
    margin-bottom: auto !important;
    margin-left: auto !important;
    margin-right: auto !important;
    height: auto !important;
    max-height: none !important;
    flex: 0 0 auto !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    overflow: visible !important;
  }
  .slide-carousel .slide-content-wrap .field-items,
  .slide-carousel .slide-content-wrap .field-item,
  .slide-carousel .heading-text .field-item,
  .slide-carousel .pre-heading-text .field-item {
    text-align: center !important;
  }
}

/* ==========================================================================
   Mobile: clearance + login spacing, cart/hamburger alignment
   Late override (beats theme custom_css margin-top: 2.5rem on account menu)
   ========================================================================== */
@media (max-width: 767.98px) {
  /* --- Header-top: clearance centered, login just below --- */
  .header-top.dark-header-top,
  .path-frontpage .header-top.dark-header-top,
  .page-node-243 .header-top.dark-header-top {
    text-align: center !important;
    padding: 0.45rem 0.75rem 0.55rem !important;
  }
  .header-top.dark-header-top .container > .row,
  .header-top.dark-header-top .col-md-6 {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    flex: none !important;
    margin: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  .header-top.dark-header-top .header-top-first {
    margin: 0 0 0.2rem !important;
    padding: 0 !important;
    text-align: center !important;
  }
  .header-top.dark-header-top .header-top-second {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: center !important;
    min-height: 0 !important;
  }
  .header-top.dark-header-top .region.region-header-top-first,
  .header-top.dark-header-top .region.region-header-top-second {
    display: block !important;
    width: 100% !important;
    text-align: center !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  /* Hide empty cookies shell so it does not add gap under clearance */
  .header-top #block-martis-cookiesui:empty,
  .header-top #block-martis-cookiesui:not(:has(.cookiesjsr-banner.active)),
  .header-top #cookiesjsr:empty {
    display: none !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  /*
   * Clearance / promo line — true horizontal center.
   * Beats custom_css: #block-clearance-sales p { margin-left: 1.5rem }
   * and div#block-clearance-sales { width: 150% }.
   */
  .header-top #block-clearance-sales,
  .header-top div#block-clearance-sales,
  .header-top #block-clearance-sales .container-wrap,
  .header-top #block-clearance-sales .block-content,
  .header-top #block-clearance-sales .field-item,
  .header-top #block-clearance-sales p,
  .header-top.dark-header-top #block-clearance-sales,
  .header-top.dark-header-top #block-clearance-sales p,
  .header-top.dark-header-top #block-clearance-sales .field-item {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-top: 1rem !important;
    margin-bottom: 0.35rem !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    text-align: center !important;
    float: none !important;
    box-sizing: border-box !important;
    position: static !important;
    left: auto !important;
    right: auto !important;
    transform: none !important;
  }
  .header-top .header-top-first,
  .header-top .region-header-top-first,
  .header-top #block-clearance-sales {
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: center !important;
  }
  /* Kill custom_css nav#block-martis-useraccountmenu { margin-top: 2.5rem } on mobile */
  .header-top nav#block-martis-useraccountmenu,
  .path-frontpage .header-top nav#block-martis-useraccountmenu,
  .page-node-243 .header-top nav#block-martis-useraccountmenu,
  body.path-frontpage nav#block-martis-useraccountmenu,
  body .header-top nav#block-martis-useraccountmenu {
    margin-top: 0.2rem !important;
    margin-bottom: -0.5rem !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding: 0 !important;
    width: auto !important;
    display: flex !important;
    justify-content: center !important;
  }
  .header-top.dark-header-top .header-top-second {
    padding-top: 0 !important;
  }
  .header-top a.dropdown-toggle.header-icon.account-icon,
  .header-top a.header-icon.account-icon,
  .path-frontpage .header-top a.dropdown-toggle.header-icon.account-icon,
  .page-node-243 .header-top a.dropdown-toggle.header-icon.account-icon {
    display: inline-block !important;
    margin: 0.15rem auto 0 !important;
    vertical-align: middle !important;
    position: relative !important;
    top: 0 !important;
  }
  .header-top button.jd-account-menu__trigger,
  .path-frontpage .header-top button.jd-account-menu__trigger,
  .page-node-243 .header-top button.jd-account-menu__trigger {
    margin: 0.15rem auto 0 !important;
    position: relative !important;
    top: 0 !important;
    vertical-align: middle !important;
  }
  /* Hide empty gtranslate shell on mobile if height 0 still reserves flow */
  .header-top #block-martis-gtranslate:empty,
  .header-top #block-martis-gtranslate .gtranslate_wrapper:empty {
    display: none !important;
    height: 0 !important;
    margin: 0 !important;
  }

  /* --- Cart + hamburger: same row height, icons centered --- */
  .header .header-element {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 0.45rem !important;
    height: 44px !important;
    min-height: 44px !important;
  }
  .header .header-element .header-cart,
  .header .header-element .header-element-item.header-cart,
  .header .header-element .navbar-toggler.nav-button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 40px !important;
    min-height: 40px !important;
    max-height: 40px !important;
    margin: 0 !important;
    vertical-align: middle !important;
    align-self: center !important;
  }
  .header .header-cart .cart-block--summary,
  .header .header-cart .cart-block--summary a,
  .header .header-element-item.header-cart .cart-block--summary a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 40px !important;
    min-height: 40px !important;
    min-width: 40px !important;
    padding: 0 10px !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    line-height: 1 !important;
  }
  .header .header-cart .cart-block--summary i,
  .header .header-cart .cart-block--summary i.ti-shopping-cart {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
    line-height: 1 !important;
    font-size: 1.15rem !important;
  }
  .header .header-element .navbar-toggler.nav-button {
    width: 40px !important;
    min-width: 40px !important;
    padding: 0 !important;
    line-height: 1 !important;
  }
  /* Icon glyph centered in hamburger button */
  .header .header-element .navbar-toggler.nav-button i,
  .header .header-element .navbar-toggler.nav-button .ti-menu,
  .header .header-element .navbar-toggler.nav-button [class*="ti-"] {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1 !important;
    font-size: 1.2rem !important;
    position: relative !important;
    top: 0 !important;
    left: 0 !important;
  }
  .header .header-element .navbar-toggler.nav-button i::before,
  .header .header-element .navbar-toggler.nav-button .ti-menu::before {
    display: block !important;
    margin: 0 auto !important;
    line-height: 1 !important;
    position: static !important;
  }
}

/* Final cart/hamburger mid-line lock on mobile */
@media (max-width: 767.98px) {
  .header .header-element > .header-cart,
  .header .header-element > .header-element-item,
  .header .header-element > .navbar-toggler.nav-button {
    align-self: center !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    position: relative !important;
    top: 0 !important;
  }
  .header .header-cart .container-wrap,
  .header .header-cart .block-content,
  .header .header-cart .cart--cart-block,
  .header .header-cart .cart-block--summary {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
    padding: 0 !important;
    height: 45px !important;
    min-height: 45px !important;
    line-height: 1 !important;
  }
  .header .header-cart .cart-block--summary a {
    height: 40px !important;
    min-height: 40px !important;
  }
}

/* ==========================================================================
   2026-07-25 playbook polish (late — beats theme custom_css)
   Green brand chrome only: #3b0a5c / #2d0847
   ========================================================================== */

/* --- Kill Bootstrap SVG hamburger ::before (custom_css may re-add) --- */
button.navbar-toggler.nav-button::before,
button.navbar-toggler.nav-button::after,
.navbar-toggler.nav-button::before,
.navbar-toggler.nav-button::after,
.header .header-element .navbar-toggler.nav-button::before,
.header .header-element .navbar-toggler.nav-button::after {
  content: none !important;
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  background: none !important;
  border: 0 !important;
}

/* Smaller centered Themify hamburger glyph only */
@media (max-width: 767.98px) {
  .header .header-element .navbar-toggler.nav-button i.ti-menu,
  .header .header-element .navbar-toggler.nav-button .ti-menu,
  button.navbar-toggler.nav-button i.ti-menu {
    font-size: 1.05rem !important;
    line-height: 1 !important;
  }
  .header .header-element .navbar-toggler.nav-button i.ti-menu::before,
  button.navbar-toggler.nav-button i.ti-menu::before {
    content: "\e68e" !important;
    display: block !important;
    font-size: inherit !important;
  }
}

/* --- Log in caret: inside pill border (static, not absolute) --- */
.header-top a.account-icon,
.header-top a.dropdown-toggle.header-icon.account-icon,
.header-top.dark-header-top a.account-icon,
.path-frontpage .header-top a.account-icon,
body .header-top a.dropdown-toggle.header-icon.account-icon {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.3rem !important;
  position: relative !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
  padding: 0.12rem 0.55rem !important;
  vertical-align: middle !important;
  white-space: nowrap !important;
}
.header-top a.account-icon::after,
.header-top a.dropdown-toggle.header-icon.account-icon::after,
.header-top.dark-header-top a.account-icon::after,
body .header-top a.dropdown-toggle.header-icon.account-icon::after {
  position: static !important;
  display: inline-block !important;
  margin: -4px 0 0 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  top: auto !important;
  right: auto !important;
  left: auto !important;
  bottom: auto !important;
  transform: rotate(45deg) !important;
  -webkit-transform: rotate(45deg) !important;
  width: 0.38rem !important;
  height: 0.38rem !important;
  border-style: solid !important;
  border-width: 0 1.5px 1.5px 0 !important;
  border-color: currentColor !important;
  vertical-align: middle !important;
  content: "" !important;
  flex: 0 0 auto !important;
}

/* Clearance sales centered on mobile */
@media (max-width: 767.98px) {
  .header-top #block-clearance-sales,
  .header-top div#block-clearance-sales,
  .header-top #block-clearance-sales .field-item,
  .header-top #block-clearance-sales p,
  .header-top .header-top-first {
    text-align: center !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }
}

/* Always kill clearance left-shift from custom_css (mobile + desktop) */
.header-top #block-clearance-sales p,
.header-top.dark-header-top #block-clearance-sales p,
header.header #block-clearance-sales p,
div#block-clearance-sales p {
  margin-left: 0 !important;
  margin-right: 0 !important;
  margin-top: 1rem !important;
  text-align: center !important;
}
header.header div#block-clearance-sales,
.header-top div#block-clearance-sales {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* --- Cart + hamburger: 4rem band, vertically centered with brand --- */
@media (max-width: 767.98px) {
  .header .header-element {
    position: absolute !important;
    top: 0.5rem !important;
    right: 1rem !important;
    height: 4rem !important;
    min-height: 4rem !important;
    max-height: 4rem !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 0.45rem !important;
    z-index: 30 !important;
  }
  /* Do NOT set position:relative on .header-right-wrap */
  .header .header-right-wrap {
    position: static !important;
  }
}

/* Mobile header rows: full container width only (no calc+min-width flex explosion) */
@media (max-width: 767.98px) {
  body .header .navbar > .container > .header-main-wrap,
  body .header .header-main-wrap,
  body.path-products .header-main-wrap,
  body.path-taxonomy .header-main-wrap,
  body.path-product .header-main-wrap,
  body.path-frontpage .header-main-wrap {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    flex: 0 0 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    position: static !important;
    box-sizing: border-box !important;
  }

  body .header .navbar > .container > .header-right-wrap,
  body .header .header-right-wrap,
  body.path-products .header-side.header-right-wrap,
  body.path-taxonomy .header-side.header-right-wrap,
  body.path-product .header-side.header-right-wrap,
  body.path-frontpage .header .header-right-wrap {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    flex: 0 0 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding: 0.45rem 0 0.25rem !important;
    position: static !important;
    box-sizing: border-box !important;
  }
}

/* --- Header info 50/50 with new classes + divider --- */
@media (max-width: 767.98px) {
  .header-info .header-info-container,
  .header .header-info .header-info-container {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    justify-content: space-between !important;
    width: 100% !important;
    gap: 0 !important;
  }
  .header-info .header-info-item,
  .header-info .header-info-location,
  .header-info .header-info-hours,
  .header-info .header-info-item--location,
  .header-info .header-info-item--hours {
    flex: 1 1 50% !important;
    max-width: 50% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }
  .header-info .header-info-location,
  .header-info .header-info-item--location {
    padding-right: 0.65rem !important;
    border-right: 1px solid rgba(255, 255, 255, 0.28) !important;
  }
  .header-info .header-info-hours,
  .header-info .header-info-item--hours {
    padding-left: 0.65rem !important;
  }
  .header-info .header-info-item--phone {
    display: none !important;
  }
  .header-info .header-info-location .header-info-desc,
  .header-info .header-info-item--location .header-info-desc {
    text-align: left !important;
  }
  .header-info .header-info-hours .header-info-desc,
  .header-info .header-info-item--hours .header-info-desc {
    text-align: right !important;
  }
  .header-info .header-info-hours-label {
    display: block !important;
    text-transform: uppercase !important;
    font-size: 0.68rem !important;
    letter-spacing: 0.04em !important;
    font-weight: 700 !important;
    opacity: 0.9 !important;
    margin-bottom: 0.15rem !important;
  }
  /* Day + time in fixed columns so Mon-Thurs / Fri-Sat times align (JD) */
  .header-info .header-info-hours-row {
    display: grid !important;
    grid-template-columns: 5.75rem max-content !important;
    column-gap: 0.35rem !important;
    align-items: baseline !important;
    justify-content: end !important;
    width: max-content !important;
    max-width: 100% !important;
    margin-left: auto !important;
    line-height: 1.35 !important;
    white-space: nowrap !important;
  }
  .header-info .header-info-label,
  .header-info .header-info-city,
  .header-info .header-info-areas {
    display: block !important;
  }
  .header-info .header-info-hours-row .header-info-day,
  .header-info .header-info-hours-row .header-info-time {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1.35 !important;
  }
  .header-info .header-info-hours-row .header-info-day {
    text-align: right !important;
    white-space: nowrap !important;
  }
  .header-info .header-info-hours-row .header-info-time {
    text-align: left !important;
    font-weight: 600 !important;
    white-space: nowrap !important;
  }
  /* Hide legacy icons if any remain */
  .header-info > .header-info-container > .header-info-item > i[class*="ti-"] {
    display: none !important;
  }
}

/* Tablet+ header-info 50/50 grid (desktop refined further at min-width 992) */
@media (min-width: 768px) {
  .header-info .header-info-container {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    align-items: center !important;
    width: 100% !important;
    gap: 0 !important;
  }
  .header-info .header-info-item,
  .header-info .header-info-location,
  .header-info .header-info-item--location,
  .header-info .header-info-hours,
  .header-info .header-info-item--hours {
    margin: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  .header-info .header-info-location,
  .header-info .header-info-item--location,
  .header-info .header-info-hours,
  .header-info .header-info-item--hours {
    flex: unset !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    display: flex !important;
    align-items: center !important;
  }
  .header-info .header-info-location,
  .header-info .header-info-item--location {
    padding-right: 1.5rem !important;
    padding-left: 0.25rem !important;
    border-right: 1px solid rgba(255, 255, 255, 0.28) !important;
    justify-content: flex-end !important;
  }
  .header-info .header-info-hours,
  .header-info .header-info-item--hours {
    padding-left: 1.5rem !important;
    padding-right: 0.25rem !important;
    justify-content: flex-start !important;
  }
  .header-info .header-info-location .header-info-desc,
  .header-info .header-info-item--location .header-info-desc {
    text-align: right !important;
  }
  .header-info .header-info-hours .header-info-desc,
  .header-info .header-info-item--hours .header-info-desc {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
  }
  .header-info .header-info-hours-label {
    display: block !important;
    width: 100% !important;
    text-align: center !important;
    text-transform: uppercase !important;
    font-size: 0.72rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.04em !important;
  }
  /* Times grid centered under OUR HOURS */
  .header-info .header-info-hours-row {
    display: grid !important;
    grid-template-columns: max-content max-content !important;
    column-gap: 0.4rem !important;
    align-items: baseline !important;
    justify-content: center !important;
    width: max-content !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    line-height: 1.35 !important;
    white-space: nowrap !important;
  }
  .header-info .header-info-hours-row .header-info-day,
  .header-info .header-info-hours-row .header-info-time {
    display: block !important;
    margin: 0 !important;
  }
  .header-info .header-info-hours-row .header-info-day {
    text-align: right !important;
  }
  .header-info .header-info-hours-row .header-info-time {
    text-align: left !important;
    font-weight: 600 !important;
  }
  .header-info .header-info-item--phone {
    display: none !important;
  }
}

/* --- Contact Us strip: extra top pad, tight bottom, no empty min-height --- */
@media (max-width: 767.98px) {
  .header #block-call-to-order,
  .header #block-call-to-order .container-wrap,
  .header #block-call-to-order .block-content,
  .header .header-right .block-content {
    min-height: 0 !important;
    padding-top: 0 !important;
    margin-top: 0 !important;
  }
  .header #block-call-to-order .block-content,
  .header #block-call-to-order .field-item,
  .header .header-right .field-item {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 0 !important;
    padding-bottom: 0.35rem !important;
    text-align: center !important;
  }
  .header #block-call-to-order .text-sm,
  .header #block-call-to-order strong.text-sm,
  .header .header-right strong.text-sm {
    margin: 0 !important;
    display: block !important;
  }
  .header #block-call-to-order p,
  .header .header-right p {
    margin: 0 !important;
    line-height: 1.2 !important;
  }
  .header #block-call-to-order .call-phone,
  .header .call-phone {
    margin-top: 0.15rem !important;
  }
}

/* --- Hide legacy Owl on-image arrows (keep .slide-additional-nav) --- */
.slide-carousel .owl-nav,
.slide-carousel.owl-carousel .owl-nav,
.hero.slide-carousel .owl-nav,
.slide-carousel .owl-nav button,
.slide-carousel .owl-prev,
.slide-carousel .owl-next,
.slide-carousel.owl-carousel .owl-nav button.owl-prev,
.slide-carousel.owl-carousel .owl-nav button.owl-next,
.slide-block .owl-prev,
.slide-block .owl-next {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
  width: 0 !important;
  height: 0 !important;
  overflow: hidden !important;
}

/* Additional-nav pills: primary green */
.slide-carousel .slide-additional-nav__btn,
.hero.slide-carousel .slide-additional-nav__btn {
  background: #3b0a5c !important;
  background-color: #3b0a5c !important;
  border: 2px solid #000 !important;
  color: #fff !important;
}
.slide-carousel .slide-additional-nav__btn:hover,
.slide-carousel .slide-additional-nav__btn:focus {
  background: #2d0847 !important;
  background-color: #2d0847 !important;
  color: #fff !important;
}

/* Carousel overlay: Y-scroll on .slide-content; main uses margin auto (reference layout site) */
@media (max-width: 768px) {
  .slide-carousel .slide-carousel-hero {
    position: relative !important;
    overflow: hidden !important;
    height: 0 !important;
    padding-bottom: 68% !important;
  }
  .slide-carousel .slide-content-wrap,
  .slide-carousel .slide-carousel-hero .slide-content-wrap,
  .slide-carousel .container.slide-wrap,
  .slide-carousel .slide-carousel-hero .container.slide-wrap {
    position: absolute !important;
    inset: 0 !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
    transform: none !important;
  }
  .slide-carousel .slide-content,
  .slide-carousel .slide-carousel-hero .slide-content {
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
    max-height: 100% !important;
    width: 100% !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    align-items: center !important;
    justify-content: flex-start !important;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-y: contain;
    pointer-events: auto !important;
    min-height: 0 !important;
    text-align: center !important;
  }
  .slide-carousel .slide-content-main,
  .slide-carousel .slide-carousel-hero .slide-content-main,
  .slide-carousel .slide-content-main.float-center,
  .slide-carousel .slide-content-main.float-center.text-left,
  .slide-carousel .slide-content-main.text-left {
    margin-top: auto !important;
    margin-bottom: auto !important;
    margin-left: auto !important;
    margin-right: auto !important;
    height: auto !important;
    max-height: none !important;
    min-height: 0 !important;
    flex: 0 0 auto !important;
    overflow: visible !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    float: none !important;
    width: 100% !important;
  }
  .slide-carousel .pre-heading-text .field-items,
  .slide-carousel .pre-heading-text .field-item,
  .slide-carousel .heading-text .field-item,
  .slide-carousel .slide-content-body .field-item {
    text-align: center !important;
    width: 100% !important;
  }
  .slide-carousel .slide-content-body {
    max-height: none !important;
    overflow: visible !important;
    -webkit-line-clamp: unset !important;
    line-clamp: unset !important;
    display: block !important;
  }
  .slide-carousel .slide-carousel-hero + .slide-additional-content,
  .slide-carousel .owl-item .slide-additional-content {
    margin-top: 1rem !important;
  }
}

/* Green hamburger + open menu (reinforce) */
@media (max-width: 767.98px) {
  button.navbar-toggler.nav-button,
  .navbar-toggler.nav-button {
    background: #3b0a5c !important;
    background-color: #3b0a5c !important;
    border: 2px solid #000 !important;
    color: #fff !important;
  }
  #main-menu.collapse.show,
  #main-menu.show {
    background: #3b0a5c !important;
    color: #fff !important;
  }
}

/* ==========================================================================
   Mobile header + carousel — match reference layout site (verified via CDP metrics)
   Do NOT use min-width: calc(100% + 2rem) on flex children — it collapses the
   .navbar > .container to ~32px and hides brand/info/contact on mobile.
   ========================================================================== */

/* Header-top borders */
.header-top.dark-header-top,
.header .header-top {
  border-top: 2px solid #000 !important;
  border-bottom: 2px solid #000 !important;
}

/* Kill custom_css green pill backgrounds on CONTACT US */
.header #block-call-to-order,
.header #block-call-to-order *,
.header #block-call-to-order p,
.header #block-call-to-order strong,
.header #block-call-to-order a,
.header #block-call-to-order .text-sm,
.header #block-call-to-order .call-phone {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.header #block-call-to-order,
.header #block-call-to-order > .container-wrap,
.header #block-call-to-order > .container-wrap > .block-content {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  text-align: center !important;
  visibility: visible !important;
  opacity: 1 !important;
}

.header #block-call-to-order .field-item,
.header #block-call-to-order .field.field-body.field-item {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.15rem !important;
  width: 100% !important;
  margin: 0 auto !important;
  padding: 0 !important;
  text-align: center !important;
}

.header #block-call-to-order p,
.header #block-call-to-order .call-phone {
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
  text-align: center !important;
  color: #fff !important;
  line-height: 1.2 !important;
}

.header #block-call-to-order strong.text-sm,
.header #block-call-to-order .text-sm {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  font-size: 0.72rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  text-align: center !important;
  color: #fff !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.45) !important;
}

.header #block-call-to-order a.call-phone-link,
.header #block-call-to-order .call-phone a {
  display: block !important;
  width: auto !important;
  margin: 0 auto !important;
  padding: 0 !important;
  font-size: 1.15rem !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  text-align: center !important;
  color: #fff !important;
  text-decoration: none !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.45) !important;
}

.header #block-header-info2 .row,
.header #block-header-info2 .layout,
.header #block-header-info2 .layout__region,
.header #block-header-info2 .container-wrap,
.header #block-header-info2 .block-content,
.header #block-header-info2 .block-layout-builder {
  background: transparent !important;
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  min-height: 0 !important;
}

@media (max-width: 991.98px) {
  /*
   * CRITICAL: theme custom_css sets .navbar.header-center { padding-left/right: 25rem }
   * (400px each side). On mobile that collapses the content box to ~0–32px and hides
   * brand / city-hours / CONTACT US. Johnny Detail does not do this.
   */
  .header .navbar.header-center,
  .navbar.header-center,
  header.header .navbar.header-center {
    padding-left: 0 !important;
    padding-right: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    overflow: visible !important;
    box-sizing: border-box !important;
  }

  .header .navbar.header-center > .container,
  .navbar.header-center > .container,
  header.header .navbar.header-center > .container {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    position: relative !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding: 0.5rem 1rem 0.65rem !important;
    box-sizing: border-box !important;
    overflow: visible !important;
  }
}

@media (max-width: 767.98px) {
  /* Shell already zeroed above; keep layout rows full-width */

  /* Row 1: brand left, room for cart/hamburger on right */
  .header .header-side.navbar-brand,
  .navbar.header-center .header-side.navbar-brand {
    display: flex !important;
    order: 1 !important;
    flex: 1 1 auto !important;
    width: auto !important;
    max-width: calc(100% - 6rem) !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 5.5rem 0 0 !important;
    min-height: 56px !important;
    align-items: center !important;
    justify-content: flex-start !important;
    text-align: left !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  .header .site-branding,
  .header .site-branding .container-wrap,
  .header #block-martis-branding .container-wrap {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: 100% !important;
    max-width: 100% !important;
    gap: 0.55rem !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  .header .brand.logo,
  .header .brand.logo img,
  .header .site-branding-logo img {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    max-width: 56px !important;
    width: 56px !important;
    height: auto !important;
  }

  .header .site-branding-name a,
  .header .brand.site-name a {
    display: inline-block !important;
    visibility: visible !important;
    color: #fff !important;
    font-size: 1.05rem !important;
    font-weight: 700 !important;
    line-height: 1.15 !important;
    white-space: nowrap !important;
  }

  /* Mobile slogan = JD: 0.72rem, weight 400, opacity 0.9, single line */
  .header .site-branding-slogan,
  .header .brand.site-name .site-branding-slogan,
  .header #block-martis-branding .site-branding-slogan {
    display: block !important;
    visibility: visible !important;
    color: #ffffff !important;
    font-size: 0.72rem !important;
    font-weight: 400 !important;
    line-height: 1.25 !important;
    margin-top: 0.1rem !important;
    margin-bottom: 0 !important;
    opacity: 0.9 !important;
    white-space: nowrap !important;
    text-wrap: nowrap !important;
    width: max-content !important;
    max-width: none !important;
    text-shadow: -1px -1px 0 #000, 0 0 0 #000, 0 0 0 #000, 0 0 0 #000 !important;
  }

  .header .brand.site-name {
    overflow: visible !important;
    width: auto !important;
    max-width: none !important;
  }

  /* Cart + hamburger absolute top-right */
  .header .header-element {
    position: absolute !important;
    top: 0.5rem !important;
    right: 1rem !important;
    left: auto !important;
    display: flex !important;
    align-items: center !important;
    gap: 0.4rem !important;
    z-index: 40 !important;
    width: auto !important;
    height: 56px !important;
  }

  /* Row 2: city + hours — full width of container (like JD ~358px content) */
  .header .header-main-wrap,
  .header .navbar > .container > .header-main-wrap,
  body .header .header-main-wrap,
  body.path-frontpage .header .header-main-wrap,
  body.path-products .header .header-main-wrap,
  body.path-taxonomy .header .header-main-wrap,
  body.path-product .header .header-main-wrap {
    display: block !important;
    order: 2 !important;
    flex: 0 0 100% !important;
    flex-basis: 100% !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0.35rem 0 0 !important;
    padding: 0.35rem 0 0.15rem !important;
    box-sizing: border-box !important;
    position: static !important;
    visibility: visible !important;
    opacity: 1 !important;
    overflow: visible !important;
  }

  .header .header-main-wrap .header-item.header-main,
  .header .header-item.header-main,
  .header .header-main,
  .header .region-header,
  .header #block-header-info2 {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0;
    padding: 0 !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  .header .header-info {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0.35rem 0 !important;
    visibility: visible !important;
    opacity: 1 !important;
    color: #fff !important;
  }

  .header .header-info .header-info-container {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    justify-content: space-between !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    gap: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
  }

  .header .header-info .header-info-item--phone {
    display: none !important;
  }

  .header .header-info .header-info-location,
  .header .header-info .header-info-item--location,
  .header .header-info .header-info-hours,
  .header .header-info .header-info-item--hours {
    display: flex !important;
    flex: 1 1 50% !important;
    max-width: 50% !important;
    min-width: 0 !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  .header .header-info .header-info-location,
  .header .header-info .header-info-item--location {
    padding-right: 0.65rem !important;
    border-right: 1px solid rgba(255, 255, 255, 0.28) !important;
    justify-content: flex-start !important;
  }

  .header .header-info .header-info-hours,
  .header .header-info .header-info-item--hours {
    padding-left: 0.65rem !important;
    justify-content: flex-end !important;
  }

  .header .header-info .header-info-desc,
  .header .header-info .header-info-desc span,
  .header .header-info .header-info-desc strong,
  .header .header-info .header-info-label,
  .header .header-info .header-info-city,
  .header .header-info .header-info-areas,
  .header .header-info .header-info-hours-label {
    display: block !important;
    color: #fff !important;
    visibility: visible !important;
    opacity: 1 !important;
    font-size: 0.72rem !important;
    line-height: 1.3 !important;
  }

  .header .header-info .header-info-item--location .header-info-desc {
    text-align: left !important;
  }

  .header .header-info .header-info-item--hours .header-info-desc {
    text-align: right !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-end !important;
    width: 100% !important;
  }

  .header .header-info .header-info-hours-label {
    text-transform: uppercase !important;
    font-size: 0.68rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.04em !important;
    margin-bottom: 0.15rem !important;
    text-align: right !important;
    width: 100% !important;
  }

  /* Align Mon-Thurs / Fri-Sat times in one column (match JD) */
  .header .header-info .header-info-hours-row {
    display: grid !important;
    grid-template-columns: 5.75rem max-content !important;
    column-gap: 0.35rem !important;
    align-items: baseline !important;
    justify-content: end !important;
    width: max-content !important;
    max-width: 100% !important;
    margin: 0 0 0 auto !important;
    line-height: 1.35 !important;
    white-space: nowrap !important;
  }

  .header .header-info .header-info-hours-row .header-info-day,
  .header .header-info .header-info-hours-row .header-info-time {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1.35 !important;
    color: #fff !important;
    font-size: 0.72rem !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  .header .header-info .header-info-hours-row .header-info-day {
    text-align: right !important;
    white-space: nowrap !important;
  }

  .header .header-info .header-info-hours-row .header-info-time {
    text-align: left !important;
    font-weight: 600 !important;
    white-space: nowrap !important;
  }

  /* Row 3: CONTACT US + phone, full width centered (JD) */
  .header .header-right-wrap,
  .header .navbar > .container > .header-right-wrap,
  .header .header-side.header-right-wrap,
  body .header .header-right-wrap,
  body.path-frontpage .header .header-right-wrap,
  body.path-products .header .header-right-wrap {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    order: 3 !important;
    flex: 0 0 100% !important;
    flex-basis: 100% !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0.15rem 0 0 !important;
    padding: 0.45rem 0 0.25rem !important;
    box-sizing: border-box !important;
    position: static !important;
    visibility: visible !important;
    opacity: 1 !important;
    text-align: center !important;
    overflow: visible !important;
  }

  .header .header-right-wrap .header-item.header-right,
  .header .header-item.header-right,
  .header .header-right,
  .header .region-header-right {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    padding: 0 !important;
    text-align: center !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  .header #block-call-to-order,
  .header #block-call-to-order .field-item {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  .header #block-call-to-order a.call-phone-link {
    font-size: 1.15rem !important;
  }
}

/* Desktop: keep header info + contact visible */
@media (min-width: 768px) {
  .header .navbar.header-center > .container {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  .header .header-main-wrap,
  .header .header-right-wrap,
  .header .header-info,
  .header #block-call-to-order {
    visibility: visible !important;
    opacity: 1 !important;
    overflow: visible !important;
    max-height: none !important;
  }

  .header .header-main-wrap {
    display: flex !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
    width: auto !important;
    max-width: none !important;
    align-items: center !important;
  }

  .header .header-right-wrap {
    display: flex !important;
    flex: 0 0 auto !important;
    width: auto !important;
    max-width: none !important;
    align-items: center !important;
    justify-content: flex-end !important;
  }
}

/* --- Mobile carousel: true vertical center (JD mainCenterOffset ~ 0) --- */
@media screen and (max-width: 768px) {
  .slide-carousel .slide-carousel-hero,
  .hero.slide-carousel .slide-carousel-hero {
    position: relative !important;
    width: 100% !important;
    height: 0 !important;
    padding-bottom: 68% !important;
    min-height: 260px !important;
    overflow: hidden !important;
  }

  .slide-carousel .slide-carousel-hero .slide-image,
  .slide-carousel .slide-carousel-hero .slide-image img,
  .slide-carousel .slide-carousel-hero .slide-image picture,
  .slide-carousel .slide-carousel-hero .slide-image picture img {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
  }

  .slide-carousel .slide-carousel-hero .slide-content-wrap,
  .slide-carousel .slide-content-wrap,
  .hero.slide-carousel .slide-content-wrap {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0.55rem 0.75rem !important;
    box-sizing: border-box !important;
    transform: none !important;
    overflow: hidden !important;
    z-index: 2 !important;
    pointer-events: none !important;
  }

  .slide-carousel .container.slide-wrap,
  .slide-carousel .slide-carousel-hero .container.slide-wrap {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    padding: 0 !important;
    transform: none !important;
  }

  .slide-carousel .slide-content,
  .slide-carousel .slide-carousel-hero .slide-content,
  .slide-carousel .owl-item .slide-content,
  .slide-carousel .owl-item.active .slide-content,
  .hero.slide-carousel .slide-content {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: 100% !important;
    height: 100% !important;
    max-height: 100% !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
    text-align: center !important;
    pointer-events: auto !important;
    transform: none !important;
  }

  /* Higher specificity than margin-top:0 !important cancelers */
  .slide-carousel .slide-carousel-hero .slide-content .slide-content-main,
  .slide-carousel .slide-carousel-hero .slide-content .slide-content-main.float-center,
  .slide-carousel .slide-carousel-hero .slide-content .slide-content-main.float-center.text-left,
  .slide-carousel .slide-content .slide-content-main.float-center.text-left,
  .slide-carousel .owl-item .slide-content-main.float-center.text-left,
  .slide-carousel .slide-content-main,
  .slide-carousel .slide-content-main.float-center,
  .slide-carousel .slide-content-main.float-center.text-left,
  .slide-carousel .slide-content-main.text-left {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    margin-top: auto !important;
    margin-bottom: auto !important;
    margin-left: auto !important;
    margin-right: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: none !important;
    min-height: 0 !important;
    flex: 0 0 auto !important;
    float: none !important;
    transform: none !important;
    overflow: visible !important;
    text-align: center !important;
    padding: 0.25rem 0.35rem !important;
    box-sizing: border-box !important;
    pointer-events: auto !important;
    gap: 0.35rem !important;
  }

  .slide-carousel .pre-heading-text,
  .slide-carousel .heading-text,
  .slide-carousel .slide-content-body,
  .slide-carousel .heading-text .field-item,
  .slide-carousel .pre-heading-text .field-item,
  .slide-carousel .slide-button {
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
    width: 100% !important;
  }

  .slide-carousel .nav.menu.alt-button.mt-4.slide-button,
  .slide-carousel .slide-button {
    display: flex !important;
    justify-content: center !important;
    margin-top: 0.35rem !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
}

/* Nuclear: hours day/time column alignment (beats any leftover display:block/inline) */
@media (max-width: 991.98px) {
  header.header .header-info .header-info-desc .header-info-hours-row,
  header.header .header-info-hours .header-info-hours-row,
  header.header span.header-info-hours-row {
    display: grid !important;
    grid-template-columns: 5.75rem max-content !important;
    column-gap: 0.35rem !important;
    align-items: baseline !important;
    justify-content: end !important;
    width: max-content !important;
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: 0 !important;
    line-height: 1.35 !important;
    white-space: nowrap !important;
  }
  header.header .header-info-hours-row > .header-info-day,
  header.header .header-info-hours-row > .header-info-time,
  header.header .header-info-hours-row > span.header-info-day,
  header.header .header-info-hours-row > strong.header-info-time {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
  }
  header.header .header-info-hours-row > .header-info-day,
  header.header .header-info-hours-row > span.header-info-day {
    text-align: right !important;
    white-space: nowrap !important;
  }
  header.header .header-info-hours-row > .header-info-time,
  header.header .header-info-hours-row > strong.header-info-time {
    text-align: left !important;
    font-weight: 600 !important;
    white-space: nowrap !important;
  }
}

/* ==========================================================================
   Mobile main menu: JD purple-pill pattern → Johnny Detail purple pills
   Panel #3b0a5c (dark) · links #b781e3 (light) · active #c9a0e8 (lighter)
   Centered labels, black border, 10px radius — same structure as JD.
   ========================================================================== */
@media (max-width: 991.98px) {
  #wrapper .header #main-menu.show,
  #wrapper #main-menu.show,
  #wrapper .header #main-menu.collapse.show,
  #wrapper #main-menu.collapse.show {
    background-color: #3b0a5c !important;
    background: #3b0a5c !important;
    padding: 1rem 0.75rem 0.85rem !important;
  }

  #wrapper .header #main-menu.show ul.nav.menu.menu-parent,
  #wrapper #main-menu.show ul.nav.menu.menu-parent,
  #wrapper #block-martis-main-menu ul.nav.menu.menu-parent {
    background: transparent !important;
    background-color: transparent !important;
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  #wrapper .header #main-menu.show li.menu-item,
  #wrapper #main-menu.show li.menu-item,
  #wrapper #block-martis-main-menu li.menu-item {
    background: transparent !important;
    border: 0 !important;
    border-bottom: 0 !important;
    margin: 0 0 0.4rem !important;
    padding: 0 !important;
    width: 100% !important;
  }

  #wrapper #main-menu.show a,
  #wrapper .header #main-menu.show a,
  #wrapper .header #main-menu.show .mega-menu > ul > li > a,
  #wrapper .header #main-menu.show .main-menu .nav > li > a,
  #wrapper #main-menu.show .menu-item a,
  #wrapper #block-martis-main-menu .menu-item a {
    background-color: #b781e3 !important;
    background: #b781e3 !important;
    color: #ffffff !important;
    border-radius: 10px !important;
    border: 2px solid #000 !important;
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    padding: 0.65rem 1rem !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    font-weight: 600 !important;
    text-decoration: none !important;
  }

  #wrapper #main-menu.show .menu-item--active-trail > a,
  #wrapper #main-menu.show li.menu-item--active-trail > a,
  #wrapper #main-menu.show a.is-active,
  #wrapper #block-martis-main-menu .menu-item--active-trail > a,
  #wrapper #block-martis-main-menu a.is-active {
    background-color: #c9a0e8 !important;
    background: #c9a0e8 !important;
    color: white !important;
    -webkit-text-fill-color: white !important;
    border: 2px solid #000 !important;
  }

  #wrapper #main-menu.show a:hover,
  #wrapper #main-menu.show a:focus,
  #wrapper #block-martis-main-menu .menu-item a:hover {
    background-color: #c9a0e8 !important;
    background: #c9a0e8 !important;
    color: #ffffff !important;
  }
}

/* ==========================================================================
   DESKTOP header + main menu (city pages + homepage)
   Match reference layout site/cypress-tx layout, Johnny Detail purple theme.
   Root cause of crush: custom_css .navbar.header-center { padding: 0 25rem }
   ========================================================================== */
@media (min-width: 992px) {
  /* Kill 25rem side padding that collapses brand/info/contact into a pile */
  .header .navbar.header-center,
  .navbar.header-center,
  header.header .navbar.header-center {
    padding-left: 0 !important;
    padding-right: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    overflow: visible !important;
  }

  .header .navbar.header-center > .container,
  .navbar.header-center > .container {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
    max-width: 1140px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding: 0.65rem 1rem !important;
    box-sizing: border-box !important;
    gap: 0.75rem 1rem !important;
  }

  /* Brand — left */
  .header .header-side.navbar-brand,
  .navbar.header-center .header-side.navbar-brand {
    display: flex !important;
    flex: 0 0 auto !important;
    width: auto !important;
    max-width: 280px !important;
    min-width: 200px !important;
    margin: 0 !important;
    padding: 0 !important;
    align-items: center !important;
    order: 1 !important;
  }

  .header .site-branding .container-wrap,
  .header #block-martis-branding .container-wrap {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 0.55rem 0.75rem !important;
    width: auto !important;
  }

  .header .brand.logo,
  .header .brand.logo img {
    max-width: 64px !important;
    width: 64px !important;
    height: auto !important;
    flex: 0 0 auto !important;
  }

  .header .brand.site-name {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    width: auto !important;
    max-width: none !important;
    overflow: visible !important;
  }

  .header .site-branding-name a {
    font-size: 1.15rem !important;
    font-weight: 700 !important;
    white-space: nowrap !important;
    color: #fff !important;
  }

  .header .site-branding-slogan {
    font-size: 0.8rem !important;
    font-weight: 400 !important;
    opacity: 0.9 !important;
    white-space: nowrap !important;
    color: #fff !important;
    margin-top: 0.1rem !important;
  }

  /* City / hours — center flex grow (JD: location | hours) */
  .header .header-main-wrap,
  .header .navbar > .container > .header-main-wrap {
    display: flex !important;
    flex: 1 1 auto !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 0.5rem !important;
    order: 2 !important;
    overflow: visible !important;
  }

  .header .header-main-wrap .header-item.header-main,
  .header .header-main,
  .header .region-header,
  .header #block-header-info2,
  .header #block-header-info2 .container-wrap,
  .header #block-header-info2 .block-content,
  .header #block-header-info2 .layout,
  .header #block-header-info2 .layout__region,
  .header #block-header-info2 .row,
  .header #block-header-info2 .block-layout-builder {
    display: block !important;
    width: 100% !important;
    max-width: 520px !important;
    margin: 0 auto;
    padding: 0 !important;
    background: transparent !important;
  }

  /*
   * header-info — ALL desktop pages (home, city/taxonomy, service, etc.):
   * CSS grid 1fr|1fr so the divider is always dead-center between
   * location and hours. Equal padding either side of the border.
   * Do not rely on page-specific padding-left: 2rem hacks.
   */
  .header .header-info,
  .header .header-main-wrap .header-info,
  body.path-frontpage .header .header-info,
  body.path-taxonomy .header .header-info,
  body.path-node .header .header-info,
  body.page-node-type-service .header .header-info,
  body.path-products .header .header-info,
  body.path-product .header .header-info {
    display: block !important;
    width: 100% !important;
    max-width: 520px !important;
    min-width: 0 !important;
    margin: 0 auto !important;
    padding: 0 !important;
    color: #fff !important;
    box-sizing: border-box !important;
    flex: 1 1 auto !important;
  }

  /* Kill path-taxonomy / products negative margins that shrink the info slot */
  .path-taxonomy .header .header-main-wrap,
  .path-products .header .header-main-wrap,
  .path-product .header .header-main-wrap,
  .page-node-type-service .header .header-main-wrap {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  .header .header-info .header-info-container,
  .path-taxonomy .header .header-info .header-info-container,
  .page-node-type-service .header .header-info .header-info-container,
  .path-frontpage .header .header-info .header-info-container {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    grid-template-rows: auto !important;
    align-items: center !important;
    justify-content: stretch !important;
    justify-items: stretch !important;
    width: 100% !important;
    max-width: 100% !important;
    gap: 0 !important;
    column-gap: 0 !important;
    row-gap: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
  }

  .header .header-info .header-info-item--phone,
  .path-taxonomy .header .header-info .header-info-item--phone,
  .page-node-type-service .header .header-info .header-info-item--phone {
    display: none !important;
    width: 0 !important;
    max-width: 0 !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
  }

  /*
   * Kill theme + custom_css spacing that shove hours off mid:
   * custom_css: .header .header-info .header-info-item.header-info-location { margin-right: 3rem !important }
   * style.css:  .header-info .header-info-item { margin-left: 40px }
   * custom_css: flex 1 1 auto + justify center on items
   */
  .header .header-info .header-info-item,
  .header .header-info .header-info-location,
  .header .header-info .header-info-item--location,
  .header .header-info .header-info-hours,
  .header .header-info .header-info-item--hours,
  .header .header-info .header-info-item.header-info-location,
  .header .header-info .header-info-item.header-info-item--location,
  .header .header-info .header-info-item.header-info-hours,
  .header .header-info .header-info-item.header-info-item--hours,
  .header .header-info .header-info-item:first-child,
  .header .header-info .header-info-item:nth-child(2),
  .path-taxonomy .header .header-info .header-info-item,
  .path-taxonomy .header .header-info .header-info-item.header-info-location,
  .page-node-type-service .header .header-info .header-info-item,
  .page-node-type-service .header .header-info .header-info-item.header-info-location {
    margin: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    float: none !important;
  }

  /* Each grid cell = exactly half; content hugs the center divider */
  .header .header-info .header-info-location,
  .header .header-info .header-info-item--location,
  .header .header-info .header-info-hours,
  .header .header-info .header-info-item--hours,
  .path-taxonomy .header .header-info .header-info-location,
  .path-taxonomy .header .header-info .header-info-item--location,
  .path-taxonomy .header .header-info .header-info-hours,
  .path-taxonomy .header .header-info .header-info-item--hours,
  .page-node-type-service .header .header-info .header-info-location,
  .page-node-type-service .header .header-info .header-info-item--location,
  .page-node-type-service .header .header-info .header-info-hours,
  .page-node-type-service .header .header-info .header-info-item--hours {
    flex: unset !important;
    flex-grow: unset !important;
    flex-shrink: unset !important;
    flex-basis: unset !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    display: flex !important;
    align-items: center !important;
    box-sizing: border-box !important;
  }

  /* Location — right half of left cell, equal pad to divider */
  .header .header-info .header-info-location,
  .header .header-info .header-info-item--location,
  .path-taxonomy .header .header-info .header-info-location,
  .path-taxonomy .header .header-info .header-info-item--location,
  .page-node-type-service .header .header-info .header-info-location,
  .page-node-type-service .header .header-info .header-info-item--location {
    padding-right: 1.5rem !important;
    padding-left: 0.25rem !important;
    border-right: 1px solid rgba(255, 255, 255, 0.28) !important;
    justify-content: flex-end !important;
  }

  /*
   * Hours — left half of right cell, SAME pad as location so content
   * sits centered about the divider (replaces fragile page-only 2rem).
   */
  .header .header-info .header-info-hours,
  .header .header-info .header-info-item--hours,
  .path-taxonomy .header .header-info .header-info-hours,
  .path-taxonomy .header .header-info .header-info-item--hours,
  .page-node-type-service .header .header-info .header-info-hours,
  .page-node-type-service .header .header-info .header-info-item--hours {
    padding-left: 1.5rem !important;
    padding-right: 0.25rem !important;
    border-right: 0 !important;
    justify-content: flex-start !important;
  }

  .header .header-info .header-info-item--location .header-info-desc,
  .header .header-info .header-info-location .header-info-desc {
    text-align: right !important;
    width: auto !important;
    max-width: 100% !important;
  }

  /* Hours column: stack label + rows, center label over the hours block */
  .header .header-info .header-info-item--hours .header-info-desc,
  .header .header-info .header-info-hours .header-info-desc,
  .path-taxonomy .header .header-info .header-info-item--hours .header-info-desc,
  .page-node-type-service .header .header-info .header-info-item--hours .header-info-desc {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    width: auto !important;
    max-width: 100% !important;
    margin: 0 !important;
  }

  .header .header-info .header-info-desc,
  .header .header-info .header-info-desc span,
  .header .header-info .header-info-desc strong {
    color: #ffffff !important;
    font-size: 0.82rem !important;
    line-height: 1.3 !important;
  }

  .header .header-info .header-info-hours-label,
  .path-taxonomy .header .header-info .header-info-hours-label,
  .page-node-type-service .header .header-info .header-info-hours-label {
    display: block !important;
    width: 100% !important;
    text-align: center !important;
    text-transform: uppercase !important;
    font-size: 0.7rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.04em !important;
    margin: 0 0 0.2rem 0 !important;
    padding: 0 !important;
  }

  /* Desktop hours: day/time grid, centered under OUR HOURS */
  .header .header-info .header-info-hours-row,
  .path-taxonomy .header .header-info .header-info-hours-row,
  .page-node-type-service .header .header-info .header-info-hours-row {
    display: grid !important;
    grid-template-columns: max-content max-content !important;
    column-gap: 0.4rem !important;
    justify-content: center !important;
    justify-items: start !important;
    width: max-content !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    white-space: nowrap !important;
  }

  .header .header-info .header-info-hours-row .header-info-day {
    display: block !important;
    text-align: right !important;
  }

  .header .header-info .header-info-hours-row .header-info-time {
    display: block !important;
    text-align: left !important;
    font-weight: 600 !important;
  }

  /* Contact + cart — right */
  .header .header-right-wrap,
  .header .header-side.header-right-wrap,
  .header .navbar > .container > .header-right-wrap {
    display: flex !important;
    flex: 0 0 auto !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: flex-end !important;
    width: auto !important;
    max-width: none !important;
    min-width: 200px !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 0.75rem !important;
    order: 3 !important;
    position: static !important;
  }

  .header .header-item.header-right,
  .header .header-right,
  .header .region-header-right {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: center !important;
  }

  .header #block-call-to-order,
  .header #block-call-to-order > .container-wrap,
  .header #block-call-to-order > .container-wrap > .block-content,
  .header #block-call-to-order .field-item {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    min-width: 10rem !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    text-align: center !important;
  }

  .header #block-call-to-order *,
  .header #block-call-to-order p,
  .header #block-call-to-order strong,
  .header #block-call-to-order a {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
  }

  .header #block-call-to-order .text-sm,
  .header #block-call-to-order strong.text-sm {
    display: block !important;
    width: 100% !important;
    font-size: 0.7rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
    color: #fff !important;
    opacity: 0.9 !important;
    text-align: center !important;
    margin: 0 0 0.2rem !important;
    line-height: 1.2 !important;
  }

  .header #block-call-to-order a.call-phone-link,
  .header #block-call-to-order .call-phone a,
  .header #block-call-to-order .call-phone {
    display: block !important;
    font-size: 1.2rem !important;
    font-weight: 700 !important;
    color: #fff !important;
    text-align: center !important;
    text-decoration: none !important;
    margin: 0 auto !important;
    white-space: nowrap !important;
    line-height: 1.25 !important;
    letter-spacing: 0.01em !important;
  }

  /* Cart sits next to contact — JD style */
  .header .header-right-wrap .cart-block,
  .header .header-right-wrap .block-commerce-cart,
  .header .header-element .cart-block-wrap,
  .header .header-right-wrap .cart--cart-block {
    display: flex !important;
    align-items: center !important;
    margin: 0 !important;
  }

  .header .header-element {
    position: static !important;
    display: flex !important;
    align-items: center !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .header .header-element .navbar-toggler {
    display: none !important; /* desktop: horizontal menu */
  }

  /* ---- Desktop primary nav bar (JD big pills → CY green) ----
   * Live JD desktop (reference layout site): dark purple bar, LARGE pills
   * pad ~11px 18px, min-height 44px, border 2px solid #000, radius 10px,
   * gap ~7–9px, flex-start, ul pad ~8px 14px. Map purple→CY green.
   * Homepage + city pages. (Mobile keeps its own green pill treatment.) */
  .header-menu,
  .header-menu .nav-menu,
  .navbar.nav-menu,
  .primary-menu,
  #main-menu.primary-menu,
  #main-menu.navbar-collapse,
  #main-menu.col-md-12,
  #main-menu.main-menu {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    background: #3b0a5c !important; /* JD bar #3b0a5c → CY dark green */
    background-color: #3b0a5c !important;
    margin: 0 !important;
    padding: 0 !important;
    box-shadow: none !important;
    border: 0 !important;
    float: none !important;
    position: relative !important;
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
  }

  .header-menu .nav-menu:before {
    display: none !important;
  }

  /* Desktop menu is always "open" (not hamburger) */
  #main-menu.collapse,
  #main-menu.navbar-collapse.collapse,
  #main-menu.navbar-collapse {
    display: block !important;
    height: auto !important;
    visibility: visible !important;
    opacity: 1 !important;
    overflow: visible !important;
  }

  /*
   * JD pill row: center-aligned, wrap, gap ~0.45rem 0.55rem,
   * container padding ~8px 14px, max-width content.
   */
  #main-menu .primary-menu,
  #main-menu .mega-menu,
  #main-menu .mega-menu > ul,
  #main-menu ul.nav.menu.menu-parent,
  #block-martis-main-menu ul.nav.menu.menu-parent,
  .header-menu ul.nav.menu.menu-parent,
  .header-menu .mega-menu > ul,
  .header-menu .nav-menu .mega-menu > ul,
  .primary-menu ul.nav.menu.menu-parent,
  .primary-menu .mega-menu > ul {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: center !important; /* JD: center pills on desktop */
    gap: 0.45rem 0.55rem !important; /* JD ~7.2px 8.8px */
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    padding: 0.5rem 0.85rem !important; /* JD ~8px 13.6px */
    min-height: 0 !important;
    background: transparent !important;
    background-color: transparent !important;
    list-style: none !important;
    box-sizing: border-box !important;
  }

  #main-menu li.menu-item,
  #block-martis-main-menu li.menu-item,
  .header-menu .mega-menu > ul > li,
  .header-menu .nav-menu .mega-menu > ul > li,
  ul.nav.menu.menu-parent > li.menu-item {
    display: flex !important;
    align-items: center !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    border-bottom: 0 !important;
    width: auto !important;
    float: none !important;
    position: relative !important;
    height: auto !important;
    min-height: 0 !important;
  }

  /*
   * Desktop nav links — BIG JD-style pills, CY green:
   * JD: pad 11.2px 18.4px, minH 44px, h~45px, fs 15.2px, br 10px,
   * border 2px solid #000, bg #6716aa / active #c9a0e8.
   * CY:  #b781e3 / active #c9a0e8.
   */
  #wrapper #main-menu a,
  #wrapper #main-menu .menu-item a,
  #wrapper #main-menu .mega-menu > ul > li > a,
  #wrapper #main-menu .main-menu .nav > li > a,
  #wrapper #block-martis-main-menu .menu-item a,
  #wrapper .header-menu ul.nav.menu.menu-parent > li.menu-item > a,
  #wrapper .header-menu .mega-menu > ul > li > a,
  #wrapper .header-menu .nav-menu .mega-menu > ul > li > a,
  #wrapper .primary-menu ul.nav.menu.menu-parent > li.menu-item > a,
  .header-menu .mega-menu > ul > li > a,
  .header-menu .nav-menu .mega-menu > ul > li > a,
  .primary-menu .main-menu .nav > li > a,
  .primary-menu .mega-menu > ul > li > a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    min-height: 2.75rem !important; /* ~44px JD */
    height: auto !important;
    padding: 0.7rem 1.15rem !important; /* ~11px 18px JD */
    margin: 0 !important;
    background: #b781e3 !important; /* JD #6716aa → CY mid green */
    background-color: #b781e3 !important;
    color: #ffffff !important;
    border: 2px solid #000000 !important;
    border-radius: 10px !important;
    box-shadow: none !important;
    text-align: center !important;
    text-decoration: none !important;
    font-weight: 600 !important;
    font-size: 0.95rem !important; /* ~15.2px JD */
    line-height: 1.25 !important;
    white-space: nowrap !important;
    box-sizing: border-box !important;
    opacity: 1 !important;
    letter-spacing: normal !important;
  }

  /* Active trail — lighter pill (JD #c9a0e8 → CY #c9a0e8) */
  #wrapper #main-menu .menu-item--active-trail > a,
  #wrapper #main-menu a.is-active,
  #wrapper #main-menu .mega-menu > ul > li > a.is-active,
  #wrapper #main-menu .mega-menu > ul > li.menu-item--active-trail > a,
  #wrapper #block-martis-main-menu .menu-item--active-trail > a,
  #wrapper #block-martis-main-menu a.is-active,
  #wrapper .header-menu ul.nav.menu.menu-parent > li.menu-item--active-trail > a,
  #wrapper .header-menu .mega-menu > ul > li.menu-item--active-trail > a,
  #wrapper .header-menu .nav-menu .mega-menu > ul > li.menu-item--active-trail > a {
    background: #c9a0e8 !important;
    background-color: #c9a0e8 !important;
    color: white !important;
    -webkit-text-fill-color: white !important;
    border: 2px solid #000000 !important;
    border-radius: 10px !important;
    font-weight: 700 !important;
  }

  #wrapper #main-menu a:hover,
  #wrapper #main-menu a:focus,
  #wrapper #main-menu .mega-menu > ul > li > a:hover,
  #wrapper #main-menu .mega-menu > ul > li > a:focus,
  #wrapper #block-martis-main-menu .menu-item a:hover,
  #wrapper .header-menu ul.nav.menu.menu-parent > li.menu-item > a:hover,
  #wrapper .header-menu .mega-menu > ul > li > a:hover,
  #wrapper .header-menu .nav-menu .mega-menu > ul > li > a:hover {
    background: #b781e3 !important;
    background-color: #b781e3 !important;
    color: #ffffff !important;
    border: 2px solid #000000 !important;
    border-radius: 10px !important;
    text-decoration: none !important;
  }
}


/* ==========================================================================
   SERVICE PAGES (node type: service) — JD layout, CY greens
   Shared content column aligned with pricing/blog gutters (~15px mobile).
   Overrides brittle custom_css rem hacks (23rem widths, -54.5rem mt, pb:22rem,
   overflow scroll on brag, stacked region/cards padding that narrows mobile).
   Applies to all published service nodes (city + generic).
   ========================================================================== */

body.page-node-type-service {
  /* Match blog/pricing container-wrap side pad (~15px) on mobile; 1rem desktop */
  --service-gutter: 0.95rem;
  --service-max: 1200px;
}

/* ---- Shared content column (twocol hero + body cards) ---- */
/* Outer node shell: full width of main column, NO side pad (children own gutter) */
body.page-node-type-service .node-type-service.node-content.service-node-content,
body.page-node-type-service .service-node-content {
  position: relative !important;
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  box-sizing: border-box !important;
}

/* Shared content column: single gutter on twocol + cards only */
body.page-node-type-service .layout.layout--twocol-section.layout--twocol-section--50-50.row,
body.page-node-type-service .layout.layout--twocol-section,
body.page-node-type-service .service-cards-wrapper,
body.page-node-type-service .service-page.service-cards-wrapper,
body.page-node-type-service .service-page,
body.page-node-type-service .block-field-blocknodeservicebody .service-cards-wrapper {
  position: relative !important;
  width: 100% !important;
  max-width: var(--service-max) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: var(--service-gutter) !important;
  padding-right: var(--service-gutter) !important;
  box-sizing: border-box !important;
}

/* Body field block: full width, no extra pad (cards wrapper owns gutter) */
body.page-node-type-service .block-field-blocknodeservicebody {
  position: relative !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0.5rem 0 1rem 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  box-sizing: border-box !important;
}

body.page-node-type-service .block-field-blocknodeservicebody > .container-wrap,
body.page-node-type-service .block-field-blocknodeservicebody .block-content {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Nested cards wrapper: only one horizontal gutter (on the wrapper itself) */
body.page-node-type-service .block-field-blocknodeservicebody .service-cards-wrapper,
body.page-node-type-service .service-cards-wrapper,
body.page-node-type-service .service-page.service-cards-wrapper,
body.page-node-type-service .service-page {
  margin-top: 0.75rem !important;
  margin-bottom: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  background: transparent !important;
}

/* Region shell: full width, NO nested side pad (children use --service-gutter) */
body.page-node-type-service .region-content,
body.page-node-type-service .region.region-content {
  max-width: 100% !important;
  width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  box-sizing: border-box !important;
}

/* Twocol layout specifics */
body.page-node-type-service .layout.layout--twocol-section.layout--twocol-section--50-50.row,
body.page-node-type-service .layout.layout--twocol-section {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: flex-start !important;
  margin-top: 0.5rem !important;
  margin-bottom: 1rem !important;
  gap: 0.75rem 1rem !important;
}

body.page-node-type-service .layout__region.layout__region--first,
body.page-node-type-service .layout__region.layout__region--second {
  position: relative !important;
  margin: 0 !important;
  padding: 0 !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

/* Kill custom_css block:last-child -50rem on service pages */
body.page-node-type-service .page-wrapper .main-content .block:last-child,
body.page-node-type-service .main-content .block:last-child,
body.page-node-type-service .region-content .block:last-child {
  margin-bottom: 0 !important;
}

/* ---- service-brag comparison table ---- */
body.page-node-type-service .service-brag,
body.page-node-type-service .layout__region.layout__region--second .service-brag,
body.page-node-type-service .layout__region--second .service-brag {
  display: block !important;
  position: relative !important;
  z-index: 5 !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 0 0.75rem 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
  float: none !important;
  overflow: visible !important;
}

/* No horizontal scroll — fit table to content column */
body.page-node-type-service .service-brag > .container-wrap,
body.page-node-type-service .service-brag .block-content,
body.page-node-type-service .node-type-service .service-brag .block-content,
body.page-node-type-service .node-content .service-brag .block-content {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow-x: hidden !important;
  overflow-y: visible !important;
  box-sizing: border-box !important;
}

body.page-node-type-service .service-brag table,
body.page-node-type-service .service-brag .jd-comparison-table,
body.page-node-type-service .service-brag .cy-comparison-table {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  table-layout: fixed !important;
  box-sizing: border-box !important;
}

body.page-node-type-service .service-brag table th,
body.page-node-type-service .service-brag table td,
body.page-node-type-service .service-brag .jd-comparison-table th,
body.page-node-type-service .service-brag .jd-comparison-table td {
  word-wrap: break-word !important;
  overflow-wrap: anywhere !important;
  hyphens: auto !important;
}

/* ---- Cards / summary / H1: same width column (kill custom 23rem offsets) ---- */
body.page-node-type-service .service-cards-wrapper > h1,
body.page-node-type-service .service-page > h1 {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0.65rem 0 1rem 0 !important;
  /* Roomier title padding (user request) */
  padding: 0.65rem 0.75rem !important;
  line-height: 1.3 !important;
  box-sizing: border-box !important;
}

body.page-node-type-service .service-cards-wrapper .summary-box,
body.page-node-type-service .service-cards-wrapper .main-grid,
body.page-node-type-service .service-cards-wrapper .card,
body.page-node-type-service .layout__region.layout__region--content .card {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  box-sizing: border-box !important;
}

body.page-node-type-service .service-cards-wrapper .summary-box,
body.page-node-type-service .service-cards-wrapper .card {
  margin-top: 0.65rem !important;
  margin-bottom: 0.85rem !important;
}

body.page-node-type-service .service-cards-wrapper .main-grid {
  margin-top: 0.35rem !important;
  margin-bottom: 0.5rem !important;
}

/* main-grid cards share full column on single-column (mobile) */
body.page-node-type-service .service-cards-wrapper .main-grid .card {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* ---- Teaser icon (circular badge) ---- */
body.page-node-type-service .service-teaser.block-field-blocknodeservicefield-teaser-icon,
body.page-node-type-service .block.block-layout-builder.block-field-blocknodeservicefield-teaser-icon,
body.page-node-type-service .block-field-blocknodeservicefield-teaser-icon {
  position: relative !important;
  display: block !important;
  width: auto !important;
  max-width: none !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  z-index: 6 !important;
  background: transparent !important;
  overflow: visible !important;
}

body.page-node-type-service .block-field-blocknodeservicefield-teaser-icon .container-wrap,
body.page-node-type-service .block-field-blocknodeservicefield-teaser-icon .block-content,
body.page-node-type-service .block-field-blocknodeservicefield-teaser-icon .field,
body.page-node-type-service .block-field-blocknodeservicefield-teaser-icon .field-item {
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  width: auto !important;
  max-width: none !important;
}

body.page-node-type-service .block-field-blocknodeservicefield-teaser-icon .field-label,
body.page-node-type-service .block-field-blocknodeservicefield-teaser-icon .field-label.visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

body.page-node-type-service .block-field-blocknodeservicefield-teaser-icon .field-field-teaser-icon > .field-label {
  display: none !important;
}

body.page-node-type-service .block.block-layout-builder.block-field-blocknodeservicefield-teaser-icon img,
body.page-node-type-service .block-field-blocknodeservicefield-teaser-icon img,
body.page-node-type-service .service-teaser img,
body.page-node-type-service .field-field-teaser-icon img,
body.page-node-type-service .field-field-media-image img {
  display: block !important;
  width: 120px !important;
  max-width: 120px !important;
  height: 120px !important;
  object-fit: cover !important;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 50% !important;
  border: 5px solid #000 !important;
  background-image: linear-gradient(204deg, #c9a0e8, #7b2cbf) !important;
  background-color: #b781e3 !important;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.28) !important;
  position: relative !important;
  z-index: 6 !important;
  left: 0rem !important;
  top: -10.5rem !important;
}

/* ---- Hero image block ---- */
body.page-node-type-service .block-field-blocknodeservicefield-image {
  position: relative !important;
  margin: 0 0 0.5rem 0 !important;
  padding: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  overflow: hidden !important;
  border-radius: 8px !important;
}

body.page-node-type-service .block-field-blocknodeservicefield-image img,
body.page-node-type-service .block-field-blocknodeservicefield-image picture,
body.page-node-type-service .block-field-blocknodeservicefield-image picture img {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  margin: 0 !important;
}

/* ---- Text BG overlay (CREATE / EXPERIENCES etc.) ---- */
body.page-node-type-service .block.block-layout-builder.block-field-blocknodeservicefield-text-bg,
body.page-node-type-service .block-field-blocknodeservicefield-text-bg,
body.page-node-type-service ._none.block.block-layout-builder.block-field-blocknodeservicefield-text-bg {
  position: absolute !important;
  left: 0.75rem !important;
  right: auto !important;
  bottom: 16rem !important;
  top: auto !important;
  width: 100% !important;
  max-width: calc(100% - 1.5rem) !important;
  margin: 0 !important;
  padding: 0 !important;
  z-index: 4 !important;
  background: transparent !important;
  pointer-events: none !important;
}

body.page-node-type-service .block-field-blocknodeservicefield-text-bg .field-label {
  display: none !important;
}

body.page-node-type-service .block-field-blocknodeservicefield-text-bg .field-item {
  display: block !important;
  color: #fff !important;
  font-weight: 800 !important;
  font-size: clamp(1.35rem, 3.2vw, 2.15rem) !important;
  line-height: 1.1 !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.55) !important;
  margin: 0 !important;
  padding: 0.15rem 0.65rem !important;
  border-radius: 10px !important;
  width: max-content !important;
  max-width: 100% !important;
}

body.page-node-type-service .block-field-blocknodeservicefield-text-bg .field-item + .field-item {
  margin-top: 0.35rem !important;
}

body.page-node-type-service .layout__region.layout__region--first {
  overflow: visible !important;
}

body.page-node-type-service .layout__region--first > .block-field-blocknodeservicefield-image {
  position: relative !important;
}

/* ==========================================================================
   DESKTOP service layout (≥992px)
   Two-column hero: image left | brag right; icon badge at column join.
   Cards column matches twocol outer width (same gutter / max).
   ========================================================================== */
@media (min-width: 992px) {
  body.page-node-type-service {
    --service-gutter: 1rem;
  }

  body.page-node-type-service .layout.layout--twocol-section.layout--twocol-section--50-50.row,
  body.page-node-type-service .layout.layout--twocol-section {
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    gap: 1rem 1.25rem !important;
    margin-top: -2.25rem !important;
    margin-bottom: 1rem !important;
  }

  body.page-node-type-service .layout__region.layout__region--first {
    flex: 1 1 48% !important;
    width: 48% !important;
    max-width: 50% !important;
  }

  body.page-node-type-service .layout__region.layout__region--second {
    flex: 1 1 48% !important;
    width: 48% !important;
    max-width: 50% !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    align-items: stretch !important;
  }

  body.page-node-type-service .layout__region--second .service-brag,
  body.page-node-type-service .service-brag {
    margin: 0 !important;
    padding: 0 !important;
    max-width: 100% !important;
    width: 100% !important;
  }

  body.page-node-type-service .layout__region--first {
    position: relative !important;
  }

  body.page-node-type-service .layout__region--first > .service-teaser.block-field-blocknodeservicefield-teaser-icon,
  body.page-node-type-service .layout__region--first > .block-field-blocknodeservicefield-teaser-icon {
    position: absolute !important;
    right: -3.5rem !important;
    left: auto !important;
    top: 43.5% !important;
    bottom: auto !important;
    transform: translateY(-50%) !important;
    width: 120px !important;
    height: 120px !important;
    margin: 0 !important;
    z-index: 8 !important;
  }

  body.page-node-type-service .block-field-blocknodeservicefield-teaser-icon img {
    width: 120px !important;
    height: 120px !important;
    margin: 0 !important;
  }

  body.page-node-type-service .layout__region--first > .block-field-blocknodeservicefield-image {
    position: relative !important;
    margin-bottom: 0 !important;
  }

  body.page-node-type-service .layout__region--first > .block-field-blocknodeservicefield-text-bg,
  body.page-node-type-service .block-field-blocknodeservicefield-text-bg {
    position: absolute !important;
    left: 1rem !important;
    bottom: 1.35rem !important;
    top: auto !important;
    margin: 0 !important;
    z-index: 5 !important;
  }

  body.page-node-type-service .layout__region--first > .block-field-blocknodeservicefield-text-bg {
    top: auto !important;
    bottom: 8% !important;
  }

  body.page-node-type-service .service-cards-wrapper,
  body.page-node-type-service .service-page.service-cards-wrapper,
  body.page-node-type-service .service-page {
    margin-top: 0.5rem !important;
    margin-bottom: 0 !important;
  }

  /* Slightly roomier H1 on desktop */
  body.page-node-type-service .service-cards-wrapper > h1,
  body.page-node-type-service .service-page > h1 {
    padding: 0.75rem 1rem !important;
    margin-bottom: 1.1rem !important;
  }
}

/* ==========================================================================
   TABLET / MOBILE service layout (<992px)
   Stack: image → icon → brag → cards. Match pricing/blog width (~15px gutter).
   ========================================================================== */
@media (max-width: 991.98px) {
  body.page-node-type-service {
    /* Same as blog/pricing .container-wrap pad (~15px) */
    --service-gutter: 0.95rem;
  }

  body.page-node-type-service .block.block-layout-builder.block-field-blocknodeservicefield-text-bg,
  body.page-node-type-service .block-field-blocknodeservicefield-text-bg,
  body.page-node-type-service ._none.block.block-layout-builder.block-field-blocknodeservicefield-text-bg {
    bottom: 6rem !important;
  }
  body.page-node-type-service .block.block-layout-builder.block-field-blocknodeservicefield-teaser-icon img, body.page-node-type-service .block-field-blocknodeservicefield-teaser-icon img, body.page-node-type-service .service-teaser img, body.page-node-type-service .field-field-teaser-icon img, body.page-node-type-service .field-field-media-image img {
    left: 7.5rem !important;
    top: -21.5rem !important;
  }
  /* Full-bleed main column so service content matches pricing/blog width.
     Scope to page content only — do not strip header .container padding. */
  body.page-node-type-service #page-wrapper > .container,
  body.page-node-type-service .page-wrapper > .container,
  body.page-node-type-service #main-content .container,
  body.page-node-type-service main#main-content .container {
    padding-left: 0 !important;
    padding-right: 0 !important;
    max-width: 100% !important;
    width: 100% !important;
  }

  body.page-node-type-service .row.content-layout {
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  body.page-node-type-service .col-md-9.left-content.main-content,
  body.page-node-type-service .left-content.main-content,
  body.page-node-type-service .main-content {
    flex: 0 0 100% !important;
    max-width: 100% !important;
    width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin: 0px;
  }

  body.page-node-type-service .region-content,
  body.page-node-type-service .region.region-content,
  body.page-node-type-service #block-martis-content--3,
  body.page-node-type-service .lc-main-content {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin: 0 !important;
  }
  .fontyourface.cyb-site-animate.page-node-265.path-node.page-node-type-service.page-automotive-services-auto-detailing .region-content,
  .fontyourface.cyb-site-animate.page-node-274.path-node.page-node-type-service.page-marine-and-rv-services-boat-detailing .region-content,
  .fontyourface.cyb-site-animate.page-node-600.path-node.page-node-type-service.page-houston-tx-automotive-services-motorcycle-detailing .region-content,
  .fontyourface.cyb-site-animate.page-node-601.path-node.page-node-type-service.page-jersey-village-tx-automotive-services-motorcycle-detailing.modal-open .region-content {
    margin-top: -2.5rem !important;
  }
  /* Onecol body layout: no extra region side pad from custom_css */
  body.page-node-type-service .row.layout.layout--onecol,
  body.page-node-type-service .layout.layout--onecol {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  body.page-node-type-service .row.layout.layout--onecol .layout__region,
  body.page-node-type-service .layout.layout--onecol .layout__region,
  body.page-node-type-service .layout__region.layout__region--content {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin: 0 !important;
  }

  body.page-node-type-service .layout.layout--twocol-section.layout--twocol-section--50-50.row,
  body.page-node-type-service .layout.layout--twocol-section {
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    gap: 0.65rem !important;
    margin-top: -5.5rem !important;
    margin-bottom: 0.75rem !important;
    max-width: 100% !important;
  }

  body.page-node-type-service .layout__region.layout__region--first,
  body.page-node-type-service .layout__region.layout__region--second {
    flex: 0 0 auto !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  body.page-node-type-service .block-field-blocknodeservicefield-image {
    margin: 0 0 0.35rem 0 !important;
    width: 100% !important;
  }

  body.page-node-type-service .layout__region--first {
    position: relative !important;
  }

  body.page-node-type-service .layout__region--first > .block-field-blocknodeservicefield-image {
    position: relative !important;
  }

  body.page-node-type-service .block-field-blocknodeservicefield-text-bg,
  body.page-node-type-service .layout__region--first > .block-field-blocknodeservicefield-text-bg {
    position: absolute !important;
    left: 0.65rem !important;
    bottom: 0.85rem !important;
    top: auto !important;
    margin: 0 !important;
    z-index: 5 !important;
  }

  body.page-node-type-service .block-field-blocknodeservicefield-text-bg .field-item {
    font-size: clamp(1.1rem, 5.5vw, 1.5rem) !important;
    padding: 0.2rem 0.55rem !important;
  }

  /* Icon: centered under image */
  body.page-node-type-service .layout__region--first > .service-teaser.block-field-blocknodeservicefield-teaser-icon,
  body.page-node-type-service .layout__region--first > .block-field-blocknodeservicefield-teaser-icon,
  body.page-node-type-service .block-field-blocknodeservicefield-teaser-icon {
    position: relative !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
    height: auto !important;
    margin: -2.5rem auto 0.35rem !important;
    transform: none !important;
    right: auto !important;
    left: auto !important;
    top: 50.5% !important;
    bottom: auto !important;
    z-index: 8 !important;
  }

  body.page-node-type-service .block-field-blocknodeservicefield-teaser-icon img {
    width: 96px !important;
    height: 96px !important;
    max-width: 96px !important;
    margin: 0 auto !important;
  }

  /* Brag: full shared column width, no scroll */
  body.page-node-type-service .service-brag,
  body.page-node-type-service .layout__region--second .service-brag,
  body.page-node-type-service .layout__region.layout__region--second .service-brag {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0.25rem 0 0.5rem 0 !important;
    padding: 0 !important;
    overflow: visible !important;
  }

  body.page-node-type-service .service-brag > .container-wrap,
  body.page-node-type-service .service-brag .block-content {
    overflow-x: hidden !important;
    overflow-y: visible !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  body.page-node-type-service .service-brag table,
  body.page-node-type-service .service-brag .jd-comparison-table,
  body.page-node-type-service .service-brag .cy-comparison-table {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    table-layout: fixed !important;
  }

  /* Slightly tighter cell type so full table fits without scroll */
  body.page-node-type-service .service-brag table th,
  body.page-node-type-service .service-brag table td,
  body.page-node-type-service .service-brag p {
    font-size: clamp(0.62rem, 2.7vw, 0.78rem) !important;
    line-height: 1.25 !important;
  }

  body.page-node-type-service .layout__region.layout__region--second {
    margin: 0 0 0.5rem 0 !important;
    padding: 0 !important;
    display: block !important;
    width: 100% !important;
  }

  /* Cards / summary / h1 — full shared column, aligned */
  body.page-node-type-service .service-cards-wrapper,
  body.page-node-type-service .service-page.service-cards-wrapper,
  body.page-node-type-service .service-page,
  body.page-node-type-service .block-field-blocknodeservicebody {
    max-width: 100% !important;
    width: 100% !important;
    margin: 0.35rem auto 0 !important;
  }

  body.page-node-type-service .block-field-blocknodeservicebody {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  body.page-node-type-service .service-cards-wrapper,
  body.page-node-type-service .service-page.service-cards-wrapper,
  body.page-node-type-service .service-page {
    padding-left: var(--service-gutter) !important;
    padding-right: var(--service-gutter) !important;
  }

  body.page-node-type-service .service-cards-wrapper > h1,
  body.page-node-type-service .service-page > h1 {
    padding: 0.75rem 0.5rem !important;
    margin: 0.5rem 0 0.9rem 0 !important;
  }

  body.page-node-type-service .service-cards-wrapper .summary-box,
  body.page-node-type-service .service-cards-wrapper .card,
  body.page-node-type-service .service-cards-wrapper .main-grid,
  body.page-node-type-service .service-cards-wrapper .main-grid .card {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  /* Override per-node inline @media 640 padding that was too tight */
  body.page-node-type-service .service-cards-wrapper {
    padding-top: 0.35rem !important;
    padding-bottom: 0.35rem !important;
  }

  body.page-node-type-service .field.field-field-text-bg,
  body.page-node-type-service ._none.block.block-layout-builder.block-field-blocknodeservicefield-text-bg {
    margin-top: 0 !important;
    margin-bottom: -4rem !important;
  }
}

/* Extra-small: slightly smaller icon; keep full shared width */
@media (max-width: 575.98px) {
  body.page-node-type-service {
    --service-gutter: 0.85rem;
  }

  body.page-node-type-service .block-field-blocknodeservicefield-teaser-icon img {
    width: 84px !important;
    height: 84px !important;
    max-width: 84px !important;
    border-width: 4px !important;
  }

  body.page-node-type-service .layout__region--first > .block-field-blocknodeservicefield-teaser-icon {
    margin-top: -2rem !important;
  }

  body.page-node-type-service .service-cards-wrapper > h1,
  body.page-node-type-service .service-page > h1 {
    padding: 0.7rem 0.4rem !important;
  }
}

/* ---- First region stacking: image + text-bg share one cell; icon below ---- */
body.page-node-type-service .layout__region.layout__region--first {
  display: grid !important;
  grid-template-columns: 1fr !important;
  grid-template-rows: auto auto !important;
  grid-template-areas:
    "hero"
    "icon" !important;
  align-items: start !important;
  gap: 0 !important;
}

body.page-node-type-service .layout__region--first > .block-field-blocknodeservicefield-image {
  grid-area: hero !important;
  position: relative !important;
  z-index: 1 !important;
  margin: 0;
}

body.page-node-type-service .layout__region--first > .block-field-blocknodeservicefield-text-bg {
  grid-area: hero !important;
  position: relative !important;
  align-self: end !important;
  justify-self: start !important;
  z-index: 4 !important;
  margin: 0 0 1.1rem 0.85rem !important;
  bottom: auto !important;
  left: auto !important;
  top: auto !important;
  right: auto !important;
  transform: translateY(-0.25rem) !important;
  width: auto !important;
  max-width: calc(100% - 1.5rem) !important;
  pointer-events: none !important;
}

body.page-node-type-service .layout__region--first > .service-teaser.block-field-blocknodeservicefield-teaser-icon,
body.page-node-type-service .layout__region--first > .block-field-blocknodeservicefield-teaser-icon {
  grid-area: icon !important;
  position: relative !important;
  z-index: 6 !important;
}

@media (min-width: 992px) {
  body.page-node-type-service .layout__region--first > .service-teaser.block-field-blocknodeservicefield-teaser-icon,
  body.page-node-type-service .layout__region--first > .block-field-blocknodeservicefield-teaser-icon {
    grid-area: hero !important;
    position: absolute !important;
    right: -3.5rem !important;
    left: auto !important;
    top: 43.5% !important;
    bottom: auto !important;
    transform: translateY(-50%) !important;
    margin: 0 !important;
    width: 120px !important;
    height: 120px !important;
    display: block !important;
    justify-content: unset !important;
  }

  body.page-node-type-service .layout__region--first > .block-field-blocknodeservicefield-text-bg {
    margin: 0 0 1.25rem 1rem !important;
    transform: none !important;
  }

  body.page-node-type-service .layout__region--second .service-brag {
    height: 100% !important;
  }
}

@media (max-width: 991.98px) {
  body.page-node-type-service .layout__region--first > .service-teaser.block-field-blocknodeservicefield-teaser-icon,
  body.page-node-type-service .layout__region--first > .block-field-blocknodeservicefield-teaser-icon {
    grid-area: icon !important;
    position: relative !important;
    display: flex !important;
    justify-content: center !important;
    margin: -2.75rem 0 0.25rem 0 !important;
    transform: none !important;
    right: auto !important;
    top: 11rem !important;
    width: 100% !important;
    height: auto !important;
  }

  body.page-node-type-service .layout__region--first > .block-field-blocknodeservicefield-text-bg {
    margin: 0 0 0.85rem 0.65rem !important;
  }
}

/* ==========================================================================
   SERVICE PAGES — pricing instruction spacing under service cards
   Kill custom_css negative pulls so .nnc-pricing-instruction-container sits
   ~1rem below the last service card (desktop + mobile, all service nodes).
   Root cause: .layout--onecol margin-bottom:-64px + instruction margin-top:-1.5rem
   ========================================================================== */

/* Layout Builder onecol was pulling content-wide up into the cards */
body.page-node-type-service .row.layout.layout--onecol,
body.page-node-type-service .layout.layout--onecol,
body.page-node-type-service .node-content .row.layout.layout--onecol,
body.page-node-type-service .service-node-content .layout.layout--onecol {
  margin-bottom: 0 !important;
  margin-top: 0 !important;
  padding-bottom: 0 !important;
}

body.page-node-type-service .layout.layout--onecol > .layout__region,
body.page-node-type-service .layout.layout--onecol > .layout__region--content {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

body.page-node-type-service .service-cards-wrapper,
body.page-node-type-service .service-page.service-cards-wrapper,
body.page-node-type-service .service-page,
body.page-node-type-service .block-field-blocknodeservicebody {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

body.page-node-type-service .service-cards-wrapper > .card:last-child,
body.page-node-type-service .service-cards-wrapper .main-grid .card:last-child,
body.page-node-type-service .service-cards-wrapper > *:last-child {
  margin-bottom: 0 !important;
}

body.page-node-type-service .region-content,
body.page-node-type-service .region.region-content,
body.page-node-type-service .lc-main-content.block-system-main-block,
body.page-node-type-service #block-martis-content--3,
body.page-node-type-service .col-md-9.left-content.main-content,
body.page-node-type-service .left-content.main-content {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

/* Pricing region flush under main; 1rem comes from instruction margin-top */
body.page-node-type-service #content-wide,
body.page-node-type-service .content-wide#content-wide,
body.page-node-type-service .page-wrapper #content-wide,
body.page-node-type-service .region.region-content-wide,
body.page-node-type-service #content-wide .region.region-content-wide {
  margin-top: 0 !important;
  padding-top: 0 !important;
  clear: both !important;
}

body.page-node-type-service [id*="pricingpackages"],
body.page-node-type-service [id*="pricingpackage"],
body.page-node-type-service [id^="block-martis-customblocktoaddpricing"],
body.page-node-type-service [id^="block-martis-pricingpackages"] {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0.5rem !important;
  position: relative !important;
  top: auto !important;
  transform: none !important;
}

body.page-node-type-service .nnc-pricing-container {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

body.page-node-type-service .nnc-pricing-instruction-container,
body.page-node-type-service [id*="pricing"] .nnc-pricing-instruction-container,
body.page-node-type-service [id*="pricingpackages"] .nnc-pricing-instruction-container {
  margin-top: 1rem !important;
  margin-bottom: 1.25rem !important;
  position: relative !important;
  top: auto !important;
  transform: none !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

body.page-node-type-service .nnc-pricing-instruction-container .nnc-pricing-menu-heading,
body.page-node-type-service .nnc-pricing-menu-heading {
  scale: 1 !important;
  transform: none !important;
  max-width: 100% !important;
  overflow: visible !important;
}

@media (max-width: 991.98px) {
  body.page-node-type-service .row.layout.layout--onecol,
  body.page-node-type-service .layout.layout--onecol {
    margin-bottom: 0 !important;
  }

  body.page-node-type-service #content-wide,
  body.page-node-type-service .region.region-content-wide,
  body.page-node-type-service #content-wide .region.region-content-wide {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }

  /* Slightly larger gap on mobile so instruction text is fully visible */
  body.page-node-type-service .nnc-pricing-instruction-container,
  body.page-node-type-service [id*="pricing"] .nnc-pricing-instruction-container,
  body.page-node-type-service [id*="pricingpackages"] .nnc-pricing-instruction-container {
    margin-top: 2.75rem !important;
    margin-bottom: 1.25rem !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    padding-left: 0.75rem !important;
    padding-right: 0.75rem !important;
  }

  body.page-node-type-service .nnc-pricing-instruction-container .nnc-pricing-menu-heading,
  body.page-node-type-service .nnc-pricing-menu-heading {
    scale: 1 !important;
    transform: none !important;
    font-size: clamp(1rem, 4.2vw, 1.25rem) !important;
    line-height: 1.3 !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 0 0.5rem 0 !important;
    padding: 0.25rem 0 !important;
    text-wrap: balance;
    overflow: visible !important;
  }

  body.page-node-type-service .nnc-pricing-container {
    margin-top: 0 !important;
    padding-top: 0.25rem !important;
    overflow: visible !important;
  }

  body.page-node-type-service [id*="pricingpackages"],
  body.page-node-type-service [id^="block-martis-customblocktoaddpricing"] {
    overflow: visible !important;
    padding-top: 0.25rem !important;
  }
}


/* Kill custom_css scale:2 on service flexslider images (overflows into blog title) */
body.page-node-type-service [id*="views-block-blog"] .flexslider .slides img,
body.page-node-type-service .flexslider .slides img,
body.page-node-type-service div#flexslider-1 .slides img {
  scale: 1 !important;
  transform: none !important;
  max-width: 100% !important;
  width: 100% !important;
  height: auto !important;
  max-height: none !important;
  margin: 0 !important;
  object-fit: contain !important; /* full image, not cropped (desktop + mobile) */
}

body.page-node-type-service [id*="views-block-blog"] .flexslider,
body.page-node-type-service [id*="views-block-blog"] .flexslider .slides,
body.page-node-type-service [id*="views-block-blog"] .flexslider .slides > li,
body.page-node-type-service [id*="views-block-blog"] .blog-post-teaser,
body.page-node-type-service [id*="views-block-blog"] .post-row,
body.page-node-type-service [id*="views-block-blog"] .post-image,
body.page-node-type-service [id*="views-block-blog"] .post-thumb {
  margin-top: 0 !important;
  transform: none !important;
  scale: 1 !important;
}

body.page-node-type-service [id*="views-block-blog"] .flexslider {
  overflow: hidden !important; /* contain slides; nav is absolute outside via overflow visible on parent */
}

body.page-node-type-service [id*="views-block-blog"] .block-content {
  overflow: visible !important;
}

/* Restore visible direction nav outside clipped viewport */
body.page-node-type-service [id*="views-block-blog"] .flexslider {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* ==========================================================================
   SERVICE PAGES — blog FlexSlider direction nav (flex-nav-prev / next)
   Default FlexSlider parks prev at left:-50px (off-canvas) until hover, and
   .flex-disabled uses opacity:0 + z-index:-1. Force visible, in-bounds arrows
   on service page blog blocks.
   ========================================================================== */
body.page-node-type-service .flexslider,
body.page-node-type-service [id*="views-block-blog"] .flexslider {
  position: relative !important;
  overflow: visible !important;
}

body.page-node-type-service .flexslider .flex-direction-nav,
body.page-node-type-service [id*="views-block-blog"] .flex-direction-nav {
  display: block !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  z-index: 20 !important;
}

body.page-node-type-service .flexslider .flex-direction-nav li,
body.page-node-type-service .flexslider .flex-nav-prev,
body.page-node-type-service .flexslider .flex-nav-next {
  display: block !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

body.page-node-type-service .flexslider .flex-direction-nav a,
body.page-node-type-service .flexslider .flex-direction-nav a.flex-prev,
body.page-node-type-service .flexslider .flex-direction-nav a.flex-next,
body.page-node-type-service .flexslider .flex-nav-prev a,
body.page-node-type-service .flexslider .flex-nav-next a {
  display: block !important;
  visibility: visible !important;
  opacity: 0.85 !important;
  width: 44px !important;
  height: 44px !important;
  margin: 3.75rem 0 0 !important;
  position: absolute !important;
  top: 50% !important;
  z-index: 30 !important;
  overflow: hidden !important;
  cursor: pointer !important;
  color: #fff !important;
  text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.55) !important;
  background: rgba(59, 10, 92, 0.85) !important;
  border: 2px solid #000 !important;
  border-radius: 50% !important;
  text-indent: -9999px !important;
  transition: opacity 0.2s ease, background 0.2s ease !important;
}

body.page-node-type-service .flexslider .flex-direction-nav a.flex-prev,
body.page-node-type-service .flexslider .flex-nav-prev a.flex-prev,
body.page-node-type-service .flexslider .flex-direction-nav .flex-prev {
  left: 10px !important;
  right: auto !important;
}

body.page-node-type-service .flexslider .flex-direction-nav a.flex-next,
body.page-node-type-service .flexslider .flex-nav-next a.flex-next,
body.page-node-type-service .flexslider .flex-direction-nav .flex-next {
  right: 10px !important;
  left: auto !important;
  text-align: center !important;
}

body.page-node-type-service .flexslider:hover .flex-direction-nav a.flex-prev,
body.page-node-type-service .flexslider:hover .flex-direction-nav a.flex-next {
  opacity: 1 !important;
  left: auto; /* reset hover override from library */
}

body.page-node-type-service .flexslider:hover .flex-direction-nav a.flex-prev {
  left: 10px !important;
}

body.page-node-type-service .flexslider:hover .flex-direction-nav a.flex-next {
  right: 10px !important;
  left: auto !important;
}

/* Icon glyphs via flexslider font */
body.page-node-type-service .flexslider .flex-direction-nav a:before,
body.page-node-type-service .flexslider .flex-direction-nav a.flex-prev:before,
body.page-node-type-service .flexslider .flex-direction-nav a.flex-next:before {
  display: block !important;
  font-family: "flexslider-icon" !important;
  font-size: 18px !important;
  line-height: 40px !important;
  text-indent: 0 !important;
  color: #fff !important;
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  top: 0 !important;
  text-align: center !important;
  width: 100% !important;
  margin: 0 !important;
}

body.page-node-type-service .flexslider .flex-direction-nav a.flex-prev:before {
  content: "\f001" !important; /* left chevron in flexslider-icon */
}

body.page-node-type-service .flexslider .flex-direction-nav a.flex-next:before {
  content: "\f002" !important;
}

/* Disabled still visible but muted (single-slide edge case) */
body.page-node-type-service .flexslider .flex-direction-nav a.flex-disabled,
body.page-node-type-service .flexslider .flex-direction-nav .flex-disabled {
  opacity: 0.35 !important;
  cursor: default !important;
  z-index: 30 !important;
  pointer-events: none !important;
}

@media (max-width: 991.98px) {
  body.page-node-type-service .flexslider .flex-direction-nav a,
  body.page-node-type-service .flexslider .flex-direction-nav a.flex-prev,
  body.page-node-type-service .flexslider .flex-direction-nav a.flex-next {
    width: 40px !important;
    height: 40px !important;
    margin-top: -20px !important;
    opacity: 0.9 !important;
  }

  body.page-node-type-service .flexslider .flex-direction-nav a.flex-prev {
    left: 6px !important;
  }

  body.page-node-type-service .flexslider .flex-direction-nav a.flex-next {
    right: 6px !important;
  }
}


/* ==========================================================================
   SERVICE PAGES — blog block title vs slider (mobile overlap)
   Force a real column stack so title and flexslider cannot share vertical space.
   Also kill custom_css negative title margins (-2rem / -6rem).
   ========================================================================== */
body.page-node-type-service [id*="views-block-blog"],
body.page-node-type-service [id^="block-martis-views-block-blog"] {
  display: block !important;
  margin-top: 0.75rem !important;
  margin-bottom: 1.25rem !important;
  overflow: visible !important;
  position: relative !important;
}

body.page-node-type-service [id*="views-block-blog"] > .container-wrap {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 0.85rem !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}

body.page-node-type-service [id*="views-block-blog"] .block-title-wrap {
  order: 1 !important;
  flex: 0 0 auto !important;
  float: none !important;
  clear: none !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 0 0.35rem 0 !important;
  position: relative !important;
  z-index: 2 !important;
  overflow: visible !important;
}

body.page-node-type-service [id*="views-block-blog"] .block-title-content {
  max-width: 100% !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.page-node-type-service .block-views .block-title,
body.page-node-type-service [id*="views-block-blog"] .block-title,
body.page-node-type-service [id*="views-block-blog"] h2.block-title {
  margin: 0 0 0.5rem 0 !important;
  padding: 0.25rem 0 0.35rem 0 !important;
  position: relative !important;
  z-index: 2 !important;
  line-height: 1.3 !important;
  float: none !important;
}

body.page-node-type-service [id*="views-block-blog"] .block-content {
  order: 2 !important;
  flex: 0 0 auto !important;
  float: none !important;
  clear: both !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  position: relative !important;
  z-index: 1 !important;
  overflow: visible !important;
}

body.page-node-type-service [id*="views-block-blog"] .views-element-container,
body.page-node-type-service [id*="views-block-blog"] .flexslider {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  position: relative !important;
  z-index: 1 !important;
  clear: both !important;
}

@media (max-width: 991.98px) {
  body.page-node-type-service [id*="views-block-blog"] > .container-wrap {
    gap: 1.1rem !important;
  }

  body.page-node-type-service [id*="views-block-blog"] .block-title-wrap {
    margin: 0 !important;
    padding-bottom: 0.5rem !important;
  }

  body.page-node-type-service .block-views .block-title,
  body.page-node-type-service [id*="views-block-blog"] .block-title,
  body.page-node-type-service [id*="views-block-blog"] h2.block-title {
    margin: 0 !important;
    padding-bottom: 0.4rem !important;
  }

  body.page-node-type-service [id*="views-block-blog"] .block-content,
  body.page-node-type-service [id*="views-block-blog"] .flexslider {
    margin-top: 0 !important;
  }
}

/* ==========================================================================
   SERVICE PAGES — tighten content-wide-top → twocol layout gap to ~1rem
   Empty post-content + empty Layout Builder onecol (bs-m-3) were adding ~50px
   before the hero twocol. Hide those and pin twocol margin-top to 1rem.
   ========================================================================== */
body.page-node-type-service #content-wide-top,
body.page-node-type-service .content-wide#content-wide-top,
body.page-node-type-service .region.region-content-wide-top {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

body.page-node-type-service .page-wrapper > .container,
body.page-node-type-service #page-wrapper > .container {
  margin-top: 1rem !important;
  padding-top: 0 !important;
}

body.page-node-type-service .row.content-layout,
body.page-node-type-service .col-md-9.left-content.main-content,
body.page-node-type-service .left-content.main-content {
  margin-top: -3.25rem !important;
  padding-top: 0 !important;
}

body.page-node-type-service .region-content,
body.page-node-type-service .region.region-content {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

body.page-node-type-service .node-type-service.node-content.service-node-content,
body.page-node-type-service .service-node-content {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* Empty chrome above hero (layout builder leftovers) */
body.page-node-type-service .service-node-content > .post-content:empty,
body.page-node-type-service .node-type-service > .post-content:empty,
body.page-node-type-service .service-node-content > .post-content:not(:has(*)) {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
}

/* Empty onecol regions with only empty basic blocks (not the body onecol) */
body.page-node-type-service .service-node-content > .layout--onecol:has(.block-content:empty):not(:has(.service-cards-wrapper)),
body.page-node-type-service .service-node-content > .row.layout.layout--onecol:has(.block-content:empty):not(:has(.service-cards-wrapper)) {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
}

/* Bootstrap utility leftovers on empty LB blocks */
body.page-node-type-service .service-node-content .bs-m-3.block:has(.block-content:empty),
body.page-node-type-service .service-node-content .bs-mb-2.block:has(.block-content:empty),
body.page-node-type-service .service-node-content .bs-pb-3.block:has(.block-content:empty) {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.page-node-type-service .layout.layout--twocol-section.layout--twocol-section--50-50.row,
body.page-node-type-service .layout.layout--twocol-section {
  margin-top: 0 !important;
  margin-bottom: 1rem !important;
}

body.page-node-type-service .layout.layout--twocol-section.layout--twocol-section--50-50.row {
  /* kill custom_css margin-bottom:-24rem / margin-top:-1.5rem/-3rem/-6rem */
  margin-bottom: 1rem !important;
}

@media (max-width: 991.98px) {
  body.page-node-type-service .layout.layout--twocol-section.layout--twocol-section--50-50.row,
  body.page-node-type-service .layout.layout--twocol-section {
    margin-top: 0 !important;
    margin-bottom: 0.75rem !important;
  }
}

@media (min-width: 992px) {
  body.page-node-type-service .layout.layout--twocol-section.layout--twocol-section--50-50.row,
  body.page-node-type-service .layout.layout--twocol-section {
    margin-top: 0 !important;
  }
}

/* ==========================================================================
   SERVICE PAGES — FINAL mobile blog title/slider separation + spacing polish
   Must load last: custom_css teaser margin-bottom:-4rem/-64px and flexslider
   overflow:visible were still allowing the slider to paint over the title.
   ========================================================================== */
body.page-node-type-service [id*="views-block-blog"] .flexslider,
body.page-node-type-service [id*="views-block-blog"] #flexslider-1,
body.page-node-type-service div#flexslider-1.flexslider {
  overflow: hidden !important;
  margin-top: 0 !important;
  margin-bottom: 1rem !important;
  position: relative !important;
  top: auto !important;
  transform: none !important;
}

body.page-node-type-service [id*="views-block-blog"] .blog-post-teaser,
body.page-node-type-service [id*="views-block-blog"] .blog-post-teaser.post-row,
body.page-node-type-service [id*="views-block-blog"] .post-row,
body.page-node-type-service .blog-post-teaser.post-row {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  transform: none !important;
  scale: 1 !important;
}

body.page-node-type-service [id*="views-block-blog"] .post-image,
body.page-node-type-service [id*="views-block-blog"] .post-thumb,
body.page-node-type-service [id*="views-block-blog"] .post-content-wrap,
body.page-node-type-service .flexslider .post-image,
body.page-node-type-service .flexslider .post-thumb {
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
  scale: 1 !important;
}

body.page-node-type-service [id*="views-block-blog"] .flexslider .slides img,
body.page-node-type-service .flexslider .slides img {
  scale: 1 !important;
  transform: none !important;
  margin: 0 !important;
  max-width: 100% !important;
  width: 100% !important;
  height: auto !important;
}

/* Keep direction nav clickable above clipped slides */
body.page-node-type-service [id*="views-block-blog"] .flex-direction-nav,
body.page-node-type-service [id*="views-block-blog"] .flex-direction-nav a {
  z-index: 40 !important;
}

@media (max-width: 991.98px) {
  body.page-node-type-service [id*="views-block-blog"] > .container-wrap {
    gap: 1.25rem !important;
  }

  body.page-node-type-service [id*="views-block-blog"] .block-title-wrap {
    margin-bottom: 0 !important;
    padding-bottom: 0.65rem !important;
  }

  body.page-node-type-service [id*="views-block-blog"] .flexslider {
    margin-top: 0.25rem !important;
  }

  /* Mobile pricing: ensure full heading clearance under last card */
  body.page-node-type-service .nnc-pricing-instruction-container,
  body.page-node-type-service [id*="pricingpackages"] .nnc-pricing-instruction-container {
    margin-top: 3rem !important;
    min-height: auto !important;
    height: auto !important;
  }

  body.page-node-type-service .nnc-pricing-instruction-container .nnc-pricing-menu-heading {
    position: relative !important;
    top: auto !important;
    display: block !important;
  }
}

/* Ensure ~1rem between content-wide-top and main/twocol */
body.page-node-type-service .page-wrapper > .container,
body.page-node-type-service #page-wrapper > .container {
  margin-top: 1rem !important;
}

/* ==========================================================================
   SERVICE PAGES — final spacing pass (2026-07-29)
   1) Blog: custom_css sets
      .region.region-content-wide div.views-element-container { margin-top:-4rem }
      which beats earlier blog rules on specificity and pulls the flexslider
      ~64px into the block title on mobile (measured gap ≈ -44 with 20px flex gap).
   2) Top gap: .page-wrapper { margin-top:-10px } + container 1rem → net 6px.
      Zero page-wrapper pull so container 1rem is a true 1rem under content-wide-top.
   3) Mobile pricing: keep larger clearance under service cards; no top clip.
   ========================================================================== */

/* --- (1) Kill content-wide views-element-container -4rem pull (blog slider) --- */
body.page-node-type-service .region.region-content-wide div.views-element-container,
body.page-node-type-service #content-wide .region.region-content-wide div.views-element-container,
body.page-node-type-service #content-wide div.views-element-container,
body.page-node-type-service .region.region-content-wide [id*="views-block-blog"],
body.page-node-type-service .region.region-content-wide [id*="views-block-blog"] .views-element-container,
body.page-node-type-service [id*="views-block-blog"] .block-content .views-element-container,
body.page-node-type-service [id*="views-block-blog"] .views-element-container {
  margin-top: 0 !important;
  top: auto !important;
  transform: none !important;
}

/* Blog title stays above slider; extra mobile breathing room */
body.page-node-type-service [id*="views-block-blog"] > .container-wrap {
  display: flex !important;
  flex-direction: column !important;
  gap: 1rem !important;
  row-gap: 1rem !important;
}

body.page-node-type-service [id*="views-block-blog"] .block-title-wrap,
body.page-node-type-service [id*="views-block-blog"] .block-title,
body.page-node-type-service [id*="views-block-blog"] h2.block-title,
body.page-node-type-service .block-views .block-title {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  transform: none !important;
  scale: 1 !important;
}

body.page-node-type-service [id*="views-block-blog"] .block-content,
body.page-node-type-service [id*="views-block-blog"] .flexslider {
  margin-top: 0 !important;
  position: relative !important;
  top: auto !important;
}

@media (max-width: 991.98px) {
  body.page-node-type-service [id*="views-block-blog"] > .container-wrap {
    gap: 1.35rem !important;
    row-gap: 1.35rem !important;
  }

  body.page-node-type-service [id*="views-block-blog"] .block-title-wrap {
    padding-bottom: 0.35rem !important;
    margin-bottom: 0 !important;
  }

  body.page-node-type-service [id*="views-block-blog"] .block-content,
  body.page-node-type-service [id*="views-block-blog"] .views-element-container,
  body.page-node-type-service [id*="views-block-blog"] .flexslider {
    margin-top: 0.15rem !important;
  }

  /* --- (3) Mobile pricing instruction: slightly larger gap, no top clip --- */
  body.page-node-type-service .nnc-pricing-instruction-container,
  body.page-node-type-service [id*="pricing"] .nnc-pricing-instruction-container,
  body.page-node-type-service [id*="pricingpackages"] .nnc-pricing-instruction-container,
  body.page-node-type-service #content-wide .nnc-pricing-instruction-container {
    margin-top: 2.5rem !important;
    margin-bottom: 1.25rem !important;
    padding-top: 0.35rem !important;
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
    transform: none !important;
    top: auto !important;
  }

  body.page-node-type-service .nnc-pricing-instruction-container .nnc-pricing-menu-heading,
  body.page-node-type-service .nnc-pricing-menu-heading,
  body.page-node-type-service #content-wide .nnc-pricing-menu-heading {
    scale: 1 !important;
    transform: none !important;
    overflow: visible !important;
    max-height: none !important;
    position: relative !important;
    top: auto !important;
    display: block !important;
    padding-top: 0.15rem !important;
  }
}

/* --- (2) content-wide-top → twocol: true 1rem (kill page-wrapper -10px) --- */
body.page-node-type-service #page-wrapper,
body.page-node-type-service .page-wrapper,
body.page-node-type-service section#page-wrapper.page-wrapper {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

body.page-node-type-service #content-wide-top,
body.page-node-type-service .content-wide#content-wide-top,
body.page-node-type-service .region.region-content-wide-top {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

body.page-node-type-service .page-wrapper > .container,
body.page-node-type-service #page-wrapper > .container {
  margin-top: 1rem !important;
  padding-top: 0 !important;
}

/* Keep twocol flush to the container top so the only gap is the 1rem above */
body.page-node-type-service .layout.layout--twocol-section.layout--twocol-section--50-50.row,
body.page-node-type-service .layout.layout--twocol-section {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

body.page-node-type-service .row.content-layout,
body.page-node-type-service .region-content,
body.page-node-type-service .service-node-content,
body.page-node-type-service .node-type-service.node-content {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* ==========================================================================
   SERVICE PAGES — pricing + blog tighten & center (2026-07-29 pass 2)
   - Mobile pricing: max 1rem from last card to instruction/tabs (was ~2.5–3rem)
   - Blog title: less space above (desktop+mobile) and slightly less below (mobile)
   - Blog block + title: center horizontally (was left-pinned in full-width region)
   ========================================================================== */

/* Kill residual space after last service card before content-wide/pricing.
   Separate rules (no :has() list) so one invalid selector cannot drop the set. */
body.page-node-type-service div.service-cards-wrapper,
body.page-node-type-service .service-cards-wrapper.service-cards-wrapper,
body.page-node-type-service .service-page.service-cards-wrapper,
body.page-node-type-service .service-page,
body.page-node-type-service .block-field-blocknodeservicebody,
body.page-node-type-service .block-field-blocknodeservicebody > .container-wrap {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

body.page-node-type-service .layout.layout--onecol,
body.page-node-type-service .row.layout.layout--onecol {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

body.page-node-type-service .col-md-9.left-content.main-content,
body.page-node-type-service .left-content.main-content,
body.page-node-type-service .region-content,
body.page-node-type-service #page-wrapper,
body.page-node-type-service .page-wrapper {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

/* --- Pricing instruction: 1rem max above, tight below to tabs/buttons --- */
body.page-node-type-service .nnc-pricing-instruction-container,
body.page-node-type-service [id*="pricing"] .nnc-pricing-instruction-container,
body.page-node-type-service [id*="pricingpackages"] .nnc-pricing-instruction-container,
body.page-node-type-service #content-wide .nnc-pricing-instruction-container {
  margin-top: 1rem !important;
  margin-bottom: 0.5rem !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

body.page-node-type-service .nnc-pricing-instruction-container .nnc-pricing-menu-heading,
body.page-node-type-service .nnc-pricing-menu-heading,
body.page-node-type-service #content-wide .nnc-pricing-menu-heading {
  margin: 0 0 0.35rem 0 !important;
  padding: 0 !important;
}

body.page-node-type-service .nnc-pricing-container,
body.page-node-type-service #content-wide .nnc-pricing-container {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

body.page-node-type-service .nnc-tabs,
body.page-node-type-service .nnc-tabs.w-tabs,
body.page-node-type-service .nnc-tabs-menu,
body.page-node-type-service .nnc-pricing-instruction-container + .nnc-tabs {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

@media (max-width: 991.98px) {
  body.page-node-type-service .nnc-pricing-instruction-container,
  body.page-node-type-service [id*="pricing"] .nnc-pricing-instruction-container,
  body.page-node-type-service [id*="pricingpackages"] .nnc-pricing-instruction-container,
  body.page-node-type-service #content-wide .nnc-pricing-instruction-container {
    margin-top: 1rem !important;
    margin-bottom: 0.5rem !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    padding-left: 0.5rem !important;
    padding-right: 0.5rem !important;
  }

  body.page-node-type-service .nnc-pricing-instruction-container .nnc-pricing-menu-heading,
  body.page-node-type-service .nnc-pricing-menu-heading {
    margin: 0 0 0.25rem 0 !important;
    padding: 0 !important;
    font-size: clamp(0.95rem, 4vw, 1.15rem) !important;
    line-height: 1.25 !important;
  }

  body.page-node-type-service [id*="pricingpackages"],
  body.page-node-type-service [id^="block-martis-customblocktoaddpricing"] {
    padding-top: 0 !important;
  }
}

/* --- Blog block: center title + slider; tighten vertical spacing --- */
body.page-node-type-service .region.region-content-wide [id*="views-block-blog"],
body.page-node-type-service #content-wide [id*="views-block-blog"],
body.page-node-type-service [id*="views-block-blog"],
body.page-node-type-service [id^="block-martis-views-block-blog"] {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  width: 100% !important;
  max-width: 100% !important;
  margin-top: 0 !important;
  margin-bottom: 1rem !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  box-sizing: border-box !important;
  text-align: center !important;
}

body.page-node-type-service [id*="views-block-blog"] > .container-wrap {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  width: 100% !important;
  max-width: 1220px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding: 0 !important;
  gap: 0.5rem !important;
  row-gap: 0.5rem !important;
  box-sizing: border-box !important;
}

body.page-node-type-service [id*="views-block-blog"] .block-title-wrap {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  width: 100% !important;
  max-width: 1220px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  text-align: center !important;
  float: none !important;
}

body.page-node-type-service [id*="views-block-blog"] .block-title-content {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  padding: 0 !important;
  text-align: center !important;
}

body.page-node-type-service [id*="views-block-blog"] .block-title,
body.page-node-type-service [id*="views-block-blog"] h2.block-title,
body.page-node-type-service .block-views .block-title,
body.page-node-type-service .region.region-content-wide [id*="views-block-blog"] h2.block-title,
body.page-node-type-service .region.region-content-wide div.views-element-container h2 {
  margin: 0 auto !important;
  padding: 0 !important;
  text-align: center !important;
  width: 100% !important;
  max-width: 100% !important;
  float: none !important;
}

body.page-node-type-service [id*="views-block-blog"] .block-content,
body.page-node-type-service [id*="views-block-blog"] .views-element-container,
body.page-node-type-service [id*="views-block-blog"] .flexslider {
  width: 100% !important;
  max-width: 1220px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  box-sizing: border-box !important;
}

/* Kill content-wide block padding that adds space above blog title */
body.page-node-type-service #content-wide [id*="views-block-blog"].block,
body.page-node-type-service .region.region-content-wide [id*="views-block-blog"].block,
body.page-node-type-service .content-wide [id*="views-block-blog"] {
  padding-top: 0 !important;
  padding-bottom: 0.5rem !important;
}

/* Previous pricing block bottom pad was adding to blog title top gap */
body.page-node-type-service #content-wide [id*="pricingpackages"],
body.page-node-type-service #content-wide [id^="block-martis-customblocktoaddpricing"],
body.page-node-type-service .region.region-content-wide [id*="pricingpackages"],
body.page-node-type-service .region.region-content-wide [id^="block-martis-customblocktoaddpricing"] {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

@media (max-width: 991.98px) {
  /* Pull blog title up under pricing: kill residual package bottom pad */
  body.page-node-type-service .nnc-pricing-container,
  body.page-node-type-service #content-wide .nnc-pricing-container,
  body.page-node-type-service [id*="pricingpackages"] .nnc-pricing-container,
  body.page-node-type-service [id^="block-martis-customblocktoaddpricing"] .nnc-pricing-container {
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
  }

  body.page-node-type-service #content-wide [id*="pricingpackages"],
  body.page-node-type-service #content-wide [id^="block-martis-customblocktoaddpricing"],
  body.page-node-type-service .region.region-content-wide [id*="pricingpackages"],
  body.page-node-type-service .region.region-content-wide [id^="block-martis-customblocktoaddpricing"] {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
  }

  body.page-node-type-service .nnc-tabs,
  body.page-node-type-service .nnc-tabs.w-tabs,
  body.page-node-type-service .nnc-tab-content {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
  }

  /* Blog block: same side gutters as service cards/pricing (~0.95rem), full column width */
  body.page-node-type-service .region.region-content-wide [id*="views-block-blog"],
  body.page-node-type-service #content-wide [id*="views-block-blog"],
  body.page-node-type-service [id*="views-block-blog"],
  body.page-node-type-service [id^="block-martis-views-block-blog"] {
    margin-top: 0 !important;
    padding-top: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    align-items: stretch !important;
  }

  body.page-node-type-service [id*="views-block-blog"] > .container-wrap {
    gap: 0.5rem !important;
    row-gap: 0.5rem !important;
    width: 100% !important;
    max-width: 100% !important;
    /* Match .service-cards-wrapper mobile gutter so edges line up */
    padding-left: var(--service-gutter, 0.95rem) !important;
    padding-right: var(--service-gutter, 0.95rem) !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-top: 0 !important;
    align-items: stretch !important;
    box-sizing: border-box !important;
  }

  body.page-node-type-service [id*="views-block-blog"] .block-title-wrap {
    padding: 0 !important;
    margin: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    justify-content: center !important;
  }

  body.page-node-type-service [id*="views-block-blog"] .block-title,
  body.page-node-type-service [id*="views-block-blog"] h2.block-title,
  body.page-node-type-service .block-views .block-title {
    padding: 0 !important;
    margin: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    text-align: center !important;
  }

  body.page-node-type-service [id*="views-block-blog"] .block-content,
  body.page-node-type-service [id*="views-block-blog"] .views-element-container,
  body.page-node-type-service [id*="views-block-blog"] .flexslider {
    margin-top: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  body.page-node-type-service [id*="views-block-blog"] .blog-post-teaser,
  body.page-node-type-service [id*="views-block-blog"] .post-content-wrap,
  body.page-node-type-service [id*="views-block-blog"] .content-wrap,
  body.page-node-type-service [id*="views-block-blog"] .post-content {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
  }

  /* post-image stays slightly narrower but still centered in the same column */
  body.page-node-type-service [id*="views-block-blog"] .post-image {
    width: 92% !important;
    max-width: 92% !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
}

/* ==========================================================================
   SERVICE PAGES — blog teaser post-image / post-content polish
   - .post-content + .post-image: 2px solid black border
   - post-image slightly narrower than post-content, rounder corners
   - image → content gap ≤ 1rem (desktop + mobile)
   ========================================================================== */
body.page-node-type-service [id*="views-block-blog"] .blog-post-teaser,
body.page-node-type-service [id*="views-block-blog"] .blog-post-teaser.post-row {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  overflow: visible !important;
}

body.page-node-type-service [id*="views-block-blog"] .post-content-wrap {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  /* outer shell can stay light; borders live on image + post-content */
  border: 0 !important;
  background: transparent !important;
  overflow: visible !important;
  margin: 0 !important;
  padding: 0 !important;
  gap: 0 !important;
  row-gap: 0 !important;
  column-gap: 0 !important;
}

body.page-node-type-service [id*="views-block-blog"] .post-thumb,
body.page-node-type-service [id*="views-block-blog"] .post-media {
  display: flex !important;
  justify-content: center !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* post-content: full teaser width + black border */
body.page-node-type-service [id*="views-block-blog"] .post-content,
body.page-node-type-service [id*="views-block-blog"] .views-element-container .post-content,
body.page-node-type-service [id*="views-block-blog"] .content-wrap .post-content,
body.page-node-type-service .blog-post-teaser .post-content {
  border: 2px solid #000 !important;
  border-radius: 10px !important;
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding: 1rem 1.15rem !important;
}

body.page-node-type-service [id*="views-block-blog"] .content-wrap,
body.page-node-type-service [id*="views-block-blog"] .post-content-wrap > .content-wrap,
body.page-node-type-service .blog-post-teaser .content-wrap {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding: 0 !important;
  padding-top: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 0 !important;
  row-gap: 0 !important;
}

/* post-image: black border, slightly narrower than post-content, matching radius.
   Parent clips the photo so border-radius looks clean (no square corners peeking). */
body.page-node-type-service [id*="views-block-blog"] .post-image,
body.page-node-type-service [id*="views-block-blog"] .post-thumb .post-image,
body.page-node-type-service .blog-post-teaser .post-image {
  width: 92% !important;
  max-width: 92% !important;
  margin-top: 0.65rem !important;
  margin-left: auto !important;
  margin-right: auto !important;
  margin-bottom: -1.35rem !important; /* slight overlap into post-content */
  padding: 0 !important;
  border: 2px solid #000 !important;
  border-radius: 1rem !important;
  overflow: hidden !important; /* clip img to radius */
  height: auto !important;
  max-height: none !important;
  box-sizing: border-box !important;
  background: transparent !important;
  transform: none !important;
  scale: 1 !important;
  display: block !important;
  box-shadow: 0 3px 10px rgba(59, 10, 92, 0.14) !important;
}

body.page-node-type-service [id*="views-block-blog"] .post-image img,
body.page-node-type-service [id*="views-block-blog"] .post-image *,
body.page-node-type-service [id*="views-block-blog"] .flexslider .slides img,
body.page-node-type-service .blog-post-teaser .post-image img {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  max-height: none !important;
  object-fit: cover !important;
  object-position: center !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important; /* radius from .post-image overflow:hidden */
  scale: 1 !important;
  transform: none !important;
  box-shadow: none !important;
}

/* Kill custom_css negative image pulls that collapse image into content */
body.page-node-type-service [id*="views-block-blog"] .post-image,
body.page-node-type-service [id*="views-block-blog"] .post-thumb,
body.page-node-type-service [id*="views-block-blog"] .post-content-wrap .post-image {
  top: auto !important;
  position: relative !important;
}

@media (max-width: 991.98px) {
  body.page-node-type-service [id*="views-block-blog"] .post-image,
  body.page-node-type-service [id*="views-block-blog"] .post-thumb .post-image,
  body.page-node-type-service .blog-post-teaser .post-image {
    width: 90% !important;
    max-width: 90% !important;
    margin-top: 0.5rem !important;
    margin-bottom: -1.15rem !important; /* same overlap pattern as desktop */
    border: 2px solid #000 !important;
    border-radius: 0.9rem !important;
    overflow: hidden !important; /* clip photo to radius */
    background: transparent !important;
  }

  body.page-node-type-service [id*="views-block-blog"] .post-thumb,
  body.page-node-type-service [id*="views-block-blog"] .content-wrap {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  body.page-node-type-service [id*="views-block-blog"] .post-image img,
  body.page-node-type-service .blog-post-teaser .post-image img {
    max-height: none !important;
    height: auto !important;
    object-fit: cover !important;
    border: 0 !important;
    border-radius: 0 !important;
    scale: 1 !important;
    transform: none !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  body.page-node-type-service [id*="views-block-blog"] .post-content,
  body.page-node-type-service [id*="views-block-blog"] .views-element-container .post-content,
  body.page-node-type-service .blog-post-teaser .post-content {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    padding: 1.35rem 0.9rem 0.85rem !important;
    border: 2px solid #000 !important;
  }
}

/* ==========================================================================
   SERVICE PAGES — blog title pull-up + image/button overlap (no clip)
   Mobile: pull title tighter under pricing. Image slightly overlaps post-content
   (like read-more). Read-more stays overlapping content but fully visible
   (flexslider overflow:hidden was clipping ~12px of the button).
   ========================================================================== */

/* Image sits above content and overlaps it slightly */
body.page-node-type-service [id*="views-block-blog"] .post-thumb,
body.page-node-type-service [id*="views-block-blog"] .post-media {
  position: relative !important;
  z-index: 3 !important;
  margin-bottom: 0 !important;
  overflow: visible !important;
}

body.page-node-type-service [id*="views-block-blog"] .post-image,
body.page-node-type-service [id*="views-block-blog"] .post-thumb .post-image,
body.page-node-type-service .blog-post-teaser .post-image {
  position: relative !important;
  z-index: 3 !important;
  margin-top: 0.65rem !important;
  margin-bottom: -1.35rem !important; /* slight overlap into .post-content */
  margin-left: auto !important;
  margin-right: auto !important;
  overflow: hidden !important; /* keep border-radius clean on photo */
  height: auto !important;
  max-height: none !important;
  border: 2px solid #000 !important;
  border-radius: 1rem !important;
  background: transparent !important;
}

/* Desktop: same full image as mobile (scaled up, same position) */
@media (min-width: 992px) {
  body.page-node-type-service [id*="views-block-blog"] .post-image,
  body.page-node-type-service [id*="views-block-blog"] .post-thumb .post-image,
  body.page-node-type-service .blog-post-teaser .post-image {
    width: 92% !important;
    max-width: 92% !important;
    margin-top: 0.75rem !important;
    margin-bottom: -1.35rem !important;
    margin-left: auto !important;
    margin-right: auto !important;
    overflow: hidden !important;
    border-radius: 1rem !important;
  }

  body.page-node-type-service [id*="views-block-blog"] .post-image img,
  body.page-node-type-service [id*="views-block-blog"] .flexslider .slides img,
  body.page-node-type-service .blog-post-teaser .post-image img {
    height: auto !important;
    max-height: none !important;
    object-fit: cover !important;
    width: 100% !important;
    border: 0 !important;
    border-radius: 0 !important;
  }
}

body.page-node-type-service [id*="views-block-blog"] .content-wrap {
  position: relative !important;
  z-index: 1 !important;
  margin-top: 0 !important;
}

body.page-node-type-service [id*="views-block-blog"] .post-content,
body.page-node-type-service [id*="views-block-blog"] .views-element-container .post-content,
body.page-node-type-service .blog-post-teaser .post-content {
  position: relative !important;
  z-index: 1 !important;
  /* room under overlapping image so title text isn't hidden */
  padding-top: 1.75rem !important;
  /* restore normal bottom padding — do NOT lift the read-more */
  padding-bottom: 1rem !important;
  margin-bottom: 0 !important;
  overflow: visible !important;
}

/* Read More: keep original position (custom_css style), not pulled up.
   Slight hang below content via negative margin-bottom; overflow visible so no clip. */
body.page-node-type-service [id*="views-block-blog"] .post-link,
body.page-node-type-service .blog-post-teaser .post-link {
  position: relative !important;
  z-index: 5 !important;
  display: flex !important;
  justify-content: center !important;
  width: 100% !important;
  margin-top: 0 !important; /* was -1.35rem — user wants original lower placement */
  margin-bottom: -2rem !important; /* original hang-below overlap */
  padding-bottom: 0 !important;
  overflow: visible !important;
}

body.page-node-type-service [id*="views-block-blog"] .post-link .read-more,
body.page-node-type-service [id*="views-block-blog"] a.read-more,
body.page-node-type-service .blog-post-teaser .post-link .read-more {
  position: relative !important;
  z-index: 6 !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  width: 80% !important;
  max-width: 20rem !important;
  margin-top: 6px !important; /* original read-more top margin */
  margin-bottom: 0 !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
}

/* Stop flexslider from clipping the button when it hangs slightly below */
body.page-node-type-service [id*="views-block-blog"] .flexslider,
body.page-node-type-service [id*="views-block-blog"] #flexslider-1,
body.page-node-type-service [id*="views-block-blog"] .flex-viewport,
body.page-node-type-service [id*="views-block-blog"] .slides,
body.page-node-type-service [id*="views-block-blog"] .slides > li,
body.page-node-type-service [id*="views-block-blog"] .blog-post-teaser,
body.page-node-type-service [id*="views-block-blog"] .post-content-wrap {
  overflow: visible !important;
}

body.page-node-type-service [id*="views-block-blog"] .flexslider {
  padding-bottom: 0.75rem !important; /* small clearance only */
  margin-bottom: 0 !important;
  height: auto !important;
}

/* Tighten blog block bottom → "Want to customize a package?" block */
body.page-node-type-service .region.region-content-wide [id*="views-block-blog"],
body.page-node-type-service #content-wide [id*="views-block-blog"],
body.page-node-type-service [id*="views-block-blog"],
body.page-node-type-service [id^="block-martis-views-block-blog"] {
  margin-bottom: 0.35rem !important;
  padding-bottom: 0 !important;
}

body.page-node-type-service #content-wide [id*="views-block-blog"] + .block,
body.page-node-type-service .region.region-content-wide [id*="views-block-blog"] + .block,
body.page-node-type-service #block-rvdetailingblock,
body.page-node-type-service [id*="views-block-blog"] + [id*="detailing"],
body.page-node-type-service [id*="views-block-blog"] + [id*="customize"] {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* Direction nav still above slides */
body.page-node-type-service [id*="views-block-blog"] .flex-direction-nav,
body.page-node-type-service [id*="views-block-blog"] .flex-direction-nav a {
  z-index: 20 !important;
}

@media (max-width: 991.98px) {
  /* Slightly tighter again under pricing (iPhone) */
  body.page-node-type-service .region.region-content-wide [id*="views-block-blog"],
  body.page-node-type-service #content-wide [id*="views-block-blog"],
  body.page-node-type-service [id*="views-block-blog"],
  body.page-node-type-service [id^="block-martis-views-block-blog"] {
    margin-top: -1.2rem !important;
    margin-bottom: 0.25rem !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  body.page-node-type-service [id*="views-block-blog"] > .container-wrap {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    gap: 0.35rem !important;
    row-gap: 0.35rem !important;
  }

  body.page-node-type-service [id*="views-block-blog"] .post-image,
  body.page-node-type-service [id*="views-block-blog"] .post-thumb .post-image,
  body.page-node-type-service .blog-post-teaser .post-image {
    width: 90% !important;
    max-width: 90% !important;
    margin-top: 0.25rem !important;
    margin-bottom: -1.15rem !important; /* keep slight image→content overlap */
  }

  body.page-node-type-service [id*="views-block-blog"] .post-content,
  body.page-node-type-service .blog-post-teaser .post-content {
    padding-top: 1.5rem !important;
    padding-bottom: 0.85rem !important; /* original-ish bottom; no button lift */
  }

  /* Original read-more placement on mobile — do not pull up */
  body.page-node-type-service [id*="views-block-blog"] .post-link,
  body.page-node-type-service .blog-post-teaser .post-link {
    margin-top: 0 !important;
    margin-bottom: -2rem !important;
  }

  body.page-node-type-service [id*="views-block-blog"] .post-link .read-more,
  body.page-node-type-service .blog-post-teaser .post-link .read-more {
    margin-top: 6px !important;
  }

  body.page-node-type-service [id*="views-block-blog"] .flexslider {
    padding-bottom: 0.85rem !important;
    margin-bottom: 0 !important;
    overflow: visible !important;
  }

  body.page-node-type-service [id*="views-block-blog"] .blog-post-teaser,
  body.page-node-type-service [id*="views-block-blog"] .post-content-wrap {
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
    overflow: visible !important;
  }

  /* Tighten customize-package block after blog */
  body.page-node-type-service #content-wide [id*="views-block-blog"] + .block,
  body.page-node-type-service .region.region-content-wide [id*="views-block-blog"] + .block,
  body.page-node-type-service #block-rvdetailingblock {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }

  body.page-node-type-service .content-wide [id*="views-block-blog"] + .block .container-wrap,
  body.page-node-type-service #block-rvdetailingblock .container-wrap {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }
}

/* ==========================================================================
   BLOG PAGES (/blog listing + blog nodes) — match service-page blog teasers
   - 2px solid black on .post-content + .post-image
   - Image slightly narrower than content, centered over it
   - Full image visible; mobile column centered
   ========================================================================== */

/* Stack teaser so image centers over post-content (like service pages) */
body.path-blog .blog-post-teaser,
body.page-blog .blog-post-teaser,
body.page-node-type-blog .blog-post-teaser {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

body.path-blog .blog-post-teaser .post-content-wrap,
body.page-blog .blog-post-teaser .post-content-wrap,
body.page-node-type-blog .blog-post-teaser .post-content-wrap {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  border: 0 !important;
  background: transparent !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  padding: 0 !important;
  box-sizing: border-box !important;
  overflow: visible !important;
  gap: 0 !important;
}

body.path-blog .blog-post-teaser .post-content,
body.path-blog .blog-post-full .post-content,
body.path-blog article .post-content,
body.page-blog .blog-post-teaser .post-content,
body.page-blog .blog-post-full .post-content,
body.page-node-type-blog .blog-post-teaser .post-content,
body.page-node-type-blog .blog-post-full .post-content,
body.page-node-type-blog .post-content {
  border: 2px solid #000 !important;
  border-radius: 10px !important;
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  position: relative !important;
  z-index: 1 !important;
  /* space under overlapping image (service teaser style) */
  padding-top: 1.5rem !important;
}

/* Image: like service blog teasers — ~92% width, centered, slight drop + overlap */
body.path-blog .blog-post-teaser .post-thumb,
body.path-blog .blog-post-teaser .post-media,
body.page-blog .blog-post-teaser .post-thumb,
body.page-node-type-blog .post-thumb,
body.page-node-type-blog .post-media {
  display: flex !important;
  justify-content: center !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  height: auto !important;
  position: relative !important;
  z-index: 3 !important;
}

body.path-blog .blog-post-teaser .post-image,
body.path-blog .blog-post-full .post-image,
body.path-blog article .post-image,
body.page-blog .blog-post-teaser .post-image,
body.page-blog .blog-post-full .post-image,
body.page-node-type-blog .blog-post-teaser .post-image {
  border: 2px solid #000 !important;
  border-radius: 1.35rem !important;
  box-sizing: border-box !important;
  overflow: visible !important;
  width: 92% !important;
  max-width: 92% !important;
  height: auto !important;
  max-height: none !important;
  margin-top: 0.65rem !important; /* moved down a bit vs content */
  margin-bottom: -1.25rem !important; /* slight overlap into post-content */
  margin-left: auto !important;
  margin-right: auto !important;
  padding: 0 !important;
  position: relative !important;
  z-index: 3 !important;
  display: block !important;
}

body.path-blog .blog-post-teaser .content-wrap,
body.page-blog .blog-post-teaser .content-wrap,
body.page-node-type-blog .blog-post-teaser .content-wrap {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  padding: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
}

/* Full image visible: natural aspect ratio */
body.path-blog .post-image img,
body.page-blog .post-image img,
body.page-node-type-blog .post-image img,
body.path-blog .blog-post-teaser .post-image img,
body.page-node-type-blog .blog-post-teaser .post-image img {
  border: 0 !important;
  border-radius: 1.2rem !important;
  box-sizing: border-box !important;
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  max-height: none !important;
  object-fit: contain !important;
  object-position: center !important;
  scale: 1 !important;
  transform: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Desktop: same centered narrower image as service teasers */
@media (min-width: 992px) {
  body.path-blog .blog-post-teaser .post-image,
  body.page-blog .blog-post-teaser .post-image,
  body.page-node-type-blog .blog-post-teaser .post-image,
  body.page-node-type-blog .post-image {
    width: 100% !important;
    max-width: 100% !important;
    margin-top: 0.75rem !important;
    margin-bottom: -1.35rem !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  body.path-blog .blog-post-teaser .post-content,
  body.page-blog .blog-post-teaser .post-content,
  body.page-node-type-blog .post-content {
    padding-top: 1.75rem !important;
  }
}

/* Listing grid: stop teasers stacking into each other
   (custom_css: article.blog-post-teaser.post-row { margin-bottom: -4rem }) */
body.path-blog article.blog-post-teaser.post-row,
body.path-blog .blog-post-teaser.post-row,
body.path-blog .blog-post-teaser,
body.page-blog article.blog-post-teaser.post-row,
body.page-blog .blog-post-teaser.post-row,
body.page-blog .blog-post-teaser {
  margin-bottom: 0 !important;
  margin-top: 0 !important;
}

body.path-blog article.blog-post-teaser .post-link,
body.path-blog .blog-post-teaser .post-link,
body.page-blog .blog-post-teaser .post-link {
  /* hang button slightly, but do not pull the next teaser up */
  margin-bottom: 0 !important;
}

/* Shared item reset (mobile stack + desktop grid) */
body.path-blog .views-view-responsive-grid__item,
body.page-blog .views-view-responsive-grid__item,
body.path-blog .views-view-responsive-grid__item-inner,
body.page-blog .views-view-responsive-grid__item-inner {
  margin-bottom: 0 !important;
  margin-top: 0 !important;
  padding-bottom: 0 !important;
  box-sizing: border-box !important;
}

/* Desktop: horizontal multi-column grid (left→right, then next row).
   View is alignment:vertical (CSS columns); override to real CSS grid so
   cards read as a row grid instead of a single tall stack. */
@media (min-width: 992px) {
  body.path-blog .views-view-responsive-grid,
  body.page-blog .views-view-responsive-grid,
  body.path-blog .view-blog .views-view-responsive-grid {
    display: grid !important;
    /* Prefer up to 4 cols; min ~260px keeps teaser cards readable */
    grid-template-columns: repeat(
      auto-fill,
      minmax(min(100%, 260px), 1fr)
    ) !important;
    gap: 1.5rem !important;
    row-gap: 1.75rem !important;
    column-gap: 1.5rem !important;
    /* Kill vertical multi-column layout from views-responsive-grid--vertical */
    column-count: auto !important;
    column-width: auto !important;
    margin-bottom: 0 !important;
    margin-top: 0 !important;
  }

  body.path-blog .views-view-responsive-grid__item,
  body.page-blog .views-view-responsive-grid__item {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    break-inside: auto !important;
    page-break-inside: auto !important;
  }

  body.path-blog .views-view-responsive-grid__item > *,
  body.page-blog .views-view-responsive-grid__item > * {
    padding-bottom: 0 !important;
    break-inside: auto !important;
    page-break-inside: auto !important;
    height: 100% !important;
  }

  body.path-blog .views-view-responsive-grid__item-inner,
  body.page-blog .views-view-responsive-grid__item-inner {
    width: 100% !important;
    max-width: 100% !important;
    height: 100% !important;
  }

  body.path-blog .blog-post-teaser,
  body.page-blog .blog-post-teaser {
    width: 100% !important;
    max-width: 100% !important;
    height: 100% !important;
  }
}

/* Mobile: single-column stack — tighter gap between posts */
@media (max-width: 991.98px) {
  body.path-blog .views-view-responsive-grid,
  body.page-blog .views-view-responsive-grid,
  body.path-blog .view-blog .views-view-responsive-grid {
    display: flex !important;
    flex-direction: column !important;
    gap: 1rem !important;
    row-gap: 1rem !important;
    column-count: auto !important;
    column-width: auto !important;
    margin-bottom: 0 !important;
    margin-top: 0 !important;
  }

  body.path-blog .views-view-responsive-grid__item,
  body.page-blog .views-view-responsive-grid__item,
  body.path-blog .views-view-responsive-grid__item-inner,
  body.page-blog .views-view-responsive-grid__item-inner {
    width: 100% !important;
  }

  body.path-blog article.blog-post-teaser.post-row,
  body.path-blog .blog-post-teaser.post-row,
  body.path-blog .blog-post-teaser,
  body.page-blog .blog-post-teaser {
    margin-bottom: 0 !important;
    padding-bottom: 0.5rem !important; /* room for read-more hang without eating next card */
  }

  body.path-blog article.blog-post-teaser .post-link,
  body.path-blog .blog-post-teaser .post-link,
  body.page-blog .blog-post-teaser .post-link {
    margin-bottom: 0.15rem !important;
  }

  /* Symmetric page gutters so teasers aren't shoved right */
  body.path-blog .page-wrapper > .container,
  body.page-blog .page-wrapper > .container,
  body.page-node-type-blog .page-wrapper > .container {
    padding-left: 0.85rem !important;
    padding-right: 0.85rem !important;
    margin-left: auto !important;
    margin-right: auto !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  body.path-blog .row.content-layout,
  body.page-blog .row.content-layout,
  body.page-node-type-blog .row.content-layout {
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
  }

  body.path-blog .col-md-9.left-content.main-content,
  body.page-blog .col-md-9.left-content.main-content,
  body.page-node-type-blog .col-md-9.left-content.main-content,
  body.path-blog .region-content,
  body.page-blog .region-content {
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  body.path-blog .blog-post-teaser,
  body.page-blog .blog-post-teaser,
  body.page-node-type-blog .blog-post-teaser,
  body.path-blog .views-view-responsive-grid,
  body.path-blog .views-view-responsive-grid__item,
  body.path-blog .views-view-responsive-grid__item-inner {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    box-sizing: border-box !important;
  }

  body.path-blog .blog-post-teaser .post-image,
  body.page-blog .blog-post-teaser .post-image,
  body.page-node-type-blog .post-image {
    width: 100% !important;
    max-width: 100% !important;
    margin-top: 0.9rem !important; /* moved down a bit on mobile */
    margin-bottom: -1.15rem !important;
    margin-left: auto !important;
    margin-right: auto !important;
    border-radius: 1.15rem !important;
  }

  body.path-blog .blog-post-teaser .post-content,
  body.page-blog .blog-post-teaser .post-content,
  body.page-node-type-blog .post-content {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding: 1.35rem 0.85rem 0.85rem !important; /* extra top under overlapping image */
  }

  body.path-blog .post-image img,
  body.page-blog .post-image img,
  body.page-node-type-blog .post-image img {
    width: 100% !important;
    height: auto !important;
    max-height: none !important;
    object-fit: contain !important;
    scale: 1 !important;
    transform: none !important;
    border-radius: 1rem !important;
  }
}

/* ==========================================================================
   BLOG FULL POST + LISTING — Johnny Detail purple + white palette
   Keep existing class names (.post-body, .region.region-content, .field-body,
   .blog-post-teaser, .post-content, etc.). Late-loaded so it beats theme
   custom_css mid-green chips + blue links / white-on-light wrap.

   Palette (readable + engaging variety):
     Forest   #3b0a5c  — page title ink, deepest accents
     Brand    #6716aa  — h2 gradient end, strong, FAQ Q
     Mid      #7b2cbf  — h3 chips, link hover
     Leaf     #b781e3  — h4 chips, list left rail
     Mint     #c9a0e8  — soft accents / gradients
     Soft     #f3e8ff  — primary body paragraph chips
     Mist     #f5f0fa  — alternating body / near-white panels
     White    #ffffff  — list cards, meta pills
     Ink      #1a0a24  — body text (near-black green)
     Link     #5b21b6  — underlined links on light chips
   ========================================================================== */

/* --- Full node: base body --- */
body.page-node-type-blog .blog-post-full .post-body,
body.page-node-type-blog .post-body,
body.page-node-type-blog .post-body .field-body,
body.page-node-type-blog .post-body .field.field-body {
  color: #1a0a24 !important;
}

/* --- Body paragraphs: soft mint panels + deep ink (long-form readable) ---
   Left rail stays leaf/mint accent; top/right/bottom use soft mint (not heavy forest). */
body.page-node-type-blog .region.region-content .post-body p,
body.page-node-type-blog .region.region-content .field-body p,
body.page-node-type-blog .region.region-content .field.field-body p,
body.page-node-type-blog .region.region-content .blog-post-full p,
body.page-node-type-blog .post-body .field-body p,
body.page-node-type-blog .post-body .field.field-body p,
body.page-node-type-blog .post-body p,
body.page-node-type-blog .blog-post-full .post-body p {
  background-color: #fff !important;
  background: #fff !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  border-top: 1px solid #e9d5ff !important;
  border-right: 1px solid #e9d5ff !important;
  border-bottom: 1px solid #e9d5ff !important;
  border-left: 5px solid #c9a0e8 !important;
  border-radius: 8px !important;
  padding: 0.85rem 1.05rem !important;
  line-height: 1.7 !important;
  font-size: 1.02rem !important;
  margin-bottom: 0.95rem !important;
  box-shadow: 0 1px 0 rgba(59, 10, 92, 0.04) !important;
}

/* Subtle rhythm: every other body paragraph is near-white mist */
body.page-node-type-blog .post-body .field-body > p:nth-of-type(even),
body.page-node-type-blog .post-body .field.field-body > p:nth-of-type(even),
body.page-node-type-blog .blog-post-full .post-body .field-body > p:nth-of-type(even) {
  background-color: #fff !important;
  background: #fff !important;
  border-top-color: #c9a0e8 !important;
  border-right-color: #c9a0e8 !important;
  border-bottom-color: #c9a0e8 !important;
  border-left-color: #c9a0e8 !important;
}

/* Nested text in body paragraphs (not FAQ) */
body.page-node-type-blog .post-body .field-body > p,
body.page-node-type-blog .post-body .field-body > p span,
body.page-node-type-blog .post-body .field-body > p em,
body.page-node-type-blog .post-body .field-body > p cite,
body.page-node-type-blog .post-body .field.field-body > p span,
body.page-node-type-blog .post-body .field.field-body > p em,
body.page-node-type-blog .region.region-content .post-body .field-body p span,
body.page-node-type-blog .region.region-content .post-body .field-body p em,
body.page-node-type-blog .region.region-content .post-body .field-body p cite {
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
}

/* --- Headings: layered greens + white (visual hierarchy) --- */

/* h2 — forest→brand gradient, white type (primary section) */
body.page-node-type-blog .post-body h2,
body.page-node-type-blog .region.region-content .post-body h2,
body.page-node-type-blog .region.region-content .field-body h2 {
  background: linear-gradient(135deg, #3b0a5c 0%, #6716aa 55%, #7b2cbf 100%) !important;
  background-color: #3b0a5c !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  display: inline-block !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  padding: 0.55rem 1.05rem !important;
  border-radius: 8px !important;
  border: 2px solid #000 !important;
  font-weight: 800 !important;
  font-size: 1.28rem !important;
  line-height: 1.35 !important;
  margin-top: 2rem !important;
  margin-bottom: 0.9rem !important;
  box-shadow: 0 3px 10px rgba(59, 10, 92, 0.22) !important;
  letter-spacing: 0.01em !important;
}

/* h3 — solid brand mid green, white type */
body.page-node-type-blog .post-body h3,
body.page-node-type-blog .region.region-content .post-body h3,
body.page-node-type-blog .region.region-content .field-body h3 {
  background: #7b2cbf !important;
  background-color: #7b2cbf !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  display: inline-block !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  padding: 0.45rem 0.95rem !important;
  border-radius: 7px !important;
  border: 2px solid #000 !important;
  font-weight: 800 !important;
  font-size: 1.12rem !important;
  line-height: 1.35 !important;
  margin-top: 1.35rem !important;
  margin-bottom: 0.75rem !important;
  box-shadow: 0 2px 6px rgba(123, 44, 191, 0.2) !important;
}

/* h4 — mint leaf chip, deep forest text (light-on-soft contrast) */
body.page-node-type-blog .post-body h4,
body.page-node-type-blog .region.region-content .post-body h4,
body.page-node-type-blog .region.region-content .field-body h4,
body.page-node-type-blog .field-body h4 {
  background: #c9a0e8 !important;
  background-color: #c9a0e8 !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  display: inline-block !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  padding: 0.4rem 0.85rem !important;
  border-radius: 7px !important;
  border: 2px solid #3b0a5c !important;
  font-weight: 800 !important;
  font-size: 1.05rem !important;
  line-height: 1.35 !important;
  margin-top: 1.15rem !important;
  margin-bottom: 0.65rem !important;
}

body.page-node-type-blog .post-body h2 strong,
body.page-node-type-blog .post-body h2 *,
body.page-node-type-blog .post-body h3 strong,
body.page-node-type-blog .post-body h3 * {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

body.page-node-type-blog .post-body h4 strong,
body.page-node-type-blog .post-body h4 * {
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
}

/* --- Lists: white cards + leaf accent rail (contrast vs soft-green paragraphs) --- */
body.page-node-type-blog .post-body ul,
body.page-node-type-blog .post-body ol {
  padding-left: 0 !important;
  margin: 0.25rem 0 1.1rem !important;
  list-style-position: inside !important;
}

body.page-node-type-blog .post-body li,
body.page-node-type-blog .region.region-content .post-body li,
body.page-node-type-blog .post-body .field-body li {
  background-color: #ffffff !important;
  background: #ffffff !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  /* Soft mint outline + leaf left rail (avoid heavy forest box on all sides) */
  border-top: 1px solid #e9d5ff !important;
  border-right: 1px solid #e9d5ff !important;
  border-bottom: 1px solid #e9d5ff !important;
  border-left: 5px solid #b781e3 !important;
  border-radius: 8px !important;
  padding: 0.7rem 0.95rem !important;
  margin-bottom: 0.55rem !important;
  line-height: 1.65 !important;
  box-shadow: 0 1px 0 rgba(59, 10, 92, 0.04) !important;
}

/* Ordered list accent uses brand green rail */
body.page-node-type-blog .post-body ol > li {
  border-left-color: #6716aa !important;
}

body.page-node-type-blog .post-body li *,
body.page-node-type-blog .post-body li span,
body.page-node-type-blog .post-body li em {
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
}

body.page-node-type-blog .post-body li strong {
  color: #6716aa !important;
  -webkit-text-fill-color: #6716aa !important;
  font-weight: 800 !important;
}

/* --- Strong / emphasis --- */
body.page-node-type-blog .page-wrapper .post-body p strong,
body.page-node-type-blog .page-wrapper p strong,
body.page-node-type-blog .post-body p strong,
body.page-node-type-blog .post-body strong,
body.page-node-type-blog .region.region-content .post-body strong {
  color: #7b2cbf !important;
  -webkit-text-fill-color: #7b2cbf !important;
  font-weight: 800 !important;
}

/* --- Links: deep forest on light panels (not blue) --- */
body.page-node-type-blog .post-body a,
body.page-node-type-blog .region.region-content .post-body a,
body.page-node-type-blog .post-body p a,
body.page-node-type-blog .post-body li a {
  color: #5b21b6 !important;
  -webkit-text-fill-color: #5b21b6 !important;
  text-decoration: underline !important;
  text-decoration-color: #c9a0e8 !important;
  text-underline-offset: 2px !important;
  font-weight: 700 !important;
}

body.page-node-type-blog .post-body a:hover,
body.page-node-type-blog .post-body a:focus,
body.page-node-type-blog .region.region-content .post-body a:hover {
  color: #7b2cbf !important;
  -webkit-text-fill-color: #7b2cbf !important;
  text-decoration-color: #7b2cbf !important;
}

/* --- Blockquotes: mist panel + mint rail --- */
body.page-node-type-blog .post-body blockquote {
  background: linear-gradient(180deg, #f5f0fa 0%, #f3e8ff 100%) !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  border-top: 1px solid #e9d5ff !important;
  border-right: 1px solid #e9d5ff !important;
  border-bottom: 1px solid #e9d5ff !important;
  border-left: 6px solid #c9a0e8 !important;
  border-radius: 8px !important;
  padding: 0.95rem 1.1rem !important;
  margin: 0.25rem 0 1.1rem !important;
  font-style: italic !important;
}

body.page-node-type-blog .post-body blockquote * {
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
}

/* --- Code: deep forest + mint text --- */
body.page-node-type-blog .post-body pre,
body.page-node-type-blog .post-body code {
  background-color: #1a0a24 !important;
  color: #eafff3 !important;
  -webkit-text-fill-color: #eafff3 !important;
  border-radius: 5px !important;
}

body.page-node-type-blog .post-body pre {
  padding: 0.9rem 1.05rem !important;
  overflow-x: auto !important;
  border: 2px solid #6716aa !important;
}

body.page-node-type-blog .post-body p code,
body.page-node-type-blog .post-body li code {
  background-color: rgba(103, 22, 170, 0.12) !important;
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  padding: 0.12em 0.4em !important;
  border-radius: 4px !important;
}

/* --- FAQ accordion: forest Q + soft-green A (light borders — no heavy green bottom) --- */
body.page-node-type-blog .post-body .faq-accordion,
body.page-node-type-blog .post-body .faq-list,
body.page-node-type-blog .post-body dl.faq-list {
  border: 0 !important;
  border-bottom: 0 !important;
  box-shadow: none !important;
}

body.page-node-type-blog .post-body .faq-accordion dt,
body.page-node-type-blog .post-body .faq-accordion dt.faq-question,
body.page-node-type-blog .post-body dl.faq-list dt.faq-question {
  background: linear-gradient(135deg, #3b0a5c 0%, #6716aa 100%) !important;
  color: #ffffff !important;
  /* Thin neutral outline only — avoid stacked dark-green bottom bars */
  border: 1px solid rgba(0, 0, 0, 0.35) !important;
  border-bottom: 1px solid rgba(0, 0, 0, 0.35) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  margin-bottom: 0 !important;
}

body.page-node-type-blog .post-body .faq-accordion dt p,
body.page-node-type-blog .post-body .faq-accordion dt.faq-question p,
body.page-node-type-blog .post-body dl.faq-list dt.faq-question p,
body.page-node-type-blog .region.region-content .post-body .faq-accordion dt p,
body.page-node-type-blog .region.region-content .post-body .faq-accordion dt.faq-question p,
body.page-node-type-blog .post-body .faq-accordion dt p *,
body.page-node-type-blog .post-body .faq-accordion dt.faq-question p * {
  background: transparent !important;
  background-color: transparent !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  /* Kill body-paragraph chip borders (esp. dark-green bottom) on FAQ Q text */
  border: 0 !important;
  border-top: 0 !important;
  border-right: 0 !important;
  border-bottom: 0 !important;
  border-left: 0 !important;
  box-shadow: none !important;
  padding: 0.75rem 2.75rem 0.75rem 1rem !important;
  margin-bottom: 0 !important;
}

/* FAQ answer wrapper: even air above/below answer chip (not bottom-heavy) */
body.page-node-type-blog .post-body .faq-accordion dd,
body.page-node-type-blog .post-body .faq-accordion dd.faq-answer,
body.page-node-type-blog .post-body dl.faq-list dd.faq-answer {
  border: 0 !important;
  border-bottom: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  margin: 0 !important;
  /* Equal vertical rhythm: gap under Q ≈ gap before next Q */
  padding: 0.45rem 0 0.45rem !important;
}

/* Answer panel: soft fill + mint rail; even internal padding */
body.page-node-type-blog .post-body .faq-accordion dd.faq-answer p,
body.page-node-type-blog .post-body .faq-list .faq-answer p,
body.page-node-type-blog .post-body dl.faq-list dd.faq-answer p,
body.page-node-type-blog .region.region-content .post-body .faq-accordion dd.faq-answer p,
body.page-node-type-blog .region.region-content .post-body .faq-list .faq-answer p,
html body.page-node-type-blog .post-body .faq-accordion dd.faq-answer p {
  background: #f3e8ff !important;
  background-color: #f3e8ff !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  /* Soft outline (not heavy forest) + mint left accent */
  border-top: 1px solid #e9d5ff !important;
  border-right: 1px solid #e9d5ff !important;
  border-bottom: 1px solid #e9d5ff !important;
  border-left: 4px solid #c9a0e8 !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  /* Even padding all around (mobile inherits; no bottom-heavy margin) */
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding: 0.8rem 1rem !important;
  line-height: 1.6 !important;
  font-size: 1rem !important;
}

body.page-node-type-blog .post-body .faq-accordion .faq-answer p strong,
body.page-node-type-blog .post-body .faq-accordion dd.faq-answer p strong {
  color: #6716aa !important;
  -webkit-text-fill-color: #6716aa !important;
  border: 0 !important;
}

/* Space between FAQ items lives on the question (not uneven answer bottom) */
body.page-node-type-blog .post-body .faq-accordion dt,
body.page-node-type-blog .post-body .faq-accordion dt.faq-question,
body.page-node-type-blog .post-body dl.faq-list dt.faq-question {
  margin-top: 0.35rem !important;
}

/* --- Full-post title / meta --- */
body.page-node-type-blog .blog-post-full .post-title,
body.page-node-type-blog .post-header .post-title,
body.page-node-type-blog .post-title,
body.page-node-type-blog .post-title span {
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  text-shadow: none !important;
  font-weight: 800 !important;
}

body.page-node-type-blog .post-meta,
body.page-node-type-blog .post-meta .post-meta-item,
body.page-node-type-blog .post-meta a,
body.page-node-type-blog .post-meta i {
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
}

body.page-node-type-blog .post-meta .post-meta-item {
  background-color: #ffffff !important;
  border: 2px solid #3b0a5c !important;
  border-radius: 6px !important;
}

/* Full-post tags strip */
body.page-node-type-blog .post-tags {
  background: #f5f0fa !important;
  border: 2px solid #3b0a5c !important;
  border-radius: 8px !important;
  color: #1a0a24 !important;
}

body.page-node-type-blog .post-tags .field-item a,
body.page-node-type-blog .post-tags a {
  background: #ffffff !important;
  color: #6716aa !important;
  -webkit-text-fill-color: #6716aa !important;
  border: 2px solid #3b0a5c !important;
  border-radius: 999px !important;
  font-weight: 700 !important;
}

/* --- Blog listing teasers --- */
body.path-blog .blog-post-teaser .post-content-wrap,
body.page-blog .blog-post-teaser .post-content-wrap {
  background-color: transparent !important;
  background: transparent !important;
}

/* Teaser card: brand gradient, white copy */
body.path-blog .blog-post-teaser .post-content,
body.page-blog .blog-post-teaser .post-content,
body.path-blog article.blog-post-teaser .post-content {
  background: linear-gradient(160deg, #7b2cbf 0%, #6716aa 48%, #3b0a5c 100%) !important;
  background-color: #6716aa !important;
  color: #ffffff !important;
  border: 2px solid #000 !important;
  box-shadow: 0 4px 14px rgba(59, 10, 92, 0.18) !important;
}

body.path-blog .blog-post-teaser .post-content .post-title,
body.path-blog .blog-post-teaser .post-content .post-title a,
body.path-blog .blog-post-teaser .post-content .post-excerpt,
body.path-blog .blog-post-teaser .post-content .post-excerpt *,
body.path-blog .blog-post-teaser .post-content .post-excerpt .field-item,
body.page-blog .blog-post-teaser .post-content .post-title a {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.18) !important;
}

/* Meta pills: white chips, dark ink */
body.path-blog .blog-post-teaser .post-meta,
body.path-blog .blog-post-teaser .post-meta *,
body.path-blog .blog-post-teaser .post-meta-item,
body.path-blog .blog-post-teaser .post-meta-item *,
body.path-blog .blog-post-teaser .post-meta-item a,
body.path-blog .blog-post-teaser .post-meta-item i,
body.page-blog .blog-post-teaser .post-meta-item,
body.page-blog .blog-post-teaser .post-meta-item * {
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  text-shadow: none !important;
}

body.path-blog .blog-post-teaser .post-meta-item,
body.page-blog .blog-post-teaser .post-meta-item {
  background-color: #ffffff !important;
  border: 2px solid #3b0a5c !important;
  border-radius: 6px !important;
}

/* Read more: mint → forest gradient */
body.path-blog .blog-post-teaser .post-link .read-more,
body.page-blog .blog-post-teaser .post-link .read-more {
  background: linear-gradient(204deg, #c9a0e8 0%, #b781e3 45%, #6716aa 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border: 2px solid #000 !important;
  font-weight: 700 !important;
  box-shadow: 0 2px 6px rgba(59, 10, 92, 0.2) !important;
}

body.path-blog .blog-post-teaser .post-link .read-more:hover,
body.page-blog .blog-post-teaser .post-link .read-more:hover {
  background: linear-gradient(204deg, #e9d5ff 0%, #7b2cbf 55%, #3b0a5c 100%) !important;
  color: #ffffff !important;
}

/* Tags on listing */
body.path-blog .blog-post-teaser .post-tags,
body.path-blog .blog-post-teaser .post-tags * {
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
}

body.path-blog .blog-post-teaser .tags-list a {
  background: #ffffff !important;
  color: #6716aa !important;
  -webkit-text-fill-color: #6716aa !important;
  border: 1px solid #3b0a5c !important;
  border-radius: 999px !important;
  font-weight: 700 !important;
}

/* --- Mobile: same palette, slightly tighter spacing --- */
@media (max-width: 991.98px) {
  body.page-node-type-blog .post-body p,
  body.page-node-type-blog .region.region-content .post-body p,
  body.page-node-type-blog .post-body li {
    padding: 0.72rem 0.85rem !important;
    font-size: 0.98rem !important;
    line-height: 1.65 !important;
    /* Keep soft non-left borders on mobile cards */
    border-top-width: 1px !important;
    border-right-width: 1px !important;
    border-bottom-width: 1px !important;
  }

  body.page-node-type-blog .post-body h2 {
    font-size: 1.12rem !important;
    padding: 0.45rem 0.8rem !important;
    margin-top: 1.2rem !important;
  }

  body.page-node-type-blog .post-body h3 {
    font-size: 1.05rem !important;
    padding: 0.4rem 0.75rem !important;
  }

  body.page-node-type-blog .post-body h4 {
    font-size: 1rem !important;
  }

  body.path-blog .blog-post-teaser .post-content {
    background: linear-gradient(160deg, #7b2cbf 0%, #6716aa 50%, #3b0a5c 100%) !important;
    color: #ffffff !important;
  }

  /* FAQ answers mobile: even top/bottom air, no bottom-heavy stack */
  body.page-node-type-blog .post-body .faq-accordion dd,
  body.page-node-type-blog .post-body .faq-accordion dd.faq-answer,
  body.page-node-type-blog .post-body dl.faq-list dd.faq-answer {
    padding: 0.4rem 0 0.4rem !important;
    margin: 0 !important;
  }

  body.page-node-type-blog .post-body .faq-accordion dd.faq-answer p,
  body.page-node-type-blog .post-body .faq-list .faq-answer p,
  body.page-node-type-blog .post-body dl.faq-list dd.faq-answer p,
  body.page-node-type-blog .region.region-content .post-body .faq-accordion dd.faq-answer p {
    padding: 0.75rem 0.9rem !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    font-size: 0.96rem !important;
    line-height: 1.55 !important;
    border-top: 1px solid #e9d5ff !important;
    border-right: 1px solid #e9d5ff !important;
    border-bottom: 1px solid #e9d5ff !important;
    border-left: 4px solid #c9a0e8 !important;
  }

  body.page-node-type-blog .post-body .faq-accordion dt,
  body.page-node-type-blog .post-body .faq-accordion dt.faq-question {
    margin-top: 0.3rem !important;
  }

  body.page-node-type-blog .post-body .faq-accordion dt p,
  body.page-node-type-blog .post-body .faq-accordion dt.faq-question p {
    padding: 0.7rem 2.5rem 0.7rem 0.9rem !important;
  }
}

/* ==========================================================================
   Browse by Brand — full content width, multi-col grid
   Align L/R with content above; wider cards; mobile 2×N
   Block: #block-martis-views-block-product-categories-block-block-1 (+ --2)
   Appears on /products, brand/category taxonomy, product-related pages
   ========================================================================== */

/* Kill Bootstrap row gutters + justify-center that left empty side space
   and stacked mobile cards as a single centered column */






/* Slightly larger logo frame on wider cards (desktop default) — all product surfaces */


/* Mobile / tablet: 2-column brand grid, full content width gutters */
@media (max-width: 991.98px) {
  

  

  

  /* Logo scale for ~half-width mobile cards — all product surfaces */
  

  

  
}

/* Mid desktop: 3 cols when content is a bit tight */
@media (min-width: 992px) and (max-width: 1199.98px) {
  
}

/* ==========================================================================
   Taxonomy page H1 titles — even top/bottom gaps (match front page)
   City pages use frontpagetitle* blocks + breadcrumbs; product brand/category
   use commerce-content-h1. Beat custom_css #wrapper … margin-bottom:-1rem.
   ========================================================================== */

/* Breadcrumbs: tight, symmetric padding so they don't inflate only the top */
html body.path-taxonomy #wrapper #block-breadcrumbs,
html body.path-taxonomy #block-breadcrumbs,
html body.path-taxonomy .block-system-breadcrumb-block {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding-top: 0rem !important;
  padding-bottom: 0.5rem !important;
}

html body.path-taxonomy #wrapper #block-breadcrumbs .breadcrumb,
html body.path-taxonomy #block-breadcrumbs .breadcrumb,
html body.path-taxonomy .breadcrumb {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding-top: 0rem !important;
  padding-bottom: 0.35rem !important;
}

html body.path-taxonomy .breadcrumb ul {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* City / service-area title blocks (frontpagetitle* / pagetitle*) */
html body.path-taxonomy #wrapper [id*="frontpagetitle"],
html body.path-taxonomy #wrapper [id*="pagetitle"],
html body.path-taxonomy #wrapper #content-wide-top [id*="frontpagetitle"],
html body.path-taxonomy #wrapper #content-wide-top [id*="pagetitle"] {
  margin-top: 0.75rem !important;
  margin-bottom: 0.75rem !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/*
 * H1 badge — equal air above and below.
 * Specificity must beat:
 *   #wrapper #content-wide-top .block-block-content .field-item > h1 { margin-bottom:-1rem }
 *   .path-taxonomy .row.layout.layout--onecol h1 { margin-bottom:-1rem }
 */
html body.path-taxonomy #wrapper #content-wide-top [id*="frontpagetitle"] h1,
html body.path-taxonomy #wrapper #content-wide-top [id*="pagetitle"] h1,
html body.path-taxonomy #wrapper #content-wide-top .block-block-content .field-item > h1,
html body.path-taxonomy #wrapper #content-wide-top .block-block-content .field-body > h1,
html body.path-taxonomy #wrapper [id*="frontpagetitle"] h1,
html body.path-taxonomy #wrapper [id*="pagetitle"] h1,
html body.path-taxonomy #wrapper .row.layout.layout--onecol h1,
html body.path-taxonomy .row.layout.layout--onecol h1 {
  margin-top: 0.75rem !important;
  margin-bottom: 0rem !important;
}

/* Next sibling after title (slider / content) — same air as top, no pull-up */
html body.path-taxonomy #wrapper [id*="frontpagetitle"] + .block,
html body.path-taxonomy #wrapper [id*="pagetitle"] + .block,
html body.path-taxonomy #wrapper [id*="frontpagetitle"] + .views-element-container,
html body.path-taxonomy #wrapper [id*="pagetitle"] + .views-element-container,
html body.path-taxonomy #wrapper #content-wide-top [id*="frontpagetitle"] + .block,
html body.path-taxonomy #wrapper #content-wide-top [id*="pagetitle"] + .block {
  margin-top: 0.75rem !important;
}

/* Product brand / category taxonomy listing H1s */
html body.path-taxonomy #wrapper .commerce-content-header.brand-listing-h1,
html body.path-taxonomy #wrapper .commerce-content-header.category-listing-h1,
html body.path-taxonomy #wrapper .commerce-content-header,
html body.path-taxonomy .commerce-content-header.brand-listing-h1,
html body.path-taxonomy .commerce-content-header.category-listing-h1,
html body.path-taxonomy .commerce-content-header {
  margin-top: 1rem !important;
  margin-bottom: 1rem !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

html body.path-taxonomy #wrapper .commerce-content-header .commerce-content-h1,
html body.path-taxonomy #wrapper h1.commerce-content-h1,
html body.path-taxonomy .commerce-content-header .commerce-content-h1,
html body.path-taxonomy h1.commerce-content-h1 {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* Mobile: keep even gaps, slightly tighter like front */
@media (max-width: 991.98px) {
  html body.path-taxonomy #wrapper #block-breadcrumbs,
  html body.path-taxonomy #block-breadcrumbs,
  html body.path-taxonomy .block-system-breadcrumb-block {
    padding-top: 0rem !important;
    padding-bottom: 0.4rem !important;
  }

  html body.path-taxonomy #wrapper [id*="frontpagetitle"],
  html body.path-taxonomy #wrapper [id*="pagetitle"],
  html body.path-taxonomy #wrapper #content-wide-top [id*="frontpagetitle"],
  html body.path-taxonomy #wrapper #content-wide-top [id*="pagetitle"] {
    margin-top: 0.6rem !important;
    margin-bottom: 0.6rem !important;
  }

  html body.path-taxonomy #wrapper #content-wide-top [id*="frontpagetitle"] h1,
  html body.path-taxonomy #wrapper #content-wide-top [id*="pagetitle"] h1,
  html body.path-taxonomy #wrapper #content-wide-top .block-block-content .field-item > h1,
  html body.path-taxonomy #wrapper #content-wide-top .block-block-content .field-body > h1,
  html body.path-taxonomy #wrapper [id*="frontpagetitle"] h1,
  html body.path-taxonomy #wrapper [id*="pagetitle"] h1,
  html body.path-taxonomy #wrapper .row.layout.layout--onecol h1,
  html body.path-taxonomy .row.layout.layout--onecol h1 {
    margin-top: 0.6rem !important;
    margin-bottom: 0.6rem !important;
  }

  html body.path-taxonomy #wrapper [id*="frontpagetitle"] + .block,
  html body.path-taxonomy #wrapper [id*="pagetitle"] + .block,
  html body.path-taxonomy #wrapper [id*="frontpagetitle"] + .views-element-container,
  html body.path-taxonomy #wrapper [id*="pagetitle"] + .views-element-container,
  html body.path-taxonomy #wrapper #content-wide-top [id*="frontpagetitle"] + .block,
  html body.path-taxonomy #wrapper #content-wide-top [id*="pagetitle"] + .block {
    margin-top: 0.6rem !important;
  }

  html body.path-taxonomy #wrapper .commerce-content-header.brand-listing-h1,
  html body.path-taxonomy #wrapper .commerce-content-header.category-listing-h1,
  html body.path-taxonomy #wrapper .commerce-content-header,
  html body.path-taxonomy .commerce-content-header {
    margin-top: 0.75rem !important;
    margin-bottom: 0.75rem !important;
  }
}

@media (max-width: 575.98px) {
  html body.path-taxonomy #wrapper #content-wide-top [id*="frontpagetitle"] h1,
  html body.path-taxonomy #wrapper #content-wide-top [id*="pagetitle"] h1,
  html body.path-taxonomy #wrapper #content-wide-top .block-block-content .field-item > h1,
  html body.path-taxonomy #wrapper #content-wide-top .block-block-content .field-body > h1,
  html body.path-taxonomy #wrapper [id*="frontpagetitle"] h1,
  html body.path-taxonomy #wrapper [id*="pagetitle"] h1,
  html body.path-taxonomy #wrapper .row.layout.layout--onecol h1 {
    margin-top: 0.5rem !important;
    margin-bottom: 0rem !important;
  }

  html body.path-taxonomy #wrapper [id*="frontpagetitle"],
  html body.path-taxonomy #wrapper [id*="pagetitle"] {
    margin-top: 0.5rem !important;
    margin-bottom: 0.5rem !important;
  }

  html body.path-taxonomy #wrapper [id*="frontpagetitle"] + .block,
  html body.path-taxonomy #wrapper [id*="pagetitle"] + .block,
  html body.path-taxonomy #wrapper #content-wide-top [id*="frontpagetitle"] + .block {
    margin-top: 0.5rem !important;
  }
}

/* ==========================================================================
   Store / product pages — search block, H1, catalog results
   Widen + align with brand grid content width; clear brand↔search overlap;
   tighten excessive margins (custom_css: search width 55%/92%, mt -2rem/-4rem,
   commerce-content-header mt -4rem/-6.5rem, catalog margin-left 2rem).
   ========================================================================== */

/* --- Brand block: clear bottom space before search --- */


/* --- Product search exposed form block: full content width, no pull-up --- */


/* Inner form fills the block */


/* Also cover product_search_form block id variants */
html body.path-products #wrapper #block-martis-product-search-form,
html body.path-taxonomy #wrapper #block-martis-product-search-form,
html body.path-product #wrapper #block-martis-product-search-form,
html body.path-store #wrapper #block-martis-product-search-form {
  width: 100% !important;
  max-width: 1220px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  margin-top: 1.25rem !important;
  margin-bottom: 1rem !important;
  padding-left: 0.85rem !important;
  padding-right: 0.85rem !important;
  box-sizing: border-box !important;
}

/* --- H1 / listing title header: full width, no negative pull into search --- */
html body.path-products #wrapper .commerce-content-header,
html body.path-taxonomy #wrapper .commerce-content-header,
html body.path-product #wrapper .commerce-content-header,
html body.path-store #wrapper .commerce-content-header,
html body.path-products #wrapper .commerce-content-header.brand-listing-h1,
html body.path-taxonomy #wrapper .commerce-content-header.brand-listing-h1,
html body.path-products #wrapper .commerce-content-header.category-listing-h1,
html body.path-taxonomy #wrapper .commerce-content-header.category-listing-h1,
html body.path-products .commerce-content-header,
html body.path-taxonomy .commerce-content-header,
html body.path-product .commerce-content-header,
html body.path-store .commerce-content-header {
  width: 100% !important;
  max-width: 100% !important;
  margin-top: 1rem !important; /* kill -4rem / -6.5rem */
  margin-bottom: 1rem !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 1rem !important;
  padding-right: 1rem !important;
  box-sizing: border-box !important;
}

html body.path-products #wrapper .commerce-content-header .commerce-content-h1,
html body.path-taxonomy #wrapper .commerce-content-header .commerce-content-h1,
html body.path-products #wrapper h1.commerce-content-h1,
html body.path-taxonomy #wrapper h1.commerce-content-h1,
html body.path-product #wrapper h1.commerce-content-h1,
html body.path-store #wrapper h1.commerce-content-h1,
html body.path-products h1.commerce-content-h1,
html body.path-taxonomy h1.commerce-content-h1 {
  width: 100% !important;
  max-width: 100% !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  box-sizing: border-box !important;
}

/* --- Product catalog / filtered results: full content width, aligned ---
   Stack chrome vertically: switch-icon (top) → teaser grid (full width) → pager (bottom).
   Previous display:flex without flex-direction:column laid header/grid/pager in a ROW,
   which left switch-icon on the left and pager on the right, squeezing the grid. */
html body.path-products #wrapper .product-catalog,
html body.path-taxonomy #wrapper .product-catalog,
html body.path-product #wrapper .product-catalog,
html body.path-store #wrapper .product-catalog,
html body.path-products #wrapper .view-product-catalog,
html body.path-taxonomy #wrapper .view-product-catalog,
html body.path-products #wrapper .view-id-product_catalog,
html body.path-taxonomy #wrapper .view-id-product_catalog,
html body.path-products #wrapper .view-brand-product-listings,
html body.path-taxonomy #wrapper .view-brand-product-listings,
html body.path-products #wrapper .view-product-category-listings,
html body.path-taxonomy #wrapper .view-product-category-listings,
html body.path-products .product-catalog,
html body.path-taxonomy .product-catalog {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important; /* kill path-taxonomy margin-left: 2rem */
  margin-right: 0 !important;
  margin-top: 0.5rem !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  justify-content: flex-start !important;
}

/* Catalog children: full width stack (header / grid / pager / footer) */
html body.path-products #wrapper .product-catalog > .view-header,
html body.path-taxonomy #wrapper .product-catalog > .view-header,
html body.path-products #wrapper .view-product-catalog > .view-header,
html body.path-taxonomy #wrapper .view-product-catalog > .view-header,
html body.path-products #wrapper .view-brand-product-listings > .view-header,
html body.path-taxonomy #wrapper .view-brand-product-listings > .view-header,
html body.path-products #wrapper .view-product-category-listings > .view-header,
html body.path-taxonomy #wrapper .view-product-category-listings > .view-header,
html body.path-products #wrapper .product-catalog > .view-filters,
html body.path-taxonomy #wrapper .product-catalog > .view-filters,
html body.path-products #wrapper .product-catalog > .view-content,
html body.path-taxonomy #wrapper .product-catalog > .view-content,
html body.path-products #wrapper .product-catalog > .grid-wrapper,
html body.path-taxonomy #wrapper .product-catalog > .grid-wrapper,
html body.path-products #wrapper .product-catalog > .row.grid-wrapper,
html body.path-taxonomy #wrapper .product-catalog > .row.grid-wrapper,
html body.path-products #wrapper .product-catalog > nav.pager,
html body.path-taxonomy #wrapper .product-catalog > nav.pager,
html body.path-products #wrapper .product-catalog > .pager,
html body.path-taxonomy #wrapper .product-catalog > .pager,
html body.path-products #wrapper .product-catalog > .pagerer-container,
html body.path-taxonomy #wrapper .product-catalog > .pagerer-container,
html body.path-products #wrapper .product-catalog > .view-footer,
html body.path-taxonomy #wrapper .product-catalog > .view-footer {
  width: 100% !important;
  max-width: 100% !important;
  flex: 0 0 auto !important;
  float: none !important;
  box-sizing: border-box !important;
}

/* Switch-icon bar: above the grid, full width — never under sort form */
html body.path-products #wrapper .product-catalog > .view-header,
html body.path-taxonomy #wrapper .product-catalog > .view-header,
html body.path-products #wrapper .view-product-catalog > .view-header,
html body.path-taxonomy #wrapper .view-product-catalog > .view-header,
html body.path-products #wrapper .view-brand-product-listings > .view-header,
html body.path-taxonomy #wrapper .view-brand-product-listings > .view-header,
html body.path-products #wrapper .view-product-category-listings > .view-header,
html body.path-taxonomy #wrapper .view-product-category-listings > .view-header {
  display: block !important;
  position: relative !important;
  z-index: 2 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0.5rem !important;
  padding-bottom: 0.15rem !important;
  clear: both !important;
  overflow: visible !important;
  background: transparent !important;
}

html body.path-products #wrapper .product-catalog .switch-icon,
html body.path-taxonomy #wrapper .product-catalog .switch-icon,
html body.path-products #wrapper .view-product-catalog .switch-icon,
html body.path-taxonomy #wrapper .view-product-catalog .switch-icon {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 0.5rem !important;
  margin: 0 0 0.35rem 0 !important;
  position: relative !important;
  z-index: 3 !important;
  min-height: 42px !important;
}

/* Catalog sort form: own row BELOW switch-icon (was white overlay covering icons) */
html body.path-products #wrapper .product-catalog > form.views-exposed-form,
html body.path-taxonomy #wrapper .product-catalog > form.views-exposed-form,
html body.path-products #wrapper .product-catalog > .views-exposed-form,
html body.path-taxonomy #wrapper .product-catalog > .views-exposed-form,
html body.path-products #wrapper .view-product-catalog > form.views-exposed-form,
html body.path-taxonomy #wrapper .view-product-catalog > form.views-exposed-form {
  display: block !important;
  position: relative !important;
  z-index: 1 !important;
  width: 100% !important;
  max-width: 100% !important;
  flex: 0 0 auto !important;
  float: none !important;
  clear: both !important;
  margin-top: 0.35rem !important;
  margin-bottom: 0.85rem !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-top: 0.35rem !important;
  padding-bottom: 0.35rem !important;
  box-sizing: border-box !important;
  background: transparent !important; /* avoid white sheet over switch */
}

html body.path-products #wrapper .product-catalog .view-content.grid-wrapper,
html body.path-taxonomy #wrapper .product-catalog .view-content.grid-wrapper,
html body.path-products #wrapper .view-product-catalog .view-content.grid-wrapper,
html body.path-taxonomy #wrapper .view-product-catalog .view-content.grid-wrapper,
html body.path-products #wrapper .view-brand-product-listings .view-content.grid-wrapper,
html body.path-taxonomy #wrapper .view-brand-product-listings .view-content.grid-wrapper,
html body.path-products #wrapper .view-product-category-listings .view-content.grid-wrapper,
html body.path-taxonomy #wrapper .view-product-category-listings .view-content.grid-wrapper,
html body.path-products #wrapper .product-catalog > .row.grid-wrapper,
html body.path-taxonomy #wrapper .product-catalog > .row.grid-wrapper {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  box-sizing: border-box !important;
  flex: 0 0 auto !important;
}

/* Pager + result footer: below grid, full width, centered controls.
   Neutralizes custom_css negative margins that assumed side-by-side chrome. */
html body.path-products #wrapper .product-catalog > nav.pager,
html body.path-taxonomy #wrapper .product-catalog > nav.pager,
html body.path-products #wrapper .product-catalog > .pager,
html body.path-taxonomy #wrapper .product-catalog > .pager,
html body.path-products #wrapper .product-catalog .pagerer-container,
html body.path-taxonomy #wrapper .product-catalog .pagerer-container,
html body.path-products #wrapper .view-product-catalog > nav.pager,
html body.path-taxonomy #wrapper .view-product-catalog > nav.pager,
html body.path-products #wrapper .view-brand-product-listings > nav.pager,
html body.path-taxonomy #wrapper .view-brand-product-listings > nav.pager,
html body.path-products #wrapper .view-product-category-listings > nav.pager,
html body.path-taxonomy #wrapper .view-product-category-listings > nav.pager {
  width: 100% !important;
  max-width: 100% !important;
  margin-top: -3rem !important;
  margin-bottom: -0.25rem !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-top: 0.25rem !important;
  text-align: center !important;
  clear: both !important;
  float: none !important;
}

html body.path-products #wrapper .product-catalog .pager__items,
html body.path-taxonomy #wrapper .product-catalog .pager__items,
html body.path-products #wrapper .product-catalog ul.pager__items,
html body.path-taxonomy #wrapper .product-catalog ul.pager__items {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  align-items: center !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  margin-top: 0 !important;
}

html body.path-products #wrapper .product-catalog > .view-footer,
html body.path-taxonomy #wrapper .product-catalog > .view-footer,
html body.path-products #wrapper .view-product-catalog > .view-footer,
html body.path-taxonomy #wrapper .view-product-catalog > .view-footer {
  width: 100% !important;
  max-width: 100% !important;
  margin-top: 0.5rem !important;
  margin-bottom: -2rem !important;
  text-align: center !important;
  clear: both !important;
  float: none !important;
}

/* Main content column on these pages — use full available width */
html body.path-products #wrapper .col-md-9.left-content.main-content,
html body.path-taxonomy #wrapper .col-md-9.left-content.main-content,
html body.path-product #wrapper .col-md-9.left-content.main-content,
html body.path-store #wrapper .col-md-9.left-content.main-content,
html body.path-products #wrapper .region-content,
html body.path-taxonomy #wrapper .region-content {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  box-sizing: border-box !important;
}

/* Page container alignment with brand grid */
html body.path-products #wrapper .page-wrapper > .container,
html body.path-taxonomy #wrapper .page-wrapper > .container,
html body.path-product #wrapper .page-wrapper > .container,
html body.path-store #wrapper .page-wrapper > .container {
  max-width: 1220px !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

/* Mobile: same widen + clear gaps, slightly tighter */
@media (max-width: 991.98px) {
  

  

  html body.path-products #wrapper .commerce-content-header,
  html body.path-taxonomy #wrapper .commerce-content-header,
  html body.path-product #wrapper .commerce-content-header,
  html body.path-store #wrapper .commerce-content-header,
  html body.path-products .commerce-content-header,
  html body.path-taxonomy .commerce-content-header {
    margin-top: 0.75rem !important;
    margin-bottom: 0.75rem !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0.75rem !important;
    padding-right: 0.75rem !important;
  }

  html body.path-products #wrapper .product-catalog,
  html body.path-taxonomy #wrapper .product-catalog,
  html body.path-products .product-catalog,
  html body.path-taxonomy .product-catalog {
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  html body.path-products #wrapper .page-wrapper > .container,
  html body.path-taxonomy #wrapper .page-wrapper > .container,
  html body.path-product #wrapper .page-wrapper > .container {
    padding-left: 0.75rem !important;
    padding-right: 0.75rem !important;
    max-width: 100% !important;
  }
}

/* Mobile polish: keep H1/catalog inside viewport (no -3px bleed) */
@media (max-width: 991.98px) {
  html body.path-products #wrapper .region-content,
  html body.path-taxonomy #wrapper .region-content,
  html body.path-product #wrapper .region-content,
  html body.path-store #wrapper .region-content,
  html body.path-products #wrapper .col-md-9.left-content.main-content,
  html body.path-taxonomy #wrapper .col-md-9.left-content.main-content {
    padding-left: 0.75rem !important;
    padding-right: 0.75rem !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
  }

  html body.path-products #wrapper .commerce-content-header,
  html body.path-taxonomy #wrapper .commerce-content-header,
  html body.path-products #wrapper .product-catalog,
  html body.path-taxonomy #wrapper .product-catalog {
    max-width: 100% !important;
    overflow-x: hidden !important;
  }

  /* Brand taxonomy: H1 is inside catalog view — keep header spacing tight */
  html body.path-taxonomy #wrapper .product-catalog .commerce-content-header,
  html body.path-taxonomy #wrapper .view-product-catalog .commerce-content-header,
  html body.path-taxonomy #wrapper .view-brand-product-listings .commerce-content-header,
  html body.path-taxonomy #wrapper .view-product-category-listings .commerce-content-header {
    margin-top: 0.5rem !important;
    margin-bottom: 0.75rem !important;
  }
}

/* ==========================================================================
   SERVICE PAGES — layered green + white content palette (2026-07-30)
   Keep class names (.service-cards-wrapper, .card, .summary-box, .process-step,
   .num, .main-grid). Beat per-node field_service_css + custom_css + martis-custom
   with body.page-node-type-service specificity.

   Palette (same family as blog, card-first layout):
     Forest   #3b0a5c  — borders, H1 ink, deepest accents
     Brand    #6716aa  — strong, summary rail, price accents
     Mid      #7b2cbf  — h3 chips, link hover, process nums
     Leaf     #b781e3  — list / paragraph left rails
     Mint     #c9a0e8  — soft accents, underlines, summary p rail
     Soft     #f3e8ff  — paragraph chips, pricing soft fills
     Mist     #f5f0fa  — wrapper background
     White    #ffffff  — cards, list items
     Ink      #1a0a24  — body copy
     Link     #5b21b6  — links on light panels
   ========================================================================== */

body.page-node-type-service {
  --svc-forest: #3b0a5c;
  --svc-brand: #6716aa;
  --svc-mid: #7b2cbf;
  --svc-leaf: #b781e3;
  --svc-mint: #c9a0e8;
  --svc-soft: #f3e8ff;
  --svc-mist: #f5f0fa;
  --svc-white: #ffffff;
  --svc-ink: #1a0a24;
  --svc-link: #5b21b6;
  --svc-border-soft: #e9d5ff;
}

/* Wrapper canvas */
body.page-node-type-service .service-cards-wrapper,
body.page-node-type-service .service-page.service-cards-wrapper,
body.page-node-type-service .service-page {
  color: var(--svc-ink) !important;
}

/* Page title — beat custom_css .row.layout.layout--onecol h1 leaf-green chip.
   Forest→brand gradient + white type (readable, matches card h2 hierarchy). */
body.page-node-type-service .row.layout.layout--onecol h1,
body.page-node-type-service .service-cards-wrapper > h1,
body.page-node-type-service .service-page > h1,
html body.page-node-type-service #wrapper .row.layout.layout--onecol h1,
html body.page-node-type-service #wrapper .service-cards-wrapper > h1 {
  background: linear-gradient(135deg, #3b0a5c 0%, #6716aa 55%, #7b2cbf 100%) !important;
  background-color: #3b0a5c !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-weight: 800 !important;
  text-shadow: none !important;
  border: 2px solid #000 !important;
  border-radius: 10px !important;
  text-align: center !important;
  box-shadow: 0 3px 10px rgba(59, 10, 92, 0.22) !important;
  padding: 0.75rem 1rem !important;
  box-sizing: border-box !important;
  margin-top: 0rem !important;
}

/* FAQ section title (plain h2 under cards, often inline color:#000) */
body.page-node-type-service .service-cards-wrapper > h2,
body.page-node-type-service .service-cards-wrapper h2:is([style],.jd-db-match-73803bd455b9),
body.page-node-type-service .service-page > h2 {
  color: var(--svc-forest) !important;
  -webkit-text-fill-color: var(--svc-forest) !important;
  font-weight: 800 !important;
  text-align: center !important;
  background: transparent !important;
  background-color: transparent !important;
  border: 0 !important;
  text-shadow: none !important;
  box-shadow: none !important;
}

/* Content + FAQ cards (same .card class)
   Soft mint outline on top/right/bottom; brand left rail (match blog body cards). */
body.page-node-type-service .service-cards-wrapper .card,
body.page-node-type-service .service-page .card {
  background: var(--svc-white) !important;
  background-color: var(--svc-white) !important;
  color: var(--svc-ink) !important;
  border-top: 1px solid #e9d5ff !important;
  border-right: 1px solid #e9d5ff !important;
  border-bottom: 1px solid #e9d5ff !important;
  border-left: 5px solid var(--svc-brand) !important;
  border-radius: 16px !important;
  box-shadow: 0 4px 14px -4px rgba(59, 10, 92, 0.1) !important;
}

/* Card h2 — forest→brand gradient chip */
body.page-node-type-service .service-cards-wrapper .card h2,
body.page-node-type-service .service-cards-wrapper .card h2:is([style],.jd-db-match-73803bd455b9),
body.page-node-type-service .service-page .card h2 {
  background: linear-gradient(135deg, #3b0a5c 0%, #6716aa 55%, #7b2cbf 100%) !important;
  background-color: var(--svc-forest) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  display: inline-block !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  padding: 0.5rem 1rem !important;
  border-radius: 8px !important;
  border: 2px solid #000 !important;
  font-weight: 800 !important;
  line-height: 1.35 !important;
  margin: 0 0 0.75rem 0 !important;
  box-shadow: 0 3px 10px rgba(59, 10, 92, 0.2) !important;
}

/* Card h3 — mid green (FAQ questions + subheads) */
body.page-node-type-service .service-cards-wrapper .card h3,
body.page-node-type-service .service-page .card h3 {
  background: var(--svc-mid) !important;
  background-color: var(--svc-mid) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  display: inline-block !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  padding: 0.4rem 0.9rem !important;
  border-radius: 7px !important;
  border: 2px solid #000 !important;
  font-weight: 800 !important;
  line-height: 1.35 !important;
  margin: 0.25rem 0 0.65rem 0 !important;
  box-shadow: 0 2px 6px rgba(123, 44, 191, 0.18) !important;
  z-index: 5 !important;
}

body.page-node-type-service .service-cards-wrapper .card h2 *,
body.page-node-type-service .service-cards-wrapper .card h3 * {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  background: transparent !important;
}

/* Paragraph chips inside cards — soft sides + leaf rail (same as blog p) */
body.page-node-type-service .service-cards-wrapper .card p,
body.page-node-type-service .service-page .card p {
  color: var(--svc-ink) !important;
  -webkit-text-fill-color: var(--svc-ink) !important;
  background: var(--svc-soft) !important;
  background-color: var(--svc-soft) !important;
  border-top: 1px solid #e9d5ff !important;
  border-right: 1px solid #e9d5ff !important;
  border-bottom: 1px solid #e9d5ff !important;
  border-left: 4px solid var(--svc-leaf) !important;
  border-radius: 8px !important;
  padding: 0.7rem 0.95rem !important;
  line-height: 1.65 !important;
  margin-bottom: 0.65rem !important;
  box-shadow: none !important;
}

/* List items: white chips + soft outline + leaf rail (match blog li) */
body.page-node-type-service .service-cards-wrapper .card li,
body.page-node-type-service .service-page .card li {
  color: var(--svc-ink) !important;
  -webkit-text-fill-color: var(--svc-ink) !important;
  background: var(--svc-white) !important;
  background-color: var(--svc-white) !important;
  border-top: 1px solid #e9d5ff !important;
  border-right: 1px solid #e9d5ff !important;
  border-bottom: 1px solid #e9d5ff !important;
  border-left: 5px solid var(--svc-leaf) !important;
  border-radius: 8px !important;
  padding: 0.65rem 0.9rem !important;
  margin-bottom: 0.5rem !important;
  line-height: 1.6 !important;
  list-style-position: inside !important;
  box-shadow: 0 1px 0 rgba(59, 10, 92, 0.04) !important;
}

body.page-node-type-service .service-cards-wrapper .card p strong,
body.page-node-type-service .service-cards-wrapper .card li strong,
body.page-node-type-service .service-cards-wrapper .card strong {
  color: var(--svc-brand) !important;
  -webkit-text-fill-color: var(--svc-brand) !important;
  font-weight: 800 !important;
}

body.page-node-type-service .service-cards-wrapper .card a,
body.page-node-type-service .service-page .card a {
  color: var(--svc-link) !important;
  -webkit-text-fill-color: var(--svc-link) !important;
  text-decoration: underline !important;
  text-decoration-color: var(--svc-mint) !important;
  text-underline-offset: 2px !important;
  font-weight: 700 !important;
}

body.page-node-type-service .service-cards-wrapper .card a:hover,
body.page-node-type-service .service-cards-wrapper .card a:focus {
  color: var(--svc-mid) !important;
  -webkit-text-fill-color: var(--svc-mid) !important;
  text-decoration-color: var(--svc-mid) !important;
}

/* Summary hero box — soft outline + brand left rail */
body.page-node-type-service .service-cards-wrapper .summary-box {
  background: linear-gradient(165deg, #f3e8ff 0%, #f5f0fa 50%, #ffffff 100%) !important;
  color: var(--svc-ink) !important;
  border-top: 1px solid #e9d5ff !important;
  border-right: 1px solid #e9d5ff !important;
  border-bottom: 1px solid #e9d5ff !important;
  border-left: 6px solid var(--svc-brand) !important;
  border-radius: 16px !important;
  box-shadow: 0 3px 12px rgba(59, 10, 92, 0.08) !important;
}

body.page-node-type-service .service-cards-wrapper .summary-box h2 {
  background: linear-gradient(135deg, #3b0a5c 0%, #6716aa 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  display: inline-block !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  padding: 0.45rem 0.95rem !important;
  border-radius: 8px !important;
  border: 2px solid #000 !important;
  font-weight: 800 !important;
  margin: 0 0 0.75rem 0 !important;
}

body.page-node-type-service .service-cards-wrapper .summary-box p {
  color: var(--svc-ink) !important;
  -webkit-text-fill-color: var(--svc-ink) !important;
  background: var(--svc-white) !important;
  border-top: 1px solid #e9d5ff !important;
  border-right: 1px solid #e9d5ff !important;
  border-bottom: 1px solid #e9d5ff !important;
  border-left: 4px solid var(--svc-mint) !important;
  border-radius: 8px !important;
  padding: 0.7rem 0.95rem !important;
  line-height: 1.65 !important;
  margin-bottom: 0.65rem !important;
}

/* Process steps — soft outline + leaf rail (match blog list chips) */
body.page-node-type-service .service-cards-wrapper .process-step {
  display: block !important;
  align-items: center !important; /* vertical center number + text row */
  gap: 0.8rem !important;
  background: var(--svc-white) !important;
  color: var(--svc-ink) !important;
  border-top: 1px solid #e9d5ff !important;
  border-right: 1px solid #e9d5ff !important;
  border-bottom: 1px solid #e9d5ff !important;
  border-left: 5px solid var(--svc-leaf) !important;
  border-radius: 10px !important;
  padding: 0.75rem 0.95rem !important;
  margin-bottom: 0.7rem !important;
  box-shadow: 0 1px 0 rgba(59, 10, 92, 0.04) !important;
}

/* Circled step numbers — true optical vertical + horizontal center */
body.page-node-type-service .service-cards-wrapper .process-step .num,
body.page-node-type-service .process-step .num,
html body.page-node-type-service .service-cards-wrapper .process-step span.num {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 1.85rem !important;
  height: 1.85rem !important;
  min-width: 1.85rem !important;
  min-height: 1.85rem !important;
  max-width: 1.85rem !important;
  max-height: 1.85rem !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
  background: linear-gradient(145deg, #7b2cbf 0%, #6716aa 55%, #3b0a5c 100%) !important;
  background-color: #6716aa !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-weight: 800 !important;
  font-size: 0.9rem !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  text-align: center !important;
  text-shadow: none !important;
  border-radius: 50% !important;
  border: 2px solid #000 !important;
  box-shadow: 0 2px 5px rgba(59, 10, 92, 0.22) !important;
  flex-shrink: 0 !important;
  /* Kill any theme padding/line-height that pushes glyphs off-center */
  vertical-align: middle !important;
  margin-bottom: 1rem !important;
}

body.page-node-type-service .service-cards-wrapper .process-step > span:not(.num) {
  color: var(--svc-ink) !important;
  -webkit-text-fill-color: var(--svc-ink) !important;
  line-height: 1.55 !important;
  font-size: 0.98rem !important;
  font-weight: 550 !important;
  background: transparent !important;
  border: 0 !important;
  padding-top: 0 !important;
  display: block !important;
  flex: 1 1 auto !important;
}

/* FAQ accordion (if present on any service) — light rails, no heavy green bars */
body.page-node-type-service .faq-accordion,
body.page-node-type-service .faq-list,
body.page-node-type-service dl.faq-list {
  border: 0 !important;
  box-shadow: none !important;
}

body.page-node-type-service .faq-accordion dt,
body.page-node-type-service .faq-accordion dt.faq-question {
  background: linear-gradient(135deg, #3b0a5c 0%, #6716aa 100%) !important;
  color: #ffffff !important;
  border: 1px solid rgba(0, 0, 0, 0.35) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
}

body.page-node-type-service .faq-accordion dt p,
body.page-node-type-service .faq-accordion dt.faq-question p {
  background: transparent !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border: 0 !important;
  box-shadow: none !important;
}

body.page-node-type-service .faq-accordion dd.faq-answer p,
body.page-node-type-service .faq-accordion .faq-answer p {
  background: var(--svc-soft) !important;
  color: var(--svc-ink) !important;
  -webkit-text-fill-color: var(--svc-ink) !important;
  border: 1px solid var(--svc-border-soft) !important;
  border-left: 4px solid var(--svc-mint) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
}

/* CTA card (often last centered card) */
body.page-node-type-service .service-cards-wrapper .card:is([style*="text-align:center"],.jd-db-match-42ffa6788ad8),
body.page-node-type-service .service-cards-wrapper .card:is([style*="text-align: center"],.jd-db-match-8bcecb58c254) {
  background: linear-gradient(165deg, #f3e8ff 0%, #ffffff 60%) !important;
  border-color: var(--svc-brand) !important;
}

/* ==========================================================================
   SERVICE PAGES — pricing block: readable type, borders, centered org tabs
   Beats custom_css white-on-purple + heavy black text-shadow on light fills.
   ========================================================================== */

body.page-node-type-service .nnc-pricing-instruction-container,
body.page-node-type-service #content-wide .nnc-pricing-instruction-container {
  background: transparent !important;
}

body.page-node-type-service .nnc-pricing-instruction-container .nnc-pricing-menu-heading,
body.page-node-type-service .nnc-pricing-menu-heading,
body.page-node-type-service h2.nnc-pricing-menu-heading,
body.page-node-type-service #content-wide .nnc-pricing-menu-heading {
  color: var(--svc-forest) !important;
  -webkit-text-fill-color: var(--svc-forest) !important;
  text-shadow: none !important;
  font-weight: 800 !important;
  background: transparent !important;
  font-size: clamp(1.05rem, 2.6vw, 1.35rem) !important;
  line-height: 1.3 !important;
  letter-spacing: 0.02em !important;
}

/* ---- Org-type tabs: flex-centered label text, clear active/inactive ---- */
body.page-node-type-service .nnc-tabs-menu,
body.page-node-type-service .nnc-tabs-menu .nav.nav-tabs,
body.page-node-type-service .nnc-tabs .nav.nav-tabs,
body.page-node-type-service [id*="pricing"] .nav.nav-tabs {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  align-items: stretch !important;
  gap: 0.5rem !important;
  border-bottom: 0 !important;
  margin: 0 0 1rem 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

body.page-node-type-service .nnc-tabs-menu .nav.nav-tabs > li,
body.page-node-type-service [id*="pricing"] .nav.nav-tabs > li {
  display: flex !important;
  float: none !important;
  margin: 0 !important;
  padding: 0 !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
  max-width: 12rem !important;
}

body.page-node-type-service .nnc-pricing-tab,
body.page-node-type-service .nnc-tabs-menu .nnc-pricing-tab,
body.page-node-type-service .nnc-tab-link,
body.page-node-type-service .nav.nav-tabs > li > a.nnc-pricing-tab,
html body.page-node-type-service a.nnc-pricing-tab {
  display: flex !important;
  align-items: center !important;          /* vertical center */
  justify-content: center !important;      /* horizontal center */
  width: 100% !important;
  min-height: 3rem !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0.55rem 0.75rem !important;
  box-sizing: border-box !important;
  background: #ffffff !important;
  background-image: none !important;
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  border: 2px solid #3b0a5c !important;
  border-radius: 10px !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  text-shadow: none !important;
  box-shadow: 0 1px 3px rgba(59, 10, 92, 0.1) !important;
  line-height: 1.15 !important;
  text-align: center !important;
}

body.page-node-type-service .nnc-pricing-tab .nnc-pricing-tab-heading,
body.page-node-type-service .nnc-pricing-tab-heading,
body.page-node-type-service .nav-tabs .nnc-pricing-tab-heading,
html body.page-node-type-service .nnc-pricing-tab-heading {
  display: block !important;
  margin: 0 !important;                    /* kill margin-bottom:5px that un-centers */
  padding: 0 !important;
  font-family: var(--jd-font-display) !important;
  font-size: clamp(0.78rem, 1.8vw, 0.95rem) !important;
  line-height: 1.15 !important;
  font-weight: 800 !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
  color: inherit !important;
  -webkit-text-fill-color: inherit !important;
  text-shadow: none !important;
  text-align: center !important;
}

body.page-node-type-service .nnc-pricing-tab.active,
body.page-node-type-service .nnc-tabs-menu .nnc-pricing-tab.active,
body.page-node-type-service .nnc-tab-link.w--current,
body.page-node-type-service .nav.nav-tabs > li > a.nnc-pricing-tab.active,
html body.page-node-type-service a.nnc-pricing-tab.active {
  background: linear-gradient(204deg, #c9a0e8 0%, #7b2cbf 50%, #6716aa 100%) !important;
  background-image: linear-gradient(204deg, #c9a0e8 0%, #7b2cbf 50%, #6716aa 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border: 2px solid #000 !important;
  box-shadow: 0 3px 10px rgba(59, 10, 92, 0.25) !important;
}

body.page-node-type-service .nnc-pricing-tab.active .nnc-pricing-tab-heading,
body.page-node-type-service a.nnc-pricing-tab.active .nnc-pricing-tab-heading {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  text-shadow: none !important;
}

body.page-node-type-service .nnc-pricing-tab:hover:not(.active),
body.page-node-type-service .nnc-pricing-tab:focus:not(.active) {
  background: #f3e8ff !important;
  color: #3b0a5c !important;
  border-color: #6716aa !important;
}

/* ---- Pricing card shell + borders ---- */
body.page-node-type-service .pricing-table,
body.page-node-type-service .nnc-pricing-container .pricing-table,
body.page-node-type-service #content-wide .pricing-table,
body.page-node-type-service [id*="pricing"] .pricing-table {
  background: #ffffff !important;
  border: 2px solid #3b0a5c !important;
  border-radius: 14px !important;
  box-shadow: 0 6px 18px -6px rgba(59, 10, 92, 0.18) !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}

body.page-node-type-service .nnc-pt-heading-container {
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
}

body.page-node-type-service .nnc-pricing-table-heading,
body.page-node-type-service .pricing-table .nnc-pricing-table-heading,
body.page-node-type-service #content-wide .nnc-pricing-table-heading,
body.page-node-type-service [id*="pricing"] .nnc-pricing-table-heading {
  background: linear-gradient(135deg, #3b0a5c 0%, #6716aa 55%, #7b2cbf 100%) !important;
  background-color: #3b0a5c !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  text-shadow: none !important;
  font-weight: 800 !important;
  font-size: clamp(0.95rem, 2vw, 1.15rem) !important;
  letter-spacing: 0.06em !important;
  line-height: 1.25 !important;
  border-bottom: 2px solid #000 !important;
  padding: 0.85rem 1rem !important;
  margin: 0 !important;
}

/* Timeline chip under package title */
body.page-node-type-service .ncc-pricing-table-timeline,
body.page-node-type-service .nnc-pt-heading-container .ncc-pricing-table-timeline {
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  font-weight: 700 !important;
  font-size: 0.9rem !important;
  line-height: 1.3 !important;
  text-shadow: none !important;
  background: #f3e8ff !important;
  padding: 0.4rem 0.75rem !important;
  text-align: center !important;
  border-bottom: 1px solid #e9d5ff !important;
}

/* Package price strip — high contrast mint on forest; kill animatecss transform leftovers */
body.page-node-type-service .nnc-pricing-table-price,
body.page-node-type-service #wrapper .nnc-pricing-table-price,
body.page-node-type-service .pricing-table .nnc-pricing-table-price,
body.page-node-type-service #content-wide .nnc-pricing-table-price,
body.page-node-type-service [id*="pricing"] .nnc-pricing-table-price,
html body.page-node-type-service .nnc-pricing-table-price,
html body.page-node-type-service #wrapper .nnc-pricing-table-price {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  visibility: visible !important;
  opacity: 1 !important;
  min-height: 3.15rem !important;
  height: auto !important;
  line-height: 1.15 !important;
  padding: 0.8rem 0.9rem !important;
  margin: 0 !important;
  text-align: center !important;
  background: linear-gradient(180deg, #1a0a24 0%, #3b0a5c 100%) !important;
  background-color: #3b0a5c !important;
  background-image: linear-gradient(180deg, #1a0a24 0%, #3b0a5c 100%) !important;
  color: #eafff3 !important;
  -webkit-text-fill-color: #eafff3 !important;
  text-shadow: none !important;
  font-weight: 800 !important;
  font-size: clamp(1.3rem, 2.8vw, 1.75rem) !important;
  letter-spacing: 0.02em !important;
  font-family: var(--jd-font-display) !important;
  border-top: 0 !important;
  border-bottom: 2px solid #000 !important;
  border-left: 0 !important;
  border-right: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  transform: none !important;
  scale: 1 !important;
  animation: none !important;
  overflow: visible !important;
  white-space: nowrap !important;
}

/* Content body: soft fill + dark ink, NO black text-shadow */
body.page-node-type-service .nnc-pricing-table-content-container,
body.page-node-type-service .pricing-table .nnc-pricing-table-content-container,
body.page-node-type-service #content-wide .nnc-pricing-table-content-container,
body.page-node-type-service [id*="pricing"] .nnc-pricing-table-content-container,
html body.page-node-type-service .nnc-pricing-table-content-container {
  background: linear-gradient(180deg, #f5f0fa 0%, #f3e8ff 40%, #ffffff 100%) !important;
  background-image: linear-gradient(180deg, #f5f0fa 0%, #f3e8ff 40%, #ffffff 100%) !important;
  background-color: #f5f0fa !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  border: 0 !important;
  border-top: 0 !important;
  border-bottom: 0 !important;
  border-left: 0 !important;
  border-right: 0 !important;
  border-radius: 0 0 12px 12px !important;
  padding: 1rem 1rem 1.15rem !important;
  text-shadow: none !important;
  align-items: stretch !important;
}

/* Kill custom_css * text-shadow that ruins light-panel readability */
body.page-node-type-service .nnc-pricing-table-content-container *,
body.page-node-type-service .nnc-pricing-table-content-container li,
body.page-node-type-service .nnc-pricing-table-content-container p,
body.page-node-type-service .nnc-pricing-table-content-container span,
body.page-node-type-service .nnc-pricing-table-content-container strong,
body.page-node-type-service .nnc-pricing-table-content-container a,
html body.page-node-type-service .nnc-pricing-table-content-container * {
  color: white !important;
  -webkit-text-fill-color: white !important;
  text-shadow: none !important;
}

body.page-node-type-service .nnc-pricing-table-content-container h3,
body.page-node-type-service .nnc-pricing-table-content-container h4 {
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  border-bottom: 2px solid #c9a0e8 !important;
  font-weight: 800 !important;
  font-size: clamp(1rem, 2vw, 1.15rem) !important;
  line-height: 1.3 !important;
  text-align: center !important;
  text-shadow: none !important;
  margin: 0.85rem 0 0.55rem !important;
  padding-bottom: 0.35rem !important;
  width: 100% !important;
}

body.page-node-type-service .nnc-pricing-table-content-container ul {
  width: 100% !important;
  margin: 0 0 0.5rem !important;
  padding: 0.35rem 0 0.5rem !important;
  list-style: none !important;
}

body.page-node-type-service .nnc-pricing-table-content-container ul li {
  position: relative !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  font-size: clamp(0.9rem, 1.8vw, 1rem) !important;
  line-height: 1.55 !important;
  font-weight: 500 !important;
  text-shadow: none !important;
  border-bottom: 1px solid rgba(59, 10, 92, 0.1) !important;
  padding: 0.45rem 0.25rem 0.45rem 1.55rem !important;
  margin: 0 !important;
  text-align: left !important;
}

body.page-node-type-service .nnc-pricing-table-content-container ul li::before {
  content: "✓" !important;
  position: absolute !important;
  left: 0.15rem !important;
  top: 0.45rem !important;
  color: #7b2cbf !important;
  -webkit-text-fill-color: #7b2cbf !important;
  font-weight: 800 !important;
  font-size: 1em !important;
  line-height: 1.55 !important;
  text-shadow: none !important;
}

body.page-node-type-service .nnc-pricing-table-content-container p {
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  font-size: clamp(0.9rem, 1.8vw, 1rem) !important;
  line-height: 1.55 !important;
  font-weight: 600 !important;
  text-align: center !important;
  text-shadow: none !important;
  margin: 0.5rem 0 !important;
  padding: 0.35rem 0.25rem !important;
}

/* Pricing CTA buttons */
body.page-node-type-service .pricing-table a.button,
body.page-node-type-service .nnc-pricing-table-content-container a.button,
body.page-node-type-service .nnc-pricing-container a.button,
body.page-node-type-service .pricing-table a[href*="get-in-touch"],
body.page-node-type-service .nnc-pricing-container a[href*="form/"],
body.page-node-type-service .nnc-pricing-table-content-container a[href*="cal.com"],
body.page-node-type-service .nnc-pricing-table-content-container a[href*="schedule"] {
  background: linear-gradient(135deg, #6716aa 0%, #7b2cbf 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border: 2px solid #000 !important;
  border-radius: 8px !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  text-shadow: none !important;
  box-shadow: 0 3px 8px rgba(59, 10, 92, 0.22) !important;
}

body.page-node-type-service .pricing-table a.button:hover,
body.page-node-type-service .nnc-pricing-container a.button:hover,
body.page-node-type-service .nnc-pricing-container a[href*="form/"]:hover {
  background: linear-gradient(135deg, #3b0a5c 0%, #6716aa 100%) !important;
  color: #ffffff !important;
}

/* CTA images (SCHEDULE NOW) — keep crisp, no ghost text-shadow on parent */
body.page-node-type-service .nnc-pricing-table-content-container a img,
body.page-node-type-service .nnc-pricing-table-content-container img {
  text-shadow: none !important;
  box-shadow: none !important;
  max-width: 100% !important;
  height: auto !important;
}

/* ==========================================================================
   SERVICE PAGES — blog teaser block colors (match blog listing palette)
   ========================================================================== */

body.page-node-type-service [id*="views-block-blog"] .block-title,
body.page-node-type-service [id*="views-block-blog"] h2.block-title,
body.page-node-type-service .region.region-content-wide [id*="views-block-blog"] h2.block-title,
body.page-node-type-service .region.region-content-wide div.views-element-container h2 {
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  font-weight: 800 !important;
  text-shadow: none !important;
}

body.page-node-type-service [id*="views-block-blog"] .blog-post-teaser,
body.page-node-type-service [id*="views-block-blog"] .blog-post-teaser.post-row,
body.page-node-type-service .blog-post-teaser.post-row {
  background: transparent !important;
  color: #1a0a24 !important;
  border: 0 !important;
  box-shadow: none !important;
}

body.page-node-type-service [id*="views-block-blog"] .post-content-wrap {
  background: transparent !important;
  border: 0 !important;
}

/* Teaser body: forest gradient + white type (like path-blog) */
body.page-node-type-service [id*="views-block-blog"] .post-content,
body.page-node-type-service [id*="views-block-blog"] .views-element-container .post-content,
body.page-node-type-service [id*="views-block-blog"] .content-wrap .post-content,
body.page-node-type-service .blog-post-teaser .post-content,
html body.page-node-type-service [id*="views-block-blog"] .post-content {
  background: linear-gradient(160deg, #7b2cbf 0%, #6716aa 48%, #3b0a5c 100%) !important;
  background-color: #6716aa !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border: 2px solid #000 !important;
  border-radius: 12px !important;
  box-shadow: 0 4px 14px rgba(59, 10, 92, 0.18) !important;
  text-shadow: none !important;
}

body.page-node-type-service [id*="views-block-blog"] .post-content .post-title,
body.page-node-type-service [id*="views-block-blog"] .post-content .post-title a,
body.page-node-type-service [id*="views-block-blog"] .post-title,
body.page-node-type-service [id*="views-block-blog"] .post-title a,
body.page-node-type-service .blog-post-teaser .post-title,
body.page-node-type-service .blog-post-teaser .post-title a {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.2) !important;
  font-weight: 800 !important;
  font-size: clamp(1.05rem, 2.2vw, 1.25rem) !important;
  line-height: 1.3 !important;
}

body.page-node-type-service [id*="views-block-blog"] .post-content .post-excerpt,
body.page-node-type-service [id*="views-block-blog"] .post-content .post-excerpt *,
body.page-node-type-service [id*="views-block-blog"] .post-content .post-excerpt .field-item,
body.page-node-type-service [id*="views-block-blog"] .post-content p,
body.page-node-type-service .blog-post-teaser .post-excerpt,
body.page-node-type-service .blog-post-teaser .post-excerpt * {
  color: #f0fdf6 !important;
  -webkit-text-fill-color: #f0fdf6 !important;
  text-shadow: none !important;
  line-height: 1.55 !important;
  font-size: 0.98rem !important;
}

/* Meta pills: white chips, forest ink */
body.page-node-type-service [id*="views-block-blog"] .post-meta,
body.page-node-type-service [id*="views-block-blog"] .post-meta *,
body.page-node-type-service [id*="views-block-blog"] .post-meta-item,
body.page-node-type-service [id*="views-block-blog"] .post-meta-item *,
body.page-node-type-service [id*="views-block-blog"] .post-meta-item a,
body.page-node-type-service [id*="views-block-blog"] .post-meta-item i,
body.page-node-type-service .blog-post-teaser .post-meta-item,
body.page-node-type-service .blog-post-teaser .post-meta-item * {
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  text-shadow: none !important;
}

body.page-node-type-service [id*="views-block-blog"] .post-meta-item,
body.page-node-type-service .blog-post-teaser .post-meta-item {
  background-color: #ffffff !important;
  border: 2px solid #3b0a5c !important;
  border-radius: 6px !important;
}

/* Read more: mint → forest */
body.page-node-type-service [id*="views-block-blog"] .post-link .read-more,
body.page-node-type-service [id*="views-block-blog"] a.read-more,
body.page-node-type-service .blog-post-teaser .post-link .read-more,
html body.page-node-type-service .blog-post-teaser .read-more {
  background: linear-gradient(204deg, #c9a0e8 0%, #b781e3 45%, #6716aa 100%) !important;
  background-color: #6716aa !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border: 2px solid #000 !important;
  font-weight: 700 !important;
  text-shadow: none !important;
  box-shadow: 0 2px 6px rgba(59, 10, 92, 0.2) !important;
}

body.page-node-type-service [id*="views-block-blog"] .post-link .read-more:hover,
body.page-node-type-service .blog-post-teaser .post-link .read-more:hover {
  background: linear-gradient(204deg, #c9a0e8 0%, #b781e3 45%, #6716aa 100%) !important;
  color: #ffffff !important;
}

/* Image frame border matches green system */
body.page-node-type-service [id*="views-block-blog"] .post-image,
body.page-node-type-service .blog-post-teaser .post-image {
  border: 2px solid #3b0a5c !important;
  box-shadow: 0 3px 10px rgba(59, 10, 92, 0.15) !important;
}

/* Tags + comments row on green teaser body */
body.page-node-type-service [id*="views-block-blog"] .post-tags,
body.page-node-type-service [id*="views-block-blog"] .post-tags *,
body.page-node-type-service .blog-post-teaser .post-tags,
body.page-node-type-service .blog-post-teaser .post-tags * {
  color: #eafff3 !important;
  -webkit-text-fill-color: #eafff3 !important;
  text-shadow: none !important;
  padding-bottom: 0.25rem !important;
}

body.page-node-type-service [id*="views-block-blog"] .tags-list a,
body.page-node-type-service .blog-post-teaser .tags-list a,
body.page-node-type-service [id*="views-block-blog"] .post-tags a {
  background: #ffffff !important;
  color: #6716aa !important;
  -webkit-text-fill-color: #6716aa !important;
  border: 1px solid #3b0a5c !important;
  border-radius: 999px !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  padding: 0.15rem 0.55rem !important;
  text-shadow: none !important;
}

body.page-node-type-service [id*="views-block-blog"] .post-comment,
body.page-node-type-service [id*="views-block-blog"] .post-meta-item.post-comment,
body.page-node-type-service .blog-post-teaser .post-comment {
  background: #ffffff !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  border: 2px solid #3b0a5c !important;
  border-radius: 6px !important;
  text-shadow: none !important;
}

body.page-node-type-service [id*="views-block-blog"] .post-comment *,
body.page-node-type-service .blog-post-teaser .post-comment * {
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  text-shadow: none !important;
}

/* Mobile: keep readable type + spacing for cards / FAQ / pricing / tabs */
@media (max-width: 991.98px) {
  body.page-node-type-service .service-cards-wrapper .card,
  body.page-node-type-service .service-cards-wrapper .summary-box {
    border-radius: 12px !important;
    padding: 1rem 0.9rem !important;
  }

  body.page-node-type-service .service-cards-wrapper .card h2,
  body.page-node-type-service .service-cards-wrapper .card h3,
  body.page-node-type-service .service-cards-wrapper .summary-box h2 {
    font-size: clamp(0.95rem, 3.8vw, 1.1rem) !important;
    padding: 0.4rem 0.75rem !important;
  }

  body.page-node-type-service .service-cards-wrapper .card p,
  body.page-node-type-service .service-cards-wrapper .card li,
  body.page-node-type-service .service-cards-wrapper .summary-box p {
    font-size: 0.98rem !important;
    padding: 0.65rem 0.8rem !important;
  }

  body.page-node-type-service .pricing-table,
  body.page-node-type-service .nnc-pricing-container .pricing-table {
    border-radius: 12px !important;
    border-width: 2px !important;
  }

  body.page-node-type-service .nnc-tabs-menu .nav.nav-tabs,
  body.page-node-type-service [id*="pricing"] .nav.nav-tabs {
    gap: 0.4rem !important;
    margin-bottom: 0.85rem !important;
  }

  body.page-node-type-service .nnc-tabs-menu .nav.nav-tabs > li,
  body.page-node-type-service [id*="pricing"] .nav.nav-tabs > li {
    flex: 1 1 calc(50% - 0.4rem) !important;
    max-width: none !important;
  }

  body.page-node-type-service .nnc-pricing-tab,
  body.page-node-type-service .nnc-tabs-menu .nnc-pricing-tab,
  body.page-node-type-service .nav.nav-tabs > li > a.nnc-pricing-tab {
    min-height: 2.85rem !important;
    padding: 0.5rem 0.45rem !important;
    border-radius: 9px !important;
  }

  body.page-node-type-service .nnc-pricing-tab-heading,
  body.page-node-type-service .nav-tabs .nnc-pricing-tab-heading {
    font-size: 0.78rem !important;
    letter-spacing: 0.03em !important;
    line-height: 1.1 !important;
  }

  body.page-node-type-service .nnc-pricing-table-content-container {
    padding: 0.85rem 0.8rem 1rem !important;
  }

  body.page-node-type-service .nnc-pricing-table-content-container ul li {
    font-size: 0.92rem !important;
    line-height: 1.55 !important;
    padding: 0.5rem 0.2rem 0.5rem 1.45rem !important;
  }

  body.page-node-type-service .nnc-pricing-table-content-container h3,
  body.page-node-type-service .nnc-pricing-table-content-container h4 {
    font-size: 1rem !important;
  }

  body.page-node-type-service .nnc-pricing-table-price {
    min-height: 2.85rem !important;
    font-size: 1.35rem !important;
    padding: 0.65rem 0.75rem !important;
  }

  body.page-node-type-service [id*="views-block-blog"] .post-content .post-title,
  body.page-node-type-service [id*="views-block-blog"] .post-title a {
    font-size: 1.05rem !important;
  }

  body.page-node-type-service [id*="views-block-blog"] .post-content .post-excerpt,
  body.page-node-type-service [id*="views-block-blog"] .post-content .post-excerpt * {
    font-size: 0.92rem !important;
  }
}

@media (max-width: 575.98px) {
  body.page-node-type-service .service-cards-wrapper > h1,
  body.page-node-type-service .service-page > h1 {
    font-size: 1.45rem !important;
    line-height: 1.25 !important;
  }

  body.page-node-type-service .service-cards-wrapper > h2 {
    font-size: 1.2rem !important;
  }

  body.page-node-type-service .process-step .num,
  body.page-node-type-service .service-cards-wrapper .process-step .num {
    width: 1.75rem !important;
    height: 1.75rem !important;
    min-width: 1.75rem !important;
    min-height: 1.75rem !important;
    max-width: 1.75rem !important;
    max-height: 1.75rem !important;
    font-size: 0.85rem !important;
  }

  body.page-node-type-service .nnc-tabs-menu .nav.nav-tabs > li,
  body.page-node-type-service [id*="pricing"] .nav.nav-tabs > li {
    flex: 1 1 calc(50% - 0.35rem) !important;
  }

  body.page-node-type-service .nnc-pricing-tab {
    min-height: 2.7rem !important;
  }

  body.page-node-type-service .nnc-pricing-tab-heading {
    font-size: 0.72rem !important;
  }
}

/* ==========================================================================
   SERVICE PAGES — package tabs↔content gap + full-width title/price (2026-07-30)
   - Tighten space between org-type tabs and package cards (esp. mobile)
   - Package title strip = same full width as price strip (not a narrow chip)
   - Blog teaser colors match service green system end-to-end
   ========================================================================== */

/* ---- Kill custom_css gaps: tabs → packages ---- */
body.page-node-type-service .nnc-tabs.w-tabs,
body.page-node-type-service .nnc-tabs,
body.page-node-type-service #content-wide .nnc-tabs.w-tabs,
html body.page-node-type-service .nnc-tabs.w-tabs {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

body.page-node-type-service .nnc-tabs-menu,
body.page-node-type-service .nnc-tabs-menu.w-tab-menu,
body.page-node-type-service #content-wide .nnc-tabs-menu {
  margin-top: 0 !important;
  margin-bottom: 0.35rem !important; /* was -1.5rem / 30px — keep a tight air only */
  padding-bottom: 0 !important;
}

body.page-node-type-service .nnc-tabs-menu .nav.nav-tabs,
body.page-node-type-service .nnc-tabs .nav.nav-tabs,
body.page-node-type-service [id*="pricing"] .nav.nav-tabs,
html body.page-node-type-service .nav.nav-tabs {
  margin-top: 0 !important;
  margin-bottom: 0.35rem !important; /* kill 30px */
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-bottom: 0 !important;
  gap: 0.45rem !important;
}

body.page-node-type-service .nnc-tabs-content,
body.page-node-type-service .nnc-tabs-content.w-tab-content,
body.page-node-type-service .nnc-tabs .tab-content,
body.page-node-type-service .tab-content {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

body.page-node-type-service .nnc-tab-content,
body.page-node-type-service .tab-pane .nnc-tab-content,
body.page-node-type-service .tab-pane.fade {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding-top: 0.25rem !important; /* was 1rem */
  padding-bottom: 0 !important;
}

body.page-node-type-service .nnc-tab-content-container,
body.page-node-type-service .nnc-tab-content .nnc-tab-content-container {
  margin-top: 0 !important;
  padding-top: 0 !important;
  gap: 0.75rem !important; /* space between package cards only */
  row-gap: 0.75rem !important;
  column-gap: 0.75rem !important;
}

body.page-node-type-service .nnc-pricing-instruction-container,
body.page-node-type-service #content-wide .nnc-pricing-instruction-container {
  margin-bottom: 0.35rem !important;
}

body.page-node-type-service .nnc-pricing-container,
body.page-node-type-service #content-wide .nnc-pricing-container {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* Mobile slideshow packages — same tight top gap */
body.page-node-type-service .mobile-tab-container,
body.page-node-type-service .slideshow-container {
  margin-top: 0.25rem !important;
  padding-top: 0 !important;
}

/* ---- Package title + price: identical full width of card ---- */
body.page-node-type-service .pricing-table,
body.page-node-type-service .nnc-pricing-container .pricing-table,
body.page-node-type-service .mySlides1 .pricing-table,
body.page-node-type-service .mySlides2 .pricing-table,
body.page-node-type-service .mySlides3 .pricing-table,
body.page-node-type-service .mySlides4 .pricing-table,
body.page-node-type-service [class*="mySlides"] .pricing-table {
  width: 100% !important;
  max-width: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
}

body.page-node-type-service .nnc-pt-heading-container,
body.page-node-type-service .pricing-table .nnc-pt-heading-container,
html body.page-node-type-service .nnc-pt-heading-container {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important; /* kill custom 21px/13px — full-bleed title bar */
  height: auto !important;
  box-sizing: border-box !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
}

/* Title strip: full width of card (= price width), not a centered chip */
body.page-node-type-service .nnc-pricing-table-heading,
body.page-node-type-service .pricing-table .nnc-pricing-table-heading,
body.page-node-type-service .nnc-pt-heading-container .nnc-pricing-table-heading,
body.page-node-type-service #content-wide .nnc-pricing-table-heading,
body.page-node-type-service [id*="pricing"] .nnc-pricing-table-heading,
html body.page-node-type-service .nnc-pricing-table-heading {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 100% !important;
  box-sizing: border-box !important;
  margin: 0 !important;
  padding: 0.9rem 1rem !important;
  border-radius: 0 !important; /* full-bleed with card, not pill chip */
  border: 0 !important;
  border-bottom: 2px solid #000 !important;
  text-align: center !important;
  white-space: normal !important;
  word-break: break-word !important;
  font-size: clamp(1.05rem, 2.4vw, 1.25rem) !important;
  letter-spacing: 0.08em !important;
  line-height: 1.2 !important;
  text-transform: uppercase !important;
  font-weight: 800 !important;
  font-family: var(--jd-font-display) !important;
  background: linear-gradient(135deg, #3b0a5c 0%, #6716aa 55%, #7b2cbf 100%) !important;
  background-color: #3b0a5c !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  text-shadow: none !important;
}

/* Timeline under title — also full width */
body.page-node-type-service .ncc-pricing-table-timeline,
body.page-node-type-service .nnc-pt-heading-container .ncc-pricing-table-timeline {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  margin: 0 !important;
  border-radius: 0 !important;
}

/* Price strip: same full width as title */
body.page-node-type-service .nnc-pricing-table-price,
body.page-node-type-service .pricing-table .nnc-pricing-table-price,
html body.page-node-type-service .nnc-pricing-table-price {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 100% !important;
  box-sizing: border-box !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* Content container full width under price */
body.page-node-type-service .nnc-pricing-table-content-container {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

/* ---- Mobile: even tighter tabs→packages + wider full-bleed titles ---- */
@media (max-width: 991.98px) {
  body.page-node-type-service .nnc-pricing-instruction-container,
  body.page-node-type-service #content-wide .nnc-pricing-instruction-container {
    margin-top: 0.75rem !important;
    margin-bottom: 0.25rem !important;
  }

  body.page-node-type-service .nnc-tabs.w-tabs,
  body.page-node-type-service .nnc-tabs {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }

  body.page-node-type-service .nnc-tabs-menu,
  body.page-node-type-service .nnc-tabs-menu.w-tab-menu {
    margin-bottom: 0.2rem !important;
  }

  body.page-node-type-service .nnc-tabs-menu .nav.nav-tabs,
  body.page-node-type-service [id*="pricing"] .nav.nav-tabs {
    margin-bottom: 0.2rem !important;
    gap: 0.35rem !important;
  }

  body.page-node-type-service .nnc-tab-content,
  body.page-node-type-service .tab-pane .nnc-tab-content {
    padding-top: 0.15rem !important;
    margin-top: 0 !important;
  }

  body.page-node-type-service .nnc-tabs-content,
  body.page-node-type-service .tab-content {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }

  body.page-node-type-service .mobile-tab-container,
  body.page-node-type-service .slideshow-container {
    margin-top: 0.15rem !important;
    padding-top: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  body.page-node-type-service .nnc-tab-content-container {
    gap: 0.65rem !important;
    row-gap: 0.65rem !important;
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  /* Packages use full content width on mobile */
  body.page-node-type-service .pricing-table,
  body.page-node-type-service [class*="mySlides"] .pricing-table,
  body.page-node-type-service .slideshow-container .pricing-table {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    border-radius: 12px !important;
  }

  body.page-node-type-service .nnc-pt-heading-container,
  body.page-node-type-service .nnc-pricing-table-heading,
  body.page-node-type-service .nnc-pricing-table-price {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 100% !important;
  }

  body.page-node-type-service .nnc-pricing-table-heading {
    padding: 0.85rem 0.75rem !important;
    font-size: 1.05rem !important;
    letter-spacing: 0.06em !important;
  }

  body.page-node-type-service .nnc-pricing-table-price {
    padding: 0.75rem 0.75rem !important;
    font-size: 1.4rem !important;
    min-height: 3rem !important;
  }

  body.page-node-type-service .nnc-pricing-table-content-container {
    padding-left: 0.85rem !important;
    padding-right: 0.85rem !important;
  }
}

@media (max-width: 575.98px) {
  body.page-node-type-service .nnc-tabs-menu .nav.nav-tabs,
  body.page-node-type-service [id*="pricing"] .nav.nav-tabs {
    margin-bottom: 0.15rem !important;
    gap: 0.3rem !important;
  }

  body.page-node-type-service .nnc-tab-content {
    padding-top: 0.1rem !important;
  }

  body.page-node-type-service .nnc-pricing-table-heading {
    padding: 0.8rem 0.65rem !important;
    font-size: 1rem !important;
  }

  body.page-node-type-service .nnc-pricing-table-price {
    font-size: 1.35rem !important;
    min-height: 2.85rem !important;
  }
}

/* ==========================================================================
   SERVICE PAGES — blog teaser block: match service green system
   (full card, title, meta, tags, read-more — beat residual custom_css)
   ========================================================================== */

body.page-node-type-service [id*="views-block-blog"] .block-title,
body.page-node-type-service [id*="views-block-blog"] h2.block-title,
body.page-node-type-service .region.region-content-wide [id*="views-block-blog"] h2,
body.page-node-type-service #content-wide [id*="views-block-blog"] h2.block-title {
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  font-weight: 800 !important;
  text-shadow: none !important;
  background: transparent !important;
}

/* NO outer frame on the teaser article — only image + post-content carry chrome */
body.page-node-type-service [id*="views-block-blog"] .blog-post-teaser,
body.page-node-type-service [id*="views-block-blog"] .blog-post-teaser.post-row,
body.page-node-type-service .blog-post-teaser.post-row,
html body.page-node-type-service [id*="views-block-blog"] article.blog-post-teaser {
  background: transparent !important;
  background-color: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  overflow: visible !important;
  color: #1a0a24 !important;
}

body.page-node-type-service [id*="views-block-blog"] .post-content-wrap,
html body.page-node-type-service [id*="views-block-blog"] .post-content-wrap {
  background: transparent !important;
  background-color: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

/* Image frame: border + radius must match; clip img so corners aren’t “off” */
body.page-node-type-service [id*="views-block-blog"] .post-image,
body.page-node-type-service [id*="views-block-blog"] .post-thumb .post-image,
body.page-node-type-service .blog-post-teaser .post-image,
html body.page-node-type-service [id*="views-block-blog"] .post-image {
  border: 2px solid #000 !important;
  border-radius: 1rem !important;
  box-shadow: 0 3px 10px rgba(59, 10, 92, 0.14) !important;
  background: transparent !important;
  background-color: transparent !important;
  overflow: hidden !important; /* clip image to border-radius */
  box-sizing: border-box !important;
}

body.page-node-type-service [id*="views-block-blog"] .post-image img,
body.page-node-type-service [id*="views-block-blog"] .post-image picture,
body.page-node-type-service [id*="views-block-blog"] .post-image picture img,
body.page-node-type-service .blog-post-teaser .post-image img,
html body.page-node-type-service [id*="views-block-blog"] .post-image img {
  border: 0 !important;
  border-radius: 0 !important; /* parent clips; avoid double/mismatched radii */
  background: transparent !important;
  display: block !important;
  width: 100% !important;
  height: auto !important;
  max-width: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
}

/* Body panel under image */
body.page-node-type-service [id*="views-block-blog"] .post-content,
body.page-node-type-service [id*="views-block-blog"] .views-element-container .post-content,
body.page-node-type-service [id*="views-block-blog"] .content-wrap .post-content,
body.page-node-type-service .blog-post-teaser .post-content,
html body.page-node-type-service [id*="views-block-blog"] .post-content {
  background: linear-gradient(160deg, #7b2cbf 0%, #6716aa 48%, #3b0a5c 100%) !important;
  background-color: #6716aa !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border: 2px solid #000 !important;
  border-radius: 12px !important;
  box-shadow: 0 4px 14px rgba(59, 10, 92, 0.18) !important;
  text-shadow: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

body.page-node-type-service [id*="views-block-blog"] .post-title,
body.page-node-type-service [id*="views-block-blog"] .post-title a,
body.page-node-type-service [id*="views-block-blog"] .post-content .post-title,
body.page-node-type-service [id*="views-block-blog"] .post-content .post-title a,
body.page-node-type-service .blog-post-teaser .post-title,
body.page-node-type-service .blog-post-teaser .post-title a,
html body.page-node-type-service [id*="views-block-blog"] .post-title a {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.22) !important;
  font-weight: 800 !important;
  font-size: clamp(1.05rem, 2.2vw, 1.28rem) !important;
  line-height: 1.3 !important;
  background: transparent !important;
  border: 0 !important;
}

body.page-node-type-service [id*="views-block-blog"] .post-excerpt,
body.page-node-type-service [id*="views-block-blog"] .post-excerpt *,
body.page-node-type-service [id*="views-block-blog"] .post-content .post-excerpt,
body.page-node-type-service [id*="views-block-blog"] .post-content .post-excerpt *,
body.page-node-type-service [id*="views-block-blog"] .post-content p,
body.page-node-type-service .blog-post-teaser .post-excerpt,
body.page-node-type-service .blog-post-teaser .post-excerpt * {
  color: #f0fdf6 !important;
  -webkit-text-fill-color: #f0fdf6 !important;
  text-shadow: none !important;
  background: transparent !important;
  border: 0 !important;
  line-height: 1.55 !important;
}

body.page-node-type-service [id*="views-block-blog"] .post-meta-item,
body.page-node-type-service .blog-post-teaser .post-meta-item,
body.page-node-type-service [id*="views-block-blog"] .post-comment {
  background: #ffffff !important;
  border: 2px solid #3b0a5c !important;
  border-radius: 6px !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
}

body.page-node-type-service [id*="views-block-blog"] .post-meta-item *,
body.page-node-type-service [id*="views-block-blog"] .post-meta-item a,
body.page-node-type-service [id*="views-block-blog"] .post-meta-item i,
body.page-node-type-service [id*="views-block-blog"] .post-comment *,
body.page-node-type-service .blog-post-teaser .post-meta-item * {
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  text-shadow: none !important;
  background: transparent !important;
}

body.page-node-type-service [id*="views-block-blog"] .tags-list a,
body.page-node-type-service [id*="views-block-blog"] .post-tags a,
body.page-node-type-service .blog-post-teaser .tags-list a {
  background: #ffffff !important;
  color: #6716aa !important;
  -webkit-text-fill-color: #6716aa !important;
  border: 1px solid #3b0a5c !important;
  border-radius: 999px !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  text-shadow: none !important;
  padding: 0.15rem 0.55rem !important;
}

body.page-node-type-service [id*="views-block-blog"] .post-tags,
body.page-node-type-service [id*="views-block-blog"] .post-tags .field-label,
body.page-node-type-service .blog-post-teaser .post-tags {
  color: #eafff3 !important;
  -webkit-text-fill-color: #eafff3 !important;
  text-shadow: none !important;
  background: transparent !important;
}

body.page-node-type-service [id*="views-block-blog"] .post-link .read-more,
body.page-node-type-service [id*="views-block-blog"] a.read-more,
body.page-node-type-service .blog-post-teaser .post-link .read-more,
html body.page-node-type-service .blog-post-teaser .read-more {
  background: linear-gradient(204deg, #c9a0e8 0%, #b781e3 45%, #6716aa 100%) !important;
  background-color: #6716aa !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border: 2px solid #000 !important;
  border-radius: 8px !important;
  font-weight: 700 !important;
  text-shadow: none !important;
  box-shadow: 0 2px 6px rgba(59, 10, 92, 0.22) !important;
}

body.page-node-type-service [id*="views-block-blog"] .post-link .read-more:hover,
body.page-node-type-service .blog-post-teaser .read-more:hover {
  background: linear-gradient(204deg, #c9a0e8 0%, #b781e3 45%, #6716aa 100%) !important;
  color: #ffffff !important;
}

@media (max-width: 991.98px) {
  body.page-node-type-service [id*="views-block-blog"] .blog-post-teaser,
  body.page-node-type-service [id*="views-block-blog"] .blog-post-teaser.post-row {
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
  }

  body.page-node-type-service [id*="views-block-blog"] .post-image,
  body.page-node-type-service .blog-post-teaser .post-image {
    width: 90% !important;
    max-width: 90% !important;
    border-radius: 0.9rem !important;
    overflow: hidden !important;
    border: 2px solid #000 !important;
    background: transparent !important;
  }

  body.page-node-type-service [id*="views-block-blog"] .post-image img,
  body.page-node-type-service .blog-post-teaser .post-image img {
    border-radius: 0 !important;
  }

  body.page-node-type-service [id*="views-block-blog"] .post-content {
    border-radius: 10px !important;
  }

  body.page-node-type-service [id*="views-block-blog"] .post-title,
  body.page-node-type-service [id*="views-block-blog"] .post-title a {
    font-size: 1.05rem !important;
  }
}

/* ==========================================================================
   SERVICE blog teaser — final shell + image fix (no outer frame)
   ========================================================================== */
html body.page-node-type-service [id*="views-block-blog"] .blog-post-teaser,
html body.page-node-type-service [id*="views-block-blog"] .blog-post-teaser.post-row,
html body.page-node-type-service [id*="views-block-blog"] article.blog-post-teaser,
html body.page-node-type-service [id*="views-block-blog"] .post-content-wrap {
  background: transparent !important;
  background-color: transparent !important;
  border: 0 !important;
  border-width: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

/* custom_css often set .post-content-wrap { background: #b781e382; border: 2px solid black } */
html body.page-node-type-service .post-content-wrap,
html body.page-node-type-service [id*="views-block-blog"] .post-content-wrap {
  background: transparent !important;
  background-color: transparent !important;
  border: 0 !important;
  border-color: transparent !important;
}

html body.page-node-type-service [id*="views-block-blog"] .post-image,
html body.page-node-type-service .blog-post-teaser .post-image {
  border: 2px solid #000 !important;
  border-radius: 1rem !important;
  overflow: hidden !important;
  background: transparent !important;
  background-color: transparent !important;
  box-sizing: border-box !important;
}

html body.page-node-type-service [id*="views-block-blog"] .post-image img,
html body.page-node-type-service .blog-post-teaser .post-image img {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  display: block !important;
  width: 100% !important;
  height: auto !important;
  object-fit: cover !important;
}

@media (max-width: 991.98px) {
  html body.page-node-type-service [id*="views-block-blog"] .post-image,
  html body.page-node-type-service .blog-post-teaser .post-image {
    border-radius: 0.9rem !important;
    overflow: hidden !important;
    border: 2px solid #000 !important;
  }

  html body.page-node-type-service [id*="views-block-blog"] .post-image img {
    border-radius: 0 !important;
  }
}

/* ==========================================================================
   SERVICE cards — soft non-left borders (match blog body cards) final pass
   ========================================================================== */
html body.page-node-type-service .service-cards-wrapper .card,
html body.page-node-type-service .service-page .card {
  border-top: 1px solid #e9d5ff !important;
  border-right: 1px solid #e9d5ff !important;
  border-bottom: 1px solid #e9d5ff !important;
  border-left: 5px solid #6716aa !important;
}

html body.page-node-type-service .service-cards-wrapper .summary-box {
  border-top: 1px solid #e9d5ff !important;
  border-right: 1px solid #e9d5ff !important;
  border-bottom: 1px solid #e9d5ff !important;
  border-left: 6px solid #6716aa !important;
}

html body.page-node-type-service .service-cards-wrapper .card p,
html body.page-node-type-service .service-cards-wrapper .summary-box p {
  border-top: 1px solid #e9d5ff !important;
  border-right: 1px solid #e9d5ff !important;
  border-bottom: 1px solid #e9d5ff !important;
  border-left: 4px solid #b781e3 !important;
}

html body.page-node-type-service .service-cards-wrapper .card li,
html body.page-node-type-service .service-cards-wrapper .process-step {
  border-top: 1px solid #e9d5ff !important;
  border-right: 1px solid #e9d5ff !important;
  border-bottom: 1px solid #e9d5ff !important;
  border-left: 5px solid #b781e3 !important;
}

html body.page-node-type-service .service-cards-wrapper .summary-box p {
  border-left-color: #c9a0e8 !important;
}

/* ==========================================================================
   TEAM pages — soft non-left borders (match blog + service cards)
   Listing: body.path-team.page-team (.team-teaser / .team-content)
   Individual: body.page-node-type-team (.profile-cards-wrapper cards / FAQ)
   Left rail stays brand/leaf; top/right/bottom use soft mint #e9d5ff
   ========================================================================== */

/* ---- Team listing teasers (/team) ---- */
body.path-team.page-team .region.region-content .team-teaser,
body.path-team.page-team .team-teaser,
body.path-team.page-team .region.region-content .team-content,
body.path-team.page-team .team-content,
html body.path-team.page-team .team-teaser,
html body.path-team.page-team .team-content {
  border-top: 1px solid #e9d5ff !important;
  border-right: 1px solid #e9d5ff !important;
  border-bottom: 1px solid #e9d5ff !important;
  border-left: 5px solid #6716aa !important;
  border-radius: 12px !important;
  box-shadow: 0 4px 12px rgba(59, 10, 92, 0.08) !important;
}

/* Listing grid items that wrap teasers */
body.path-team.page-team .region.region-content .grid-item .team-teaser,
body.path-team.page-team .views-view-responsive-grid__item .team-teaser {
  border-top: 1px solid #e9d5ff !important;
  border-right: 1px solid #e9d5ff !important;
  border-bottom: 1px solid #e9d5ff !important;
  border-left: 5px solid #6716aa !important;
}

/* ---- Individual team node content cards ---- */
body.page-node-type-team .profile-cards-wrapper .card,
body.page-node-type-team .profile-cards-wrapper .card .card,
body.page-node-type-team .profile-cards-wrapper .main-grid .card,
body.page-node-type-team .region.region-content .profile-cards-wrapper .card,
html body.page-node-type-team .profile-cards-wrapper .card,
html body.page-node-type-team .profile-cards-wrapper .card .card {
  border-top: 1px solid #e9d5ff !important;
  border-right: 1px solid #e9d5ff !important;
  border-bottom: 1px solid #e9d5ff !important;
  border-left: 5px solid #6716aa !important;
  border-radius: 14px !important;
  box-shadow: 0 4px 14px -4px rgba(59, 10, 92, 0.1) !important;
}

/* FAQ cards on individual team bios */
body.page-node-type-team .profile-cards-wrapper .faq-card,
body.page-node-type-team .profile-cards-wrapper .faq-grid .faq-card,
body.page-node-type-team .region.region-content .profile-cards-wrapper .faq-card,
html body.page-node-type-team .profile-cards-wrapper .faq-card {
  border-top: 1px solid #e9d5ff !important;
  border-right: 1px solid #e9d5ff !important;
  border-bottom: 1px solid #e9d5ff !important;
  border-left: 5px solid #6716aa !important;
  border-radius: 12px !important;
  box-shadow: 0 3px 10px rgba(59, 10, 92, 0.08) !important;
}

/* Summary boxes if present on team bios */
body.page-node-type-team .profile-cards-wrapper .summary-box,
html body.page-node-type-team .profile-cards-wrapper .summary-box {
  border-top: 1px solid #e9d5ff !important;
  border-right: 1px solid #e9d5ff !important;
  border-bottom: 1px solid #e9d5ff !important;
  border-left: 6px solid #6716aa !important;
  border-radius: 14px !important;
}

/* Paragraph / list chips inside team profile cards (match blog p/li) */
body.page-node-type-team .profile-cards-wrapper .card p,
body.page-node-type-team .profile-cards-wrapper .card .card p,
body.page-node-type-team .profile-cards-wrapper .main-grid .card p,
body.page-node-type-team .profile-cards-wrapper .faq-card p,
body.page-node-type-team .profile-cards-wrapper .summary-box p,
body.page-node-type-team .region.region-content .profile-cards-wrapper .card p,
body.page-node-type-team .region.region-content .profile-cards-wrapper .faq-card p,
html body.page-node-type-team .profile-cards-wrapper .card p,
html body.page-node-type-team .profile-cards-wrapper .faq-card p {
  border-top: 1px solid #e9d5ff !important;
  border-right: 1px solid #e9d5ff !important;
  border-bottom: 1px solid #e9d5ff !important;
  border-left: 4px solid #b781e3 !important;
  border-radius: 8px !important;
}

body.page-node-type-team .profile-cards-wrapper .card li,
body.page-node-type-team .profile-cards-wrapper .card .card li,
body.page-node-type-team .profile-cards-wrapper .faq-card li,
body.page-node-type-team .region.region-content .profile-cards-wrapper .card li,
html body.page-node-type-team .profile-cards-wrapper .card li {
  border-top: 1px solid #e9d5ff !important;
  border-right: 1px solid #e9d5ff !important;
  border-bottom: 1px solid #e9d5ff !important;
  border-left: 5px solid #b781e3 !important;
  border-radius: 8px !important;
}

/* Summary box paragraphs: mint left rail */
body.page-node-type-team .profile-cards-wrapper .summary-box p {
  border-left-color: #c9a0e8 !important;
}

/* Team body lists / bio chips when present outside profile wrapper */
body.page-node-type-team .team-body ul,
body.page-node-type-team .team-body ol {
  border-bottom: 0 !important;
}

body.page-node-type-team .team-body li,
body.page-node-type-team .team-biography {
  border-top: 1px solid #e9d5ff !important;
  border-right: 1px solid #e9d5ff !important;
  border-bottom: 1px solid #e9d5ff !important;
  border-left: 5px solid #b781e3 !important;
  border-radius: 8px !important;
}

body.page-node-type-team .team-biography {
  border-left-color: #c9a0e8 !important;
}

/* Kill heavy black 4px/2px frames from inline profile CSS + custom_css */
html body.page-node-type-team .profile-cards-wrapper .card,
html body.page-node-type-team .profile-cards-wrapper .faq-card {
  border-width: 1px 1px 1px 5px !important;
  border-style: solid !important;
  border-color: #e9d5ff #e9d5ff #e9d5ff #6716aa !important;
}

html body.path-team.page-team .team-teaser,
html body.path-team.page-team .team-content {
  border-width: 1px 1px 1px 5px !important;
  border-style: solid !important;
  border-color: #e9d5ff #e9d5ff #e9d5ff #6716aa !important;
}

@media (max-width: 991.98px) {
  body.path-team.page-team .team-teaser,
  body.path-team.page-team .team-content,
  body.page-node-type-team .profile-cards-wrapper .card,
  body.page-node-type-team .profile-cards-wrapper .faq-card {
    border-top: 1px solid #e9d5ff !important;
    border-right: 1px solid #e9d5ff !important;
    border-bottom: 1px solid #e9d5ff !important;
    border-left: 5px solid #6716aa !important;
  }

  body.page-node-type-team .profile-cards-wrapper .card p,
  body.page-node-type-team .profile-cards-wrapper .card li,
  body.page-node-type-team .profile-cards-wrapper .faq-card p {
    border-top: 1px solid #e9d5ff !important;
    border-right: 1px solid #e9d5ff !important;
    border-bottom: 1px solid #e9d5ff !important;
    border-left-width: 4px !important;
  }
}

/* ==========================================================================
   TEAM listing + individual — layered green + white palette (2026-07-30)
   Match blog/service: white/mist cards, forest gradient headers, soft chips,
   dark ink body, soft mint outlines + brand/leaf left rails.
   Beats inline .profile-cards-wrapper style + custom_css mid-green shells.
   ========================================================================== */

body.path-team.page-team,
body.page-node-type-team {
  --team-forest: #3b0a5c;
  --team-brand: #6716aa;
  --team-mid: #7b2cbf;
  --team-leaf: #b781e3;
  --team-mint: #c9a0e8;
  --team-soft: #f3e8ff;
  --team-mist: #f5f0fa;
  --team-white: #ffffff;
  --team-ink: #1a0a24;
  --team-link: #5b21b6;
  --team-border: #e9d5ff;
}

/* ---------- Listing H1 / page title (content region only — never bare body h1) ---------- */
body.path-team.page-team #block-martis-teamh1title h1,
body.path-team.page-team #main-content .region.region-content h1,
body.path-team.page-team #main-content .row.layout.layout--onecol h1 {
  background: linear-gradient(135deg, #3b0a5c 0%, #6716aa 55%, #7b2cbf 100%) !important;
  background-color: #3b0a5c !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  text-shadow: none !important;
  border: 2px solid #000 !important;
  border-radius: 10px !important;
  font-weight: 800 !important;
  text-align: center !important;
  box-shadow: 0 3px 10px rgba(59, 10, 92, 0.2) !important;
}

/* ---------- Listing teaser cards ---------- */
body.path-team.page-team .region.region-content .team-teaser,
body.path-team.page-team .team-teaser,
body.path-team.page-team .region.region-content .team-content,
body.path-team.page-team .team-content,
body.path-team.page-team .team-teaser.d-flex.align-items-center,
html body.path-team.page-team .team-teaser,
html body.path-team.page-team .team-content {
  background: linear-gradient(165deg, #ffffff 0%, #f5f0fa 55%, #f3e8ff 100%) !important;
  background-color: #ffffff !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  border-top: 1px solid #e9d5ff !important;
  border-right: 1px solid #e9d5ff !important;
  border-bottom: 1px solid #e9d5ff !important;
  border-left: 5px solid #6716aa !important;
  border-radius: 14px !important;
  box-shadow: 0 4px 14px rgba(59, 10, 92, 0.1) !important;
  overflow: hidden !important;
}

/* Name pill on listing */
body.path-team.page-team .team-name,
body.path-team.page-team .team-name a,
body.path-team.page-team .region.region-content .team-name,
body.path-team.page-team .region.region-content .team-name a,
body.path-team.page-team .grid-item h4,
body.path-team.page-team .col-lg-4.grid-item h4,
html body.path-team.page-team .team-name a {
  background: linear-gradient(135deg, #3b0a5c 0%, #6716aa 55%, #7b2cbf 100%) !important;
  background-color: #3b0a5c !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  text-shadow: none !important;
  border: 2px solid #000 !important;
  border-radius: 8px !important;
  font-weight: 800 !important;
  text-decoration: none !important;
  box-shadow: 0 2px 6px rgba(59, 10, 92, 0.18) !important;
}

body.path-team.page-team .team-name a:hover,
body.path-team.page-team .team-name a:focus {
  color: #eafff3 !important;
  -webkit-text-fill-color: #eafff3 !important;
  text-decoration: none !important;
}

body.path-team.page-team .team-position,
body.path-team.page-team .region.region-content .team-position {
  color: #6716aa !important;
  -webkit-text-fill-color: #6716aa !important;
  font-weight: 700 !important;
  text-shadow: none !important;
  background: transparent !important;
}

/* Bio excerpt on listing — dark ink, readable (no universal * selector) */
body.path-team.page-team #main-content .team-teaser p,
body.path-team.page-team #main-content .team-teaser .team-biography,
body.path-team.page-team #main-content .team-teaser .team-body,
body.path-team.page-team #main-content .team-teaser .field-body {
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  text-shadow: none !important;
}

body.path-team.page-team .team-teaser .field-body,
body.path-team.page-team .team-teaser .team-body,
body.path-team.page-team .team-content .field-body {
  background: #f3e8ff !important;
  border-top: 1px solid #e9d5ff !important;
  border-right: 1px solid #e9d5ff !important;
  border-bottom: 1px solid #e9d5ff !important;
  border-left: 4px solid #b781e3 !important;
  border-radius: 8px !important;
  padding: 0.55rem 0.75rem !important;
  color: #1a0a24 !important;
}

/* Photo ring */
body.path-team.page-team .team-thumb,
body.path-team.page-team .region.region-content .team-thumb {
  border: 4px solid #6716aa !important;
  box-shadow: 0 3px 10px rgba(59, 10, 92, 0.18) !important;
  background: #ffffff !important;
}

body.path-team.page-team .team-thumb img,
body.path-team.page-team .region.region-content .team-thumb img {
  border: 0 !important;
}

/* Social icons on listing */
body.path-team.page-team .team-social a,
body.path-team.page-team .region.region-content .team-social a {
  color: #6716aa !important;
  -webkit-text-fill-color: #6716aa !important;
}

body.path-team.page-team .team-social a:hover {
  color: #7b2cbf !important;
  -webkit-text-fill-color: #7b2cbf !important;
}

/* ---------- Individual team header ---------- */
body.page-node-type-team .team-header.flex-wrap,
body.page-node-type-team .team-header,
html body.page-node-type-team .team-header.flex-wrap {
  background: linear-gradient(135deg, #3b0a5c 0%, #6716aa 50%, #7b2cbf 100%) !important;
  background-color: #3b0a5c !important;
  border: 2px solid #000 !important;
  border-radius: 12px !important;
  box-shadow: 0 4px 14px rgba(59, 10, 92, 0.2) !important;
  color: #ffffff !important;
}

body.page-node-type-team #main-content .team-header .team-name,
body.page-node-type-team #main-content .team-header .team-name a,
body.page-node-type-team #main-content .team-header .team-position,
body.page-node-type-team #main-content .team-header .team-meta,
body.page-node-type-team #main-content .team-header .team-meta span {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  text-shadow: none !important;
  background: transparent !important;
}

body.page-node-type-team .team-header .team-name,
body.page-node-type-team .team-header .team-name a {
  font-weight: 800 !important;
}

body.page-node-type-team .team-header .team-social a {
  color: #eafff3 !important;
  -webkit-text-fill-color: #eafff3 !important;
}

body.page-node-type-team .team-header .team-social a:hover {
  color: #c9a0e8 !important;
}

body.page-node-type-team .team-header .team-thumb,
body.page-node-type-team .team-thumb {
  border: 4px solid #c9a0e8 !important;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.25) !important;
  background: #ffffff !important;
}

/* ---------- Profile cards wrapper canvas ---------- */
body.page-node-type-team .profile-cards-wrapper,
body.page-node-type-team .team-body .profile-cards-wrapper,
html body.page-node-type-team .profile-cards-wrapper {
  background: #f5f0fa !important;
  background-color: #f5f0fa !important;
  color: #1a0a24 !important;
  max-width: 1100px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Outer wrapping .card that sometimes wraps all sections — flatten to transparent */
body.page-node-type-team .profile-cards-wrapper > .card:not(:has(> h2)):not(:has(> h3)) {
  background: transparent !important;
  background-color: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Content cards + nested cards — white shells, soft outline, brand rail */
body.page-node-type-team .profile-cards-wrapper .card,
body.page-node-type-team .profile-cards-wrapper .card .card,
body.page-node-type-team .profile-cards-wrapper .main-grid .card,
body.page-node-type-team .region.region-content .profile-cards-wrapper .card,
html body.page-node-type-team .profile-cards-wrapper .card,
html body.page-node-type-team .profile-cards-wrapper .card .card,
html body.page-node-type-team .container .profile-cards-wrapper .card .card {
  background: #ffffff !important;
  background-color: #ffffff !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  border-top: 1px solid #e9d5ff !important;
  border-right: 1px solid #e9d5ff !important;
  border-bottom: 1px solid #e9d5ff !important;
  border-left: 5px solid #6716aa !important;
  border-radius: 14px !important;
  box-shadow: 0 4px 14px -4px rgba(59, 10, 92, 0.12) !important;
  padding: 1.2rem 1.15rem !important;
  margin-bottom: 1.15rem !important;
}

/* Card headings — forest gradient chips, white type */
body.page-node-type-team .profile-cards-wrapper .card h2,
body.page-node-type-team .profile-cards-wrapper .card h3,
body.page-node-type-team .profile-cards-wrapper .card .card h2,
body.page-node-type-team .profile-cards-wrapper .card .card h3,
body.page-node-type-team .profile-cards-wrapper .faq-card h3,
body.page-node-type-team .region.region-content .profile-cards-wrapper .card h2,
body.page-node-type-team .region.region-content .profile-cards-wrapper .card h3,
html body.page-node-type-team .profile-cards-wrapper .card h2,
html body.page-node-type-team .profile-cards-wrapper .card h3,
html body.page-node-type-team .profile-cards-wrapper .faq-card h3 {
  background: linear-gradient(135deg, #3b0a5c 0%, #6716aa 55%, #7b2cbf 100%) !important;
  background-color: #3b0a5c !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  display: inline-block !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  padding: 0.5rem 1rem !important;
  border-radius: 8px !important;
  border: 2px solid #000 !important;
  font-weight: 800 !important;
  text-shadow: none !important;
  margin: 0 0 0.75rem 0 !important;
  box-shadow: 0 3px 10px rgba(59, 10, 92, 0.2) !important;
  line-height: 1.3 !important;
}

body.page-node-type-team .profile-cards-wrapper .faq-card h3 {
  background: #7b2cbf !important;
  background-color: #7b2cbf !important;
  box-shadow: 0 2px 6px rgba(123, 44, 191, 0.18) !important;
}

/* FAQ section title (plain h2) */
body.page-node-type-team .profile-cards-wrapper > h2,
body.page-node-type-team .profile-cards-wrapper h2:is([style],.jd-db-match-73803bd455b9),
body.page-node-type-team .team-body .profile-cards-wrapper > h2,
html body.page-node-type-team #main-content .profile-cards-wrapper > h2,
html body.page-node-type-team #main-content .profile-cards-wrapper h2:is([style],.jd-db-match-73803bd455b9),
html body.page-node-type-team .team-body .profile-cards-wrapper > h2 {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  text-align: center !important;
  font-weight: 800 !important;
  text-shadow: none !important;
  margin: 1.75rem auto 1rem auto !important;
  padding-left: 0.5rem !important;
  padding-right: 0.5rem !important;
  float: none !important;
}

/* Body text chips inside cards */
body.page-node-type-team .profile-cards-wrapper .card p,
body.page-node-type-team .profile-cards-wrapper .card .card p,
body.page-node-type-team .profile-cards-wrapper .main-grid .card p,
body.page-node-type-team .profile-cards-wrapper .summary-box p,
body.page-node-type-team .region.region-content .profile-cards-wrapper .card p,
body.page-node-type-team .region.region-content .profile-cards-wrapper .faq-card p,
html body.page-node-type-team .profile-cards-wrapper .card p,
html body.page-node-type-team .profile-cards-wrapper .faq-card p,
html body.page-node-type-team .profile-cards-wrapper .main-grid .card p,
html body.page-node-type-team .profile-cards-wrapper .summary-box p {
  background: #f3e8ff !important;
  background-color: #f3e8ff !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  text-shadow: none !important;
  border-top: 1px solid #e9d5ff !important;
  border-right: 1px solid #e9d5ff !important;
  border-bottom: 1px solid #e9d5ff !important;
  border-left: 4px solid #b781e3 !important;
  border-radius: 8px !important;
  padding: 0.75rem 0.95rem !important;
  line-height: 1.65 !important;
  margin-bottom: 0.65rem !important;
  font-weight: 500 !important;
}

body.page-node-type-team .profile-cards-wrapper .card li,
body.page-node-type-team .profile-cards-wrapper .card .card li,
body.page-node-type-team .profile-cards-wrapper .faq-card li,
html body.page-node-type-team .profile-cards-wrapper .card li {
  background: #ffffff !important;
  background-color: #ffffff !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  text-shadow: none !important;
  border-top: 1px solid #e9d5ff !important;
  border-right: 1px solid #e9d5ff !important;
  border-bottom: 1px solid #e9d5ff !important;
  border-left: 5px solid #b781e3 !important;
  border-radius: 8px !important;
  padding: 0.65rem 0.9rem !important;
  margin-bottom: 0.45rem !important;
  line-height: 1.6 !important;
}

body.page-node-type-team .profile-cards-wrapper .card p strong,
body.page-node-type-team .profile-cards-wrapper .card li strong,
body.page-node-type-team .profile-cards-wrapper .faq-card p strong {
  color: #6716aa !important;
  -webkit-text-fill-color: #6716aa !important;
  font-weight: 800 !important;
  text-shadow: none !important;
}

/* Links — brand green, not purple */
body.page-node-type-team .profile-cards-wrapper .card a,
body.page-node-type-team .profile-cards-wrapper .faq-card a,
body.page-node-type-team .team-body a {
  color: #5b21b6 !important;
  -webkit-text-fill-color: #5b21b6 !important;
  text-decoration: underline !important;
  text-decoration-color: #c9a0e8 !important;
  font-weight: 700 !important;
  text-shadow: none !important;
}

body.page-node-type-team .profile-cards-wrapper .card a:hover,
body.page-node-type-team .profile-cards-wrapper .faq-card a:hover {
  color: #7b2cbf !important;
  text-decoration-color: #7b2cbf !important;
}

/* FAQ cards — white shell, soft rail */
body.page-node-type-team .profile-cards-wrapper .faq-card,
body.page-node-type-team .profile-cards-wrapper .faq-grid .faq-card,
body.page-node-type-team .region.region-content .profile-cards-wrapper .faq-card,
html body.page-node-type-team .profile-cards-wrapper .faq-card,
html body.page-node-type-team .profile-cards-wrapper .faq-grid .faq-card {
  background: #ffffff !important;
  background-color: #ffffff !important;
  color: #1a0a24 !important;
  border-top: 1px solid #e9d5ff !important;
  border-right: 1px solid #e9d5ff !important;
  border-bottom: 1px solid #e9d5ff !important;
  border-left: 5px solid #6716aa !important;
  border-radius: 12px !important;
  box-shadow: 0 3px 10px rgba(59, 10, 92, 0.08) !important;
  padding: 1rem 1.05rem !important;
}

body.page-node-type-team .profile-cards-wrapper .faq-grid {
  gap: 1rem !important;
}

/* Summary box if used */
body.page-node-type-team .profile-cards-wrapper .summary-box {
  background: linear-gradient(165deg, #f3e8ff 0%, #f5f0fa 50%, #ffffff 100%) !important;
  color: #1a0a24 !important;
  border-top: 1px solid #e9d5ff !important;
  border-right: 1px solid #e9d5ff !important;
  border-bottom: 1px solid #e9d5ff !important;
  border-left: 6px solid #6716aa !important;
  border-radius: 14px !important;
}

body.page-node-type-team .profile-cards-wrapper .summary-box p {
  border-left-color: #c9a0e8 !important;
  background: #ffffff !important;
}

/* team-body residual text (outside profile cards) */
body.page-node-type-team .team-body,
body.page-node-type-team .team-body p,
body.page-node-type-team .team-body li {
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  text-shadow: none !important;
}

body.page-node-type-team .team-body header {
  background: #f3e8ff !important;
  border-radius: 10px !important;
}

body.page-node-type-team .team-body h2 {
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  text-shadow: none !important;
  background: transparent !important;
}

body.page-node-type-team #main-content b,
body.page-node-type-team #main-content strong {
  color: #6716aa !important;
  -webkit-text-fill-color: #6716aa !important;
  text-shadow: none !important;
}

/* ---------- Mobile ---------- */
@media (max-width: 991.98px) {
  body.path-team.page-team .team-teaser,
  body.path-team.page-team .team-content {
    border-radius: 12px !important;
    padding: 0.85rem !important;
  }

  body.path-team.page-team .team-name,
  body.path-team.page-team .team-name a,
  body.path-team.page-team .grid-item h4 {
    font-size: 1rem !important;
    padding: 0.55rem 0.75rem !important;
  }

  body.page-node-type-team .team-header.flex-wrap {
    width: 100% !important;
    max-width: 100% !important;
    padding: 1.1rem 1rem !important;
    border-radius: 10px !important;
  }

  body.page-node-type-team .profile-cards-wrapper .card,
  body.page-node-type-team .profile-cards-wrapper .card .card,
  body.page-node-type-team .profile-cards-wrapper .faq-card {
    padding: 1rem 0.9rem !important;
    border-radius: 12px !important;
  }

  body.page-node-type-team .profile-cards-wrapper .card h2,
  body.page-node-type-team .profile-cards-wrapper .card h3,
  body.page-node-type-team .profile-cards-wrapper .faq-card h3 {
    font-size: clamp(0.95rem, 3.8vw, 1.1rem) !important;
    padding: 0.45rem 0.8rem !important;
  }

  body.page-node-type-team .profile-cards-wrapper .card p,
  body.page-node-type-team .profile-cards-wrapper .faq-card p {
    font-size: 0.96rem !important;
    padding: 0.7rem 0.85rem !important;
    line-height: 1.6 !important;
  }

  body.page-node-type-team .profile-cards-wrapper .faq-grid {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 575.98px) {
  body.page-node-type-team .profile-cards-wrapper {
    padding: 0.5rem 0.35rem !important;
  }

  body.path-team.page-team .team-teaser {
    flex-direction: column !important;
    text-align: center !important;
  }
}

/* Flatten outer wrapping .card around all profile sections (no double frame) */
html body.page-node-type-team .profile-cards-wrapper > .card {
  background: transparent !important;
  background-color: transparent !important;
  border: 0 !important;
  border-width: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 0 0.5rem 0 !important;
  border-radius: 0 !important;
}

/* Inner section cards keep the white + soft-rail look */
html body.page-node-type-team .profile-cards-wrapper > .card > .card,
html body.page-node-type-team .profile-cards-wrapper .main-grid > .card {
  background: #ffffff !important;
  background-color: #ffffff !important;
  border-top: 1px solid #e9d5ff !important;
  border-right: 1px solid #e9d5ff !important;
  border-bottom: 1px solid #e9d5ff !important;
  border-left: 5px solid #6716aa !important;
  border-radius: 14px !important;
  box-shadow: 0 4px 14px -4px rgba(59, 10, 92, 0.12) !important;
  padding: 1.2rem 1.15rem !important;
  margin-bottom: 1.15rem !important;
}

/* FAQ grid should not sit in a solid green outer box */
html body.page-node-type-team .profile-cards-wrapper .faq-grid {
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
  margin: 0.5rem 0 1rem !important;
}

/* Ensure profile wrapper itself is mist, not lavender from inline CSS */
html body.page-node-type-team .profile-cards-wrapper {
  background: #f5f0fa !important;
  background-color: #f5f0fa !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* Kill any remaining outer green shell around team profile content */
html body.page-node-type-team .team-body,
html body.page-node-type-team .team-body .field-body,
html body.page-node-type-team .team-body .field-item,
html body.page-node-type-team .col-sm-7.team-detail,
html body.page-node-type-team .team-detail {
  background: transparent !important;
  background-color: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

html body.page-node-type-team .profile-cards-wrapper,
html body.page-node-type-team .team-body .profile-cards-wrapper,
html body.page-node-type-team .field-body .profile-cards-wrapper {
  background: transparent !important;
  background-color: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding-left: 0.25rem !important;
  padding-right: 0.25rem !important;
}

/* Direct child .card of wrapper = structural shell only (not a content card) */
html body.page-node-type-team .profile-cards-wrapper > .card,
html body.page-node-type-team .field-item > .profile-cards-wrapper > .card,
html body.page-node-type-team .team-body .profile-cards-wrapper > .card {
  display: block !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-top: 0 !important;
  border-right: 0 !important;
  border-bottom: 0 !important;
  border-left: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
  border-radius: 0 !important;
  color: inherit !important;
}

/* Content cards one level deeper keep palette */
html body.page-node-type-team .profile-cards-wrapper > .card > .card {
  display: block !important;
  background: #ffffff !important;
  background-color: #ffffff !important;
  border-top: 1px solid #e9d5ff !important;
  border-right: 1px solid #e9d5ff !important;
  border-bottom: 1px solid #e9d5ff !important;
  border-left: 5px solid #6716aa !important;
  border-radius: 14px !important;
  box-shadow: 0 4px 14px -4px rgba(59, 10, 92, 0.12) !important;
  padding: 1.2rem 1.15rem !important;
  margin: 0 0 1.15rem 0 !important;
}

/* ==========================================================================
   TEAM fix pass — no outer box, banner/listing layout, header isolation
   2026-07-30
   ========================================================================== */

/* ---- NEVER let team palette leak into site chrome ---- */
body.path-team .header,
body.path-team .header *,
body.path-team #header,
body.path-team #header *,
body.path-team .header-main-wrap,
body.path-team .header-main-wrap *,
body.path-team .header-info,
body.path-team .header-info *,
body.path-team .navbar,
body.path-team .navbar *,
body.page-node-type-team .header,
body.page-node-type-team .header *,
body.page-node-type-team #header,
body.page-node-type-team #header *,
body.page-node-type-team .header-main-wrap,
body.page-node-type-team .header-main-wrap *,
body.page-node-type-team .header-info,
body.page-node-type-team .header-info *,
body.page-node-type-team .navbar,
body.page-node-type-team .navbar * {
  /* Do not force team ink/white; restore cascade for chrome only when
     a prior over-broad rule set color. Explicit safe defaults: */
  -webkit-text-fill-color: unset;
}

/* Undo any accidental green gradient on non-content headings in chrome */
body.path-team .header h1,
body.path-team .header h2,
body.path-team .navbar h1,
body.page-node-type-team .header h1,
body.page-node-type-team .header h2 {
  background: none !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  color: inherit !important;
  -webkit-text-fill-color: unset !important;
}

/* Narrow listing H1 — content only, never bare body h1 */
html body.path-team.page-team #main-content h1,
html body.path-team.page-team .region.region-content h1,
html body.path-team.page-team #block-martis-teamh1title h1,
html body.path-team.page-team .row.layout.layout--onecol h1 {
  background: linear-gradient(135deg, #3b0a5c 0%, #6716aa 55%, #7b2cbf 100%) !important;
  background-color: #3b0a5c !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  text-shadow: none !important;
  border: 2px solid #000 !important;
  border-radius: 10px !important;
  font-weight: 800 !important;
  text-align: center !important;
  box-shadow: 0 3px 10px rgba(59, 10, 92, 0.2) !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding: 0.75rem 1rem !important;
  line-height: 1.25 !important;
}

/* ==========================================================================
   INDIVIDUAL — kill outer content box completely
   ========================================================================== */
html body.page-node-type-team #main-content .team-content,
html body.page-node-type-team #main-content .team-detail,
html body.page-node-type-team #main-content .team-body,
html body.page-node-type-team #main-content .team-body .field-body,
html body.page-node-type-team #main-content .team-body .field-item,
html body.page-node-type-team #main-content .profile-cards-wrapper,
html body.page-node-type-team #main-content .profile-cards-wrapper > .card {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-width: 0 !important;
  border-color: transparent !important;
  box-shadow: none !important;
  outline: 0 !important;
}

html body.page-node-type-team #main-content .profile-cards-wrapper {
  padding: 0.35rem 0 !important;
  max-width: 100% !important;
}

html body.page-node-type-team #main-content .profile-cards-wrapper > .card {
  padding: 0 !important;
  margin: 0;
  border-radius: 0 !important;
}

/* Content cards only (nested), not the structural shell */
html body.page-node-type-team #main-content .profile-cards-wrapper > .card > .card,
html body.page-node-type-team #main-content .profile-cards-wrapper .main-grid > .card {
  background: #ffffff !important;
  border-top: 1px solid #e9d5ff !important;
  border-right: 1px solid #e9d5ff !important;
  border-bottom: 1px solid #e9d5ff !important;
  border-left: 5px solid #6716aa !important;
  border-radius: 14px !important;
  box-shadow: 0 4px 14px -4px rgba(59, 10, 92, 0.12) !important;
  padding: 1.15rem 1.1rem !important;
  margin: 0 0 1rem 0 !important;
}

/* ==========================================================================
   INDIVIDUAL — banner (avatar + name + socials)
   Structure: .team-header > .col-sm-5.figure > .team-thumb + .team-meta
   ========================================================================== */
html body.page-node-type-team #main-content .team-content {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

html body.page-node-type-team #main-content .team-header,
html body.page-node-type-team #main-content .team-header.flex-wrap {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0.75rem 0 1.25rem 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}

/* Inner banner bar — full content width */
html body.page-node-type-team #main-content .team-header .col-sm-5.figure {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 1.35rem !important;
  width: 100% !important;
  max-width: 100% !important;
  flex: 0 0 100% !important;
  margin: 0 !important;
  padding: 1.15rem 1.35rem 1.15rem 1.2rem !important;
  box-sizing: border-box !important;
  background: linear-gradient(120deg, #3b0a5c 0%, #6716aa 48%, #7b2cbf 100%) !important;
  border: 2px solid #000 !important;
  border-radius: 14px !important;
  box-shadow: 0 4px 14px rgba(59, 10, 92, 0.22) !important;
  float: none !important;
  overflow: visible !important; /* avatar ring can sit cleanly without clipping name */
}

html body.page-node-type-team #main-content .team-header .team-thumb {
  position: relative !important;
  flex: 0 0 96px !important;
  width: 96px !important;
  height: 96px !important;
  min-width: 96px !important;
  min-height: 96px !important;
  max-width: 96px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 3px solid #c9a0e8 !important;
  border-radius: 50% !important;
  overflow: hidden !important;
  background: #ffffff !important;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.28) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  z-index: 2 !important;
}

html body.page-node-type-team #main-content .team-header .team-thumb img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  border: 0 !important;
  border-radius: 50% !important;
  margin: 0 !important;
}

/* Kill custom_css absolute / negative meta offsets */
html body.page-node-type-team #main-content .team-header .team-meta,
html body.page-node-type-team #main-content .team-meta.text-left {
  position: static !important;
  flex: 1 1 auto !important;
  width: auto !important;
  max-width: none !important;
  margin: 0 !important;
  margin-top: 0 !important;
  margin-left: 0 !important;
  margin-bottom: 0 !important;
  padding: 0 !important;
  text-align: left !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

html body.page-node-type-team #main-content .team-header .team-name,
html body.page-node-type-team #main-content .team-header h1.team-name {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-size: clamp(1.35rem, 2.6vw, 1.85rem) !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  margin: 0 0 0.25rem 0 !important;
  padding: 0 !important;
  width: auto !important;
  max-width: 100% !important;
  text-shadow: none !important;
}

html body.page-node-type-team #main-content .team-header .team-position {
  color: #d8f5e6 !important;
  -webkit-text-fill-color: #d8f5e6 !important;
  font-weight: 650 !important;
  font-size: 1rem !important;
  margin: 0 0 0.45rem 0 !important;
  background: transparent !important;
  border: 0 !important;
}

html body.page-node-type-team #main-content .team-header .team-social,
html body.page-node-type-team #main-content .team-social {
  position: static !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 0.65rem !important;
  margin: 0 !important;
  margin-top: 0.15rem !important;
  padding: 0 !important;
  opacity: 1 !important;
  width: auto !important;
}

html body.page-node-type-team #main-content .team-header .team-social a {
  color: #eafff3 !important;
  -webkit-text-fill-color: #eafff3 !important;
  font-size: 1.25rem !important;
  margin: 0 !important;
  text-decoration: none !important;
  line-height: 1 !important;
}

html body.page-node-type-team #main-content .team-header .team-social a:hover {
  color: #c9a0e8 !important;
}

/* Detail column full width under banner on all breakpoints for cleaner stack */
html body.page-node-type-team #main-content .col-sm-7.team-detail {
  flex: 0 0 100% !important;
  max-width: 100% !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
}

/* ==========================================================================
   LISTING /team — teaser layout (desktop + mobile)
   Structure: .team-teaser > .team-thumb(img+social) + .team-meta(name,pos,bio)
   ========================================================================== */
html body.path-team.page-team #main-content .team-teaser,
html body.path-team.page-team .region.region-content .team-teaser {
  display: flex !important;
  flex-direction: row !important;
  align-items: flex-start !important;
  gap: 1.1rem !important;
  background: #ffffff !important;
  background-image: none !important;
  color: #1a0a24 !important;
  border-top: 1px solid #e9d5ff !important;
  border-right: 1px solid #e9d5ff !important;
  border-bottom: 1px solid #e9d5ff !important;
  border-left: 5px solid #6716aa !important;
  border-radius: 14px !important;
  box-shadow: 0 4px 14px rgba(59, 10, 92, 0.1) !important;
  padding: 1.15rem 1.15rem 1.2rem !important;
  margin: 0 0 1.25rem 0;
  overflow: visible !important;
  box-sizing: border-box !important;
}

/* Thumb column: photo + socials stacked, no absolute */
html body.path-team.page-team #main-content .team-teaser .team-thumb {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: flex-start !important;
  flex: 0 0 auto !important;
  width: 120px !important;
  min-width: 120px !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

/* Photo frame only — never apply circle frame to social <a> icons */
html body.path-team.page-team #main-content .team-teaser .team-thumb > .field,
html body.path-team.page-team #main-content .team-teaser .team-thumb .field-field-image,
html body.path-team.page-team #main-content .team-teaser .team-thumb .field-item,
html body.path-team.page-team #main-content .team-teaser .team-thumb .field-item > a {
  display: block !important;
  width: 110px !important;
  height: 110px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  border-radius: 50% !important;
  overflow: hidden !important;
  border: 2px solid #6716aa !important;
  box-shadow: 0 3px 10px rgba(59, 10, 92, 0.16) !important;
  background: #ffffff !important;
  box-sizing: border-box !important;
}

html body.path-team.page-team #main-content .team-teaser .team-thumb img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  border: 0 !important;
  border-radius: 50% !important;
  margin: 0 !important;
}

/* Socials under avatar (inside thumb in markup) — plain icons, not photo frames */
html body.path-team.page-team #main-content .team-teaser .team-social {
  position: static !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 0.55rem !important;
  width: 100% !important;
  margin: 0.65rem 0 0 0 !important;
  padding: 0 !important;
  opacity: 1 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html body.path-team.page-team #main-content .team-teaser .team-social a,
html body.path-team.page-team #main-content .team-teaser .team-thumb .team-social a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  height: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0.2rem !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
  color: #6716aa !important;
  -webkit-text-fill-color: #6716aa !important;
  font-size: 1.25rem !important;
  line-height: 1 !important;
  text-decoration: none !important;
}

html body.path-team.page-team #main-content .team-teaser .team-social a:hover {
  color: #7b2cbf !important;
}

/* Meta column */
html body.path-team.page-team #main-content .team-teaser .team-meta {
  position: static !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
  margin: 0 !important;
  margin-left: 0 !important;
  padding: 0 !important;
  text-align: left !important;
  background: transparent !important;
  border: 0 !important;
}

/* Name pill — not overlaying avatar */
html body.path-team.page-team #main-content .team-teaser .team-name,
html body.path-team.page-team #main-content .team-teaser .team-name a,
html body.path-team.page-team #main-content .team-teaser h4.team-name {
  display: inline-block !important;
  width: auto !important;
  max-width: 100% !important;
  margin: 0 0 0.45rem 0 !important;
  padding: 0.45rem 0.9rem !important;
  background: linear-gradient(135deg, #3b0a5c 0%, #6716aa 55%, #7b2cbf 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border: 2px solid #000 !important;
  border-radius: 8px !important;
  font-weight: 800 !important;
  font-size: 1.15rem !important;
  line-height: 1.25 !important;
  text-decoration: none !important;
  text-shadow: none !important;
  box-shadow: 0 2px 6px rgba(59, 10, 92, 0.16) !important;
  box-sizing: border-box !important;
  position: static !important;
}

html body.path-team.page-team #main-content .team-teaser .team-position {
  color: #6716aa !important;
  -webkit-text-fill-color: #6716aa !important;
  font-weight: 750 !important;
  font-size: 1rem !important;
  margin: 0 0 0.55rem 0 !important;
  background: transparent !important;
  border: 0 !important;
  text-shadow: none !important;
}

html body.path-team.page-team #main-content .team-teaser .team-biography {
  background: #f3e8ff !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  border-top: 1px solid #e9d5ff !important;
  border-right: 1px solid #e9d5ff !important;
  border-bottom: 1px solid #e9d5ff !important;
  border-left: 4px solid #b781e3 !important;
  border-radius: 8px !important;
  padding: 0.7rem 0.85rem !important;
  margin: 0 !important;
  font-style: normal !important;
  line-height: 1.55 !important;
  font-size: 0.95rem !important;
  max-height: 8.5rem !important;
  overflow-y: auto !important;
  text-shadow: none !important;
}

/* Do not recolor every descendant (was leaking) — only content text */
html body.path-team.page-team #main-content .team-teaser .team-meta,
html body.path-team.page-team #main-content .team-teaser .team-biography {
  color: #1a0a24 !important;
}

/* ==========================================================================
   MOBILE
   ========================================================================== */
@media (max-width: 991.98px) {
  /* Listing H1 */
  html body.path-team.page-team #main-content h1,
  html body.path-team.page-team #block-martis-teamh1title h1 {
    font-size: 1.25rem !important;
    padding: 0.7rem 0.85rem !important;
    margin: 0.5rem 0 1rem 0 !important;
    width: 100% !important;
  }

  /* Listing teaser: stack avatar → socials → name → role → bio */
  html body.path-team.page-team #main-content .team-teaser {
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    gap: 0.75rem !important;
    padding: 1.15rem 1rem 1.2rem !important;
  }

  html body.path-team.page-team #main-content .team-teaser .team-thumb {
    width: 100% !important;
    min-width: 0 !important;
    align-items: center !important;
  }

  html body.path-team.page-team #main-content .team-teaser .team-thumb > .field,
  html body.path-team.page-team #main-content .team-teaser .team-thumb .field-item,
  html body.path-team.page-team #main-content .team-teaser .team-thumb .field-item > a {
    width: 128px !important;
    height: 128px !important;
  }

  html body.path-team.page-team #main-content .team-teaser .team-social {
    margin-top: 0.55rem !important;
    gap: 0.75rem !important;
  }

  html body.path-team.page-team #main-content .team-teaser .team-social a,
  html body.path-team.page-team #main-content .team-teaser .team-thumb .team-social a {
    width: auto !important;
    height: auto !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    font-size: 1.35rem !important;
    color: #6716aa !important;
  }

  html body.path-team.page-team #main-content .team-teaser .team-meta {
    width: 100% !important;
    text-align: center !important;
    margin: 0 !important;
  }

  html body.path-team.page-team #main-content .team-teaser .team-name,
  html body.path-team.page-team #main-content .team-teaser .team-name a,
  html body.path-team.page-team #main-content .team-teaser h4.team-name {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0.15rem 0 0.45rem 0 !important;
    padding: 0.55rem 0.85rem !important;
    font-size: 1.12rem !important;
    text-align: center !important;
  }

  html body.path-team.page-team #main-content .team-teaser .team-position {
    margin-bottom: 0.55rem !important;
    font-size: 1.02rem !important;
  }

  html body.path-team.page-team #main-content .team-teaser .team-biography {
    text-align: left !important;
    max-height: 9.5rem !important;
    font-size: 0.94rem !important;
  }

  /* Individual banner: full width, stack on small screens */
  html body.page-node-type-team #main-content .team-header .col-sm-5.figure {
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    gap: 0.85rem !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 1.15rem 1rem 1.2rem !important;
    border-radius: 12px !important;
  }

  html body.page-node-type-team #main-content .team-header .team-thumb {
    width: 112px !important;
    height: 112px !important;
    min-width: 112px !important;
    min-height: 112px !important;
    margin: 0 auto !important;
  }

  html body.page-node-type-team #main-content .team-header .team-meta,
  html body.page-node-type-team #main-content .team-meta.text-left {
    text-align: center !important;
    width: 100% !important;
    margin: 0 !important;
  }

  html body.page-node-type-team #main-content .team-header .team-name {
    font-size: 1.4rem !important;
    margin-bottom: 0.2rem !important;
  }

  html body.page-node-type-team #main-content .team-header .team-position {
    margin-bottom: 0.5rem !important;
  }

  html body.page-node-type-team #main-content .team-header .team-social {
    justify-content: center !important;
    gap: 0.85rem !important;
  }

  html body.page-node-type-team #main-content .team-header .team-social a {
    font-size: 1.35rem !important;
  }

  /* Content cards full width, no outer shell */
  html body.page-node-type-team #main-content .profile-cards-wrapper > .card > .card,
  html body.page-node-type-team #main-content .profile-cards-wrapper .faq-card {
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
}

@media (max-width: 575.98px) {
  html body.path-team.page-team #main-content h1,
  html body.path-team.page-team #block-martis-teamh1title h1 {
    font-size: 1.12rem !important;
    padding: 0.65rem 0.7rem !important;
  }

  html body.path-team.page-team #main-content .team-teaser .team-thumb > .field,
  html body.path-team.page-team #main-content .team-teaser .team-thumb .field-item,
  html body.path-team.page-team #main-content .team-teaser .team-thumb .field-item > a {
    width: 112px !important;
    height: 112px !important;
  }

  html body.page-node-type-team #main-content .team-header .team-thumb {
    width: 100px !important;
    height: 100px !important;
    min-width: 100px !important;
    min-height: 100px !important;
  }

  html body.page-node-type-team #main-content .team-header .team-name {
    font-size: 1.25rem !important;
  }
}

/* Individual banner: keep avatar fully inside bar; kill leftover offsets */
html body.page-node-type-team #main-content .team-header .col-sm-5.figure,
html body.page-node-type-team #main-content .team-header .figure {
  position: relative !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  transform: none !important;
  overflow: hidden !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  margin-top: 0 !important;
  padding-left: 1.15rem !important;
  padding-right: 1.25rem !important;
}

html body.page-node-type-team #main-content .team-header .team-thumb,
html body.page-node-type-team #main-content .team-thumb {
  position: relative !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  transform: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  float: none !important;
}

html body.page-node-type-team #main-content .team-header .team-meta,
html body.page-node-type-team #main-content .team-meta,
html body.page-node-type-team #main-content .team-meta.text-left {
  position: relative !important;
  left: auto !important;
  top: auto !important;
  transform: none !important;
  margin: 0 !important;
  margin-top: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  margin-bottom: 0 !important;
  padding-left: 0.15rem !important;
  float: none !important;
  width: auto !important;
  max-width: none !important;
}

html body.page-node-type-team #main-content .team-header .team-name,
html body.page-node-type-team #main-content .team-header h1.team-name {
  position: static !important;
  left: auto !important;
  margin-left: 0 !important;
  padding-left: 0 !important;
  width: auto !important;
  max-width: 100% !important;
  overflow: visible !important;
  white-space: normal !important;
}

/* Listing: ensure social icons never get photo-frame sizing from any leftover rule */
html body.path-team.page-team #main-content .team-teaser .team-social a::before {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* ==========================================================================
   TEAM polish 2026-07-30b — animation kill, banner, outer shell, listing,
   header isolation (must stay last in this file)
   ========================================================================== */

/* ---- Kill Animate.css heartBeat (scales name over the avatar) ---- */
html body.page-node-type-team .team-header .team-name,
html body.page-node-type-team .team-header .team-name.animate__animated,
html body.page-node-type-team .team-header .team-name.animate__heartBeat,
html body.page-node-type-team .team-header h1.team-name,
html body.path-team.page-team .team-teaser .team-name,
html body.path-team.page-team .team-teaser .team-name.animate__animated,
html body.path-team.page-team .team-teaser .team-name a {
  animation: none !important;
  animation-name: none !important;
  animation-duration: 0s !important;
  transform: none !important;
  -webkit-animation: none !important;
}

/* ---- Header isolation (never restyle site chrome on team routes) ---- */
html body.path-team .header,
html body.path-team .header-main-wrap,
html body.path-team .header-info,
html body.path-team .navbar,
html body.path-team .region-header,
html body.page-node-type-team .header,
html body.page-node-type-team .header-main-wrap,
html body.page-node-type-team .header-info,
html body.page-node-type-team .navbar,
html body.page-node-type-team .region-header {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* Do not force white / forest ink onto header descendants
html body.path-team .header a,
html body.path-team .header span,
html body.path-team .header strong,
html body.path-team .header .call-phone-link,
html body.path-team .header #block-call-to-order,
html body.path-team .header-info .header-info-title,
html body.path-team .header-info .header-info-desc,
html body.page-node-type-team #main-content a,
html body.page-node-type-team #main-content  span,
html body.page-node-type-team #main-content strong,
html body.page-node-type-team #main-content  .call-phone-link,
html body.page-node-type-team #main-content  #block-call-to-order,
html body.page-node-type-team .header-info .header-info-title,
html body.page-node-type-team .header-info .header-info-desc {
  /* leave cascade; only clear accidental team fills
  -webkit-text-fill-color: unset;
  text-shadow: none;
}
*/

/* ---- Individual: no outer content shell ---- */
html body.page-node-type-team .team-content,
html body.page-node-type-team .team-detail,
html body.page-node-type-team .team-body,
html body.page-node-type-team .team-body .field-body,
html body.page-node-type-team .team-body .field-item,
html body.page-node-type-team .profile-cards-wrapper,
html body.page-node-type-team .profile-cards-wrapper > .card:not(:has(> h2)):not(:has(> h3)):not(:has(> .summary-box)):has(> .card) {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
}

/* Structural outer shell only (wrapper that only contains other cards) */
html body.page-node-type-team .profile-cards-wrapper > .card {
  /* If this card is just a shell, flatten it. Content cards still styled below. */
  background: transparent !important;
  background-color: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 0 0.75rem 0 !important;
  border-radius: 0 !important;
}

/* Real content cards (nested or direct with heading) keep single soft frame */
html body.page-node-type-team .profile-cards-wrapper > .card > .card,
html body.page-node-type-team .profile-cards-wrapper .main-grid > .card,
html body.page-node-type-team .profile-cards-wrapper > .card:has(> h2),
html body.page-node-type-team .profile-cards-wrapper > .card:has(> h3) {
  background: #ffffff !important;
  background-color: #ffffff !important;
  border-top: 1px solid #e9d5ff !important;
  border-right: 1px solid #e9d5ff !important;
  border-bottom: 1px solid #e9d5ff !important;
  border-left: 5px solid #6716aa !important;
  border-radius: 14px !important;
  box-shadow: 0 4px 14px -4px rgba(59, 10, 92, 0.12) !important;
  padding: 1.15rem 1.1rem !important;
  margin: 0 0 1rem 0 !important;
}

/* ---- Individual banner: solid flex, avatar never covers name ---- */
html body.page-node-type-team .team-header,
html body.page-node-type-team .team-header.flex-wrap {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0.65rem 0 1.15rem 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}

html body.page-node-type-team .team-header .col-sm-5.figure,
html body.page-node-type-team .team-header .figure {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 1.25rem !important;
  column-gap: 1.25rem !important;
  row-gap: 0.75rem !important;
  width: 100% !important;
  max-width: 100% !important;
  flex: 0 0 100% !important;
  box-sizing: border-box !important;
  margin: 0 !important;
  padding: 1.1rem 1.35rem !important;
  background: linear-gradient(115deg, #3b0a5c 0%, #6716aa 45%, #7b2cbf 100%) !important;
  border: 2px solid #000 !important;
  border-radius: 14px !important;
  box-shadow: 0 4px 16px rgba(59, 10, 92, 0.22) !important;
  overflow: hidden !important;
  float: none !important;
  position: relative !important;
  left: auto !important;
  top: auto !important;
  transform: none !important;
}

html body.page-node-type-team .team-header .team-thumb {
  flex: 0 0 100px !important;
  width: 100px !important;
  height: 100px !important;
  min-width: 100px !important;
  min-height: 100px !important;
  max-width: 100px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 3px solid #c9a0e8 !important;
  border-radius: 50% !important;
  overflow: hidden !important;
  background: #fff !important;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.28) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: relative !important;
  z-index: 2 !important;
  float: none !important;
  left: auto !important;
  top: auto !important;
  transform: none !important;
}

html body.page-node-type-team .team-header .team-thumb img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  border: 0 !important;
  border-radius: 50% !important;
}

html body.page-node-type-team .team-header .team-meta,
html body.page-node-type-team .team-header .team-meta.text-left {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  width: auto !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 0 0 0.15rem !important;
  position: relative !important;
  left: auto !important;
  top: auto !important;
  transform: none !important;
  text-align: left !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  z-index: 1 !important;
  float: none !important;
}

html body.page-node-type-team .team-header .team-name,
html body.page-node-type-team .team-header h1.team-name {
  display: block !important;
  width: auto !important;
  max-width: 100% !important;
  margin: 0 0 0.2rem 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-size: clamp(1.4rem, 2.5vw, 1.9rem) !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  text-shadow: none !important;
  position: static !important;
  transform: none !important;
  animation: none !important;
  overflow: visible !important;
  white-space: normal !important;
}

html body.page-node-type-team .team-header .team-position {
  color: #d8f5e6 !important;
  -webkit-text-fill-color: #d8f5e6 !important;
  font-weight: 650 !important;
  font-size: 1.02rem !important;
  margin: 0 0 0.4rem 0 !important;
  background: transparent !important;
  border: 0 !important;
}

html body.page-node-type-team .team-header .team-social {
  position: static !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 0.7rem !important;
  margin: 0.1rem 0 0 0 !important;
  padding: 0 !important;
  opacity: 1 !important;
}

html body.page-node-type-team .team-header .team-social a {
  color: #eafff3 !important;
  -webkit-text-fill-color: #eafff3 !important;
  font-size: 1.3rem !important;
  line-height: 1 !important;
  text-decoration: none !important;
  margin: 0 !important;
  transform: none !important;
}

html body.page-node-type-team .team-header .team-social a:hover {
  color: #c9a0e8 !important;
}

html body.page-node-type-team .col-sm-7.team-detail {
  flex: 0 0 100% !important;
  max-width: 100% !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
}

/* ---- Listing /team ---- */
html body.path-team.page-team #block-martis-teamh1title {
  margin-bottom: -1.75rem !important;
}

html body.path-team.page-team #block-martis-teamh1title h1,
html body.path-team.page-team .region.region-content-wide-top h1,
html body.path-team.page-team #main-content h1 {
  background: linear-gradient(135deg, #3b0a5c 0%, #6716aa 55%, #7b2cbf 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border: 2px solid #000 !important;
  border-radius: 12px !important;
  font-weight: 800 !important;
  text-align: center !important;
  box-shadow: 0 3px 12px rgba(59, 10, 92, 0.2) !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  margin: 0.35rem 0 1rem 0 !important;
  padding: 0.8rem 1.1rem !important;
  line-height: 1.25 !important;
  text-shadow: none !important;
}

html body.path-team.page-team .team-teaser {
  display: flex !important;
  flex-direction: row !important;
  align-items: flex-start !important;
  gap: 1.15rem !important;
  background: #ffffff !important;
  color: #1a0a24 !important;
  border-top: 1px solid #e9d5ff !important;
  border-right: 1px solid #e9d5ff !important;
  border-bottom: 1px solid #e9d5ff !important;
  border-left: 5px solid #6716aa !important;
  border-radius: 14px !important;
  box-shadow: 0 4px 14px rgba(59, 10, 92, 0.1) !important;
  padding: 1.2rem 1.2rem 1.25rem !important;
  margin: 0 0 1.2rem 0 !important;
  overflow: visible !important;
  box-sizing: border-box !important;
}

html body.path-team.page-team .team-teaser .team-thumb {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  flex: 0 0 auto !important;
  width: 118px !important;
  min-width: 118px !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

html body.path-team.page-team .team-teaser .team-thumb .field-item,
html body.path-team.page-team .team-teaser .team-thumb .field-item > a,
html body.path-team.page-team .team-teaser .team-thumb > .field {
  display: block !important;
  width: 108px !important;
  height: 108px !important;
  margin: 0 auto !important;
  border-radius: 50% !important;
  overflow: hidden !important;
  border: 3px solid #6716aa !important;
  box-shadow: 0 3px 10px rgba(59, 10, 92, 0.16) !important;
  background: #fff !important;
  box-sizing: border-box !important;
}

html body.path-team.page-team .team-teaser .team-thumb img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  border: 0 !important;
  border-radius: 50% !important;
}

html body.path-team.page-team .team-teaser .team-social {
  position: static !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 0.6rem !important;
  width: 100% !important;
  margin: 0.55rem 0 0 0 !important;
  padding: 0 !important;
  opacity: 1 !important;
}

html body.path-team.page-team .team-teaser .team-social a {
  display: inline-flex !important;
  width: auto !important;
  height: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0.15rem !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #6716aa !important;
  -webkit-text-fill-color: #6716aa !important;
  font-size: 1.28rem !important;
  line-height: 1 !important;
  text-decoration: none !important;
  transform: none !important;
}

html body.path-team.page-team .team-teaser .team-meta {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  margin: 0 !important;
  margin-left: 0 !important;
  padding: 0 !important;
  text-align: left !important;
  position: static !important;
}

/* Name pill on the h4 only — link inside stays transparent (avoids double frame) */
html body.path-team.page-team #main-content .team-teaser .team-name,
html body.path-team.page-team .region.region-content .team-teaser .team-name,
html body.path-team.page-team #main-content .team-teaser h4.team-name,
html body.path-team.page-team .region.region-content .team-teaser h4.team-name {
  display: inline-block !important;
  width: auto !important;
  max-width: 100% !important;
  margin: 0 0 0.4rem 0 !important;
  margin-left: 0 !important;
  padding: 0.45rem 0.95rem !important;
  background: linear-gradient(135deg, #3b0a5c 0%, #6716aa 55%, #7b2cbf 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border: 2px solid #000 !important;
  border-radius: 8px !important;
  font-weight: 800 !important;
  font-size: 1.12rem !important;
  line-height: 1.25 !important;
  text-decoration: none !important;
  text-shadow: none !important;
  box-shadow: 0 2px 6px rgba(59, 10, 92, 0.16) !important;
  box-sizing: border-box !important;
  position: static !important;
  animation: none !important;
  transform: none !important;
  white-space: nowrap !important;
  overflow: visible !important;
}

html body.path-team.page-team #main-content .team-teaser .team-name a,
html body.path-team.page-team .region.region-content .team-teaser .team-name a,
html body.path-team.page-team #main-content .team-teaser h4.team-name a,
html body.path-team.page-team .region.region-content .team-teaser h4.team-name a {
  display: inline !important;
  width: auto !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border: 0 !important;
  border-width: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
  font-weight: inherit !important;
  font-size: inherit !important;
  line-height: inherit !important;
  text-decoration: none !important;
  text-shadow: none !important;
  text-wrap: auto !important;
}

html body.path-team.page-team .team-teaser .team-position {
  color: #6716aa !important;
  -webkit-text-fill-color: #6716aa !important;
  font-weight: 750 !important;
  font-size: 1rem !important;
  margin: 0 0 0.5rem 0 !important;
  background: transparent !important;
  border: 0 !important;
}

html body.path-team.page-team .team-teaser .team-biography {
  background: #f3e8ff !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  border-top: 1px solid #e9d5ff !important;
  border-right: 1px solid #e9d5ff !important;
  border-bottom: 1px solid #e9d5ff !important;
  border-left: 4px solid #b781e3 !important;
  border-radius: 8px !important;
  padding: 0.7rem 0.85rem !important;
  margin: 0 !important;
  font-style: normal !important;
  line-height: 1.55 !important;
  font-size: 0.95rem !important;
  max-height: 8.5rem !important;
  overflow-y: auto !important;
  text-shadow: none !important;
}

/* ---- Mobile ---- */
@media (max-width: 991.98px) {
  html body.path-team.page-team #block-martis-teamh1title h1,
  html body.path-team.page-team #main-content h1 {
    font-size: 1.2rem !important;
    padding: 0.7rem 0.85rem !important;
    margin: 0.35rem 0 0.85rem 0 !important;
    border-radius: 10px !important;
  }

  html body.path-team.page-team .team-teaser {
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    gap: 0.55rem !important;
    padding: 1.1rem 0.95rem 1.15rem !important;
  }

  html body.path-team.page-team .team-teaser .team-thumb {
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
  }

  html body.path-team.page-team .team-teaser .team-thumb .field-item,
  html body.path-team.page-team .team-teaser .team-thumb .field-item > a,
  html body.path-team.page-team .team-teaser .team-thumb > .field {
    width: 120px !important;
    height: 120px !important;
  }

  html body.path-team.page-team .team-teaser .team-social {
    margin-top: 0.4rem !important;
    margin-bottom: 0.15rem !important;
    gap: 0.75rem !important;
  }

  html body.path-team.page-team .team-teaser .team-social a {
    font-size: 1.4rem !important;
    color: #6716aa !important;
  }

  html body.path-team.page-team .team-teaser .team-meta {
    width: 100% !important;
    text-align: center !important;
    margin: 0 !important;
  }

  html body.path-team.page-team #main-content .team-teaser .team-name,
  html body.path-team.page-team .region.region-content .team-teaser .team-name,
  html body.path-team.page-team #main-content .team-teaser h4.team-name {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0.1rem 0 0.35rem 0 !important;
    padding: 0.55rem 0.8rem !important;
    font-size: 1.1rem !important;
    text-align: center !important;
    white-space: normal !important;
  }

  html body.path-team.page-team #main-content .team-teaser .team-name a,
  html body.path-team.page-team .region.region-content .team-teaser .team-name a {
    display: inline !important;
    width: auto !important;
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
    background-image: none !important;
    border: 0 !important;
    box-shadow: none !important;
  }

  html body.path-team.page-team .team-teaser .team-position {
    margin: 0 0 0.45rem 0 !important;
    font-size: 1.02rem !important;
  }

  html body.path-team.page-team .team-teaser .team-biography {
    text-align: left !important;
    max-height: 9rem !important;
  }

  /* Individual banner stacks cleanly full-bleed of content column */
  html body.page-node-type-team .team-header .col-sm-5.figure,
  html body.page-node-type-team .team-header .figure {
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    gap: 0.7rem !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 1.2rem 1rem 1.25rem !important;
    border-radius: 12px !important;
  }

  html body.page-node-type-team .team-header .team-thumb {
    width: 112px !important;
    height: 112px !important;
    min-width: 112px !important;
    min-height: 112px !important;
    margin: 0 auto !important;
  }

  html body.page-node-type-team .team-header .team-meta,
  html body.page-node-type-team .team-header .team-meta.text-left {
    text-align: center !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  html body.page-node-type-team .team-header .team-name {
    font-size: 1.4rem !important;
    margin-bottom: 0.15rem !important;
  }

  html body.page-node-type-team .team-header .team-position {
    margin-bottom: 0.4rem !important;
  }

  html body.page-node-type-team .team-header .team-social {
    justify-content: center !important;
    gap: 0.9rem !important;
  }

  html body.page-node-type-team .team-header .team-social a {
    font-size: 1.4rem !important;
  }

  html body.page-node-type-team .profile-cards-wrapper > .card > .card,
  html body.page-node-type-team .profile-cards-wrapper > .card:has(> h2),
  html body.page-node-type-team .profile-cards-wrapper > .card:has(> h3),
  html body.page-node-type-team .profile-cards-wrapper .faq-card {
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
}

@media (max-width: 575.98px) {
  html body.path-team.page-team #block-martis-teamh1title h1,
  html body.path-team.page-team #main-content h1 {
    font-size: 1.08rem !important;
    padding: 0.6rem 0.7rem !important;
  }

  html body.path-team.page-team .team-teaser {
    gap: 0.45rem !important;
    padding: 1rem 0.85rem 1.05rem !important;
  }

  html body.path-team.page-team .team-teaser .team-thumb .field-item,
  html body.path-team.page-team .team-teaser .team-thumb .field-item > a,
  html body.path-team.page-team .team-teaser .team-thumb > .field {
    width: 108px !important;
    height: 108px !important;
  }

  html body.path-team.page-team .team-teaser .team-social {
    margin-top: 0.3rem !important;
  }

  html body.path-team.page-team .team-teaser .team-name {
    font-size: 1.05rem !important;
    padding: 0.5rem 0.7rem !important;
  }

  html body.page-node-type-team .team-header .team-thumb {
    width: 104px !important;
    height: 104px !important;
    min-width: 104px !important;
    min-height: 104px !important;
  }

  html body.page-node-type-team .team-header .team-name {
    font-size: 1.28rem !important;
  }

  html body.page-node-type-team .team-header .col-sm-5.figure,
  html body.page-node-type-team .team-header .figure {
    padding: 1.05rem 0.85rem 1.1rem !important;
  }
}


/* Team individual — center "Frequently Asked Questions" on all breakpoints */
html body.page-node-type-team .profile-cards-wrapper > h2,
html body.page-node-type-team .profile-cards-wrapper h2:is([style*="text-align"],.jd-db-match-1e410919678a),
html body.page-node-type-team .team-body .profile-cards-wrapper > h2,
html body.page-node-type-team #main-content .profile-cards-wrapper > h2 {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
  float: none !important;
}

/* ==========================================================================
   Service pages — center service-brag heading + "Want to customize a package?"
   (same treatment as team FAQ heading)
   ========================================================================== */

/* service-brag comparison card header / title / subtitle */
html body.page-node-type-service .service-brag .cy-card-header,
html body.page-node-type-service .layout__region--second .service-brag .cy-card-header,
html body.page-node-type-service .service-brag .cy-comparison-block .cy-card-header {
  text-align: center !important;
  display: block !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

html body.page-node-type-service .service-brag .cy-heading,
html body.page-node-type-service .service-brag h2.cy-heading,
html body.page-node-type-service .service-brag .cy-card-header h2,
html body.page-node-type-service .service-brag .cy-comparison-block h2 {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
  float: none !important;
  box-sizing: border-box !important;
}

html body.page-node-type-service .service-brag .cy-subtitle,
html body.page-node-type-service .service-brag .cy-card-header p,
html body.page-node-type-service .service-brag .cy-card-header .cy-subtitle {
  display: block !important;
  width: 100% !important;
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* "Want to customize a package?" CTA block titles (all variants) */
html body.page-node-type-service #block-traditionaldetailingblock .block-title-wrap,
html body.page-node-type-service #block-rvdetailingblock .block-title-wrap,
html body.page-node-type-service #block-boatdetailingblock .block-title-wrap,
html body.page-node-type-service #block-ceramiccoatingblock .block-title-wrap,
html body.page-node-type-service #block-marineceramiccoatingblock .block-title-wrap,
html body.page-node-type-service #block-paintcorrectionblock .block-title-wrap,
html body.page-node-type-service [id$="detailingblock"] .block-title-wrap,
html body.page-node-type-service [id*="ceramiccoatingblock"] .block-title-wrap,
html body.page-node-type-service [id*="paintcorrectionblock"] .block-title-wrap {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  text-align: center !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

html body.page-node-type-service #block-traditionaldetailingblock .block-title-content,
html body.page-node-type-service #block-rvdetailingblock .block-title-content,
html body.page-node-type-service #block-boatdetailingblock .block-title-content,
html body.page-node-type-service #block-ceramiccoatingblock .block-title-content,
html body.page-node-type-service #block-marineceramiccoatingblock .block-title-content,
html body.page-node-type-service #block-paintcorrectionblock .block-title-content,
html body.page-node-type-service [id$="detailingblock"] .block-title-content,
html body.page-node-type-service [id*="ceramiccoatingblock"] .block-title-content,
html body.page-node-type-service [id*="paintcorrectionblock"] .block-title-content {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
  float: none !important;
}

html body.page-node-type-service #block-traditionaldetailingblock h2.block-title,
html body.page-node-type-service #block-rvdetailingblock h2.block-title,
html body.page-node-type-service #block-boatdetailingblock h2.block-title,
html body.page-node-type-service #block-ceramiccoatingblock h2.block-title,
html body.page-node-type-service #block-marineceramiccoatingblock h2.block-title,
html body.page-node-type-service #block-paintcorrectionblock h2.block-title,
html body.page-node-type-service [id$="detailingblock"] h2.block-title,
html body.page-node-type-service [id*="ceramiccoatingblock"] h2.block-title,
html body.page-node-type-service [id*="paintcorrectionblock"] h2.block-title {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  text-align: center !important;
  justify-content: center !important;
  align-items: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
  float: none !important;
}

/* Also center body intro text under that heading for a consistent CTA band */
html body.page-node-type-service #block-traditionaldetailingblock .block-content,
html body.page-node-type-service #block-rvdetailingblock .block-content,
html body.page-node-type-service #block-boatdetailingblock .block-content,
html body.page-node-type-service #block-ceramiccoatingblock .block-content,
html body.page-node-type-service #block-marineceramiccoatingblock .block-content,
html body.page-node-type-service #block-paintcorrectionblock .block-content,
html body.page-node-type-service [id$="detailingblock"] .block-content,
html body.page-node-type-service [id*="ceramiccoatingblock"] .block-content,
html body.page-node-type-service [id*="paintcorrectionblock"] .block-content {
  text-align: center !important;
}

html body.page-node-type-service #block-traditionaldetailingblock .block-content p,
html body.page-node-type-service #block-rvdetailingblock .block-content p,
html body.page-node-type-service #block-boatdetailingblock .block-content p,
html body.page-node-type-service #block-ceramiccoatingblock .block-content p,
html body.page-node-type-service #block-marineceramiccoatingblock .block-content p,
html body.page-node-type-service #block-paintcorrectionblock .block-content p,
html body.page-node-type-service [id$="detailingblock"] .block-content p,
html body.page-node-type-service [id*="ceramiccoatingblock"] .block-content p,
html body.page-node-type-service [id*="paintcorrectionblock"] .block-content p {
  text-align: center !important;
}

/* ==========================================================================
   Service pages — engaging color polish for service-brag + customize CTA
   Palette: Forest #3b0a5c · Brand #6716aa · Mid #7b2cbf · Leaf #b781e3
            Mint #c9a0e8 · Soft #f3e8ff · Mist #f5f0fa · Border #e9d5ff · Ink #1a0a24
   ========================================================================== */

/* ---- service-brag comparison card shell ---- */
html body.page-node-type-service .service-brag .cy-material-card,
html body.page-node-type-service .service-brag .cy-comparison-block .cy-material-card {
  background: #ffffff !important;
  border: 2px solid #3b0a5c !important;
  border-radius: 14px !important;
  box-shadow: 0 6px 18px -4px rgba(59, 10, 92, 0.18) !important;
  overflow: hidden !important;
}

/* Header band — forest gradient, white title */
html body.page-node-type-service .service-brag .cy-card-header,
html body.page-node-type-service .service-brag .cy-comparison-block .cy-card-header {
  background: linear-gradient(135deg, #3b0a5c 0%, #6716aa 50%, #7b2cbf 100%) !important;
  background-color: #3b0a5c !important;
  padding: 1rem 1.1rem 0.9rem !important;
  text-align: center !important;
}

html body.page-node-type-service .service-brag .cy-heading,
html body.page-node-type-service .service-brag h2.cy-heading,
html body.page-node-type-service .service-brag .cy-card-header h2 {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-weight: 800 !important;
  font-size: clamp(1.15rem, 2.2vw, 1.4rem) !important;
  line-height: 1.25 !important;
  margin: 0 0 0.45rem 0 !important;
  text-shadow: none !important;
  text-align: center !important;
}

/* Subtitle as soft mint chip on the green header */
html body.page-node-type-service .service-brag .cy-subtitle,
html body.page-node-type-service .service-brag .cy-card-header .cy-subtitle,
html body.page-node-type-service .service-brag .cy-card-header p {
  display: inline-block !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  padding: 0.35rem 0.85rem !important;
  background: #f3e8ff !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  border: 1px solid #e9d5ff !important;
  border-radius: 999px !important;
  font-size: 0.82rem !important;
  font-weight: 650 !important;
  line-height: 1.35 !important;
  text-align: center !important;
  box-shadow: 0 1px 4px rgba(59, 10, 92, 0.12) !important;
}

/* Table container */
html body.page-node-type-service .service-brag .cy-table-container {
  background: #f5f0fa !important;
}

/* Table headers — soft mint band, brand ink */
html body.page-node-type-service .service-brag .cy-comparison-table thead th,
html body.page-node-type-service .service-brag table thead th {
  background: #f3e8ff !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  border-bottom: 2px solid #3b0a5c !important;
  border-right: 1px solid #e9d5ff !important;
  font-weight: 750 !important;
  letter-spacing: 0.02em !important;
}

html body.page-node-type-service .service-brag .cy-comparison-table thead th p,
html body.page-node-type-service .service-brag table thead th p {
  color: inherit !important;
  -webkit-text-fill-color: inherit !important;
  margin: 0 !important;
  background: transparent !important;
  border: 0 !important;
}

/* Johnny Detail recommended column header — solid brand green */
html body.page-node-type-service .service-brag .cy-comparison-table thead th.cy-recommended-col,
html body.page-node-type-service .service-brag table thead th.cy-recommended-col {
  background: linear-gradient(180deg, #6716aa 0%, #3b0a5c 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border: 1px solid #3b0a5c !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08) !important;
}

html body.page-node-type-service .service-brag .cy-comparison-table thead th.cy-recommended-col p,
html body.page-node-type-service .service-brag table thead th.cy-recommended-col p {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

/* Feature labels as soft mint pills */
html body.page-node-type-service .service-brag .cy-comparison-table tbody td:first-child,
html body.page-node-type-service .service-brag .cy-comparison-table tbody td.cy-feature {
  background: #f5f0fa !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  font-weight: 700 !important;
}

html body.page-node-type-service .service-brag .cy-comparison-table tbody td:first-child p,
html body.page-node-type-service .service-brag .cy-feature p {
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  background: #f3e8ff !important;
  border: 1px solid #e9d5ff !important;
  border-radius: 10px !important;
  padding: 0.45rem 0.55rem !important;
  margin: 0 !important;
  display: inline-block !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  line-height: 1.3 !important;
}

/* Johnny Detail column body cells — soft green wash */
html body.page-node-type-service .service-brag .cy-comparison-table tbody td.cy-recommended-col,
html body.page-node-type-service .service-brag .cy-comparison-table .cy-recommended-col {
  background-color: #f3e8ff !important;
  background: #f3e8ff !important;
}

/* Body cells / borders */
html body.page-node-type-service .service-brag .cy-comparison-table tbody td {
  border-bottom: 1px solid #e9d5ff !important;
  border-right: 1px solid #e9d5ff !important;
  color: #1a0a24 !important;
  background-color: #ffffff !important;
}

html body.page-node-type-service .service-brag .cy-comparison-table tbody tr:nth-child(even) td:not(.cy-recommended-col):not(:first-child) {
  background-color: #f5f0fa !important;
}

/* Checkmarks stronger brand green */
html body.page-node-type-service .service-brag .cy-icon-wrapper,
html body.page-node-type-service .service-brag .cy-comparison-table svg,
html body.page-node-type-service .service-brag .cy-comparison-table .cy-check {
  color: #6716aa !important;
}

html body.page-node-type-service .service-brag .cy-comparison-table .cy-icon-wrapper svg path,
html body.page-node-type-service .service-brag .cy-comparison-table svg path[fill],
html body.page-node-type-service .service-brag .cy-comparison-table svg [fill="#7b2cbf"],
html body.page-node-type-service .service-brag .cy-comparison-table svg [fill="#6716aa"] {
  fill: #6716aa !important;
}

/* Badges — keep readable with brand-adjacent tones */
html body.page-node-type-service .service-brag .cy-badge {
  border: 2px solid #000 !important;
  font-weight: 750 !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08) !important;
}

html body.page-node-type-service .service-brag .cy-badge-amber {
  background: #fef3c7 !important;
  color: #92400e !important;
}

html body.page-node-type-service .service-brag .cy-badge-red {
  background: #fee2e2 !important;
  color: #991b1b !important;
}

/* Footer trust strip */
html body.page-node-type-service .service-brag .cy-card-footer {
  background: linear-gradient(180deg, #f3e8ff 0%, #f5f0fa 100%) !important;
  border-top: 1px solid #e9d5ff !important;
  padding: 0.7rem 1rem !important;
}

html body.page-node-type-service .service-brag .cy-trust-note {
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  font-weight: 600 !important;
}

/* ==========================================================================
   "Want to customize a package?" CTA — rich forest band + clear button
   ========================================================================== */
html body.page-node-type-service #block-traditionaldetailingblock,
html body.page-node-type-service #block-rvdetailingblock,
html body.page-node-type-service #block-boatdetailingblock,
html body.page-node-type-service #block-ceramiccoatingblock,
html body.page-node-type-service #block-marineceramiccoatingblock,
html body.page-node-type-service #block-paintcorrectionblock,
html body.page-node-type-service [id$="detailingblock"],
html body.page-node-type-service [id*="ceramiccoatingblock"],
html body.page-node-type-service [id*="paintcorrectionblock"] {
  background: transparent !important;
  margin-top: 0.5rem !important;
  margin-bottom: 0 !important;
}

html body.page-node-type-service #block-traditionaldetailingblock > .container-wrap,
html body.page-node-type-service #block-rvdetailingblock > .container-wrap,
html body.page-node-type-service #block-boatdetailingblock > .container-wrap,
html body.page-node-type-service #block-ceramiccoatingblock > .container-wrap,
html body.page-node-type-service #block-marineceramiccoatingblock > .container-wrap,
html body.page-node-type-service #block-paintcorrectionblock > .container-wrap,
html body.page-node-type-service [id$="detailingblock"] > .container-wrap,
html body.page-node-type-service [id*="ceramiccoatingblock"] > .container-wrap,
html body.page-node-type-service [id*="paintcorrectionblock"] > .container-wrap {
  background: linear-gradient(120deg, #3b0a5c 0%, #6716aa 42%, #7b2cbf 78%, #b781e3 100%) !important;
  border-top: 2px solid #000 !important;
  border-bottom: 2px solid #000 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12), 0 -4px 18px rgba(59, 10, 92, 0.12) !important;
  padding: 1.6rem 1.25rem 1.75rem !important;
  margin: 0 !important;
  max-width: none !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

/* Title */
html body.page-node-type-service #block-traditionaldetailingblock h2.block-title,
html body.page-node-type-service #block-rvdetailingblock h2.block-title,
html body.page-node-type-service #block-boatdetailingblock h2.block-title,
html body.page-node-type-service #block-ceramiccoatingblock h2.block-title,
html body.page-node-type-service #block-marineceramiccoatingblock h2.block-title,
html body.page-node-type-service #block-paintcorrectionblock h2.block-title,
html body.page-node-type-service [id$="detailingblock"] h2.block-title,
html body.page-node-type-service [id*="ceramiccoatingblock"] h2.block-title,
html body.page-node-type-service [id*="paintcorrectionblock"] h2.block-title {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-weight: 800 !important;
  font-size: clamp(1.35rem, 2.8vw, 1.85rem) !important;
  line-height: 1.25 !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25) !important;
  margin: 0 0 0.55rem 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  text-align: center !important;
}

/* Decorative rule under title */
html body.page-node-type-service #block-traditionaldetailingblock .block-title-wrap::after,
html body.page-node-type-service #block-rvdetailingblock .block-title-wrap::after,
html body.page-node-type-service #block-boatdetailingblock .block-title-wrap::after,
html body.page-node-type-service #block-ceramiccoatingblock .block-title-wrap::after,
html body.page-node-type-service #block-marineceramiccoatingblock .block-title-wrap::after,
html body.page-node-type-service #block-paintcorrectionblock .block-title-wrap::after,
html body.page-node-type-service [id$="detailingblock"] .block-title-wrap::after,
html body.page-node-type-service [id*="ceramiccoatingblock"] .block-title-wrap::after,
html body.page-node-type-service [id*="paintcorrectionblock"] .block-title-wrap::after {
  content: "" !important;
  display: block !important;
  width: min(220px, 55%) !important;
  height: 3px !important;
  margin: 0.15rem auto 0.85rem auto !important;
  background: linear-gradient(90deg, transparent, #c9a0e8, #ffffff, #c9a0e8, transparent) !important;
  border-radius: 2px !important;
}

/* Body copy — high-contrast soft mint */
html body.page-node-type-service #block-traditionaldetailingblock .block-content,
html body.page-node-type-service #block-rvdetailingblock .block-content,
html body.page-node-type-service #block-boatdetailingblock .block-content,
html body.page-node-type-service #block-ceramiccoatingblock .block-content,
html body.page-node-type-service #block-marineceramiccoatingblock .block-content,
html body.page-node-type-service #block-paintcorrectionblock .block-content,
html body.page-node-type-service [id$="detailingblock"] .block-content,
html body.page-node-type-service [id*="ceramiccoatingblock"] .block-content,
html body.page-node-type-service [id*="paintcorrectionblock"] .block-content {
  text-align: center !important;
  max-width: 720px !important;
  margin: 0 auto !important;
}

html body.page-node-type-service #block-traditionaldetailingblock .block-content p,
html body.page-node-type-service #block-rvdetailingblock .block-content p,
html body.page-node-type-service #block-boatdetailingblock .block-content p,
html body.page-node-type-service #block-ceramiccoatingblock .block-content p,
html body.page-node-type-service #block-marineceramiccoatingblock .block-content p,
html body.page-node-type-service #block-paintcorrectionblock .block-content p,
html body.page-node-type-service [id$="detailingblock"] .block-content p,
html body.page-node-type-service [id*="ceramiccoatingblock"] .block-content p,
html body.page-node-type-service [id*="paintcorrectionblock"] .block-content p {
  color: #eafff3 !important;
  -webkit-text-fill-color: #eafff3 !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2) !important;
  font-size: 1.02rem !important;
  line-height: 1.55 !important;
  font-weight: 500 !important;
  margin: 0 0 1rem 0 !important;
  background: transparent !important;
  border: 0 !important;
  text-align: center !important;
}

/* Primary CTA button — solid white/mint, forest text, strong border */
html body.page-node-type-service #block-traditionaldetailingblock .block-content a,
html body.page-node-type-service #block-rvdetailingblock .block-content a,
html body.page-node-type-service #block-boatdetailingblock .block-content a,
html body.page-node-type-service #block-ceramiccoatingblock .block-content a,
html body.page-node-type-service #block-marineceramiccoatingblock .block-content a,
html body.page-node-type-service #block-paintcorrectionblock .block-content a,
html body.page-node-type-service [id$="detailingblock"] .block-content a,
html body.page-node-type-service [id*="ceramiccoatingblock"] .block-content a,
html body.page-node-type-service [id*="paintcorrectionblock"] .block-content a,
html body.page-node-type-service #block-traditionaldetailingblock a[href*="/form/get-in-touch"],
html body.page-node-type-service #block-rvdetailingblock a[href*="/form/get-in-touch"],
html body.page-node-type-service #block-boatdetailingblock a[href*="/form/get-in-touch"],
html body.page-node-type-service #block-traditionaldetailingblock a.button,
html body.page-node-type-service #block-rvdetailingblock a.button,
html body.page-node-type-service #block-boatdetailingblock a.button,
html body.page-node-type-service #block-traditionaldetailingblock a.side-btn,
html body.page-node-type-service #block-rvdetailingblock a.side-btn,
html body.page-node-type-service #block-boatdetailingblock a.side-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: min(320px, 92%) !important;
  width: auto !important;
  max-width: 100% !important;
  margin: 0.25rem auto 0 auto !important;
  background: linear-gradient(180deg, #ffffff 0%, #f3e8ff 100%) !important;
  background-color: #ffffff !important;
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  border: 2px solid #000 !important;
  border-radius: 12px !important;
  font-weight: 800 !important;
  font-size: 1.05rem !important;
  letter-spacing: 0.01em !important;
  text-decoration: none !important;
  text-shadow: none !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.22) !important;
  transition: transform 0.15s ease, box-shadow 0.15s ease, background 0.15s ease !important;
  opacity: 1 !important;
  filter: none !important;
}

html body.page-node-type-service #block-traditionaldetailingblock .block-content a:hover,
html body.page-node-type-service #block-rvdetailingblock .block-content a:hover,
html body.page-node-type-service #block-boatdetailingblock .block-content a:hover,
html body.page-node-type-service #block-ceramiccoatingblock .block-content a:hover,
html body.page-node-type-service #block-marineceramiccoatingblock .block-content a:hover,
html body.page-node-type-service #block-paintcorrectionblock .block-content a:hover,
html body.page-node-type-service [id$="detailingblock"] .block-content a:hover,
html body.page-node-type-service [id*="ceramiccoatingblock"] .block-content a:hover,
html body.page-node-type-service [id*="paintcorrectionblock"] .block-content a:hover,
html body.page-node-type-service #block-traditionaldetailingblock a[href*="/form/get-in-touch"]:hover,
html body.page-node-type-service #block-rvdetailingblock a[href*="/form/get-in-touch"]:hover,
html body.page-node-type-service #block-boatdetailingblock a[href*="/form/get-in-touch"]:hover {
  background: linear-gradient(180deg, #f3e8ff 0%, #c9a0e8 100%) !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.28) !important;
  text-decoration: none !important;
}

/* Mobile polish */
@media (max-width: 991.98px) {
  html body.page-node-type-service .service-brag .cy-card-header {
    padding: 0.9rem 0.85rem 0.8rem !important;
  }

  html body.page-node-type-service .service-brag .cy-heading,
  html body.page-node-type-service .service-brag h2.cy-heading {
    font-size: 1.15rem !important;
  }

  html body.page-node-type-service .service-brag .cy-subtitle,
  html body.page-node-type-service .service-brag .cy-card-header .cy-subtitle {
    font-size: 0.78rem !important;
    padding: 0.3rem 0.7rem !important;
  }

  html body.page-node-type-service .service-brag .cy-comparison-table tbody td:first-child p,
  html body.page-node-type-service .service-brag .cy-feature p {
    font-size: 0.78rem !important;
    padding: 0.35rem 0.45rem !important;
  }

  html body.page-node-type-service #block-traditionaldetailingblock > .container-wrap,
  html body.page-node-type-service #block-rvdetailingblock > .container-wrap,
  html body.page-node-type-service #block-boatdetailingblock > .container-wrap,
  html body.page-node-type-service #block-ceramiccoatingblock > .container-wrap,
  html body.page-node-type-service #block-marineceramiccoatingblock > .container-wrap,
  html body.page-node-type-service #block-paintcorrectionblock > .container-wrap,
  html body.page-node-type-service [id$="detailingblock"] > .container-wrap,
  html body.page-node-type-service [id*="ceramiccoatingblock"] > .container-wrap,
  html body.page-node-type-service [id*="paintcorrectionblock"] > .container-wrap {
    padding: 1.35rem 1rem 1.5rem !important;
  }

  html body.page-node-type-service #block-traditionaldetailingblock h2.block-title,
  html body.page-node-type-service #block-rvdetailingblock h2.block-title,
  html body.page-node-type-service #block-boatdetailingblock h2.block-title,
  html body.page-node-type-service [id$="detailingblock"] h2.block-title,
  html body.page-node-type-service [id*="ceramiccoatingblock"] h2.block-title,
  html body.page-node-type-service [id*="paintcorrectionblock"] h2.block-title {
    font-size: 1.3rem !important;
  }

  html body.page-node-type-service #block-traditionaldetailingblock .block-content p,
  html body.page-node-type-service #block-rvdetailingblock .block-content p,
  html body.page-node-type-service [id$="detailingblock"] .block-content p,
  html body.page-node-type-service [id*="ceramiccoatingblock"] .block-content p,
  html body.page-node-type-service [id*="paintcorrectionblock"] .block-content p {
    font-size: 0.96rem !important;
    padding: 0 0.25rem !important;
  }

  html body.page-node-type-service #block-traditionaldetailingblock .block-content a,
  html body.page-node-type-service #block-rvdetailingblock .block-content a,
  html body.page-node-type-service [id$="detailingblock"] .block-content a,
  html body.page-node-type-service [id*="ceramiccoatingblock"] .block-content a,
  html body.page-node-type-service [id*="paintcorrectionblock"] .block-content a {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    padding: 0.9rem 1.1rem !important;
    font-size: 1.02rem !important;
  }
}

@media (max-width: 575.98px) {
  html body.page-node-type-service .service-brag .cy-heading {
    font-size: 1.08rem !important;
  }

  html body.page-node-type-service #block-traditionaldetailingblock h2.block-title,
  html body.page-node-type-service [id$="detailingblock"] h2.block-title {
    font-size: 1.2rem !important;
  }
}

/* ==========================================================================
   Service CTA + brag fixes — center title for real, kill white gap, RECOMMENDED
   fully visible in cell (desktop + mobile)
   ========================================================================== */

/* ---- Customize package: full-width centered title (no left shrink-wrap) ---- */
html body.page-node-type-service #block-traditionaldetailingblock,
html body.page-node-type-service #block-rvdetailingblock,
html body.page-node-type-service #block-boatdetailingblock,
html body.page-node-type-service #block-ceramiccoatingblock,
html body.page-node-type-service #block-marineceramiccoatingblock,
html body.page-node-type-service #block-paintcorrectionblock,
html body.page-node-type-service [id$="detailingblock"],
html body.page-node-type-service [id*="ceramiccoatingblock"],
html body.page-node-type-service [id*="paintcorrectionblock"] {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: linear-gradient(120deg, #3b0a5c 0%, #6716aa 42%, #7b2cbf 78%, #b781e3 100%) !important;
  /* gradient on the BLOCK itself so no white strip under container-wrap */
}

html body.page-node-type-service #block-traditionaldetailingblock > .container-wrap,
html body.page-node-type-service #block-rvdetailingblock > .container-wrap,
html body.page-node-type-service #block-boatdetailingblock > .container-wrap,
html body.page-node-type-service #block-ceramiccoatingblock > .container-wrap,
html body.page-node-type-service #block-marineceramiccoatingblock > .container-wrap,
html body.page-node-type-service #block-paintcorrectionblock > .container-wrap,
html body.page-node-type-service [id$="detailingblock"] > .container-wrap,
html body.page-node-type-service [id*="ceramiccoatingblock"] > .container-wrap,
html body.page-node-type-service [id*="paintcorrectionblock"] > .container-wrap {
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-top: 0 !important;
  border-bottom: 0 !important;
  box-shadow: none !important;
  margin: 0 auto !important;
  padding: 1.35rem 1rem 1.25rem !important;
  max-width: 920px !important;
  width: 100% !important;
  box-sizing: border-box !important;
  text-align: center !important;
  float: none !important;
}

/* Title stack — full width, true center (defeat clearfix + shrink-wrap) */
html body.page-node-type-service #block-traditionaldetailingblock .block-title-wrap,
html body.page-node-type-service #block-rvdetailingblock .block-title-wrap,
html body.page-node-type-service #block-boatdetailingblock .block-title-wrap,
html body.page-node-type-service #block-ceramiccoatingblock .block-title-wrap,
html body.page-node-type-service #block-marineceramiccoatingblock .block-title-wrap,
html body.page-node-type-service #block-paintcorrectionblock .block-title-wrap,
html body.page-node-type-service [id$="detailingblock"] .block-title-wrap,
html body.page-node-type-service [id*="ceramiccoatingblock"] .block-title-wrap,
html body.page-node-type-service [id*="paintcorrectionblock"] .block-title-wrap {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  padding: 0 !important;
  text-align: center !important;
  float: none !important;
  clear: both !important;
}

/* Kill clearfix pseudo-elements that break centering as flex items */
html body.page-node-type-service #block-traditionaldetailingblock .block-title-wrap::before,
html body.page-node-type-service #block-rvdetailingblock .block-title-wrap::before,
html body.page-node-type-service #block-boatdetailingblock .block-title-wrap::before,
html body.page-node-type-service [id$="detailingblock"] .block-title-wrap::before,
html body.page-node-type-service [id*="ceramiccoatingblock"] .block-title-wrap::before,
html body.page-node-type-service [id*="paintcorrectionblock"] .block-title-wrap::before,
html body.page-node-type-service #block-traditionaldetailingblock .container-wrap::before,
html body.page-node-type-service #block-traditionaldetailingblock .container-wrap::after,
html body.page-node-type-service #block-rvdetailingblock .container-wrap::before,
html body.page-node-type-service #block-rvdetailingblock .container-wrap::after,
html body.page-node-type-service [id$="detailingblock"] .container-wrap::before,
html body.page-node-type-service [id$="detailingblock"] .container-wrap::after,
html body.page-node-type-service [id*="ceramiccoatingblock"] .container-wrap::before,
html body.page-node-type-service [id*="ceramiccoatingblock"] .container-wrap::after,
html body.page-node-type-service [id*="paintcorrectionblock"] .container-wrap::before,
html body.page-node-type-service [id*="paintcorrectionblock"] .container-wrap::after {
  content: none !important;
  display: none !important;
}

/* Decorative rule stays after title wrap (re-declare after clearfix kill) */
html body.page-node-type-service #block-traditionaldetailingblock .block-title-wrap::after,
html body.page-node-type-service #block-rvdetailingblock .block-title-wrap::after,
html body.page-node-type-service #block-boatdetailingblock .block-title-wrap::after,
html body.page-node-type-service #block-ceramiccoatingblock .block-title-wrap::after,
html body.page-node-type-service #block-marineceramiccoatingblock .block-title-wrap::after,
html body.page-node-type-service #block-paintcorrectionblock .block-title-wrap::after,
html body.page-node-type-service [id$="detailingblock"] .block-title-wrap::after,
html body.page-node-type-service [id*="ceramiccoatingblock"] .block-title-wrap::after,
html body.page-node-type-service [id*="paintcorrectionblock"] .block-title-wrap::after {
  content: "" !important;
  display: block !important;
  width: min(200px, 50%) !important;
  height: 3px !important;
  margin: 0.2rem auto 0.75rem auto !important;
  background: linear-gradient(90deg, transparent, #c9a0e8, #ffffff, #c9a0e8, transparent) !important;
  border-radius: 2px !important;
}

html body.page-node-type-service #block-traditionaldetailingblock .block-title-content,
html body.page-node-type-service #block-rvdetailingblock .block-title-content,
html body.page-node-type-service #block-boatdetailingblock .block-title-content,
html body.page-node-type-service #block-ceramiccoatingblock .block-title-content,
html body.page-node-type-service #block-marineceramiccoatingblock .block-title-content,
html body.page-node-type-service #block-paintcorrectionblock .block-title-content,
html body.page-node-type-service [id$="detailingblock"] .block-title-content,
html body.page-node-type-service [id*="ceramiccoatingblock"] .block-title-content,
html body.page-node-type-service [id*="paintcorrectionblock"] .block-title-content {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  padding: 0 !important;
  text-align: center !important;
  float: none !important;
}

html body.page-node-type-service #block-traditionaldetailingblock h2.block-title,
html body.page-node-type-service #block-rvdetailingblock h2.block-title,
html body.page-node-type-service #block-boatdetailingblock h2.block-title,
html body.page-node-type-service #block-ceramiccoatingblock h2.block-title,
html body.page-node-type-service #block-marineceramiccoatingblock h2.block-title,
html body.page-node-type-service #block-paintcorrectionblock h2.block-title,
html body.page-node-type-service [id$="detailingblock"] h2.block-title,
html body.page-node-type-service [id*="ceramiccoatingblock"] h2.block-title,
html body.page-node-type-service [id*="paintcorrectionblock"] h2.block-title {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto 0.15rem auto !important;
  padding: 0 0.5rem !important;
  text-align: center !important;
  float: none !important;
  box-sizing: border-box !important;
  /* kill pulse animation that makes alignment look off */
  animation: none !important;
  transform: none !important;
  border-bottom: 0 !important;
  justify-content: center !important;
}

html body.page-node-type-service #block-traditionaldetailingblock .block-content,
html body.page-node-type-service #block-rvdetailingblock .block-content,
html body.page-node-type-service #block-boatdetailingblock .block-content,
html body.page-node-type-service #block-ceramiccoatingblock .block-content,
html body.page-node-type-service #block-marineceramiccoatingblock .block-content,
html body.page-node-type-service #block-paintcorrectionblock .block-content,
html body.page-node-type-service [id$="detailingblock"] .block-content,
html body.page-node-type-service [id*="ceramiccoatingblock"] .block-content,
html body.page-node-type-service [id*="paintcorrectionblock"] .block-content {
  display: block !important;
  width: 100% !important;
  max-width: 640px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  text-align: center !important;
  float: none !important;
}

html body.page-node-type-service #block-traditionaldetailingblock .block-content p,
html body.page-node-type-service #block-rvdetailingblock .block-content p,
html body.page-node-type-service #block-boatdetailingblock .block-content p,
html body.page-node-type-service [id$="detailingblock"] .block-content p,
html body.page-node-type-service [id*="ceramiccoatingblock"] .block-content p,
html body.page-node-type-service [id*="paintcorrectionblock"] .block-content p {
  text-align: center !important;
  margin: 0 auto 0.85rem auto !important;
  padding: 0 0.35rem !important;
}

html body.page-node-type-service #block-traditionaldetailingblock .block-content a,
html body.page-node-type-service #block-rvdetailingblock .block-content a,
html body.page-node-type-service #block-boatdetailingblock .block-content a,
html body.page-node-type-service [id$="detailingblock"] .block-content a,
html body.page-node-type-service [id*="ceramiccoatingblock"] .block-content a,
html body.page-node-type-service [id*="paintcorrectionblock"] .block-content a {
  margin: 0.15rem auto 0 auto !important;
}

/* Kill white gap under CTA before footer */
html body.page-node-type-service #block-traditionaldetailingblock,
html body.page-node-type-service #block-rvdetailingblock,
html body.page-node-type-service #block-boatdetailingblock,
html body.page-node-type-service [id$="detailingblock"],
html body.page-node-type-service [id*="ceramiccoatingblock"],
html body.page-node-type-service [id*="paintcorrectionblock"],
html body.page-node-type-service .region.region-content-wide > [id$="detailingblock"]:last-child,
html body.page-node-type-service #content-wide > [id$="detailingblock"]:last-child,
html body.page-node-type-service .region.region-content-wide > .block:last-child {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

html body.page-node-type-service #content-wide,
html body.page-node-type-service .region.region-content-wide,
html body.page-node-type-service .region-content-wide {
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
}

/* If footer follows immediately, no spacer strip */
html body.page-node-type-service #block-traditionaldetailingblock + *,
html body.page-node-type-service [id$="detailingblock"] + footer,
html body.page-node-type-service [id$="detailingblock"] + #footer,
html body.page-node-type-service [id$="detailingblock"] + .footer {
  margin-top: 0 !important;
}

/* ==========================================================================
   RECOMMENDED badge — inside green column, centered, fully visible
   ========================================================================== */
html body.page-node-type-service .service-brag .cy-comparison-table thead th.cy-recommended-col,
html body.page-node-type-service .service-brag table thead th.cy-recommended-col {
  position: relative !important;
  overflow: visible !important;
  white-space: normal !important;
  vertical-align: middle !important;
  text-align: center !important;
  padding: 0.55rem 0.3rem 0.45rem !important;
  line-height: 1.2 !important;
  box-sizing: border-box !important;
}

html body.page-node-type-service .service-brag .cy-comparison-table thead th.cy-recommended-col p,
html body.page-node-type-service .service-brag table thead th.cy-recommended-col p {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  text-align: center !important;
  white-space: normal !important;
  word-break: break-word !important;
  overflow-wrap: anywhere !important;
  font-size: inherit !important;
  line-height: 1.2 !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  background: transparent !important;
  border: 0 !important;
}

/* Place RECOMMENDED as first line inside the cell (static flow, not clipped absolute) */
html body.page-node-type-service .service-brag .cy-comparison-table thead th.cy-recommended-col::before,
html body.page-node-type-service .service-brag table thead th.cy-recommended-col::before {
  content: "★ RECOMMENDED" !important;
  display: block !important;
  position: static !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 0 0.2rem 0 !important;
  padding: 0.15rem 0.15rem !important;
  box-sizing: border-box !important;
  font-size: 0.55rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.04em !important;
  line-height: 1.15 !important;
  text-align: center !important;
  white-space: normal !important;
  word-break: break-word !important;
  color: #d8f5e6 !important;
  -webkit-text-fill-color: #d8f5e6 !important;
  opacity: 1 !important;
  background: rgba(0, 0, 0, 0.18) !important;
  border-radius: 4px !important;
}

/* Hide legacy absolute ::after that clips off-cell */
html body.page-node-type-service .service-brag .cy-comparison-table thead th.cy-recommended-col::after,
html body.page-node-type-service .service-brag table thead th.cy-recommended-col::after {
  content: none !important;
  display: none !important;
}

/* Trust footer fully visible + centered in card */
html body.page-node-type-service .service-brag .cy-card-footer {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  text-align: center !important;
  padding: 0.75rem 0.85rem !important;
  overflow: visible !important;
}

html body.page-node-type-service .service-brag .cy-trust-note {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  align-items: center !important;
  text-align: center !important;
  gap: 0.35rem !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  line-height: 1.4 !important;
  white-space: normal !important;
}

/* Mobile tighten */
@media (max-width: 991.98px) {
  html body.page-node-type-service #block-traditionaldetailingblock > .container-wrap,
  html body.page-node-type-service #block-rvdetailingblock > .container-wrap,
  html body.page-node-type-service [id$="detailingblock"] > .container-wrap,
  html body.page-node-type-service [id*="ceramiccoatingblock"] > .container-wrap,
  html body.page-node-type-service [id*="paintcorrectionblock"] > .container-wrap {
    padding: 1.2rem 0.9rem 1.1rem !important;
  }

  html body.page-node-type-service #block-traditionaldetailingblock h2.block-title,
  html body.page-node-type-service #block-rvdetailingblock h2.block-title,
  html body.page-node-type-service [id$="detailingblock"] h2.block-title,
  html body.page-node-type-service [id*="ceramiccoatingblock"] h2.block-title,
  html body.page-node-type-service [id*="paintcorrectionblock"] h2.block-title {
    font-size: 1.28rem !important;
    line-height: 1.25 !important;
    padding: 0 0.25rem !important;
  }

  html body.page-node-type-service #block-traditionaldetailingblock .block-content p,
  html body.page-node-type-service [id$="detailingblock"] .block-content p {
    font-size: 0.95rem !important;
    margin-bottom: 0.75rem !important;
  }

  html body.page-node-type-service #block-traditionaldetailingblock .block-content a,
  html body.page-node-type-service [id$="detailingblock"] .block-content a {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  /* RECOMMENDED fully in cell on narrow columns */
  html body.page-node-type-service .service-brag .cy-comparison-table thead th.cy-recommended-col,
  html body.page-node-type-service .service-brag table thead th.cy-recommended-col {
    padding: 0.4rem 0.2rem 0.35rem !important;
    min-width: 0 !important;
  }

  html body.page-node-type-service .service-brag .cy-comparison-table thead th.cy-recommended-col::before {
    font-size: 0.48rem !important;
    letter-spacing: 0.02em !important;
    padding: 0.12rem 0.1rem !important;
    margin-bottom: 0.15rem !important;
  }

  html body.page-node-type-service .service-brag .cy-comparison-table thead th.cy-recommended-col p {
    font-size: 0.62rem !important;
    line-height: 1.15 !important;
  }

  html body.page-node-type-service .service-brag .cy-card-footer {
    padding: 0.65rem 0.6rem !important;
  }

  html body.page-node-type-service .service-brag .cy-trust-note {
    font-size: 0.72rem !important;
  }
}

@media (max-width: 575.98px) {
  html body.page-node-type-service #block-traditionaldetailingblock h2.block-title,
  html body.page-node-type-service [id$="detailingblock"] h2.block-title {
    font-size: 1.18rem !important;
  }

  html body.page-node-type-service .service-brag .cy-comparison-table thead th.cy-recommended-col::before {
    content: "★ RECOMMENDED" !important;
    font-size: 0.44rem !important;
  }

  html body.page-node-type-service .service-brag .cy-comparison-table thead th.cy-recommended-col p {
    font-size: 0.58rem !important;
  }
}

/* ==========================================================================
   Customize CTA — beat #content-wide flex title-wrap (spec 1,5,0)
   ========================================================================== */
html body.page-node-type-service #content-wide #block-traditionaldetailingblock.norm-width.block-title-1.block-title-left.block-block-content .block-title-wrap,
html body.page-node-type-service #content-wide #block-rvdetailingblock.norm-width.block-title-1.block-title-left.block-block-content .block-title-wrap,
html body.page-node-type-service #content-wide #block-boatdetailingblock.norm-width.block-title-1.block-title-left.block-block-content .block-title-wrap,
html body.page-node-type-service #content-wide #block-ceramiccoatingblock.norm-width.block-title-1.block-title-left.block-block-content .block-title-wrap,
html body.page-node-type-service #content-wide #block-marineceramiccoatingblock.norm-width.block-title-1.block-title-left.block-block-content .block-title-wrap,
html body.page-node-type-service #content-wide #block-paintcorrectionblock.norm-width.block-title-1.block-title-left.block-block-content .block-title-wrap,
html body.page-node-type-service #content-wide [id$="detailingblock"].norm-width.block-title-1.block-title-left.block-block-content .block-title-wrap,
html body.page-node-type-service #content-wide [id*="ceramiccoatingblock"].norm-width.block-title-1.block-title-left.block-block-content .block-title-wrap,
html body.page-node-type-service #content-wide [id*="paintcorrectionblock"].norm-width.block-title-1.block-title-left.block-block-content .block-title-wrap,
html body.page-node-type-service .region.region-content-wide #block-traditionaldetailingblock .block-title-wrap,
html body.page-node-type-service .region.region-content-wide [id$="detailingblock"] .block-title-wrap,
html body.page-node-type-service #content-wide .block-title-wrap.clearfix {
  display: block !important;
  flex-direction: unset !important;
  justify-content: unset !important;
  align-items: unset !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  padding: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  text-align: center !important;
  float: none !important;
}

html body.page-node-type-service #content-wide #block-traditionaldetailingblock .block-title-content,
html body.page-node-type-service #content-wide #block-rvdetailingblock .block-title-content,
html body.page-node-type-service #content-wide [id$="detailingblock"] .block-title-content,
html body.page-node-type-service #content-wide [id*="ceramiccoatingblock"] .block-title-content,
html body.page-node-type-service #content-wide [id*="paintcorrectionblock"] .block-title-content,
html body.page-node-type-service #content-wide #block-traditionaldetailingblock.norm-width .block-title-content,
html body.page-node-type-service .region.region-content-wide [id$="detailingblock"] .block-title-content {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  flex: none !important;
  flex-basis: auto !important;
  margin: 0 auto !important;
  padding: 0 !important;
  text-align: center !important;
  float: none !important;
}

html body.page-node-type-service #content-wide #block-traditionaldetailingblock h2.block-title,
html body.page-node-type-service #content-wide #block-rvdetailingblock h2.block-title,
html body.page-node-type-service #content-wide [id$="detailingblock"] h2.block-title,
html body.page-node-type-service #content-wide [id*="ceramiccoatingblock"] h2.block-title,
html body.page-node-type-service #content-wide [id*="paintcorrectionblock"] h2.block-title,
html body.page-node-type-service #content-wide #block-traditionaldetailingblock.norm-width.block-title-1.block-title-left.block-block-content .block-title-content h2.block-title,
html body.page-node-type-service #content-wide .norm-width.block-title-1.block-title-left.block-block-content .block-title-content h2.block-title {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
  float: none !important;
  justify-content: center !important;
  animation: none !important;
  transform: none !important;
  border-bottom: 0 !important;
}

/* Also center body + button under full-width stack */
html body.page-node-type-service #content-wide #block-traditionaldetailingblock .block-content,
html body.page-node-type-service #content-wide [id$="detailingblock"] .block-content,
html body.page-node-type-service #content-wide [id*="ceramiccoatingblock"] .block-content,
html body.page-node-type-service #content-wide [id*="paintcorrectionblock"] .block-content {
  display: block !important;
  width: 100% !important;
  max-width: 640px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
}

/* Keep green band flush to footer — no white strip */
html body.page-node-type-service #content-wide #block-traditionaldetailingblock,
html body.page-node-type-service #content-wide [id$="detailingblock"],
html body.page-node-type-service #content-wide [id*="ceramiccoatingblock"],
html body.page-node-type-service #content-wide [id*="paintcorrectionblock"],
html body.page-node-type-service #content-wide > .block:last-child {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

html body.page-node-type-service #content-wide {
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
}

/* RECOMMENDED: ensure badge stays inside green header cell on all widths */
html body.page-node-type-service #content-wide .service-brag .cy-comparison-table thead th.cy-recommended-col::before,
html body.page-node-type-service .service-brag .cy-comparison-table thead th.cy-recommended-col::before {
  content: "★ RECOMMENDED" !important;
  display: block !important;
  position: static !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  transform: none !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  margin: 0 0 0.2rem 0 !important;
  padding: 0.15rem 0.1rem !important;
  font-size: 0.52rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.03em !important;
  line-height: 1.15 !important;
  text-align: center !important;
  white-space: normal !important;
  word-break: break-word !important;
  overflow-wrap: anywhere !important;
  color: #d8f5e6 !important;
  -webkit-text-fill-color: #d8f5e6 !important;
  background: rgba(0, 0, 0, 0.2) !important;
  border-radius: 4px !important;
  opacity: 1 !important;
}

html body.page-node-type-service #content-wide .service-brag .cy-comparison-table thead th.cy-recommended-col::after,
html body.page-node-type-service .service-brag .cy-comparison-table thead th.cy-recommended-col::after {
  content: none !important;
  display: none !important;
}

html body.page-node-type-service #content-wide .service-brag .cy-comparison-table thead th.cy-recommended-col,
html body.page-node-type-service .service-brag .cy-comparison-table thead th.cy-recommended-col {
  overflow: visible !important;
  white-space: normal !important;
  text-align: center !important;
  vertical-align: middle !important;
  padding: 0.45rem 0.25rem !important;
}

@media (max-width: 991.98px) {
  html body.page-node-type-service #content-wide #block-traditionaldetailingblock h2.block-title,
  html body.page-node-type-service #content-wide [id$="detailingblock"] h2.block-title {
    font-size: 1.25rem !important;
    line-height: 1.25 !important;
  }

  html body.page-node-type-service #content-wide .service-brag .cy-comparison-table thead th.cy-recommended-col::before {
    font-size: 0.46rem !important;
    letter-spacing: 0.01em !important;
  }

  html body.page-node-type-service #content-wide .service-brag .cy-comparison-table thead th.cy-recommended-col p {
    font-size: 0.6rem !important;
    line-height: 1.15 !important;
    white-space: normal !important;
  }
}

/* Mobile RECOMMENDED + JOHNNY DETAIL: fit fully inside green cell */
@media (max-width: 991.98px) {
  html body.page-node-type-service .service-brag .cy-comparison-table thead th.cy-recommended-col,
  html body.page-node-type-service #content-wide .service-brag .cy-comparison-table thead th.cy-recommended-col {
    padding: 0.35rem 0.15rem 0.3rem !important;
  }

  html body.page-node-type-service .service-brag .cy-comparison-table thead th.cy-recommended-col::before,
  html body.page-node-type-service #content-wide .service-brag .cy-comparison-table thead th.cy-recommended-col::before {
    content: "★ REC." !important;
    font-size: 0.5rem !important;
    letter-spacing: 0.02em !important;
    white-space: nowrap !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    padding: 0.12rem 0.15rem !important;
    margin-bottom: 0.15rem !important;
  }

  html body.page-node-type-service .service-brag .cy-comparison-table thead th.cy-recommended-col p,
  html body.page-node-type-service #content-wide .service-brag .cy-comparison-table thead th.cy-recommended-col p {
    font-size: 0.55rem !important;
    line-height: 1.1 !important;
    letter-spacing: -0.01em !important;
    white-space: normal !important;
    word-break: break-word !important;
    hyphens: auto !important;
  }
}

@media (min-width: 992px) {
  html body.page-node-type-service .service-brag .cy-comparison-table thead th.cy-recommended-col::before,
  html body.page-node-type-service #content-wide .service-brag .cy-comparison-table thead th.cy-recommended-col::before {
    content: "★ RECOMMENDED" !important;
    white-space: nowrap !important;
    font-size: 0.55rem !important;
  }
}

/* ==========================================================================
   service-brag thead labels — vertical center + tight top/bottom padding
   KEY SERVICE FEATURES | JOHNNY DETAIL | OTHER AGENCIES | DIY / IN-HOUSE
   ========================================================================== */
html body.page-node-type-service .service-brag .cy-comparison-table thead th,
html body.page-node-type-service .service-brag table thead th,
html body.page-node-type-service #content-wide .service-brag .cy-comparison-table thead th {
  vertical-align: middle !important;
  text-align: center !important;
  padding: 0.4rem 0.25rem !important;
  padding-top: 0.4rem !important;
  padding-bottom: 0.4rem !important;
  padding-left: 0.25rem !important;
  padding-right: 0.25rem !important;
  height: auto !important;
  line-height: 1.15 !important;
  box-sizing: border-box !important;
}

/* First column also centered vertically; keep readable label */
html body.page-node-type-service .service-brag .cy-comparison-table thead th:first-child,
html body.page-node-type-service .service-brag table thead th:first-child,
html body.page-node-type-service #content-wide .service-brag .cy-comparison-table thead th:first-child {
  text-align: center !important;
  padding: 0.4rem 0.3rem !important;
  vertical-align: middle !important;
}

html body.page-node-type-service .service-brag .cy-comparison-table thead th p,
html body.page-node-type-service .service-brag table thead th p,
html body.page-node-type-service #content-wide .service-brag .cy-comparison-table thead th p {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  padding: 0 !important;
  text-align: center !important;
  line-height: 1.15 !important;
  vertical-align: middle !important;
  background: transparent !important;
  border: 0 !important;
  box-sizing: border-box !important;
}

/* Johnny Detail col — same tight padding as siblings (badge + label still stack) */
html body.page-node-type-service .service-brag .cy-comparison-table thead th.cy-recommended-col,
html body.page-node-type-service .service-brag table thead th.cy-recommended-col,
html body.page-node-type-service #content-wide .service-brag .cy-comparison-table thead th.cy-recommended-col {
  vertical-align: middle !important;
  text-align: center !important;
  padding: 0.35rem 0.2rem !important;
  padding-top: 0.35rem !important;
  padding-bottom: 0.35rem !important;
}

html body.page-node-type-service .service-brag .cy-comparison-table thead th.cy-recommended-col::before,
html body.page-node-type-service #content-wide .service-brag .cy-comparison-table thead th.cy-recommended-col::before {
  margin-top: 0 !important;
  margin-bottom: 0.15rem !important;
}

html body.page-node-type-service .service-brag .cy-comparison-table thead th.cy-recommended-col p,
html body.page-node-type-service #content-wide .service-brag .cy-comparison-table thead th.cy-recommended-col p {
  margin: 0 auto !important;
  padding: 0 !important;
}

/* Kill legacy inline/body padding that forced 32px top on headers */
html body.page-node-type-service .service-brag .cy-comparison-table thead th:is([style],.jd-db-match-73803bd455b9),
html body.page-node-type-service .service-brag table thead th:is([style],.jd-db-match-73803bd455b9) {
  padding: 0.4rem 0.25rem !important;
  vertical-align: middle !important;
}

@media (max-width: 991.98px) {
  html body.page-node-type-service .service-brag .cy-comparison-table thead th,
  html body.page-node-type-service .service-brag table thead th,
  html body.page-node-type-service #content-wide .service-brag .cy-comparison-table thead th {
    padding: 0.3rem 0.15rem !important;
    padding-top: 0.3rem !important;
    padding-bottom: 0.3rem !important;
    vertical-align: middle !important;
    text-align: center !important;
    font-size: 0.62rem !important;
    line-height: 1.12 !important;
  }

  html body.page-node-type-service .service-brag .cy-comparison-table thead th p,
  html body.page-node-type-service #content-wide .service-brag .cy-comparison-table thead th p {
    font-size: inherit !important;
    line-height: 1.12 !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: center !important;
  }

  html body.page-node-type-service .service-brag .cy-comparison-table thead th.cy-recommended-col,
  html body.page-node-type-service #content-wide .service-brag .cy-comparison-table thead th.cy-recommended-col {
    padding: 0.28rem 0.12rem !important;
  }

  html body.page-node-type-service .service-brag .cy-comparison-table thead th.cy-recommended-col::before,
  html body.page-node-type-service #content-wide .service-brag .cy-comparison-table thead th.cy-recommended-col::before {
    margin-bottom: 0.1rem !important;
    padding: 0.1rem 0.1rem !important;
  }
}

@media (max-width: 575.98px) {
  html body.page-node-type-service .service-brag .cy-comparison-table thead th,
  html body.page-node-type-service #content-wide .service-brag .cy-comparison-table thead th {
    padding: 0.25rem 0.1rem !important;
    font-size: 0.58rem !important;
  }
}

/* service-brag: thinner green top border above the 4 header cells */
html body.page-node-type-service .service-brag .cy-comparison-table,
html body.page-node-type-service .service-brag table.cy-comparison-table,
html body.page-node-type-service #content-wide .service-brag .cy-comparison-table {
  border-top: 1px solid #b781e3 !important;
}

/* Header row separator under the 4 labels — match: thin brand green */
html body.page-node-type-service .service-brag .cy-comparison-table thead th,
html body.page-node-type-service .service-brag table thead th,
html body.page-node-type-service #content-wide .service-brag .cy-comparison-table thead th {
  border-bottom: 1px solid #6716aa !important;
}

/* Soften vertical dividers between headers to soft mint (not heavy black) */
html body.page-node-type-service .service-brag .cy-comparison-table thead th,
html body.page-node-type-service .service-brag table thead th {
  border-right: 1px solid #e9d5ff !important;
}

html body.page-node-type-service .service-brag .cy-comparison-table thead th:last-child,
html body.page-node-type-service .service-brag table thead th:last-child {
  border-right: 0 !important;
}

/* ==========================================================================
   SERVICE PAGES — content-wide blog block showcase (desktop + mobile)
   Targets:
     body.page-node-type-service #content-wide [id*="views-block-blog"].block
     body.page-node-type-service .region.region-content-wide [id*="views-block-blog"].block
   Creative green + white palette (engaging, on-brand). Late-loaded.
   ========================================================================== */

/* --- Block shell: soft mist panel frames the whole insights carousel ---
   CENTERED on desktop + mobile (margin auto + calc width for gutters).
   Vertical: slightly tighter under pricing, slightly roomier above next block
   so the *visual* air matches (pricing residual bottom vs CTA top chrome).
   ========================================================================== */
html body.page-node-type-service #content-wide [id*="views-block-blog"].block,
html body.page-node-type-service .region.region-content-wide [id*="views-block-blog"].block,
html body.page-node-type-service .content-wide [id*="views-block-blog"].block {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  /* Centered column, same width language as pricing/cards */
  width: calc(100% - (2 * var(--service-gutter, 0.95rem))) !important;
  max-width: var(--service-max, 1200px) !important;
  box-sizing: border-box !important;
  margin-top: 0.5rem !important; /* under pricing — keep snug */
  margin-bottom: 1.35rem !important; /* above next block — a bit more air */
  margin-left: auto !important; /* center (do NOT pin to left gutter only) */
  margin-right: auto !important;
  padding: 1.15rem 1rem 1.35rem !important;
  /* Soft mist → mint panel */
  background:  radial-gradient(
    ellipse 80% 60% at 50% 0%,
    rgba(168, 85, 247, 0.38) 0%,
    transparent 55%
  ),
  linear-gradient(
    180deg,
    #f9f5ff 0%,
    #ede3ff 55%,
    #e2d4ff 100%
  ) !important;
  background-color: #ede3ff !important;
  border: 2px solid #3b0a5c !important;
  border-radius: 18px !important;
  box-shadow:
    0 8px 28px rgba(59, 10, 92, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.65) !important;
  overflow: visible !important;
  position: relative !important;
}

/* Pricing package block: no extra bottom pad (blog owns the 1rem gap) */
html body.page-node-type-service #content-wide [id*="pricingpackages"],
html body.page-node-type-service #content-wide [id^="block-martis-customblocktoaddpricing"],
html body.page-node-type-service .region.region-content-wide [id*="pricingpackages"],
html body.page-node-type-service .region.region-content-wide [id^="block-martis-customblocktoaddpricing"] {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

html body.page-node-type-service .nnc-tab-content-container,
html body.page-node-type-service .nnc-tab-content .nnc-tab-content-container,
html body.page-node-type-service #content-wide .nnc-tab-content-container,
html body.page-node-type-service .nnc-pricing-container,
html body.page-node-type-service #content-wide .nnc-pricing-container {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

/* Next block after blog (e.g. traditional detailing CTA): no extra top pad */
html body.page-node-type-service #content-wide [id*="views-block-blog"].block + .block,
html body.page-node-type-service #content-wide [id*="views-block-blog"].block + .norm-width.block-title-1.block-title-left.block-block-content,
html body.page-node-type-service .region.region-content-wide [id*="views-block-blog"].block + .block,
html body.page-node-type-service .region.region-content-wide [id*="views-block-blog"].block + .norm-width.block-title-1.block-title-left.block-block-content,
html body.page-node-type-service #content-wide [id*="views-block-blog"] + [id$="detailingblock"],
html body.page-node-type-service #content-wide [id*="views-block-blog"] + #block-traditionaldetailingblock,
html body.page-node-type-service #content-wide [id*="views-block-blog"] + #block-rvdetailingblock,
html body.page-node-type-service #content-wide [id*="views-block-blog"] + #block-boatdetailingblock {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

html body.page-node-type-service #content-wide [id*="views-block-blog"].block > .container-wrap,
html body.page-node-type-service .region.region-content-wide [id*="views-block-blog"].block > .container-wrap {
  width: 100% !important;
  max-width: 1100px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 0.65rem !important;
  box-sizing: border-box !important;
}

/* --- Block title: forest chip + white type + mint underline --- */
html body.page-node-type-service #content-wide [id*="views-block-blog"].block .block-title-wrap,
html body.page-node-type-service .region.region-content-wide [id*="views-block-blog"].block .block-title-wrap {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0.15rem auto 0.25rem !important;
  padding: 0 0.35rem !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  float: none !important;
}

html body.page-node-type-service #content-wide [id*="views-block-blog"].block .block-title-content,
html body.page-node-type-service .region.region-content-wide [id*="views-block-blog"].block .block-title-content {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  padding: 0 !important;
  text-align: center !important;
}

html body.page-node-type-service #content-wide [id*="views-block-blog"].block h2.block-title,
html body.page-node-type-service #content-wide [id*="views-block-blog"].block .block-title,
html body.page-node-type-service .region.region-content-wide [id*="views-block-blog"].block h2.block-title,
html body.page-node-type-service .region.region-content-wide [id*="views-block-blog"].block .block-title {
  display: inline-block !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  margin: 0 auto !important;
  padding: 0.55rem 1.15rem !important;
  text-align: center !important;
  float: none !important;
  font-weight: 800 !important;
  font-size: clamp(1.05rem, 2.4vw, 1.4rem) !important;
  line-height: 1.3 !important;
  letter-spacing: 0.01em !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.22) !important;
  background: linear-gradient(135deg, #3b0a5c 0%, #6716aa 50%, #7b2cbf 100%) !important;
  background-color: #6716aa !important;
  border: 2px solid #000 !important;
  border-radius: 999px !important;
  box-shadow: 0 3px 12px rgba(59, 10, 92, 0.22) !important;
  animation: none !important; /* kill pulse if custom_css adds it */
}

/* --- Slider / content area inside shell --- */
html body.page-node-type-service #content-wide [id*="views-block-blog"].block .block-content,
html body.page-node-type-service .region.region-content-wide [id*="views-block-blog"].block .block-content,
html body.page-node-type-service #content-wide [id*="views-block-blog"].block .views-element-container,
html body.page-node-type-service .region.region-content-wide [id*="views-block-blog"].block .views-element-container,
html body.page-node-type-service #content-wide [id*="views-block-blog"].block .flexslider,
html body.page-node-type-service .region.region-content-wide [id*="views-block-blog"].block .flexslider {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  overflow: visible !important;
}

/* Teaser article stays frameless; card chrome lives on image + post-content */
html body.page-node-type-service #content-wide [id*="views-block-blog"].block .blog-post-teaser,
html body.page-node-type-service .region.region-content-wide [id*="views-block-blog"].block .blog-post-teaser,
html body.page-node-type-service #content-wide [id*="views-block-blog"].block .post-content-wrap,
html body.page-node-type-service .region.region-content-wide [id*="views-block-blog"].block .post-content-wrap {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* --- Image frame: dual-tone ring (mint outer feel via shadow + forest edge) --- */
html body.page-node-type-service #content-wide [id*="views-block-blog"].block .post-image,
html body.page-node-type-service .region.region-content-wide [id*="views-block-blog"].block .post-image {
  border: 3px solid #3b0a5c !important;
  border-radius: 1.1rem !important;
  overflow: hidden !important;
  background: #ffffff !important;
  box-shadow:
    0 0 0 3px rgba(201, 160, 232, 0.55),
    0 6px 18px rgba(59, 10, 92, 0.18) !important;
  transition: transform 0.2s ease, box-shadow 0.2s ease !important;
}

html body.page-node-type-service #content-wide [id*="views-block-blog"].block .post-image img,
html body.page-node-type-service .region.region-content-wide [id*="views-block-blog"].block .post-image img {
  border: 0 !important;
  border-radius: 0 !important;
  display: block !important;
  width: 100% !important;
  height: auto !important;
  object-fit: cover !important;
}

/* --- Content card: richer forest gradient + white hierarchy --- */
html body.page-node-type-service #content-wide [id*="views-block-blog"].block .post-content,
html body.page-node-type-service .region.region-content-wide [id*="views-block-blog"].block .post-content,
html body.page-node-type-service #content-wide [id*="views-block-blog"].block .views-element-container .post-content {
  background:
    radial-gradient(ellipse 90% 70% at 15% 0%, rgba(201, 160, 232, 0.28) 0%, transparent 50%),
    linear-gradient(155deg, #7b2cbf 0%, #7b2cbf 28%, #6716aa 62%, #3b0a5c 100%) !important;
  background-color: #6716aa !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border: 2px solid #000 !important;
  border-radius: 14px !important;
  box-shadow:
    0 8px 22px rgba(59, 10, 92, 0.22),
    inset 0 1px 0 rgba(255, 255, 255, 0.12) !important;
  padding-left: 1.15rem !important;
  padding-right: 1.15rem !important;
  text-align: center !important;
}

/* Title on card */
html body.page-node-type-service #content-wide [id*="views-block-blog"].block .post-title,
html body.page-node-type-service #content-wide [id*="views-block-blog"].block .post-title a,
html body.page-node-type-service .region.region-content-wide [id*="views-block-blog"].block .post-title,
html body.page-node-type-service .region.region-content-wide [id*="views-block-blog"].block .post-title a {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-weight: 800 !important;
  font-size: clamp(1.08rem, 2.3vw, 1.32rem) !important;
  line-height: 1.28 !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25) !important;
  background: transparent !important;
  border: 0 !important;
  text-decoration: none !important;
}

html body.page-node-type-service #content-wide [id*="views-block-blog"].block .post-title a:hover,
html body.page-node-type-service .region.region-content-wide [id*="views-block-blog"].block .post-title a:hover {
  color: #eafff3 !important;
  -webkit-text-fill-color: #eafff3 !important;
  text-decoration: underline !important;
  text-decoration-color: #c9a0e8 !important;
}

/* Excerpt — soft mint-white for secondary hierarchy */
html body.page-node-type-service #content-wide [id*="views-block-blog"].block .post-excerpt,
html body.page-node-type-service #content-wide [id*="views-block-blog"].block .post-excerpt *,
html body.page-node-type-service #content-wide [id*="views-block-blog"].block .post-content p,
html body.page-node-type-service .region.region-content-wide [id*="views-block-blog"].block .post-excerpt,
html body.page-node-type-service .region.region-content-wide [id*="views-block-blog"].block .post-excerpt * {
  color: #eafff3 !important;
  -webkit-text-fill-color: #eafff3 !important;
  background: transparent !important;
  border: 0 !important;
  text-shadow: none !important;
  font-size: 0.97rem !important;
  line-height: 1.55 !important;
  font-weight: 500 !important;
}

/* Meta pills — crisp white on green card */
html body.page-node-type-service #content-wide [id*="views-block-blog"].block .post-meta {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  gap: 0.45rem !important;
  border: 0 !important;
  background: transparent !important;
  margin: 0.65rem 0 0.35rem !important;
}

html body.page-node-type-service #content-wide [id*="views-block-blog"].block .post-meta-item,
html body.page-node-type-service .region.region-content-wide [id*="views-block-blog"].block .post-meta-item,
html body.page-node-type-service #content-wide [id*="views-block-blog"].block .post-comment {
  background: #ffffff !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  border: 2px solid #3b0a5c !important;
  border-radius: 999px !important;
  padding: 0.35rem 0.7rem !important;
  font-size: 0.78rem !important;
  font-weight: 600 !important;
  box-shadow: 0 1px 3px rgba(59, 10, 92, 0.1) !important;
}

html body.page-node-type-service #content-wide [id*="views-block-blog"].block .post-meta-item *,
html body.page-node-type-service #content-wide [id*="views-block-blog"].block .post-meta-item a,
html body.page-node-type-service #content-wide [id*="views-block-blog"].block .post-meta-item i,
html body.page-node-type-service #content-wide [id*="views-block-blog"].block .post-comment * {
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  background: transparent !important;
  text-shadow: none !important;
}

/* Tags as white pills */
html body.page-node-type-service #content-wide [id*="views-block-blog"].block .post-tags,
html body.page-node-type-service .region.region-content-wide [id*="views-block-blog"].block .post-tags {
  color: #eafff3 !important;
  -webkit-text-fill-color: #eafff3 !important;
  background: transparent !important;
  border: 0 !important;
  justify-content: center !important;
}

html body.page-node-type-service #wrapper #content-wide [id*="views-block-blog"].block .post-tags a {
  background: #ffffff !important;
  color: #6716aa !important;
  -webkit-text-fill-color: #6716aa !important;
  border: 1px solid #3b0a5c !important;
  border-radius: 999px !important;
  font-weight: 700 !important;
  font-size: 0.75rem !important;
  padding: 0.18rem 0.6rem !important;
  text-decoration: none !important;
  text-shadow: none !important;
}

/* Read more CTA — mint → forest, pill shape */
html body.page-node-type-service #content-wide [id*="views-block-blog"].block .post-link .read-more,
html body.page-node-type-service .region.region-content-wide [id*="views-block-blog"].block .post-link .read-more,
html body.page-node-type-service #content-wide [id*="views-block-blog"].block a.read-more {
  background: linear-gradient(204deg, #e9d5ff 0%, #c9a0e8 22%, #b781e3 55%, #6716aa 100%) !important;
  background-color: #6716aa !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border: 2px solid #000 !important;
  border-radius: 999px !important;
  font-weight: 800 !important;
  font-size: 0.92rem !important;
  letter-spacing: 0.02em !important;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.15) !important;
  box-shadow:
    0 3px 10px rgba(59, 10, 92, 0.28),
    inset 0 1px 0 rgba(255, 255, 255, 0.25) !important;
  padding: 0.55rem 1.25rem !important;
  transition: transform 0.15s ease, box-shadow 0.15s ease, background 0.15s ease !important;
}

html body.page-node-type-service #content-wide [id*="views-block-blog"].block .post-link .read-more:hover,
html body.page-node-type-service .region.region-content-wide [id*="views-block-blog"].block .post-link .read-more:hover,
html body.page-node-type-service #content-wide [id*="views-block-blog"].block a.read-more:hover {
  background: linear-gradient(204deg, #c9a0e8 0%, #b781e3 45%, #6716aa 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 5px 14px rgba(59, 10, 92, 0.32) !important;
}

/* FlexSlider direction nav — green circular controls */
html body.page-node-type-service #content-wide [id*="views-block-blog"].block .flex-direction-nav a,
html body.page-node-type-service .region.region-content-wide [id*="views-block-blog"].block .flex-direction-nav a {
  background: linear-gradient(160deg, #b781e3 0%, #6716aa 100%) !important;
  background-color: #6716aa !important;
  color: #ffffff !important;
  border: 2px solid #000 !important;
  border-radius: 999px !important;
  box-shadow: 0 2px 8px rgba(59, 10, 92, 0.25) !important;
  opacity: 0.95 !important;
  width: 2.5rem !important;
  height: 2.5rem !important;
  line-height: 2.3rem !important;
  text-align: center !important;
  text-shadow: none !important;
}

html body.page-node-type-service #content-wide [id*="views-block-blog"].block .flex-direction-nav a:hover,
html body.page-node-type-service .region.region-content-wide [id*="views-block-blog"].block .flex-direction-nav a:hover {
  background: linear-gradient(160deg, #c9a0e8 0%, #7b2cbf 100%) !important;
  opacity: 1 !important;
}

/* Desktop: roomier shell; centered; balanced visual gaps */
@media (min-width: 992px) {
  html body.page-node-type-service #content-wide [id*="views-block-blog"].block,
  html body.page-node-type-service .region.region-content-wide [id*="views-block-blog"].block,
  html body.page-node-type-service .content-wide [id*="views-block-blog"].block {
    margin-top: 0.5rem !important;
    margin-bottom: 1.35rem !important;
    margin-left: auto !important;
    margin-right: auto !important;
    width: calc(100% - (2 * var(--service-gutter, 1rem))) !important;
    max-width: var(--service-max, 1200px) !important;
    padding: 1.4rem 1.5rem 1.6rem !important;
    border-radius: 20px !important;
  }

  html body.page-node-type-service #content-wide [id*="views-block-blog"].block h2.block-title,
  html body.page-node-type-service .region.region-content-wide [id*="views-block-blog"].block h2.block-title {
    font-size: clamp(1.15rem, 1.8vw, 1.45rem) !important;
    padding: 0.6rem 1.4rem !important;
  }

  html body.page-node-type-service #content-wide [id*="views-block-blog"].block .post-content,
  html body.page-node-type-service .region.region-content-wide [id*="views-block-blog"].block .post-content {
    padding-left: 1.35rem !important;
    padding-right: 1.35rem !important;
    border-radius: 16px !important;
  }

  html body.page-node-type-service #content-wide [id*="views-block-blog"].block .post-image,
  html body.page-node-type-service .region.region-content-wide [id*="views-block-blog"].block .post-image {
    border-radius: 1.15rem !important;
  }
}

/* Mobile: centered, pricing-matched width (not left-pinned full-bleed) */
@media (max-width: 991.98px) {
  html body.page-node-type-service #content-wide [id*="views-block-blog"].block .block-title-wrap,
  html body.page-node-type-service .region.region-content-wide [id*="views-block-blog"].block .block-title-wrap {
    margin: 0.75rem auto 0.25rem !important;
  }

  html body.page-node-type-service #content-wide [id*="views-block-blog"].block,
  html body.page-node-type-service .region.region-content-wide [id*="views-block-blog"].block,
  html body.page-node-type-service .content-wide [id*="views-block-blog"].block {
    margin-top: 3.5rem !important;
    margin-bottom: 1.35rem !important;
    margin-left: auto !important;
    margin-right: auto !important;
    width: calc(100% - (2 * var(--service-gutter, 0.95rem))) !important;
    max-width: 100% !important;
    padding: 0.85rem 0.75rem 1.05rem !important;
    border-radius: 14px !important;
    border-width: 2px !important;
    box-sizing: border-box !important;
  }

  /* Container-wrap: no extra side pad (block already has gutter margins) */
  html body.page-node-type-service #content-wide [id*="views-block-blog"].block > .container-wrap,
  html body.page-node-type-service .region.region-content-wide [id*="views-block-blog"].block > .container-wrap,
  html body.page-node-type-service [id*="views-block-blog"] > .container-wrap {
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    gap: 0.5rem !important;
  }

  /* Pricing → blog: keep bottom of pricing flush so only blog margin-top = 1rem */
  html body.page-node-type-service #content-wide [id*="pricingpackages"],
  html body.page-node-type-service #content-wide [id^="block-martis-customblocktoaddpricing"],
  html body.page-node-type-service .nnc-tab-content-container,
  html body.page-node-type-service .nnc-pricing-container {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
  }

  html body.page-node-type-service #content-wide [id*="views-block-blog"].block + .block,
  html body.page-node-type-service #content-wide [id*="views-block-blog"].block + .norm-width.block-title-1.block-title-left.block-block-content {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }

  html body.page-node-type-service #content-wide [id*="views-block-blog"].block h2.block-title,
  html body.page-node-type-service .region.region-content-wide [id*="views-block-blog"].block h2.block-title {
    font-size: clamp(0.95rem, 3.8vw, 1.12rem) !important;
    padding: 0.5rem 0.85rem !important;
    border-radius: 14px !important; /* less pill, more chip on long titles */
    line-height: 1.28 !important;
  }

  html body.page-node-type-service #content-wide [id*="views-block-blog"].block .post-content,
  html body.page-node-type-service .region.region-content-wide [id*="views-block-blog"].block .post-content {
    border-radius: 12px !important;
    padding-left: 0.85rem !important;
    padding-right: 0.85rem !important;
  }

  html body.page-node-type-service #content-wide [id*="views-block-blog"].block .post-title,
  html body.page-node-type-service #content-wide [id*="views-block-blog"].block .post-title a {
    font-size: 1.05rem !important;
  }

  html body.page-node-type-service #content-wide [id*="views-block-blog"].block .post-excerpt,
  html body.page-node-type-service #content-wide [id*="views-block-blog"].block .post-excerpt * {
    font-size: 0.9rem !important;
  }

  html body.page-node-type-service #content-wide [id*="views-block-blog"].block .post-image,
  html body.page-node-type-service .region.region-content-wide [id*="views-block-blog"].block .post-image {
    width: 90% !important;
    max-width: 90% !important;
    border-width: 2px !important;
    border-radius: 0.95rem !important;
    box-shadow:
      0 0 0 2px rgba(201, 160, 232, 0.5),
      0 4px 12px rgba(59, 10, 92, 0.16) !important;
  }

  html body.page-node-type-service #content-wide [id*="views-block-blog"].block .post-meta-item {
    font-size: 0.72rem !important;
    padding: 0.3rem 0.55rem !important;
  }

  html body.page-node-type-service #content-wide [id*="views-block-blog"].block .post-link .read-more,
  html body.page-node-type-service .region.region-content-wide [id*="views-block-blog"].block .post-link .read-more {
    font-size: 0.88rem !important;
    padding: 0.5rem 1.05rem !important;
    width: 85% !important;
    max-width: 18rem !important;
  }

  html body.page-node-type-service #content-wide [id*="views-block-blog"].block .flex-direction-nav a,
  html body.page-node-type-service .region.region-content-wide [id*="views-block-blog"].block .flex-direction-nav a {
    width: 2.25rem !important;
    height: 2.25rem !important;
    line-height: 2.05rem !important;
  }
}

@media (max-width: 575.98px) {
  html body.page-node-type-service #content-wide [id*="views-block-blog"].block,
  html body.page-node-type-service .region.region-content-wide [id*="views-block-blog"].block,
  html body.page-node-type-service .content-wide [id*="views-block-blog"].block {
    margin-top: 0.5rem !important;
    margin-bottom: 1.35rem !important;
    margin-left: auto !important;
    margin-right: auto !important;
    width: calc(100% - (2 * var(--service-gutter, 0.85rem))) !important;
    max-width: 100% !important;
    padding: 0.7rem 0.55rem 0.9rem !important;
    border-radius: 12px !important;
  }

  html body.page-node-type-service #content-wide [id*="views-block-blog"].block h2.block-title,
  html body.page-node-type-service .region.region-content-wide [id*="views-block-blog"].block h2.block-title {
    font-size: 0.95rem !important;
    padding: 0.45rem 0.7rem !important;
  }
}

/* --------------------------------------------------------------------------
   FINAL pass: center blog block + balanced gaps (beats earlier left-pin / -1.2rem)
   -------------------------------------------------------------------------- */
html body.page-node-type-service .region.region-content-wide [id*="views-block-blog"],
html body.page-node-type-service #content-wide [id*="views-block-blog"],
html body.page-node-type-service [id*="views-block-blog"],
html body.page-node-type-service [id^="block-martis-views-block-blog"] {
  /* generic blog views wrappers: don't pin left */
  margin-left: auto !important;
  margin-right: auto !important;
}

html body.page-node-type-service #content-wide [id*="views-block-blog"].block,
html body.page-node-type-service .region.region-content-wide [id*="views-block-blog"].block,
html body.page-node-type-service .content-wide [id*="views-block-blog"].block {
  margin-top: 0.5rem !important;
  margin-bottom: 1.35rem !important;
  margin-left: auto !important;
  margin-right: auto !important;
  width: calc(100% - (2 * var(--service-gutter, 0.95rem))) !important;
  max-width: var(--service-max, 1200px) !important;
  box-sizing: border-box !important;
  float: none !important;
  position: relative !important;
  left: auto !important;
  right: auto !important;
  transform: none !important;
}

/* Parent content-wide: center flex children if it becomes a flex column */
html body.page-node-type-service #content-wide,
html body.page-node-type-service .region.region-content-wide {
  /* keep block flow; centering is on the blog block itself */
}

@media (max-width: 991.98px) {
  html body.path-team.page-team #block-martis-teamh1title {
  margin-bottom: -3rem !important;
  }
  html body.page-node-type-service #content-wide [id*="views-block-blog"].block,
  html body.page-node-type-service .region.region-content-wide [id*="views-block-blog"].block,
  html body.page-node-type-service .content-wide [id*="views-block-blog"].block,
  html body.page-node-type-service [id^="block-martis-views-block-blog"].block {
    margin-top: -3.5rem !important;
    margin-bottom: 1.35rem !important;
    margin-left: auto !important;
    margin-right: auto !important;
    width: calc(100% - (2 * var(--service-gutter, 0.95rem))) !important;
    max-width: 100% !important;
    float: none !important;
  }

  /* Double-gutter fix: earlier rules put gutter on container-wrap too */
  html body.page-node-type-service #content-wide [id*="views-block-blog"] > .container-wrap,
  html body.page-node-type-service .region.region-content-wide [id*="views-block-blog"] > .container-wrap,
  html body.page-node-type-service [id*="views-block-blog"] > .container-wrap {
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: auto !important;
    margin-right: auto !important;
    width: 100% !important;
    max-width: 100% !important;
  }
}

/* ==========================================================================
   BASIC POLICY PAGES — layered green + white palette (2026-08-01)
   Scopes: page-privacy, page-terms-and-conditions, page-bookings-refunds
   Wrappers: .privacy-cards-wrapper | .terms-cards-wrapper | .policy-cards-wrapper
   Beats residual custom_css + older node styles. Match service/team cards.
   ========================================================================== */

body.page-privacy,
body.page-terms-and-conditions,
body.page-bookings-refunds {
  --pol-forest: #3b0a5c;
  --pol-brand: #6716aa;
  --pol-mid: #7b2cbf;
  --pol-leaf: #b781e3;
  --pol-mint: #c9a0e8;
  --pol-soft: #f3e8ff;
  --pol-mist: #f5f0fa;
  --pol-white: #ffffff;
  --pol-ink: #1a0a24;
  --pol-link: #5b21b6;
  --pol-border: #e9d5ff;
}

html body.page-privacy .privacy-cards-wrapper,
html body.page-terms-and-conditions .terms-cards-wrapper,
html body.page-bookings-refunds .policy-cards-wrapper,
.privacy-cards-wrapper,
.terms-cards-wrapper,
.policy-cards-wrapper {
  background: #f5f0fa !important;
  background-color: #f5f0fa !important;
  color: #1a0a24 !important;
  max-width: 1100px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
}

html body.page-privacy .privacy-cards-wrapper h1,
html body.page-terms-and-conditions .terms-cards-wrapper h1,
html body.page-bookings-refunds .policy-cards-wrapper h1,
.privacy-cards-wrapper h1,
.terms-cards-wrapper h1,
.policy-cards-wrapper h1 {
  background: linear-gradient(135deg, #3b0a5c 0%, #6716aa 55%, #7b2cbf 100%) !important;
  background-color: #3b0a5c !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  text-align: center !important;
  font-weight: 800 !important;
  border: 2px solid #000 !important;
  border-radius: 10px !important;
  box-shadow: 0 3px 10px rgba(59, 10, 92, 0.22) !important;
  padding: 0.75rem 1rem !important;
  margin-left: auto !important;
  margin-right: auto !important;
  max-width: 100% !important;
  text-shadow: none !important;
}

html body.page-privacy .privacy-cards-wrapper .card,
html body.page-privacy .privacy-cards-wrapper .summary-box,
html body.page-privacy .privacy-cards-wrapper .faq-card,
html body.page-terms-and-conditions .terms-cards-wrapper .card,
html body.page-terms-and-conditions .terms-cards-wrapper .summary-box,
html body.page-terms-and-conditions .terms-cards-wrapper .faq-card,
html body.page-bookings-refunds .policy-cards-wrapper .card,
html body.page-bookings-refunds .policy-cards-wrapper .summary-box,
html body.page-bookings-refunds .policy-cards-wrapper .faq-card,
.privacy-cards-wrapper .card,
.terms-cards-wrapper .card,
.policy-cards-wrapper .card,
.privacy-cards-wrapper .summary-box,
.terms-cards-wrapper .summary-box,
.policy-cards-wrapper .summary-box,
.privacy-cards-wrapper .faq-card,
.terms-cards-wrapper .faq-card,
.policy-cards-wrapper .faq-card {
  background: #ffffff !important;
  background-color: #ffffff !important;
  color: #1a0a24 !important;
  border-top: 1px solid #e9d5ff !important;
  border-right: 1px solid #e9d5ff !important;
  border-bottom: 1px solid #e9d5ff !important;
  border-left: 5px solid #6716aa !important;
  border-radius: 16px !important;
  box-shadow: 0 4px 14px -4px rgba(59, 10, 92, 0.1) !important;
}

html body.page-privacy .privacy-cards-wrapper .summary-box,
html body.page-bookings-refunds .policy-cards-wrapper .summary-box,
.privacy-cards-wrapper .summary-box,
.policy-cards-wrapper .summary-box {
  border-left-width: 6px !important;
}

html body.page-privacy .privacy-cards-wrapper .card h2,
html body.page-privacy .privacy-cards-wrapper .summary-box h2,
html body.page-terms-and-conditions .terms-cards-wrapper .card h2,
html body.page-bookings-refunds .policy-cards-wrapper .card h2,
html body.page-bookings-refunds .policy-cards-wrapper .summary-box h2,
.privacy-cards-wrapper .card h2,
.terms-cards-wrapper .card h2,
.policy-cards-wrapper .card h2,
.privacy-cards-wrapper .summary-box h2,
.policy-cards-wrapper .summary-box h2 {
  background: linear-gradient(135deg, #3b0a5c 0%, #6716aa 55%, #7b2cbf 100%) !important;
  background-color: #3b0a5c !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  display: inline-block !important;
  max-width: 100% !important;
  padding: 0.5rem 1rem !important;
  border-radius: 8px !important;
  border: 2px solid #000 !important;
  font-weight: 800 !important;
  box-shadow: 0 3px 10px rgba(59, 10, 92, 0.2) !important;
  text-shadow: none !important;
}

html body.page-privacy .privacy-cards-wrapper .card h3,
html body.page-privacy .privacy-cards-wrapper .faq-card h3,
html body.page-terms-and-conditions .terms-cards-wrapper .card h3,
html body.page-terms-and-conditions .terms-cards-wrapper .faq-card h3,
html body.page-bookings-refunds .policy-cards-wrapper .card h3,
html body.page-bookings-refunds .policy-cards-wrapper .faq-card h3,
.privacy-cards-wrapper .card h3,
.terms-cards-wrapper .card h3,
.policy-cards-wrapper .card h3,
.privacy-cards-wrapper .faq-card h3,
.terms-cards-wrapper .faq-card h3,
.policy-cards-wrapper .faq-card h3 {
  background: #7b2cbf !important;
  background-color: #7b2cbf !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  display: inline-block !important;
  max-width: 100% !important;
  padding: 0.4rem 0.9rem !important;
  border-radius: 7px !important;
  border: 2px solid #000 !important;
  font-weight: 800 !important;
  box-shadow: 0 2px 6px rgba(123, 44, 191, 0.2) !important;
  text-shadow: none !important;
}

html body.page-privacy .privacy-cards-wrapper .card p,
html body.page-privacy .privacy-cards-wrapper .card li,
html body.page-privacy .privacy-cards-wrapper .summary-box p,
html body.page-privacy .privacy-cards-wrapper .faq-card p,
html body.page-terms-and-conditions .terms-cards-wrapper .card p,
html body.page-terms-and-conditions .terms-cards-wrapper .card li,
html body.page-terms-and-conditions .terms-cards-wrapper .faq-card p,
html body.page-bookings-refunds .policy-cards-wrapper .card p,
html body.page-bookings-refunds .policy-cards-wrapper .card li,
html body.page-bookings-refunds .policy-cards-wrapper .summary-box p,
html body.page-bookings-refunds .policy-cards-wrapper .faq-card p,
.privacy-cards-wrapper .card p,
.terms-cards-wrapper .card p,
.policy-cards-wrapper .card p,
.privacy-cards-wrapper .card li,
.terms-cards-wrapper .card li,
.policy-cards-wrapper .card li,
.privacy-cards-wrapper .summary-box p,
.policy-cards-wrapper .summary-box p,
.privacy-cards-wrapper .faq-card p,
.terms-cards-wrapper .faq-card p,
.policy-cards-wrapper .faq-card p {
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  background: #f3e8ff !important;
  background-color: #f3e8ff !important;
  border-top: 1px solid #e9d5ff !important;
  border-right: 1px solid #e9d5ff !important;
  border-bottom: 1px solid #e9d5ff !important;
  border-left: 4px solid #b781e3 !important;
  border-radius: 8px !important;
  line-height: 1.65 !important;
}

html body.page-privacy .privacy-cards-wrapper .summary-box p,
html body.page-bookings-refunds .policy-cards-wrapper .summary-box p,
.privacy-cards-wrapper .summary-box p,
.policy-cards-wrapper .summary-box p {
  border-left-color: #c9a0e8 !important;
}

html body.page-privacy .privacy-cards-wrapper a,
html body.page-terms-and-conditions .terms-cards-wrapper a,
html body.page-bookings-refunds .policy-cards-wrapper a,
.privacy-cards-wrapper a,
.terms-cards-wrapper a,
.policy-cards-wrapper a {
  color: #5b21b6 !important;
  -webkit-text-fill-color: #5b21b6 !important;
  font-weight: 600 !important;
  text-decoration: underline !important;
}

html body.page-privacy .privacy-cards-wrapper a:hover,
html body.page-terms-and-conditions .terms-cards-wrapper a:hover,
html body.page-bookings-refunds .policy-cards-wrapper a:hover {
  color: #7b2cbf !important;
  -webkit-text-fill-color: #7b2cbf !important;
}

/* FAQ section plain h2 under cards */
html body.page-privacy .privacy-cards-wrapper > h2,
html body.page-terms-and-conditions .terms-cards-wrapper > h2,
html body.page-bookings-refunds .policy-cards-wrapper > h2 {
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  text-align: center !important;
  font-weight: 800 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

@media (max-width: 640px) {
  html body.page-privacy .privacy-cards-wrapper,
  html body.page-terms-and-conditions .terms-cards-wrapper,
  html body.page-bookings-refunds .policy-cards-wrapper {
    padding-left: 0.5rem !important;
    padding-right: 0.5rem !important;
  }
  html body.page-privacy .privacy-cards-wrapper h1,
  html body.page-terms-and-conditions .terms-cards-wrapper h1,
  html body.page-bookings-refunds .policy-cards-wrapper h1 {
    font-size: 1.4rem !important;
    padding: 0.65rem 0.75rem !important;
  }
}

/* ==========================================================================
   HOME + CITY MARKETING PAGES — layered green palette (2026-08-01)
   Home: body.path-frontpage
   Cities: body.page-houston-tx | page-katy-tx | page-cypress-tx |
           page-spring-tx | page-tomball-tx | page-jersey-village-tx
   Avoid bare path-taxonomy (shared with product catalog).
   ========================================================================== */

body.path-frontpage,
body.page-houston-tx,
body.page-katy-tx,
body.page-cypress-tx,
body.page-spring-tx,
body.page-tomball-tx,
body.page-jersey-village-tx {
  --hc-forest: #3b0a5c;
  --hc-brand: #6716aa;
  --hc-mid: #7b2cbf;
  --hc-leaf: #b781e3;
  --hc-mint: #c9a0e8;
  --hc-soft: #f3e8ff;
  --hc-mist: #f5f0fa;
  --hc-white: #ffffff;
  --hc-ink: #1a0a24;
  --hc-link: #5b21b6;
  --hc-border: #e9d5ff;
}

/* ---- Frontpage / city H1 title chips ---- */
html body.path-frontpage #wrapper #content-wide-top [id*="frontpagetitle"] h1,
html body.path-frontpage #wrapper #content-wide-top [id*="pagetitle"] h1,
html body.path-frontpage #wrapper #block-martis-frontpagetitle h1,
html body.path-frontpage #wrapper [id^="block-martis-frontpagetitle"] h1,
html body.page-houston-tx #wrapper #content-wide-top [id*="frontpagetitle"] h1,
html body.page-houston-tx #wrapper #content-wide-top [id*="pagetitle"] h1,
html body.page-katy-tx #wrapper #content-wide-top [id*="frontpagetitle"] h1,
html body.page-katy-tx #wrapper #content-wide-top [id*="pagetitle"] h1,
html body.page-cypress-tx #wrapper #content-wide-top [id*="frontpagetitle"] h1,
html body.page-cypress-tx #wrapper #content-wide-top [id*="pagetitle"] h1,
html body.page-spring-tx #wrapper #content-wide-top [id*="frontpagetitle"] h1,
html body.page-spring-tx #wrapper #content-wide-top [id*="pagetitle"] h1,
html body.page-tomball-tx #wrapper #content-wide-top [id*="frontpagetitle"] h1,
html body.page-tomball-tx #wrapper #content-wide-top [id*="pagetitle"] h1,
html body.page-jersey-village-tx #wrapper #content-wide-top [id*="frontpagetitle"] h1,
html body.page-jersey-village-tx #wrapper #content-wide-top [id*="pagetitle"] h1 {
  background: linear-gradient(135deg, #3b0a5c 0%, #6716aa 55%, #7b2cbf 100%) !important;
  background-color: #3b0a5c !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-weight: 800 !important;
  text-shadow: none !important;
  border: 2px solid #000 !important;
  border-radius: 10px !important;
  box-shadow: 0 3px 10px rgba(59, 10, 92, 0.22) !important;
  padding: 0.75rem 1rem !important;
  text-align: center !important;
  box-sizing: border-box !important;
  width: auto !important;
  max-width: min(920px, 100%) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  display: block !important;
  line-height: 1.3 !important;
  margin-bottom: -1rem !important;
}

@media (max-width: 767.98px) {
  html body.path-frontpage #wrapper #content-wide-top [id*="frontpagetitle"] h1,
  html body.path-frontpage #wrapper #content-wide-top [id*="pagetitle"] h1,
  html body.path-frontpage #wrapper #block-martis-frontpagetitle h1,
  html body.page-houston-tx #wrapper #content-wide-top [id*="frontpagetitle"] h1,
  html body.page-houston-tx #wrapper #content-wide-top [id*="pagetitle"] h1,
  html body.page-katy-tx #wrapper #content-wide-top [id*="frontpagetitle"] h1,
  html body.page-katy-tx #wrapper #content-wide-top [id*="pagetitle"] h1,
  html body.page-cypress-tx #wrapper #content-wide-top [id*="frontpagetitle"] h1,
  html body.page-cypress-tx #wrapper #content-wide-top [id*="pagetitle"] h1,
  html body.page-spring-tx #wrapper #content-wide-top [id*="frontpagetitle"] h1,
  html body.page-spring-tx #wrapper #content-wide-top [id*="pagetitle"] h1,
  html body.page-tomball-tx #wrapper #content-wide-top [id*="frontpagetitle"] h1,
  html body.page-tomball-tx #wrapper #content-wide-top [id*="pagetitle"] h1,
  html body.page-jersey-village-tx #wrapper #content-wide-top [id*="frontpagetitle"] h1,
  html body.page-jersey-village-tx #wrapper #content-wide-top [id*="pagetitle"] h1 {
    width: calc(100% - 1rem) !important;
    max-width: 100% !important;
    font-size: 1.25rem !important;
    padding: 0.65rem 0.75rem !important;
  }
}

/* ---- Slide additional content (SEO packs under carousel) ---- */
html body.path-frontpage .slide-additional-content,
html body.page-houston-tx .slide-additional-content,
html body.page-katy-tx .slide-additional-content,
html body.page-cypress-tx .slide-additional-content,
html body.page-spring-tx .slide-additional-content,
html body.page-tomball-tx .slide-additional-content,
html body.page-jersey-village-tx .slide-additional-content {
  background: #f5f0fa !important;
  background-color: #f5f0fa !important;
  color: #1a0a24 !important;
  border: 1px solid #e9d5ff !important;
  border-radius: 16px !important;
  box-shadow: 0 4px 16px -6px rgba(59, 10, 92, 0.12) !important;
  padding: 1.5rem 1.25rem !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
}

html body.path-frontpage .slide-additional-content .section-title,
html body.page-houston-tx .slide-additional-content .section-title,
html body.page-katy-tx .slide-additional-content .section-title,
html body.page-cypress-tx .slide-additional-content .section-title,
html body.page-spring-tx .slide-additional-content .section-title,
html body.page-tomball-tx .slide-additional-content .section-title,
html body.page-jersey-village-tx .slide-additional-content .section-title {
  background: linear-gradient(135deg, #3b0a5c 0%, #6716aa 55%, #7b2cbf 100%) !important;
  background-color: #3b0a5c !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  display: inline-block !important;
  max-width: 100% !important;
  padding: 0.55rem 1.05rem !important;
  border-radius: 8px !important;
  border: 2px solid #000 !important;
  font-weight: 800 !important;
  line-height: 1.35 !important;
  margin-bottom: 1rem !important;
  box-shadow: 0 3px 10px rgba(59, 10, 92, 0.2) !important;
  text-shadow: none !important;
}

html body.path-frontpage .slide-additional-content .slide-seo-lead,
html body.path-frontpage .slide-additional-content .slide-seo-side,
html body.path-frontpage .slide-additional-content .slide-seo-focus,
html body.path-frontpage .slide-additional-content .slide-seo-cta-body,
html body.path-frontpage .slide-additional-content .slide-seo-foot,
html body.page-houston-tx .slide-additional-content .slide-seo-lead,
html body.page-houston-tx .slide-additional-content .slide-seo-side,
html body.page-houston-tx .slide-additional-content .slide-seo-focus,
html body.page-houston-tx .slide-additional-content .slide-seo-cta-body,
html body.page-houston-tx .slide-additional-content .slide-seo-foot,
html body.page-katy-tx .slide-additional-content .slide-seo-lead,
html body.page-katy-tx .slide-additional-content .slide-seo-side,
html body.page-katy-tx .slide-additional-content .slide-seo-focus,
html body.page-katy-tx .slide-additional-content .slide-seo-cta-body,
html body.page-katy-tx .slide-additional-content .slide-seo-foot,
html body.page-cypress-tx .slide-additional-content .slide-seo-lead,
html body.page-cypress-tx .slide-additional-content .slide-seo-side,
html body.page-cypress-tx .slide-additional-content .slide-seo-focus,
html body.page-cypress-tx .slide-additional-content .slide-seo-cta-body,
html body.page-cypress-tx .slide-additional-content .slide-seo-foot,
html body.page-spring-tx .slide-additional-content .slide-seo-lead,
html body.page-spring-tx .slide-additional-content .slide-seo-side,
html body.page-spring-tx .slide-additional-content .slide-seo-focus,
html body.page-spring-tx .slide-additional-content .slide-seo-cta-body,
html body.page-spring-tx .slide-additional-content .slide-seo-foot,
html body.page-tomball-tx .slide-additional-content .slide-seo-lead,
html body.page-tomball-tx .slide-additional-content .slide-seo-side,
html body.page-tomball-tx .slide-additional-content .slide-seo-focus,
html body.page-tomball-tx .slide-additional-content .slide-seo-cta-body,
html body.page-tomball-tx .slide-additional-content .slide-seo-foot,
html body.page-jersey-village-tx .slide-additional-content .slide-seo-lead,
html body.page-jersey-village-tx .slide-additional-content .slide-seo-side,
html body.page-jersey-village-tx .slide-additional-content .slide-seo-focus,
html body.page-jersey-village-tx .slide-additional-content .slide-seo-cta-body,
html body.page-jersey-village-tx .slide-additional-content .slide-seo-foot {
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  background: #f3e8ff !important;
  border-top: 1px solid #e9d5ff !important;
  border-right: 1px solid #e9d5ff !important;
  border-bottom: 1px solid #e9d5ff !important;
  border-left: 4px solid #b781e3 !important;
  border-radius: 8px !important;
  padding: 0.75rem 0.95rem !important;
  line-height: 1.65 !important;
  margin-bottom: 0.85rem !important;
}

html body.path-frontpage .slide-additional-content .slide-seo-focus-title,
html body.path-frontpage .slide-additional-content .slide-seo-steps-title,
html body.path-frontpage .slide-additional-content .slide-seo-cta-heading,
html body.page-houston-tx .slide-additional-content .slide-seo-focus-title,
html body.page-houston-tx .slide-additional-content .slide-seo-steps-title,
html body.page-houston-tx .slide-additional-content .slide-seo-cta-heading,
html body.page-katy-tx .slide-additional-content .slide-seo-focus-title,
html body.page-katy-tx .slide-additional-content .slide-seo-steps-title,
html body.page-katy-tx .slide-additional-content .slide-seo-cta-heading,
html body.page-cypress-tx .slide-additional-content .slide-seo-focus-title,
html body.page-cypress-tx .slide-additional-content .slide-seo-steps-title,
html body.page-cypress-tx .slide-additional-content .slide-seo-cta-heading,
html body.page-spring-tx .slide-additional-content .slide-seo-focus-title,
html body.page-spring-tx .slide-additional-content .slide-seo-steps-title,
html body.page-spring-tx .slide-additional-content .slide-seo-cta-heading,
html body.page-tomball-tx .slide-additional-content .slide-seo-focus-title,
html body.page-tomball-tx .slide-additional-content .slide-seo-steps-title,
html body.page-tomball-tx .slide-additional-content .slide-seo-cta-heading,
html body.page-jersey-village-tx .slide-additional-content .slide-seo-focus-title,
html body.page-jersey-village-tx .slide-additional-content .slide-seo-steps-title,
html body.page-jersey-village-tx .slide-additional-content .slide-seo-cta-heading {
  background: #7b2cbf !important;
  background-color: #7b2cbf !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  display: inline-block !important;
  max-width: 100% !important;
  padding: 0.4rem 0.9rem !important;
  border-radius: 7px !important;
  border: 2px solid #000 !important;
  font-weight: 800 !important;
  margin-bottom: 0.65rem !important;
  box-shadow: 0 2px 6px rgba(123, 44, 191, 0.2) !important;
}

/* Benefit / step lists */
html body.path-frontpage .slide-additional-content .seo-benefits,
html body.page-houston-tx .slide-additional-content .seo-benefits,
html body.page-katy-tx .slide-additional-content .seo-benefits,
html body.page-cypress-tx .slide-additional-content .seo-benefits,
html body.page-spring-tx .slide-additional-content .seo-benefits,
html body.page-tomball-tx .slide-additional-content .seo-benefits,
html body.page-jersey-village-tx .slide-additional-content .seo-benefits {
  list-style: none !important;
  padding-left: 0 !important;
  margin: 0 0 1rem 0 !important;
}

html body.path-frontpage .slide-additional-content .seo-benefits li,
html body.page-houston-tx .slide-additional-content .seo-benefits li,
html body.page-katy-tx .slide-additional-content .seo-benefits li,
html body.page-cypress-tx .slide-additional-content .seo-benefits li,
html body.page-spring-tx .slide-additional-content .seo-benefits li,
html body.page-tomball-tx .slide-additional-content .seo-benefits li,
html body.page-jersey-village-tx .slide-additional-content .seo-benefits li {
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  background: #ffffff !important;
  border-top: 1px solid #e9d5ff !important;
  border-right: 1px solid #e9d5ff !important;
  border-bottom: 1px solid #e9d5ff !important;
  border-left: 5px solid #6716aa !important;
  border-radius: 8px !important;
  padding: 0.55rem 0.85rem !important;
  margin-bottom: 0.5rem !important;
  line-height: 1.5 !important;
}

/* Trust badges */
html body.path-frontpage .slide-additional-content .trust-badges .badge,
html body.page-houston-tx .slide-additional-content .trust-badges .badge,
html body.page-katy-tx .slide-additional-content .trust-badges .badge,
html body.page-cypress-tx .slide-additional-content .trust-badges .badge,
html body.page-spring-tx .slide-additional-content .trust-badges .badge,
html body.page-tomball-tx .slide-additional-content .trust-badges .badge,
html body.page-jersey-village-tx .slide-additional-content .trust-badges .badge {
  background: linear-gradient(135deg, #3b0a5c 0%, #6716aa 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border: 2px solid #000 !important;
  border-radius: 999px !important;
  font-weight: 700 !important;
  padding: 0.35rem 0.75rem !important;
  margin: 0.2rem !important;
  display: inline-block !important;
}

/* Slide pack CTAs */
html body.path-frontpage .slide-additional-content a.slide-seo-cta,
html body.path-frontpage .slide-additional-content .slide-seo-cta,
html body.page-houston-tx .slide-additional-content a.slide-seo-cta,
html body.page-houston-tx .slide-additional-content .slide-seo-cta,
html body.page-katy-tx .slide-additional-content a.slide-seo-cta,
html body.page-katy-tx .slide-additional-content .slide-seo-cta,
html body.page-cypress-tx .slide-additional-content a.slide-seo-cta,
html body.page-cypress-tx .slide-additional-content .slide-seo-cta,
html body.page-spring-tx .slide-additional-content a.slide-seo-cta,
html body.page-spring-tx .slide-additional-content .slide-seo-cta,
html body.page-tomball-tx .slide-additional-content a.slide-seo-cta,
html body.page-tomball-tx .slide-additional-content .slide-seo-cta,
html body.page-jersey-village-tx .slide-additional-content a.slide-seo-cta,
html body.page-jersey-village-tx .slide-additional-content .slide-seo-cta {
  background: linear-gradient(135deg, #3b0a5c 0%, #6716aa 55%, #7b2cbf 100%) !important;
  background-color: #6716aa !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border: 2px solid #000 !important;
  border-radius: 10px !important;
  font-weight: 800 !important;
  padding: 0.65rem 1.15rem !important;
  text-decoration: none !important;
  display: inline-block !important;
  box-shadow: 0 3px 10px rgba(59, 10, 92, 0.22) !important;
}

html body.path-frontpage .slide-additional-content a.slide-seo-cta:hover,
html body.page-houston-tx .slide-additional-content a.slide-seo-cta:hover,
html body.page-katy-tx .slide-additional-content a.slide-seo-cta:hover,
html body.page-cypress-tx .slide-additional-content a.slide-seo-cta:hover,
html body.page-spring-tx .slide-additional-content a.slide-seo-cta:hover,
html body.page-tomball-tx .slide-additional-content a.slide-seo-cta:hover,
html body.page-jersey-village-tx .slide-additional-content a.slide-seo-cta:hover {
  background: linear-gradient(135deg, #6716aa 0%, #7b2cbf 100%) !important;
  color: #ffffff !important;
}

/* Slide pack nav buttons */
/* DISABLED 20260919 Row8 mobile bounce — white/8px chip fought purple SoT pills
html body.path-frontpage .slide-additional-nav__btn,
html body.page-houston-tx .slide-additional-nav__btn,
html body.page-katy-tx .slide-additional-nav__btn,
html body.page-cypress-tx .slide-additional-nav__btn,
html body.page-spring-tx .slide-additional-nav__btn,
html body.page-tomball-tx .slide-additional-nav__btn,
html body.page-jersey-village-tx .slide-additional-nav__btn {
  background: #ffffff !important;
  color: #3b0a5c !important;
  border: 2px solid #6716aa !important;
  border-radius: 8px !important;
  font-weight: 700 !important;
}
*/


@media (max-width: 767.98px) {
  html body.path-frontpage .slide-additional-content,
  html body.page-houston-tx .slide-additional-content,
  html body.page-katy-tx .slide-additional-content,
  html body.page-cypress-tx .slide-additional-content,
  html body.page-spring-tx .slide-additional-content,
  html body.page-tomball-tx .slide-additional-content,
  html body.page-jersey-village-tx .slide-additional-content {
    width: 94% !important;
    max-width: 100% !important;
    padding: 1rem 0.85rem !important;
  }
  html body.path-frontpage .slide-additional-content .section-title,
  html body.page-houston-tx .slide-additional-content .section-title,
  html body.page-katy-tx .slide-additional-content .section-title,
  html body.page-cypress-tx .slide-additional-content .section-title,
  html body.page-spring-tx .slide-additional-content .section-title,
  html body.page-tomball-tx .slide-additional-content .section-title,
  html body.page-jersey-village-tx .slide-additional-content .section-title {
    font-size: 1.05rem !important;
    padding: 0.45rem 0.8rem !important;
  }
}

/* ---- Testimonials block (home + cities share block id pattern) ---- */
html body.path-frontpage #block-martis-views-block-testimonials-block-1,
html body.page-houston-tx [id*="views-block-testimonials"],
html body.page-katy-tx [id*="views-block-testimonials"],
html body.page-cypress-tx [id*="views-block-testimonials"],
html body.page-spring-tx [id*="views-block-testimonials"],
html body.page-tomball-tx [id*="views-block-testimonials"],
html body.page-jersey-village-tx [id*="views-block-testimonials"] {
  background: transparent !important;
}

html body.path-frontpage #block-martis-views-block-testimonials-block-1 .block-title,
html body.path-frontpage #block-martis-views-block-testimonials-block-1 h2.block-title,
html body.page-houston-tx [id*="views-block-testimonials"] .block-title,
html body.page-katy-tx [id*="views-block-testimonials"] .block-title,
html body.page-cypress-tx [id*="views-block-testimonials"] .block-title,
html body.page-spring-tx [id*="views-block-testimonials"] .block-title,
html body.page-tomball-tx [id*="views-block-testimonials"] .block-title,
html body.page-jersey-village-tx [id*="views-block-testimonials"] .block-title {
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  font-weight: 800 !important;
  text-align: center !important;
}

html body.path-frontpage #block-martis-views-block-testimonials-block-1 .views_slideshow_cycle_slide,
html body.page-houston-tx [id*="views-block-testimonials"] .views_slideshow_cycle_slide,
html body.page-katy-tx [id*="views-block-testimonials"] .views_slideshow_cycle_slide,
html body.page-cypress-tx [id*="views-block-testimonials"] .views_slideshow_cycle_slide,
html body.page-spring-tx [id*="views-block-testimonials"] .views_slideshow_cycle_slide,
html body.page-tomball-tx [id*="views-block-testimonials"] .views_slideshow_cycle_slide,
html body.page-jersey-village-tx [id*="views-block-testimonials"] .views_slideshow_cycle_slide {
  background: #ffffff !important;
  border: 1px solid #e9d5ff !important;
  border-left: 5px solid #6716aa !important;
  border-radius: 16px !important;
  box-shadow: 0 4px 14px -4px rgba(59, 10, 92, 0.1) !important;
}

html body.path-frontpage #block-martis-views-block-testimonials-block-1 .views-field.views-field-body,
html body.page-houston-tx [id*="views-block-testimonials"] .views-field.views-field-body,
html body.page-katy-tx [id*="views-block-testimonials"] .views-field.views-field-body,
html body.page-cypress-tx [id*="views-block-testimonials"] .views-field.views-field-body,
html body.page-spring-tx [id*="views-block-testimonials"] .views-field.views-field-body,
html body.page-tomball-tx [id*="views-block-testimonials"] .views-field.views-field-body,
html body.page-jersey-village-tx [id*="views-block-testimonials"] .views-field.views-field-body {
  background: #f3e8ff !important;
  border: 1px solid #e9d5ff !important;
  border-left: 5px solid #b781e3 !important;
  color: #1a0a24 !important;
}

html body.path-frontpage #block-martis-views-block-testimonials-block-1 .views-field.views-field-title,
html body.path-frontpage #block-martis-views-block-testimonials-block-1 .views-field.views-field-title a,
html body.page-houston-tx [id*="views-block-testimonials"] .views-field.views-field-title,
html body.page-houston-tx [id*="views-block-testimonials"] .views-field.views-field-title a,
html body.page-katy-tx [id*="views-block-testimonials"] .views-field.views-field-title,
html body.page-katy-tx [id*="views-block-testimonials"] .views-field.views-field-title a {
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  font-weight: 800 !important;
}

html body.path-frontpage #block-martis-views-block-testimonials-block-1 .views-field.views-field-body a,
html body.page-houston-tx [id*="views-block-testimonials"] .views-field.views-field-body a,
html body.page-katy-tx [id*="views-block-testimonials"] .views-field.views-field-body a,
html body.page-cypress-tx [id*="views-block-testimonials"] .views-field.views-field-body a,
html body.page-spring-tx [id*="views-block-testimonials"] .views-field.views-field-body a,
html body.page-tomball-tx [id*="views-block-testimonials"] .views-field.views-field-body a,
html body.page-jersey-village-tx [id*="views-block-testimonials"] .views-field.views-field-body a {
  color: #5b21b6 !important;
  -webkit-text-fill-color: #5b21b6 !important;
}

/* ---- Partners block titles (home + city partner block ids) ---- */
html body.path-frontpage [id^="block-martis-views-block-partners-block-"] .block-title,
html body.page-houston-tx [id^="block-martis-views-block-partners-block-"] .block-title,
html body.page-katy-tx [id^="block-martis-views-block-partners-block-"] .block-title,
html body.page-cypress-tx [id^="block-martis-views-block-partners-block-"] .block-title,
html body.page-spring-tx [id^="block-martis-views-block-partners-block-"] .block-title,
html body.page-tomball-tx [id^="block-martis-views-block-partners-block-"] .block-title,
html body.page-jersey-village-tx [id^="block-martis-views-block-partners-block-"] .block-title {
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  font-weight: 800 !important;
  text-align: center !important;
}

html body.path-frontpage [id^="block-martis-views-block-partners-block-"] .views_slideshow_cycle_slide .views-row,
html body.page-houston-tx [id^="block-martis-views-block-partners-block-"] .views_slideshow_cycle_slide .views-row,
html body.page-katy-tx [id^="block-martis-views-block-partners-block-"] .views_slideshow_cycle_slide .views-row,
html body.page-cypress-tx [id^="block-martis-views-block-partners-block-"] .views_slideshow_cycle_slide .views-row,
html body.page-spring-tx [id^="block-martis-views-block-partners-block-"] .views_slideshow_cycle_slide .views-row,
html body.page-tomball-tx [id^="block-martis-views-block-partners-block-"] .views_slideshow_cycle_slide .views-row,
html body.page-jersey-village-tx [id^="block-martis-views-block-partners-block-"] .views_slideshow_cycle_slide .views-row {
  background: #ffffff !important;
  border: 1px solid #e9d5ff !important;
  border-radius: 12px !important;
  box-shadow: 0 2px 8px rgba(59, 10, 92, 0.06) !important;
}

/* Section spacing: slider → testimonials → partners */
html body.path-frontpage #block-martis-views-block-testimonials-block-1,
html body.page-houston-tx [id*="views-block-testimonials"],
html body.page-katy-tx [id*="views-block-testimonials"],
html body.page-cypress-tx [id*="views-block-testimonials"],
html body.page-spring-tx [id*="views-block-testimonials"],
html body.page-tomball-tx [id*="views-block-testimonials"],
html body.page-jersey-village-tx [id*="views-block-testimonials"] {
  margin-top: 1rem !important;
  margin-bottom: 1rem !important;
}

html body.path-frontpage [id^="block-martis-views-block-partners-block-"],
html body.page-houston-tx [id^="block-martis-views-block-partners-block-"],
html body.page-katy-tx [id^="block-martis-views-block-partners-block-"],
html body.page-cypress-tx [id^="block-martis-views-block-partners-block-"],
html body.page-spring-tx [id^="block-martis-views-block-partners-block-"],
html body.page-tomball-tx [id^="block-martis-views-block-partners-block-"],
html body.page-jersey-village-tx [id^="block-martis-views-block-partners-block-"] {
  margin-top: 1rem !important;
  margin-bottom: 1.25rem !important;
}

/* END home-city-policy-palette-2026-08-01 */

/* ==========================================================================
   POLICY PAGES — beat legacy custom_css solid-green p / purple Last Updated
   custom_css still has: .region.region-content p { bg #6716aa; color white }
   and purple inline Last Updated (#4c1d95). Late CSS wins with html body + #wrapper.
   ========================================================================== */

html body.page-privacy #wrapper .privacy-cards-wrapper > p,
html body.page-terms-and-conditions #wrapper .terms-cards-wrapper > p,
html body.page-bookings-refunds #wrapper .policy-cards-wrapper > p,
html body.page-privacy #wrapper .privacy-cards-wrapper p:is([style*="4c1d95"],.jd-db-match-37c73bb83edd),
html body.page-terms-and-conditions #wrapper .terms-cards-wrapper p:is([style*="4c1d95"],.jd-db-match-37c73bb83edd),
html body.page-bookings-refunds #wrapper .policy-cards-wrapper p:is([style*="4c1d95"],.jd-db-match-37c73bb83edd),
html body.page-privacy #wrapper .page-wrapper p:is([style*="4c1d95"],.jd-db-match-37c73bb83edd),
html body.page-terms-and-conditions #wrapper .page-wrapper p:is([style*="4c1d95"],.jd-db-match-37c73bb83edd),
html body.page-bookings-refunds #wrapper .page-wrapper p:is([style*="4c1d95"],.jd-db-match-37c73bb83edd) {
  background: #f3e8ff !important;
  background-color: #f3e8ff !important;
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  border: 1px solid #e9d5ff !important;
  border-left: 4px solid #6716aa !important;
  border-radius: 8px !important;
  text-align: center !important;
  font-weight: 700 !important;
  padding: 0.55rem 1rem !important;
  margin: 0.75rem auto 1.25rem !important;
  max-width: 100% !important;
  box-shadow: none !important;
}

html body.page-privacy #wrapper .privacy-cards-wrapper > p em,
html body.page-terms-and-conditions #wrapper .terms-cards-wrapper > p em,
html body.page-bookings-refunds #wrapper .policy-cards-wrapper > p em,
html body.page-privacy #wrapper .page-wrapper p:is([style*="4c1d95"],.jd-db-match-37c73bb83edd) em,
html body.page-terms-and-conditions #wrapper .page-wrapper p:is([style*="4c1d95"],.jd-db-match-37c73bb83edd) em,
html body.page-bookings-refunds #wrapper .page-wrapper p:is([style*="4c1d95"],.jd-db-match-37c73bb83edd) em {
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  font-style: italic !important;
}

/* Nuclear override: all card/summary/faq p+li stay soft+ink (not custom_css leaf/brand solid) */
html body.page-privacy #wrapper .region.region-content .privacy-cards-wrapper .card p,
html body.page-privacy #wrapper .region.region-content .privacy-cards-wrapper .card li,
html body.page-privacy #wrapper .region.region-content .privacy-cards-wrapper .summary-box p,
html body.page-privacy #wrapper .region.region-content .privacy-cards-wrapper .faq-card p,
html body.page-privacy #wrapper .region.region-content .privacy-cards-wrapper .main-grid .card p,
html body.page-terms-and-conditions #wrapper .region.region-content .terms-cards-wrapper .card p,
html body.page-terms-and-conditions #wrapper .region.region-content .terms-cards-wrapper .card li,
html body.page-terms-and-conditions #wrapper .region.region-content .terms-cards-wrapper .faq-card p,
html body.page-terms-and-conditions #wrapper .region.region-content .terms-cards-wrapper .main-grid .card p,
html body.page-bookings-refunds #wrapper .region.region-content .policy-cards-wrapper .card p,
html body.page-bookings-refunds #wrapper .region.region-content .policy-cards-wrapper .card li,
html body.page-bookings-refunds #wrapper .region.region-content .policy-cards-wrapper .summary-box p,
html body.page-bookings-refunds #wrapper .region.region-content .policy-cards-wrapper .faq-card p,
html body.page-bookings-refunds #wrapper .region.region-content .policy-cards-wrapper .main-grid .card p {
  background: #f3e8ff !important;
  background-color: #f3e8ff !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  border-top: 1px solid #e9d5ff !important;
  border-right: 1px solid #e9d5ff !important;
  border-bottom: 1px solid #e9d5ff !important;
  border-left: 4px solid #b781e3 !important;
}

html body.page-privacy #wrapper .region.region-content .privacy-cards-wrapper .card p strong,
html body.page-privacy #wrapper .region.region-content .privacy-cards-wrapper .summary-box p strong,
html body.page-terms-and-conditions #wrapper .region.region-content .terms-cards-wrapper .card p strong,
html body.page-bookings-refunds #wrapper .region.region-content .policy-cards-wrapper .card p strong,
html body.page-bookings-refunds #wrapper .region.region-content .policy-cards-wrapper .summary-box p strong {
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
}

/* FAQ cards white shell (not solid brand from custom_css) */
html body.page-privacy #wrapper .region.region-content .privacy-cards-wrapper .faq-card,
html body.page-terms-and-conditions #wrapper .region.region-content .terms-cards-wrapper .faq-card,
html body.page-bookings-refunds #wrapper .region.region-content .policy-cards-wrapper .faq-card {
  background: #ffffff !important;
  background-color: #ffffff !important;
  color: #1a0a24 !important;
  border-top: 1px solid #e9d5ff !important;
  border-right: 1px solid #e9d5ff !important;
  border-bottom: 1px solid #e9d5ff !important;
  border-left: 5px solid #6716aa !important;
}

/* Wrapper canvas mist (custom_css unsets background) */
html body.page-privacy #wrapper .privacy-cards-wrapper,
html body.page-terms-and-conditions #wrapper .terms-cards-wrapper,
html body.page-bookings-refunds #wrapper .policy-cards-wrapper {
  background: transparent !important;
  background-color: transparent !important;
}

/* END policy custom_css beaters */

/* ==========================================================================
   SERVICE HUB LISTINGS — refined palette + original teaser chrome (2026-08-01)
   Goals: fewer borders, restore CREATE/EXPERIENCES + SECURE PLATFORMS text-bg,
   circular icons in original positions, centered Read More, mobile centering.
   Scope: path-automotive-services | path-marine-and-rv-services | page-*-tx-*-services
   Exclude: page-node-type-service (leaf nodes already styled)
   ========================================================================== */

/* Tokens */
body.path-automotive-services,
body.path-marine-and-rv-services,
body.page-houston-tx-automotive-services,
body.page-houston-tx-marine-and-rv-services,
body.page-katy-tx-automotive-services,
body.page-katy-tx-marine-and-rv-services,
body.page-cypress-tx-automotive-services,
body.page-cypress-tx-marine-and-rv-services,
body.page-spring-tx-automotive-services,
body.page-spring-tx-marine-and-rv-services,
body.page-tomball-tx-automotive-services,
body.page-tomball-tx-marine-and-rv-services,
body.page-jersey-village-tx-automotive-services,
body.page-jersey-village-tx-marine-and-rv-services {
  --hub-forest: #3b0a5c;
  --hub-brand: #6716aa;
  --hub-mid: #7b2cbf;
  --hub-leaf: #b781e3;
  --hub-soft: #f3e8ff;
  --hub-mist: #f5f0fa;
  --hub-ink: #1a0a24;
  --hub-link: #5b21b6;
}

/* ---- H1 title chip (single border, not double frames) ---- */
html body.path-automotive-services #wrapper #content-wide-top .field-body > h1,
html body.path-automotive-services #wrapper #content-wide-top .block-block-content .field-item > h1,
html body.path-automotive-services #wrapper #content-wide-top [id*="servicestitle"] h1,
html body.path-marine-and-rv-services #wrapper #content-wide-top .field-body > h1,
html body.path-marine-and-rv-services #wrapper #content-wide-top .block-block-content .field-item > h1,
html body.path-marine-and-rv-services #wrapper #content-wide-top [id*="servicestitle"] h1,
html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper #content-wide-top .field-body > h1,
html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper #content-wide-top .block-block-content .field-item > h1,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper #content-wide-top .field-body > h1,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper #content-wide-top .block-block-content .field-item > h1 {
  background: linear-gradient(135deg, #3b0a5c 0%, #6716aa 55%, #7b2cbf 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-weight: 800 !important;
  text-shadow: none !important;
  border: 2px solid #000 !important;
  border-radius: 10px !important;
  box-shadow: 0 3px 10px rgba(59, 10, 92, 0.18) !important;
  padding: 0.75rem 1.1rem !important;
  text-align: center !important;
  width: auto !important;
  max-width: min(960px, calc(100% - 2.25rem)) !important;
  margin: 0.5rem auto 0rem;
  display: block !important;
  line-height: 1.3 !important;
  box-sizing: border-box !important;
  margin-bottom: 0rem;
}

/* ---- Teaser card: soft shell, ONE light edge (no stacked borders) ---- */
html body.path-automotive-services #wrapper .feat-container.service-teaser.service-teaser2,
html body.path-marine-and-rv-services #wrapper .feat-container.service-teaser.service-teaser2,
html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .feat-container.service-teaser.service-teaser2,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .feat-container.service-teaser.service-teaser2 {
  position: relative !important;
  display: block !important;
  background: #ffffff !important;
  color: #1a0a24 !important;
  border: 0 !important;
  border-radius: 14px !important;
  box-shadow: 0 4px 16px -4px rgba(59, 10, 92, 0.14) !important;
  overflow: visible !important;
  padding: 0.5rem 0.5rem 0.75rem !important;
  margin: 0 auto 1.25rem !important;
  box-sizing: border-box !important;
  height: auto !important;
  min-height: 0 !important;
}

/* Soft left accent only (no multi-side borders) */
html body.path-automotive-services #wrapper .feat-container.service-teaser.service-teaser2::before,
html body.path-marine-and-rv-services #wrapper .feat-container.service-teaser.service-teaser2::before,
html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .feat-container.service-teaser.service-teaser2::before,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .feat-container.service-teaser.service-teaser2::before {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  top: 0.65rem !important;
  bottom: 0.65rem !important;
  width: 4px !important;
  border-radius: 4px !important;
  background: linear-gradient(180deg, #6716aa, #b781e3) !important;
  pointer-events: none !important;
  z-index: 1 !important;
}

/* ---- Image: no extra black frame ---- */
html body.path-automotive-services #wrapper .service-teaser .service-image,
html body.path-marine-and-rv-services #wrapper .service-teaser .service-image,
html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .service-teaser .service-image,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .service-teaser .service-image {
  position: relative !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  border: 0 !important;
  border-radius: 12px !important;
  overflow: hidden !important;
  background: #1a0a24 !important;
  box-shadow: none !important;
}

html body.path-automotive-services #wrapper .service-teaser .service-image img,
html body.path-marine-and-rv-services #wrapper .service-teaser .service-image img,
html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .service-teaser .service-image img,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .service-teaser .service-image img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  border: 0 !important;
  border-radius: 0 !important;
  margin: 0 auto !important;
}

/* ---- text-bg: restore CREATE / EXPERIENCES, SECURE / PLATFORMS overlay ---- */
html body.path-automotive-services #wrapper .service-teaser .text-bg,
html body.path-marine-and-rv-services #wrapper .service-teaser .text-bg,
html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .service-teaser .text-bg,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .service-teaser .text-bg {
  position: absolute !important;
  left: 0.75rem !important;
  top: 18% !important;
  right: auto !important;
  width: auto !important;
  max-width: 58% !important;
  margin: 0 !important;
  padding: 0.55rem 0.7rem !important;
  background: rgba(123, 44, 191, 0.55) !important;
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
  border: 0 !important;
  outline: 0 !important;
  border-radius: 10px !important;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2) !important;
  z-index: 4 !important;
  display: block !important;
  min-height: 0 !important;
  height: auto !important;
  pointer-events: none !important;
}

html body.path-automotive-services #wrapper .service-teaser .field-field-text-bg,
html body.path-marine-and-rv-services #wrapper .service-teaser .field-field-text-bg,
html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .service-teaser .field-field-text-bg,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .service-teaser .field-field-text-bg {
  outline: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  backdrop-filter: none !important;
  width: auto !important;
  max-width: 100% !important;
  border-radius: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  display: block !important;
  min-height: 0 !important;
  height: auto !important;
}

html body.path-automotive-services #wrapper .service-teaser .text-bg .field-items,
html body.path-marine-and-rv-services #wrapper .service-teaser .text-bg .field-items,
html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .service-teaser .text-bg .field-items,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .service-teaser .text-bg .field-items {
  display: flex !important;
  flex-direction: column !important;
  flex-wrap: nowrap !important;
  align-items: flex-start !important;
  gap: 0.15rem !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  width: auto !important;
  height: auto !important;
  min-height: 0 !important;
}

/* Word stack: CREATE / EXPERIENCES — large stroke type like before */
html body.path-automotive-services #wrapper .service-teaser .text-bg .field-item,
html body.path-marine-and-rv-services #wrapper .service-teaser .text-bg .field-item,
html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .service-teaser .text-bg .field-item,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .service-teaser .text-bg .field-item {
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  font-size: clamp(1.15rem, 2.2vw, 1.65rem) !important;
  font-weight: 800 !important;
  line-height: 1.1 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #c9a0e8 !important;
  -webkit-text-stroke: 1px #ffffff !important;
  text-shadow:
    -1px -1px 0 #3b0a5c,
     1px -1px 0 #3b0a5c,
    -1px  1px 0 #3b0a5c,
     1px  1px 0 #3b0a5c,
     0 2px 6px rgba(0, 0, 0, 0.35) !important;
  opacity: 0.95 !important;
  width: auto !important;
  height: auto !important;
  min-height: 0 !important;
}

html body.path-automotive-services #wrapper .service-teaser .text-bg .field-item:nth-child(2),
html body.path-marine-and-rv-services #wrapper .service-teaser .text-bg .field-item:nth-child(2),
html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .service-teaser .text-bg .field-item:nth-child(2),
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .service-teaser .text-bg .field-item:nth-child(2) {
  padding-top: 0.15rem !important;
  margin-left: 0.35rem !important;
}

/* ---- Service icon: circular, original bottom-right over image style ---- */
html body.path-automotive-services #wrapper .service-teaser .service-icon,
html body.path-marine-and-rv-services #wrapper .service-teaser .service-icon,
html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .service-teaser .service-icon,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .service-teaser .service-icon {
  position: absolute !important;
  top: auto !important;
  right: 0.85rem !important;
  left: auto !important;
  bottom: auto !important;
  /* Sit over lower-right of image area (matches prior listing chrome) */
  margin: 0 !important;
  margin-top: 0 !important;
  margin-left: 0 !important;
  width: 5.25rem !important;
  height: 5.25rem !important;
  max-width: 28% !important;
  border: 2px solid #000 !important;
  border-radius: 50% !important;
  background-color: #6716aa !important;
  background: linear-gradient(204deg, #c9a0e8, #7b2cbf) !important;
  box-shadow: 4px 4px 8px rgba(0, 0, 0, 0.28) !important;
  z-index: 5 !important;
  padding: 0.35rem !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: hidden !important;
  transform: none !important;
  scale: 1 !important;
  /* Position after image starts: use top relative to card; image is first block */
  top: clamp(9.5rem, 42%, 14rem) !important;
}

html body.path-automotive-services #wrapper .service-teaser .service-icon img,
html body.path-marine-and-rv-services #wrapper .service-teaser .service-icon img,
html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .service-teaser .service-icon img,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .service-teaser .service-icon img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  border-radius: 50% !important;
  box-shadow: none !important;
  margin: 0 !important;
  scale: 1 !important;
  max-width: 100% !important;
  display: block !important;
}

/* ---- Post content panel (description + title + CTA) ---- */
html body.path-automotive-services #wrapper .service-teaser .post-content,
html body.path-marine-and-rv-services #wrapper .service-teaser .post-content,
html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .service-teaser .post-content,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .service-teaser .post-content {
  position: relative !important;
  background: #f5f0fa !important;
  background-color: #f5f0fa !important;
  border: 0 !important;
  border-radius: 0 0 12px 12px !important;
  box-shadow: none !important;
  margin: 0.65rem 0.15rem 0.15rem !important;
  padding: 0.85rem 0.75rem 1rem !important;
  text-align: center !important;
  color: #1a0a24 !important;
  width: auto !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

/* Title: simple weight, no extra chip border stack */
html body.path-automotive-services #wrapper .service-teaser .post-content h4,
html body.path-marine-and-rv-services #wrapper .service-teaser .post-content h4,
html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .service-teaser .post-content h4,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .service-teaser .post-content h4 {
  margin: 0 0 0.55rem !important;
  text-align: center !important;
  line-height: 1.3 !important;
}

html body.path-automotive-services #wrapper .service-teaser .post-content h4 a,
html body.path-automotive-services #wrapper .service-teaser .post-content h4 a span,
html body.path-marine-and-rv-services #wrapper .service-teaser .post-content h4 a,
html body.path-marine-and-rv-services #wrapper .service-teaser .post-content h4 a span,
html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .service-teaser .post-content h4 a,
html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .service-teaser .post-content h4 a span,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .service-teaser .post-content h4 a,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .service-teaser .post-content h4 a span {
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  font-weight: 800 !important;
  text-decoration: none !important;
  display: inline !important;
}

html body.path-automotive-services #wrapper .service-teaser .post-content h4 a:hover,
html body.path-automotive-services #wrapper .service-teaser .post-content h4 a:hover span,
html body.path-marine-and-rv-services #wrapper .service-teaser .post-content h4 a:hover,
html body.path-marine-and-rv-services #wrapper .service-teaser .post-content h4 a:hover span,
html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .service-teaser .post-content h4 a:hover,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .service-teaser .post-content h4 a:hover {
  color: #7b2cbf !important;
  -webkit-text-fill-color: #7b2cbf !important;
}

/* Description: soft fill, NO heavy multi-border rails */
html body.path-automotive-services #wrapper .service-teaser .post-content .mb-3,
html body.path-marine-and-rv-services #wrapper .service-teaser .post-content .mb-3,
html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .service-teaser .post-content .mb-3,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .service-teaser .post-content .mb-3 {
  margin: 0 auto 0.75rem !important;
  max-height: 10rem !important;
  overflow-y: auto !important;
  text-align: left !important;
  max-width: 100% !important;
}

html body.path-automotive-services #wrapper .service-teaser .post-content .mb-3 .field-body,
html body.path-automotive-services #wrapper .service-teaser .post-content .mb-3 .field-item,
html body.path-marine-and-rv-services #wrapper .service-teaser .post-content .mb-3 .field-body,
html body.path-marine-and-rv-services #wrapper .service-teaser .post-content .mb-3 .field-item,
html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .service-teaser .post-content .mb-3 .field-body,
html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .service-teaser .post-content .mb-3 .field-item,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .service-teaser .post-content .mb-3 .field-body,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .service-teaser .post-content .mb-3 .field-item {
  background: #f3e8ff !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  border: 0 !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  padding: 0.65rem 0.8rem !important;
  line-height: 1.55 !important;
  margin: 0 !important;
  text-align: left !important;
  display: block !important;
  width: 100% !important;
  box-sizing: border-box !important;
  min-height: 0 !important;
  height: auto !important;
}

/* Read More — centered pill (single border) */
html body.path-automotive-services #wrapper .service-teaser .post-content > a,
html body.path-marine-and-rv-services #wrapper .service-teaser .post-content > a,
html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .service-teaser .post-content > a,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .service-teaser .post-content > a {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  width: 100% !important;
  margin: 0.35rem auto 0 !important;
  text-align: center !important;
  text-decoration: none !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
}

html body.path-automotive-services #wrapper .service-teaser .post-content > a strong,
html body.path-marine-and-rv-services #wrapper .service-teaser .post-content > a strong,
html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .service-teaser .post-content > a strong,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .service-teaser .post-content > a strong {
  display: inline-block !important;
  margin: 0 auto !important;
  background: linear-gradient(135deg, #3b0a5c 0%, #6716aa 55%, #7b2cbf 100%) !important;
  background-color: #7b2cbf !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border: 2px solid #000 !important;
  border-radius: 8px !important;
  font-weight: 800 !important;
  text-shadow: none !important;
  box-shadow: 0 2px 6px rgba(59, 10, 92, 0.2) !important;
  padding: 0.45rem 1.15rem !important;
  animation: none !important;
  -webkit-animation: none !important;
  text-align: center !important;
}

html body.path-automotive-services #wrapper .service-teaser .post-content > a:hover strong,
html body.path-marine-and-rv-services #wrapper .service-teaser .post-content > a:hover strong,
html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .service-teaser .post-content > a:hover strong,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .service-teaser .post-content > a:hover strong {
  background: linear-gradient(135deg, #6716aa 0%, #7b2cbf 100%) !important;
  color: #ffffff !important;
}

/* Grid: centered columns */
html body.path-automotive-services #wrapper .page-wrapper .grid-item,
html body.path-marine-and-rv-services #wrapper .page-wrapper .grid-item,
html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .page-wrapper .grid-item,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .page-wrapper .grid-item,
html body.path-automotive-services #wrapper .region-content .grid-item,
html body.path-marine-and-rv-services #wrapper .region-content .grid-item,
html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .region-content .grid-item,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .region-content .grid-item {
  display: flex !important;
  justify-content: center !important;
  padding-left: 0.5rem !important;
  padding-right: 0.5rem !important;
  margin-bottom: 0.5rem !important;
  box-sizing: border-box !important;
}

html body.path-automotive-services #wrapper .breadcrumb a,
html body.path-marine-and-rv-services #wrapper .breadcrumb a,
html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .breadcrumb a,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .breadcrumb a {
  color: #5b21b6 !important;
}

/* ---- Mobile: center everything, fix icon/text-bg scale ---- */
@media (max-width: 767.98px) {
  html body.path-automotive-services #wrapper #content-wide-top .field-body > h1,
  html body.path-marine-and-rv-services #wrapper #content-wide-top .field-body > h1,
  html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper #content-wide-top .field-body > h1,
  html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper #content-wide-top .field-body > h1 {
    width: calc(100% - 1rem) !important;
    max-width: 100% !important;
    font-size: 1.15rem !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  html body.path-automotive-services #wrapper .feat-container.service-teaser.service-teaser2,
  html body.path-marine-and-rv-services #wrapper .feat-container.service-teaser.service-teaser2,
  html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .feat-container.service-teaser.service-teaser2,
  html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .feat-container.service-teaser.service-teaser2 {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding: 0.4rem 0.4rem 0.65rem !important;
  }

  html body.path-automotive-services #wrapper .page-wrapper .grid-item,
  html body.path-marine-and-rv-services #wrapper .page-wrapper .grid-item,
  html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .page-wrapper .grid-item,
  html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .page-wrapper .grid-item,
  html body.path-automotive-services #wrapper .region-content .grid-item,
  html body.path-marine-and-rv-services #wrapper .region-content .grid-item {
    flex: 0 0 100% !important;
    max-width: 100% !important;
    width: 100% !important;
    padding-left: 0.35rem !important;
    padding-right: 0.35rem !important;
    justify-content: center !important;
  }

  html body.path-automotive-services #wrapper .service-teaser .text-bg,
  html body.path-marine-and-rv-services #wrapper .service-teaser .text-bg,
  html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .service-teaser .text-bg,
  html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .service-teaser .text-bg {
    left: 0.55rem !important;
    top: 14% !important;
    max-width: 62% !important;
    padding: 0.4rem 0.5rem !important;
  }

  html body.path-automotive-services #wrapper .service-teaser .text-bg .field-item,
  html body.path-marine-and-rv-services #wrapper .service-teaser .text-bg .field-item,
  html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .service-teaser .text-bg .field-item,
  html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .service-teaser .text-bg .field-item {
    font-size: 1.05rem !important;
    letter-spacing: 0.08em !important;
  }

  html body.path-automotive-services #wrapper .service-teaser .service-icon,
  html body.path-marine-and-rv-services #wrapper .service-teaser .service-icon,
  html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .service-teaser .service-icon,
  html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .service-teaser .service-icon {
    width: 4.25rem !important;
    height: 4.25rem !important;
    right: 0.65rem !important;
    top: clamp(8.5rem, 38vw, 12rem) !important;
  }

  html body.path-automotive-services #wrapper .service-teaser .post-content,
  html body.path-marine-and-rv-services #wrapper .service-teaser .post-content,
  html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .service-teaser .post-content,
  html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .service-teaser .post-content {
    text-align: center !important;
    margin-left: 0.1rem !important;
    margin-right: 0.1rem !important;
    padding: 0.75rem 0.65rem 0.9rem !important;
  }

  html body.path-automotive-services #wrapper .service-teaser .post-content > a,
  html body.path-marine-and-rv-services #wrapper .service-teaser .post-content > a,
  html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .service-teaser .post-content > a,
  html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .service-teaser .post-content > a {
    justify-content: center !important;
    width: 100% !important;
  }

  html body.path-automotive-services #wrapper .service-teaser .post-content > a strong,
  html body.path-marine-and-rv-services #wrapper .service-teaser .post-content > a strong,
  html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .service-teaser .post-content > a strong,
  html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .service-teaser .post-content > a strong {
    min-width: 8.5rem !important;
  }
}

/* Desktop icon nudge: align lower-right of hero image */
@media (min-width: 768px) {
  html body.path-automotive-services #wrapper .service-teaser .service-icon,
  html body.path-marine-and-rv-services #wrapper .service-teaser .service-icon,
  html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .service-teaser .service-icon,
  html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .service-teaser .service-icon {
    width: 5.5rem !important;
    height: 5.5rem !important;
    right: 0.75rem !important;
    top: clamp(10.5rem, 28%, 15.5rem) !important;
  }
}

/* END hub-listing-palette-2026-08-01-v3 */

/* Hub v3 polish: plain titles (no solid green title chips) + cookie-free mobile QA */
html body.path-automotive-services #wrapper .service-teaser .post-content h4,
html body.path-marine-and-rv-services #wrapper .service-teaser .post-content h4,
html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .service-teaser .post-content h4,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .service-teaser .post-content h4,
html body.path-automotive-services #wrapper .service-teaser .post-content h4 a,
html body.path-marine-and-rv-services #wrapper .service-teaser .post-content h4 a,
html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .service-teaser .post-content h4 a,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .service-teaser .post-content h4 a {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  -webkit-text-fill-color: #3b0a5c !important;
  color: #3b0a5c !important;
}

/* Ensure teaser card itself doesn't get double outline from custom_css */
html body.path-automotive-services #wrapper .service-teaser2 .post-content,
html body.path-marine-and-rv-services #wrapper .service-teaser2 .post-content,
html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .service-teaser2 .post-content,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .service-teaser2 .post-content {
  border: 0 !important;
  border-top: 0 !important;
  border-bottom: 0 !important;
  outline: 0 !important;
}

/* END hub-v3-title-polish */

/* ==========================================================================
   HUB LISTINGS v4 — bigger overlay type + icons, minimal borders, true center
   ========================================================================== */

/* Shared hub teaser scope shorthand via repeated selectors */

/* Card: minimal original-style border (single soft black + radius) */
html body.path-automotive-services #wrapper .feat-container.service-teaser.service-teaser2,
html body.path-marine-and-rv-services #wrapper .feat-container.service-teaser.service-teaser2,
html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .feat-container.service-teaser.service-teaser2,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .feat-container.service-teaser.service-teaser2 {
  border: 2px solid #1a0a24 !important;
  border-radius: 14px !important;
  box-shadow: 0 5px 14px -4px rgba(59, 10, 92, 0.16) !important;
  background: #ffffff !important;
  margin-left: auto !important;
  margin-right: auto !important;
  width: 100% !important;
  max-width: 100% !important;
  overflow: visible !important;
  box-sizing: border-box !important;
}

/* Soft left rail only (keep light accent, not a second heavy frame) */
html body.path-automotive-services #wrapper .feat-container.service-teaser.service-teaser2::before,
html body.path-marine-and-rv-services #wrapper .feat-container.service-teaser.service-teaser2::before,
html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .feat-container.service-teaser.service-teaser2::before,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .feat-container.service-teaser.service-teaser2::before {
  width: 3px !important;
  left: 2px !important;
  top: 0.75rem !important;
  bottom: 0.75rem !important;
  opacity: 0.85 !important;
}

/* Image: subtle inner edge, no thick black box */
html body.path-automotive-services #wrapper .service-teaser .service-image,
html body.path-marine-and-rv-services #wrapper .service-teaser .service-image,
html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .service-teaser .service-image,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .service-teaser .service-image {
  border: 1px solid rgba(26, 10, 36, 0.2) !important;
  border-radius: 10px !important;
  overflow: hidden !important;
}

/* Post panel: light original border (minimal) */
html body.path-automotive-services #wrapper .service-teaser .post-content,
html body.path-marine-and-rv-services #wrapper .service-teaser .post-content,
html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .service-teaser .post-content,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .service-teaser .post-content {
  border: 1px solid #e9d5ff !important;
  border-radius: 10px !important;
  background: #f5f0fa !important;
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
  margin-top: 0.75rem !important;
}

/* Description chip: single soft edge */
html body.path-automotive-services #wrapper .service-teaser .post-content .mb-3 .field-item,
html body.path-marine-and-rv-services #wrapper .service-teaser .post-content .mb-3 .field-item,
html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .service-teaser .post-content .mb-3 .field-item,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .service-teaser .post-content .mb-3 .field-item {
  border: 1px solid #7424b8 !important;
  border-radius: 8px !important;
}

/* ---- Overlay text: bigger, upper-left inset (not flush, not vertical center) ---- */
html body.path-automotive-services #wrapper .service-teaser .text-bg,
html body.path-marine-and-rv-services #wrapper .service-teaser .text-bg,
html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .service-teaser .text-bg,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .service-teaser .text-bg {
  position: absolute !important;
  /* inset from left ~8–10% of card — not edge, not center */
  left: 8% !important;
  right: auto !important;
  top: 11% !important;
  transform: none !important;
  max-width: 55% !important;
  width: auto !important;
  padding: 0.65rem 0.85rem !important;
  background: rgba(103, 22, 170, 0.52) !important;
  backdrop-filter: blur(9px) !important;
  -webkit-backdrop-filter: blur(9px) !important;
  border: 1px solid rgba(255, 255, 255, 0.35) !important;
  border-radius: 10px !important;
  box-shadow: 0 3px 12px rgba(0, 0, 0, 0.22) !important;
  z-index: 4 !important;
}

html body.path-automotive-services #wrapper .service-teaser .text-bg .field-item,
html body.path-marine-and-rv-services #wrapper .service-teaser .text-bg .field-item,
html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .service-teaser .text-bg .field-item,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .service-teaser .text-bg .field-item {
  font-size: clamp(1.45rem, 2.6vw, 2rem) !important;
  font-weight: 800 !important;
  line-height: 1.05 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #c9a0e8 !important;
  -webkit-text-stroke: 1.15px #ffffff !important;
  text-shadow:
    -1px -1px 0 #3b0a5c,
     1px -1px 0 #3b0a5c,
    -1px  1px 0 #3b0a5c,
     1px  1px 0 #3b0a5c,
     0 3px 8px rgba(0, 0, 0, 0.4) !important;
  opacity: 0.98 !important;
}

html body.path-automotive-services #wrapper .service-teaser .text-bg .field-item:nth-child(2),
html body.path-marine-and-rv-services #wrapper .service-teaser .text-bg .field-item:nth-child(2),
html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .service-teaser .text-bg .field-item:nth-child(2),
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .service-teaser .text-bg .field-item:nth-child(2) {
  padding-top: 0.2rem !important;
  margin-left: 0.45rem !important;
}

/* ---- Service icon: larger (~25% of card), lower-right over image (pleasing) ---- */
html body.path-automotive-services #wrapper .service-teaser .service-icon,
html body.path-marine-and-rv-services #wrapper .service-teaser .service-icon,
html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .service-teaser .service-icon,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .service-teaser .service-icon {
  position: absolute !important;
  width: 26% !important;
  max-width: 7.25rem !important;
  min-width: 5.75rem !important;
  height: auto !important;
  aspect-ratio: 1 / 1 !important;
  /* Lower-right of image, slightly inset — original pleasing spot */
  top: auto !important;
  bottom: auto !important;
  left: auto !important;
  right: 6% !important;
  /* Sit on lower third of image area */
  top: 52% !important;
  margin: 0 !important;
  margin-top: 0 !important;
  margin-left: 0 !important;
  border: 2px solid #000 !important;
  border-radius: 50% !important;
  background: linear-gradient(204deg, #c9a0e8 0%, #7b2cbf 55%, #6716aa 100%) !important;
  background-color: #6716aa !important;
  box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.32) !important;
  z-index: 6 !important;
  padding: 0.4rem !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: hidden !important;
  scale: 1.15 !important;
  transform: none !important;
}

html body.path-automotive-services #wrapper .service-teaser .service-icon img,
html body.path-marine-and-rv-services #wrapper .service-teaser .service-icon img,
html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .service-teaser .service-icon img,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .service-teaser .service-icon img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  border-radius: 50% !important;
  box-shadow: none !important;
  margin: 0 !important;
  scale: 1 !important;
}

/* Grid: force center alignment of cards (desktop + mobile) */
html body.path-automotive-services #wrapper .page-wrapper .row,
html body.path-marine-and-rv-services #wrapper .page-wrapper .row,
html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .page-wrapper .row,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .page-wrapper .row,
html body.path-automotive-services #wrapper .region-content .row,
html body.path-marine-and-rv-services #wrapper .region-content .row,
html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .region-content .row,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .region-content .row {
  justify-content: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
  margin-top: -0.5rem;
  margin-bottom: -1rem;
}

html body.path-automotive-services #wrapper .page-wrapper .grid-item,
html body.path-marine-and-rv-services #wrapper .page-wrapper .grid-item,
html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .page-wrapper .grid-item,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .page-wrapper .grid-item,
html body.path-automotive-services #wrapper .region-content .grid-item,
html body.path-marine-and-rv-services #wrapper .region-content .grid-item,
html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .region-content .grid-item,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .region-content .grid-item,
html body.path-automotive-services #wrapper .page-wrapper [class*="col-"],
html body.path-marine-and-rv-services #wrapper .page-wrapper [class*="col-"],
html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .page-wrapper [class*="col-"],
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .page-wrapper [class*="col-"] {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: flex-start !important;
  float: none !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Read More stays centered */
html body.path-automotive-services #wrapper .service-teaser .post-content > a,
html body.path-marine-and-rv-services #wrapper .service-teaser .post-content > a,
html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .service-teaser .post-content > a,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .service-teaser .post-content > a {
  display: flex !important;
  justify-content: center !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* ---- Mobile: true center + scale type/icon ---- */
@media (max-width: 767.98px) {
  html body.path-automotive-services #wrapper .page-wrapper,
  html body.path-marine-and-rv-services #wrapper .page-wrapper,
  html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .page-wrapper,
  html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .page-wrapper,
  html body.path-automotive-services #wrapper .region-content,
  html body.path-marine-and-rv-services #wrapper .region-content {
    padding-left: 0.5rem !important;
    padding-right: 0.5rem !important;
  }

  html body.path-automotive-services #wrapper .page-wrapper .container,
  html body.path-marine-and-rv-services #wrapper .page-wrapper .container,
  html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .page-wrapper .container,
  html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .page-wrapper .container {
    max-width: 100% !important;
    padding-left: 0.5rem !important;
    padding-right: 0.5rem !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  html body.path-automotive-services #wrapper .page-wrapper .grid-item,
  html body.path-marine-and-rv-services #wrapper .page-wrapper .grid-item,
  html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .page-wrapper .grid-item,
  html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .page-wrapper .grid-item,
  html body.path-automotive-services #wrapper .page-wrapper [class*="col-"],
  html body.path-marine-and-rv-services #wrapper .page-wrapper [class*="col-"],
  html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .page-wrapper [class*="col-"],
  html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .page-wrapper [class*="col-"] {
    flex: 0 0 100% !important;
    max-width: 100% !important;
    width: 100% !important;
    padding-left: 0.35rem !important;
    padding-right: 0.35rem !important;
    margin-left: auto !important;
    margin-right: auto !important;
    align-items: center !important;
  }

  html body.path-automotive-services #wrapper .feat-container.service-teaser.service-teaser2,
  html body.path-marine-and-rv-services #wrapper .feat-container.service-teaser.service-teaser2,
  html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .feat-container.service-teaser.service-teaser2,
  html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .feat-container.service-teaser.service-teaser2 {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    float: none !important;
  }

  html body.path-automotive-services #wrapper .service-teaser .text-bg,
  html body.path-marine-and-rv-services #wrapper .service-teaser .text-bg,
  html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .service-teaser .text-bg,
  html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .service-teaser .text-bg {
    left: 5% !important;
    top: 10% !important;
    max-width: 100% !important;
    padding: 0.55rem 0.7rem !important;
  }

  html body.path-automotive-services #wrapper .service-teaser .text-bg .field-item,
  html body.path-marine-and-rv-services #wrapper .service-teaser .text-bg .field-item,
  html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .service-teaser .text-bg .field-item,
  html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .service-teaser .text-bg .field-item {
    font-size: 1.35rem !important;
    letter-spacing: 0.12em !important;
  }

  html body.path-automotive-services #wrapper .service-teaser .service-icon,
  html body.path-marine-and-rv-services #wrapper .service-teaser .service-icon,
  html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .service-teaser .service-icon,
  html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .service-teaser .service-icon {
    width: 28% !important;
    min-width: 5.5rem !important;
    max-width: 6.5rem !important;
    right: 7% !important;
    top: 48% !important;
    scale: 1.2 !important;
  }

  html body.path-automotive-services #wrapper .service-teaser .post-content,
  html body.path-marine-and-rv-services #wrapper .service-teaser .post-content,
  html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .service-teaser .post-content,
  html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .service-teaser .post-content {
    text-align: center !important;
    width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    margin-top: 0.65rem !important;
  }

  html body.path-automotive-services #wrapper #content-wide-top .field-body > h1,
  html body.path-marine-and-rv-services #wrapper #content-wide-top .field-body > h1,
  html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper #content-wide-top .field-body > h1,
  html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper #content-wide-top .field-body > h1 {
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: center !important;
  }
}

/* Desktop: slightly larger type + icon sit lower-right of image */
@media (min-width: 768px) {
  html body.path-automotive-services #wrapper .service-teaser .text-bg .field-item,
  html body.path-marine-and-rv-services #wrapper .service-teaser .text-bg .field-item,
  html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .service-teaser .text-bg .field-item,
  html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .service-teaser .text-bg .field-item {
    font-size: clamp(1.55rem, 1.8vw, 2.05rem) !important;
  }

  html body.path-automotive-services #wrapper .service-teaser .service-icon,
  html body.path-marine-and-rv-services #wrapper .service-teaser .service-icon,
  html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .service-teaser .service-icon,
  html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .service-teaser .service-icon {
    width: 27% !important;
    max-width: 7.75rem !important;
    min-width: 6.25rem !important;
    right: 5.5% !important;
    top: 50% !important;
    scale: 1.2 !important;
  }

  html body.path-automotive-services #wrapper .service-teaser .text-bg,
  html body.path-marine-and-rv-services #wrapper .service-teaser .text-bg,
  html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .service-teaser .text-bg,
  html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .service-teaser .text-bg {
    left: 7.5% !important;
    top: 10% !important;
  }
}

/* END hub-listing-v4 */

/* ==========================================================================
   HUB v4.1 — pin larger icons to IMAGE lower-right (not mid-card %)
   text-bg stays upper-left inset; mobile cards stay centered
   ========================================================================== */

html body.path-automotive-services #wrapper .service-teaser .service-icon,
html body.path-marine-and-rv-services #wrapper .service-teaser .service-icon,
html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .service-teaser .service-icon,
html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .service-teaser .service-icon {
  /* Original-ish: absolute from card top, over lower image, big circle */
  top: 10.25rem !important;
  right: 0.85rem !important;
  left: auto !important;
  bottom: auto !important;
  width: 6.75rem !important;
  height: 6.75rem !important;
  min-width: 6.75rem !important;
  max-width: 6.75rem !important;
  scale: 1.22 !important;
  margin: 0 !important;
}

/* Desktop 3-col: image is wider; drop icon a bit further down the photo */
@media (min-width: 992px) {
  html body.path-automotive-services #wrapper .service-teaser .service-icon,
  html body.path-marine-and-rv-services #wrapper .service-teaser .service-icon,
  html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .service-teaser .service-icon,
  html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .service-teaser .service-icon {
    top: 10.5rem !important;
    right: 0rem !important;
    width: 7.25rem !important;
    height: 7.25rem !important;
    min-width: 7.25rem !important;
    max-width: 7.25rem !important;
    scale: 1 !important;
  }
}

/* Tablet */
@media (min-width: 768px) and (max-width: 991.98px) {
  html body.path-automotive-services #wrapper .service-teaser .service-icon,
  html body.path-marine-and-rv-services #wrapper .service-teaser .service-icon,
  html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .service-teaser .service-icon,
  html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .service-teaser .service-icon {
    top: 12.5rem !important;
    right: 0.9rem !important;
    width: 6.5rem !important;
    height: 6.5rem !important;
    min-width: 6.5rem !important;
    max-width: 6.5rem !important;
    scale: 1.2 !important;
  }
}

/* Mobile: larger icon on image, left-inset overlay text bigger */
@media (max-width: 767.98px) {
  html body.path-automotive-services #wrapper .service-teaser .service-icon,
  html body.path-marine-and-rv-services #wrapper .service-teaser .service-icon,
  html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .service-teaser .service-icon,
  html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .service-teaser .service-icon {
    top: 10.75rem !important;
    right: 0.7rem !important;
    width: 6.25rem !important;
    height: 6.25rem !important;
    min-width: 6.25rem !important;
    max-width: 6.25rem !important;
    scale: 1.25 !important;
  }

  html body.path-automotive-services #wrapper .service-teaser .text-bg,
  html body.path-marine-and-rv-services #wrapper .service-teaser .text-bg,
  html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .service-teaser .text-bg,
  html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .service-teaser .text-bg {
    left: 9% !important;
    top: 9% !important;
    max-width: 68% !important;
    padding: 0.6rem 0.75rem !important;
  }

  html body.path-automotive-services #wrapper .service-teaser .text-bg .field-item,
  html body.path-marine-and-rv-services #wrapper .service-teaser .text-bg .field-item,
  html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .service-teaser .text-bg .field-item,
  html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .service-teaser .text-bg .field-item {
    font-size: 1.5rem !important;
    letter-spacing: 0.13em !important;
  }

  /* Center the whole mobile column hard */
  html body.path-automotive-services #wrapper .page-wrapper .main-content,
  html body.path-marine-and-rv-services #wrapper .page-wrapper .main-content,
  html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .page-wrapper .main-content,
  html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .page-wrapper .main-content {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
  }

  html body.path-automotive-services #wrapper .feat-container.service-teaser.service-teaser2,
  html body.path-marine-and-rv-services #wrapper .feat-container.service-teaser.service-teaser2,
  html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .feat-container.service-teaser.service-teaser2,
  html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .feat-container.service-teaser.service-teaser2 {
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
}

/* Desktop overlay type a touch larger + left inset */
@media (min-width: 768px) {
  html body.path-automotive-services #wrapper .service-teaser .text-bg,
  html body.path-marine-and-rv-services #wrapper .service-teaser .text-bg,
  html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .service-teaser .text-bg,
  html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .service-teaser .text-bg {
    left: 5% !important;
    top: 9% !important;
    max-width: 100% !important;
    padding: 0.7rem 0.9rem !important;
  }

  html body.path-automotive-services #wrapper .service-teaser .text-bg .field-item,
  html body.path-marine-and-rv-services #wrapper .service-teaser .text-bg .field-item,
  html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .service-teaser .text-bg .field-item,
  html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .service-teaser .text-bg .field-item {
    font-size: clamp(1.65rem, 1.9vw, 2.15rem) !important;
    letter-spacing: 0.15em !important;
  }
}

/* END hub-v4.1-icon-pin */

/* ==========================================================================
   HUB v4.2 — mobile cards full usable width (was ~22.5rem / too narrow)
   ========================================================================== */

@media (max-width: 767.98px) {
  /* Kill the artificial narrow cap */
  html body.path-automotive-services #wrapper .feat-container.service-teaser.service-teaser2,
  html body.path-marine-and-rv-services #wrapper .feat-container.service-teaser.service-teaser2,
  html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .feat-container.service-teaser.service-teaser2,
  html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .feat-container.service-teaser.service-teaser2 {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin-left: auto !important;
    margin-right: auto !important;
    box-sizing: border-box !important;
  }

  /* Columns / grid items: full width of content area */
  html body.path-automotive-services #wrapper .page-wrapper .grid-item,
  html body.path-marine-and-rv-services #wrapper .page-wrapper .grid-item,
  html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .page-wrapper .grid-item,
  html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .page-wrapper .grid-item,
  html body.path-automotive-services #wrapper .region-content .grid-item,
  html body.path-marine-and-rv-services #wrapper .region-content .grid-item,
  html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .region-content .grid-item,
  html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .region-content .grid-item,
  html body.path-automotive-services #wrapper .page-wrapper [class*="col-"],
  html body.path-marine-and-rv-services #wrapper .page-wrapper [class*="col-"],
  html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .page-wrapper [class*="col-"],
  html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .page-wrapper [class*="col-"] {
    flex: 0 0 100% !important;
    max-width: 100% !important;
    width: 100% !important;
    padding-left: 0.4rem !important;
    padding-right: 0.4rem !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  /* Page container: modest side gutters only */
  html body.path-automotive-services #wrapper .page-wrapper > .container,
  html body.path-marine-and-rv-services #wrapper .page-wrapper > .container,
  html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .page-wrapper > .container,
  html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .page-wrapper > .container,
  html body.path-automotive-services #wrapper .page-wrapper .container,
  html body.path-marine-and-rv-services #wrapper .page-wrapper .container {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 0.65rem !important;
    padding-right: 0.65rem !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  html body.path-automotive-services #wrapper .page-wrapper,
  html body.path-marine-and-rv-services #wrapper .page-wrapper,
  html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .page-wrapper,
  html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .page-wrapper {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  /* Title chip also uses full width comfortably */
  html body.path-automotive-services #wrapper #content-wide-top .field-body > h1,
  html body.path-marine-and-rv-services #wrapper #content-wide-top .field-body > h1,
  html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper #content-wide-top .field-body > h1,
  html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper #content-wide-top .field-body > h1 {
    width: calc(100% - 0.5rem) !important;
    max-width: 100% !important;
  }
}

/* END hub-v4.2-mobile-width */

/* ==========================================================================
   HUB v4.3 — FORCE full mobile width (col-md-9 + container + teaser)
   Root cause: layout is col-md-9 main column; earlier caps at 22.5rem; gutters.
   ========================================================================== */

@media (max-width: 991.98px) {
  /* Main column: use full row (no 75% leftover from md-9) */
  html body.path-automotive-services #wrapper .row.content-layout,
  html body.path-marine-and-rv-services #wrapper .row.content-layout,
  html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .row.content-layout,
  html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .row.content-layout {
    display: flex !important;
    flex-wrap: wrap !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  html body.path-automotive-services #wrapper .col-md-9.left-content.main-content,
  html body.path-marine-and-rv-services #wrapper .col-md-9.left-content.main-content,
  html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .col-md-9.left-content.main-content,
  html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .col-md-9.left-content.main-content,
  html body.path-automotive-services #wrapper .left-content.main-content,
  html body.path-marine-and-rv-services #wrapper .left-content.main-content,
  html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .left-content.main-content,
  html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .left-content.main-content {
    flex: 0 0 100% !important;
    max-width: 100% !important;
    width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  /* Hide empty/side chrome if it steals width on hubs */
  html body.path-automotive-services #wrapper .content-layout > .col-md-3,
  html body.path-marine-and-rv-services #wrapper .content-layout > .col-md-3,
  html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .content-layout > .col-md-3,
  html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .content-layout > .col-md-3,
  html body.path-automotive-services #wrapper .region-sidebar-second,
  html body.path-marine-and-rv-services #wrapper .region-sidebar-second,
  html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .region-sidebar-second,
  html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .region-sidebar-second {
    display: none !important;
    width: 0 !important;
    max-width: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  html body.path-automotive-services #wrapper .page-wrapper > .container,
  html body.path-marine-and-rv-services #wrapper .page-wrapper > .container,
  html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .page-wrapper > .container,
  html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .page-wrapper > .container,
  html body.path-automotive-services #wrapper .page-wrapper .container,
  html body.path-marine-and-rv-services #wrapper .page-wrapper .container {
    max-width: 100% !important;
    width: 100% !important;
    padding-left: 0.75rem !important;
    padding-right: 0.75rem !important;
  }

  html body.path-automotive-services #wrapper .container-wrap,
  html body.path-marine-and-rv-services #wrapper .container-wrap,
  html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .container-wrap,
  html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .container-wrap,
  html body.path-automotive-services #wrapper .views-element-container,
  html body.path-marine-and-rv-services #wrapper .views-element-container,
  html body.path-automotive-services #wrapper .view-item,
  html body.path-marine-and-rv-services #wrapper .view-item,
  html body.path-automotive-services #wrapper .row.grid-wrapper,
  html body.path-marine-and-rv-services #wrapper .row.grid-wrapper {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  html body.path-automotive-services #wrapper .feat-container.service-teaser.service-teaser2,
  html body.path-marine-and-rv-services #wrapper .feat-container.service-teaser.service-teaser2,
  html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .feat-container.service-teaser.service-teaser2,
  html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .feat-container.service-teaser.service-teaser2 {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
  }

  html body.path-automotive-services #wrapper .page-wrapper .grid-item,
  html body.path-marine-and-rv-services #wrapper .page-wrapper .grid-item,
  html body.path-automotive-services #wrapper .grid-item,
  html body.path-marine-and-rv-services #wrapper .grid-item,
  html body.path-automotive-services #wrapper .col-12.col-sm-12.col-md-6.col-lg-4.grid-item,
  html body.path-marine-and-rv-services #wrapper .col-12.col-sm-12.col-md-6.col-lg-4.grid-item {
    flex: 0 0 100% !important;
    max-width: 100% !important;
    width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}

@media (max-width: 767.98px) {
  /* Even tighter gutters on true phones */
  html body.path-automotive-services #wrapper .page-wrapper > .container,
  html body.path-marine-and-rv-services #wrapper .page-wrapper > .container,
  html body[class*="-automotive-services"]:not(.page-node-type-service) #wrapper .page-wrapper > .container,
  html body[class*="-marine-and-rv-services"]:not(.page-node-type-service) #wrapper .page-wrapper > .container {
    padding-left: 0.5rem !important;
    padding-right: 0.5rem !important;
  }
}

/* END hub-v4.3-full-width */

/* ==========================================================================
   STORE + PRODUCT PAGES — layered green palette (2026-08-01)
   Scopes: path-products, path-product, path-store, path-taxonomy (brand/cat
   under /products/*), page-store-home
   Match hub/service: mist canvas, white cards, forest H1 chips, soft borders,
   mobile full width. Beat solid-green category shells + custom_css widths.
   ========================================================================== */

body.path-products,
body.path-product,
body.path-store,
body.page-store-home,
body.path-taxonomy.page-products-brand-hp,
body[class*="page-products"] {
  --shop-forest: #3b0a5c;
  --shop-brand: #6716aa;
  --shop-mid: #7b2cbf;
  --shop-leaf: #b781e3;
  --shop-mint: #c9a0e8;
  --shop-soft: #f3e8ff;
  --shop-mist: #f5f0fa;
  --shop-ink: #1a0a24;
  --shop-link: #5b21b6;
  --shop-border: #e9d5ff;
}

/* ---- Page H1: forest gradient chip (listing + product) ---- */
html body.path-products #wrapper h1.commerce-content-h1,
html body.path-taxonomy #wrapper h1.commerce-content-h1,
html body.path-product #wrapper h1.commerce-content-h1,
html body.path-store #wrapper h1.commerce-content-h1,
html body.path-products #wrapper .commerce-content-header .commerce-content-h1,
html body.path-taxonomy #wrapper .commerce-content-header .commerce-content-h1,
html body.path-product #wrapper h1.commerce-product-h1,
html body.path-products #wrapper h1.commerce-product-h1,
html body.page-store-home #wrapper #content-wide-top .field-body > h1,
html body.page-store-home #wrapper #content-wide-top .block-block-content .field-item > h1 {
  background: linear-gradient(135deg, #3b0a5c 0%, #6716aa 55%, #7b2cbf 100%) !important;
  background-color: #3b0a5c !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-weight: 800 !important;
  text-shadow: none !important;
  border: 2px solid #000 !important;
  border-radius: 10px !important;
  box-shadow: 0 3px 10px rgba(59, 10, 92, 0.2) !important;
  padding: 0.7rem 1.05rem !important;
  text-align: center !important;
  display: block !important;
  width: auto !important;
  max-width: min(960px, 100%) !important;
  margin: 0.5rem auto 1rem !important;
  line-height: 1.3 !important;
  box-sizing: border-box !important;
}

html body.path-products #wrapper .commerce-content-header,
html body.path-taxonomy #wrapper .commerce-content-header,
html body.path-product #wrapper .commerce-content-header,
html body.path-store #wrapper .commerce-content-header {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  text-align: center !important;
}

/* ---- Categories block: mist shell, not solid green slab ---- */






/* Parent category cards: light green shell (readable mint surface) */






/* Child category descriptions in Browse by Category (full text, no clamp) */




/* Category listing page H1 deck (parent + child term pages) */
html body.path-products #wrapper .category-listing-description,
html body.path-taxonomy #wrapper .category-listing-description,
html body.path-products #wrapper .commerce-content-header.category-listing-h1 .category-listing-description,
html body.path-taxonomy #wrapper .commerce-content-header.category-listing-h1 .category-listing-description {
  display: block !important;
  margin: 1.55rem auto 0 auto !important;
  padding: 0.65rem 0.85rem !important;
  max-width: 52rem !important;
  font-size: clamp(0.9rem, 2vw, 1.02rem) !important;
  line-height: 1.55 !important;
  font-weight: 500 !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  background: #f3e8ff !important;
  border: 2px solid #6716aa !important;
  border-radius: 10px !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.35) !important;
  max-height: none !important;
  height: auto !important;
  overflow: visible !important;
  white-space: normal !important;
  -webkit-line-clamp: unset !important;
  line-clamp: unset !important;
}

/* Child links: soft pills, not solid dark green bars */




/* Brand logo grid cards */




/* ---- Product teaser cards (catalog results) ---- */
html body.path-products #wrapper .product-teaser,
html body.path-taxonomy #wrapper .product-teaser,
html body.path-product #wrapper .product-teaser,
html body.path-store #wrapper .product-teaser,
html body.path-products .product-teaser,
html body.path-taxonomy .product-teaser {
  border: 1px solid #e9d5ff !important;
  border-radius: 14px !important;
  box-shadow: 0 4px 14px -4px rgba(59, 10, 92, 0.12) !important;
  overflow: hidden !important;
}

html body.path-products #wrapper .product-teaser:hover,
html body.path-taxonomy #wrapper .product-teaser:hover,
html body.path-products .product-teaser:hover {
  border-color: #c9a0e8 !important;
  border-left-color: #6716aa !important;
  box-shadow: 0 8px 20px -6px rgba(59, 10, 92, 0.18) !important;
}

html body.path-products #wrapper .product-teaser .product-title a,
html body.path-taxonomy #wrapper .product-teaser .product-title a,
html body.path-products #wrapper a.product-title-link,
html body.path-taxonomy #wrapper a.product-title-link {
  color: #3b0a5c !important;
  font-weight: 800 !important;
}

html body.path-products #wrapper .product-teaser .product-price,
html body.path-taxonomy #wrapper .product-teaser .product-price,
html body.path-products #wrapper .product-teaser .price {
  color: #6716aa !important;
  font-weight: 800 !important;
}

html body.path-products #wrapper .product-teaser .button,
html body.path-taxonomy #wrapper .product-teaser .button,
html body.path-products #wrapper .product-teaser-learn-more,
html body.path-taxonomy #wrapper .product-teaser-learn-more,
html body.path-products #wrapper .btn.product-teaser-learn-more {
  background: linear-gradient(135deg, #3b0a5c 0%, #6716aa 55%, #7b2cbf 100%) !important;
  background-color: #6716aa !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border: 2px solid #000 !important;
  border-radius: 8px !important;
  font-weight: 800 !important;
  text-align: center !important;
}

/* Short description soft chip */
html body.path-products #wrapper .product-teaser .field-field-short-description .field-item,
html body.path-taxonomy #wrapper .product-teaser .field-field-short-description .field-item,
html body.path-products #wrapper .product-teaser .product-teaser-short-desc .field-item {
  background: #f3e8ff !important;
  color: #1a0a24 !important;
  border: 1px solid #7424b8 !important;
  border-radius: 8px !important;
  margin-bottom: 1.5rem !important;
}

/* ---- Search form ---- */


html body.path-products #wrapper #edit-submit-product-catalog,
html body.path-taxonomy #wrapper #edit-submit-product-catalog {
  background: linear-gradient(135deg, #3b0a5c 0%, #6716aa 55%, #7b2cbf 100%) !important;
  background-color: #6716aa !important;
  color: #ffffff !important;
  border: 2px solid #000 !important;
  border-radius: 8px !important;
  font-weight: 800 !important;
}

/* ---- Shop benefit / icon boxes (store + products top) ---- */


/* ---- Product detail (path-product) ---- */
html body.path-product #wrapper .product--rendered-attribute,
html body.path-product #wrapper .commerce-product,
html body.path-product #wrapper .product-content-wrap {
  color: #1a0a24 !important;
}

html body.path-product #wrapper .field--name-price,
html body.path-product #wrapper .product-price,
html body.path-product #wrapper .price__number {
  color: #6716aa !important;
  font-weight: 800 !important;
}

html body.path-product #wrapper .button--add-to-cart,
html body.path-product #wrapper .commerce-order-item-add-to-cart-form .button,
html body.path-product #wrapper input.button--add-to-cart,
html body.path-product #wrapper .form-actions .button {
  background: linear-gradient(135deg, #3b0a5c 0%, #6716aa 55%, #7b2cbf 100%) !important;
  color: #ffffff !important;
  border: 2px solid #000 !important;
  border-radius: 8px !important;
  font-weight: 800 !important;
}

html body.path-product #wrapper .product-images,
html body.path-product #wrapper .product-image-wrap,
html body.path-product #wrapper .field--name-field-images {
  border: 1px solid #e9d5ff !important;
  border-radius: 12px !important;
  background: white !important;
  overflow: hidden !important;
}

/* ---- Store listing pages ---- */
html body.path-store #wrapper .region-content,
html body.page-store-home #wrapper .region-content {
  color: #1a0a24 !important;
}

html body.path-store #wrapper .breadcrumb a,
html body.path-products #wrapper .breadcrumb a,
html body.path-product #wrapper .breadcrumb a {
  color: #5b21b6 !important;
}

/* ---- Mobile / tablet: full width like hubs ---- */
@media (max-width: 991.98px) {
  html body.path-products #wrapper .col-md-9.left-content.main-content,
  html body.path-taxonomy #wrapper .col-md-9.left-content.main-content,
  html body.path-product #wrapper .col-md-9.left-content.main-content,
  html body.path-store #wrapper .col-md-9.left-content.main-content,
  html body.page-store-home #wrapper .col-md-9.left-content.main-content {
    flex: 0 0 100% !important;
    max-width: 100% !important;
    width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  html body.path-products #wrapper .region-sidebar-second,
  html body.path-taxonomy #wrapper .region-sidebar-second,
  html body.path-product #wrapper .region-sidebar-second,
  html body.path-store #wrapper .region-sidebar-second {
    display: none !important;
  }

  html body.path-products #wrapper .page-wrapper > .container,
  html body.path-taxonomy #wrapper .page-wrapper > .container,
  html body.path-product #wrapper .page-wrapper > .container,
  html body.path-store #wrapper .page-wrapper > .container {
    max-width: 100% !important;
    width: 100% !important;
    padding-left: 0.65rem !important;
    padding-right: 0.65rem !important;
  }

  

  html body.path-products #wrapper h1.commerce-content-h1,
  html body.path-taxonomy #wrapper h1.commerce-content-h1,
  html body.path-product #wrapper h1.commerce-product-h1 {
    width: 100% !important;
    max-width: 100% !important;
    font-size: 1.2rem !important;
  }

  html body.path-products #wrapper .product-teaser,
html body.path-taxonomy #wrapper .product-teaser {
    width: 100% !important;
    max-width: 100% !important;
  }

  /* Mobile / tablet: 2-column product teaser grid (was forced 1-col 100%).
     Use calc(50% - half-gap) so row gap from custom_css does not force wrap. */
  html body.path-products #wrapper .product-catalog .grid-wrapper,
  html body.path-taxonomy #wrapper .product-catalog .grid-wrapper,
  html body.path-products #wrapper .view-product-catalog .grid-wrapper,
  html body.path-taxonomy #wrapper .view-product-catalog .grid-wrapper,
  html body.path-products #wrapper .view-brand-product-listings .grid-wrapper,
  html body.path-taxonomy #wrapper .view-brand-product-listings .grid-wrapper,
  html body.path-products #wrapper .view-product-category-listings .grid-wrapper,
  html body.path-taxonomy #wrapper .view-product-category-listings .grid-wrapper {
    gap: 0.5rem !important;
    row-gap: 0.65rem !important;
    column-gap: 0.5rem !important;
  }

  html body.path-products #wrapper .product-catalog .grid-wrapper > .grid-item,
  html body.path-taxonomy #wrapper .product-catalog .grid-wrapper > .grid-item,
  html body.path-products #wrapper .view-product-catalog .grid-wrapper > .grid-item,
  html body.path-taxonomy #wrapper .view-product-catalog .grid-wrapper > .grid-item,
  html body.path-products #wrapper .view-brand-product-listings .grid-wrapper > .grid-item,
  html body.path-taxonomy #wrapper .view-brand-product-listings .grid-wrapper > .grid-item,
  html body.path-products #wrapper .view-product-category-listings .grid-wrapper > .grid-item,
  html body.path-taxonomy #wrapper .view-product-category-listings .grid-wrapper > .grid-item {
    flex: 0 0 calc(50% - 0.25rem) !important;
    max-width: calc(50% - 0.25rem) !important;
    width: calc(50% - 0.25rem) !important;
    padding-left: 0.2rem !important;
    padding-right: 0.2rem !important;
    box-sizing: border-box !important;
  }
}

@media (max-width: 767.98px) {
  html body.path-products #wrapper .page-wrapper > .container,
  html body.path-taxonomy #wrapper .page-wrapper > .container,
  html body.path-store #wrapper .page-wrapper > .container {
    padding-left: 0.5rem !important;
    padding-right: 0.5rem !important;
  }
}

/* END store-product-palette-2026-08-01 */

/* ==========================================================================
   STORE/PRODUCT polish v2 (audit 2026-08-01)
   1) Drop extra outer border on taxonomy category shell
   2) Restore green brand logo cards (were forced white)
   3) Align search block full width/height on brand + category pages
   ========================================================================== */

/* 1) Taxonomy "Browse by Category" shell — no outer frame (inner cards keep rail) */


/* Keep parent cards as layered cards (soft mint edge, brand rail — no heavy black) */


/* 2) Brand logo grid — restore green gradient cards (commerce-material intent) */


/* Undo white override on brand card children wrappers */


/* Brand name on green card = white for contrast */


/* Logo plate stays white (readable logos) */


/* Description text under brand if present */


/* 3) Search block — same content width as H1 / catalog on all product surfaces */




/* Match search row height: inputs fill, submit aligned */




html body.path-products #wrapper #edit-submit-product-catalog,
html body.path-taxonomy #wrapper #edit-submit-product-catalog {
  min-height: 2.75rem !important;
  width: 30% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

/* Kill leftover 92% search widths on product surfaces (older chrome rules) */
@media (max-width: 991.98px) {
  

  /* Align H1 + search + catalog to same content column */
  html body.path-products #wrapper .commerce-content-header,
  html body.path-taxonomy #wrapper .commerce-content-header,
  html body.path-product #wrapper .commerce-content-header {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0.5rem !important;
    padding-right: 0.5rem !important;
  }
}

/* Soften shopicon outer group if it got a black frame (benefit tiles keep their own border) */




/* END store-product-polish-v2 */

/* ==========================================================================
   STORE/PRODUCT polish v3 — shopicon border, titles, category radius, search
   ========================================================================== */

/* ---- 1) Next-day Shipping group: NO outer border ---- */




/* Individual benefit tiles keep their own green chrome only */


/* ---- 2) Browse by Category + Browse by Brand titles: centered, readable, even pad ---- */




/* Remove folder/icon pseudo that can read as white glyph beside title */


/* ---- 3) Category parent cards: proper border-radius all around ---- */




/* ---- 4) Browse by Brand block: match category section chrome ---- */


/* Brand cards already green; ensure radius + black border consistent */


/* ---- 5) Search for Available Products: readable title (not white) ---- */


/* Search block slightly narrower to match content column */


@media (max-width: 991.98px) {
  
}

/* Category grid even spacing under centered title */


/* END store-product-polish-v3 */

/* ==========================================================================
   store-product-polish-v4 — 2026-08-01
   - Readable "Search products" label (kill custom_css white)
   - Narrow Search submit (not full width)
   - Stylish bottom border under Browse by Category / Brand
   - Even vertical title spacing between adjacent blocks
   ========================================================================== */

/* ---- 1) Search products label: forest ink, never white ---- */


/* Search block title (h2) — reinforce forest; beat animate white */


/* ---- 2) Narrow Search button (not 100% width) ---- */


html body.path-products #wrapper #edit-submit-product-catalog--2,
html body.path-taxonomy #wrapper #edit-submit-product-catalog--2,
html body.path-products #wrapper #edit-actions--2 #edit-submit-product-catalog--2,
html body.path-taxonomy #wrapper #edit-actions--2 #edit-submit-product-catalog--2 {
  width: auto !important;
  min-width: 7.5rem !important;
  max-width: 10rem !important;
  flex: 0 0 auto !important;
  padding-left: 1.5rem !important;
  padding-right: 1.5rem !important;
  margin-left: auto !important;
  margin-right: auto !important;
  display: inline-block !important;
  box-sizing: border-box !important;
}

/* ---- 3) Stylish bottom border under Browse by Category + Browse by Brand ---- */


/* Title itself: compact, centered, forest; kill custom_css 3rem bottom on brand */


/* Content under titles sits close (matches top gap of header) */




/* Section blocks: balanced spacing between shop-icons / category / brand / search */






/* Mobile: keep label readable, button narrow, borders + title spacing */
@media (max-width: 991.98px) {
  

  html body.path-products #wrapper #edit-submit-product-catalog--2,
  html body.path-taxonomy #wrapper #edit-submit-product-catalog--2,
  html body.path-products #wrapper #edit-actions--2 #edit-submit-product-catalog--2,
  html body.path-taxonomy #wrapper #edit-actions--2 #edit-submit-product-catalog--2 {
    width: auto !important;
    min-width: 7rem !important;
    max-width: 9.5rem !important;
    padding-left: 1.25rem !important;
    padding-right: 1.25rem !important;
  }

  

  
}

/* END store-product-polish-v4 */

/* store-product-polish-v4.1 — reliable title underline (not border-image only) */




/* END store-product-polish-v4.1 */

/* store-product-polish-v4.2 — single underline only (kill dual border-image + ::after) */


/* Keep one stylish bar only via ::after (already defined in v4.1) */


/* Also neutralize mobile re-application of border-image from v4 */
@media (max-width: 991.98px) {
  
}

/* END store-product-polish-v4.2 */

/* ==========================================================================
   blog-listing-palette-v1 — 2026-08-01
   SCOPE: /blog listing ONLY (body.path-blog.page-blog)
   Do NOT restyle page-node-type-blog full articles or service blog blocks.
   - H1 chrome + single gold/green underline
   - Search block readable (kill white title/label)
   - Teasers: service-style green cards, engaging meta/tags/Read More
   - Grid rhythm + pager
   ========================================================================== */

/* ---- Page shell ---- */
html body.path-blog.page-blog #wrapper .region-content-wide-top,
html body.path-blog.page-blog #wrapper #page-wrapper .region-content {
  color: #1a0a24 !important;
}

html body.path-blog.page-blog #wrapper .breadcrumb a {
  color: #5b21b6 !important;
}

/* ---- H1 (blog listing title block) ---- */
html body.path-blog.page-blog #wrapper #block-martis-blogh1title,
html body.path-blog.page-blog #wrapper #block-martis-blogh1title .container-wrap,
html body.path-blog.page-blog #wrapper #block-martis-blogh1title .block-content {
  text-align: center !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

html body.path-blog.page-blog #wrapper #block-martis-blogh1title .field-item,
html body.path-blog.page-blog #wrapper #block-martis-blogh1title .field-body {
  display: flex !important;
  justify-content: center !important;
  position: relative !important;
  margin: 0.5rem auto 0.85rem !important;
  padding: 0.45rem 1rem 0.85rem !important;
  max-width: min(920px, 100%) !important;
}

html body.path-blog.page-blog #wrapper #block-martis-blogh1title h1 {
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  text-shadow: none !important;
  background: #f3e8ff !important;
  border: 1px solid #e9d5ff !important;
  border-radius: 20px !important;
  display: inline-block !important;
  margin: 0 auto !important;
  padding: 0.55rem 1.35rem !important;
  font-weight: 800 !important;
  font-size: clamp(1.15rem, 2.6vw, 1.55rem) !important;
  line-height: 1.3 !important;
  text-align: center !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

/* Single stylish underline under H1 (not dual border) */
html body.path-blog.page-blog #wrapper #block-martis-blogh1title .field-item::after,
html body.path-blog.page-blog #wrapper #block-martis-blogh1title .field-body::after {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  bottom: 0.1rem !important;
  width: min(16rem, 70%) !important;
  height: 3px !important;
  border-radius: 3px !important;
  border: 0 !important;
  background: linear-gradient(
    90deg,
    transparent 0%,
    #e9d5ff 8%,
    #6716aa 32%,
    #c9a227 50%,
    #6716aa 68%,
    #e9d5ff 92%,
    transparent 100%
  ) !important;
  pointer-events: none !important;
}

/* ---- Search Blog Posts (mirror product search polish) ---- */
html body.path-blog.page-blog #wrapper #block-martis-exposedformblog-searchblog-search {
  width: min(100%, 720px) !important;
  max-width: min(100%, 720px) !important;
  margin: 0.65rem auto 1.25rem !important;
  padding: 0.85rem 1rem 1rem !important;
  background: #f5f0fa !important;
  border: 1px solid #e9d5ff !important;
  border-radius: 14px !important;
  box-shadow: 0 2px 10px rgba(59, 10, 92, 0.07) !important;
  box-sizing: border-box !important;
}

html body.path-blog.page-blog #wrapper #block-martis-exposedformblog-searchblog-search .block-title,
html body.path-blog.page-blog #wrapper #block-martis-exposedformblog-searchblog-search h2.block-title,
html body.path-blog.page-blog #wrapper #block-martis-exposedformblog-searchblog-search .block-title.animate__animated,
html body.path-blog.page-blog #wrapper #block-martis-exposedformblog-searchblog-search h2.block-title.animate__animated.animate__pulse,
html body.path-blog.page-blog #wrapper #block-martis-exposedformblog-searchblog-search .block-title-wrap,
html body.path-blog.page-blog #wrapper #block-martis-exposedformblog-searchblog-search .block-title-content {
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  text-shadow: none !important;
  background: transparent !important;
  text-align: center !important;
  font-weight: 800 !important;
  margin: 0.15rem auto 0.55rem !important;
  padding: 0.2rem 0.5rem !important;
}

html body.path-blog.page-blog #wrapper #views-exposed-form-blog-search-blog-search .control-label,
html body.path-blog.page-blog #wrapper #block-martis-exposedformblog-searchblog-search .control-label,
html body.path-blog.page-blog #wrapper #block-martis-exposedformblog-searchblog-search label.control-label,
html body.path-blog.page-blog #wrapper #views-exposed-form-blog-search-blog-search label[for="edit-keys"] {
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  text-shadow: none !important;
  background: transparent !important;
  font-weight: 700 !important;
  opacity: 1 !important;
}

html body.path-blog.page-blog #wrapper #views-exposed-form-blog-search-blog-search input.form-text,
html body.path-blog.page-blog #wrapper #views-exposed-form-blog-search-blog-search #edit-keys {
  width: 100% !important;
  max-width: 100% !important;
  min-height: 2.75rem !important;
  border: 1px solid #e9d5ff !important;
  border-radius: 8px !important;
  box-sizing: border-box !important;
  background: #fff !important;
  color: #1a0a24 !important;
}

html body.path-blog.page-blog #wrapper #block-martis-exposedformblog-searchblog-search .form-actions,
html body.path-blog.page-blog #wrapper #views-exposed-form-blog-search-blog-search .form-actions {
  display: flex !important;
  justify-content: center !important;
  margin-top: 0.5rem !important;
  width: 100% !important;
}

html body.path-blog.page-blog #wrapper #edit-submit-blog-search,
html body.path-blog.page-blog #wrapper #views-exposed-form-blog-search-blog-search .form-submit,
html body.path-blog.page-blog #wrapper #block-martis-exposedformblog-searchblog-search .form-submit {
  width: auto !important;
  min-width: 7.5rem !important;
  max-width: 10rem !important;
  min-height: 2.75rem !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 1.5rem !important;
  padding-right: 1.5rem !important;
  background: linear-gradient(135deg, #3b0a5c 0%, #6716aa 55%, #7b2cbf 100%) !important;
  background-color: #6716aa !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border: 2px solid #000 !important;
  border-radius: 8px !important;
  font-weight: 800 !important;
  box-sizing: border-box !important;
}

/* ---- Teaser cards: match service blog block language (listing only) ---- */
html body.path-blog.page-blog #wrapper article.blog-post-teaser.post-row,
html body.path-blog.page-blog #wrapper .blog-post-teaser {
  translate: 0 0;
  transition: translate 0.18s ease, box-shadow 0.18s ease !important;
  border-radius: 14px !important;
}

html body.path-blog.page-blog #wrapper article.blog-post-teaser.post-row:hover,
html body.path-blog.page-blog #wrapper .blog-post-teaser:hover {
  translate: 0 -3px !important;
}

/* Image frame: forest edge + soft lift (service polish) */
html body.path-blog.page-blog #wrapper .blog-post-teaser .post-image {
  border: 2px solid #3b0a5c !important;
  border-radius: 1.15rem !important;
  overflow: hidden !important;
  background: #fff !important;
}

html body.path-blog.page-blog #wrapper .blog-post-teaser .post-image img {
  border-radius: 1rem !important;
  overflow: hidden !important;
}

/* Content: green gradient card like service teasers */
html body.path-blog.page-blog #wrapper .blog-post-teaser .post-content,
html body.path-blog.page-blog #wrapper article.blog-post-teaser .post-content {
  background: linear-gradient(160deg, #7b2cbf 0%, #6716aa 48%, #3b0a5c 100%) !important;
  background-color: #6716aa !important;
  color: #ffffff !important;
  border: 2px solid #000 !important;
  border-radius: 12px !important;
  box-shadow: 0 4px 14px rgba(59, 10, 92, 0.18) !important;
  padding: 1.15rem 1.1rem 1.25rem !important;
}

html body.path-blog.page-blog #wrapper .blog-post-teaser .post-title,
html body.path-blog.page-blog #wrapper .blog-post-teaser .post-title a,
html body.path-blog.page-blog #wrapper .blog-post-teaser .post-content .post-title,
html body.path-blog.page-blog #wrapper .blog-post-teaser .post-content .post-title a {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.18) !important;
  font-weight: 800 !important;
  font-size: clamp(1.02rem, 2vw, 1.2rem) !important;
  line-height: 1.3 !important;
  text-align: center !important;
}

html body.path-blog.page-blog #wrapper .blog-post-teaser .post-title a:hover {
  color: #f3e8ff !important;
  -webkit-text-fill-color: #f3e8ff !important;
}

html body.path-blog.page-blog #wrapper .blog-post-teaser .post-excerpt,
html body.path-blog.page-blog #wrapper .blog-post-teaser .post-excerpt *,
html body.path-blog.page-blog #wrapper .blog-post-teaser .post-content p {
  color: #f0fdf6 !important;
  -webkit-text-fill-color: #f0fdf6 !important;
  text-align: center !important;
  line-height: 1.55 !important;
}

/* Meta chips: white on green */
html body.path-blog.page-blog #wrapper .blog-post-teaser .post-meta {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  gap: 0.35rem !important;
  margin: 0.55rem 0 0.45rem !important;
}

html body.path-blog.page-blog #wrapper .blog-post-teaser .post-meta-item,
html body.path-blog.page-blog #wrapper .blog-post-teaser .post-meta-item * {
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  text-shadow: none !important;
}

html body.path-blog.page-blog #wrapper .blog-post-teaser .post-meta-item {
  background: #ffffff !important;
  border: 2px solid #3b0a5c !important;
  border-radius: 6px !important;
  padding: 0.2rem 0.45rem !important;
  font-size: 0.78rem !important;
  font-weight: 600 !important;
}

/* Tags */
html body.path-blog.page-blog #wrapper .blog-post-teaser .post-tags {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  gap: 0.3rem !important;
  margin: 0.4rem 0 !important;
}

html body.path-blog.page-blog #wrapper .blog-post-teaser .post-tags a,
html body.path-blog.page-blog #wrapper .blog-post-teaser .tags-list a {
  background: #ffffff !important;
  color: #6716aa !important;
  -webkit-text-fill-color: #6716aa !important;
  border: 1px solid #3b0a5c !important;
  border-radius: 999px !important;
  font-weight: 700 !important;
  font-size: 0.75rem !important;
  padding: 0.15rem 0.55rem !important;
  text-decoration: none !important;
}

/* Read More: service mint→forest pill, centered */
html body.path-blog.page-blog #wrapper .blog-post-teaser .post-link {
  display: flex !important;
  justify-content: center !important;
  width: 100% !important;
  margin-top: 0.35rem !important;
  margin-bottom: 0.15rem !important;
}

html body.path-blog.page-blog #wrapper .blog-post-teaser .post-link .read-more,
html body.path-blog.page-blog #wrapper .blog-post-teaser a.read-more {
  display: inline-block !important;
  background: linear-gradient(204deg, #c9a0e8 0%, #b781e3 45%, #6716aa 100%) !important;
  background-color: #6716aa !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border: 2px solid #000 !important;
  border-radius: 8px !important;
  font-weight: 800 !important;
  text-shadow: none !important;
  box-shadow: 0 2px 6px rgba(59, 10, 92, 0.2) !important;
  padding: 0.4rem 1.1rem !important;
  text-decoration: none !important;
  width: auto !important;
  max-width: 12rem !important;
}

html body.path-blog.page-blog #wrapper .blog-post-teaser .post-link .read-more:hover,
html body.path-blog.page-blog #wrapper .blog-post-teaser a.read-more:hover {
  background: linear-gradient(180deg, #9b4dd4 0%, #6716aa 55%, #3b0a5c 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

/* Grid: slightly roomier cards on listing */
@media (min-width: 992px) {
  html body.path-blog.page-blog #wrapper .views-view-responsive-grid {
    gap: 1.65rem !important;
    row-gap: 1.85rem !important;
  }
}

/* ---- Pager ---- */
html body.path-blog.page-blog #wrapper .pager,
html body.path-blog.page-blog #wrapper ul.pager,
html body.path-blog.page-blog #wrapper .pagination,
html body.path-blog.page-blog #wrapper nav.pager {
  text-align: center !important;
  margin: 1.5rem auto 1rem !important;
}

html body.path-blog.page-blog #wrapper .pager li a,
html body.path-blog.page-blog #wrapper .pager li > span,
html body.path-blog.page-blog #wrapper .pagination a,
html body.path-blog.page-blog #wrapper .pagination span,
html body.path-blog.page-blog #wrapper ul.pager a {
  background: #f5f0fa !important;
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  border: 1px solid #e9d5ff !important;
  border-radius: 8px !important;
  font-weight: 700 !important;
  padding: 0.35rem 0.7rem !important;
  margin: 0 0.15rem !important;
  text-decoration: none !important;
}

html body.path-blog.page-blog #wrapper .pager li.is-active a,
html body.path-blog.page-blog #wrapper .pager li.active a,
html body.path-blog.page-blog #wrapper .pager .is-active > a,
html body.path-blog.page-blog #wrapper .pagination .active a,
html body.path-blog.page-blog #wrapper .pagination li.active span {
  background: linear-gradient(135deg, #3b0a5c 0%, #6716aa 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border: 2px solid #000 !important;
}

/* Hide empty sidebar frame if present */
html body.path-blog.page-blog #wrapper .sidebar .region-sidebar-second:empty,
html body.path-blog.page-blog #wrapper .col-md-3.sidebar:has(.region-sidebar-second:empty) {
  border: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}

/* ---- Mobile ---- */
@media (max-width: 991.98px) {
  html body.path-blog.page-blog #wrapper #block-martis-blogh1title h1 {
    font-size: clamp(1.05rem, 4.2vw, 1.3rem) !important;
    padding: 0.5rem 1rem !important;
    border-radius: 14px !important;
  }

  html body.path-blog.page-blog #wrapper #block-martis-exposedformblog-searchblog-search {
    width: calc(100% - 2rem) !important;
    max-width: calc(100% - 1rem) !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding: 0.75rem 0.85rem !important;
  }

  html body.path-blog.page-blog #wrapper #edit-submit-blog-search {
    min-width: 7rem !important;
    max-width: 9.5rem !important;
  }

  html body.path-blog.page-blog #wrapper .blog-post-teaser .post-content {
    padding: 1rem 0.9rem 1.1rem !important;
  }

  html body.path-blog.page-blog #wrapper .blog-post-teaser .post-meta-item {
    font-size: 0.72rem !important;
  }
}

/* END blog-listing-palette-v1 */

/* ==========================================================================
   blog-listing-teaser-v2 — 2026-08-01
   /blog LISTING teasers only (path-blog.page-blog)
   - Wider 2–3 col grid (not cramped 4-col stubs)
   - 16:9 image hero, service-like panel + radial green
   - Declutter: hide comments, tags row, field labels
   - Meta: date + category chips horizontal
   - Read More: pill CTA pinned bottom, equal card heights
   - Desktop + mobile engagement polish
   ========================================================================== */

/* ---- Grid: prefer 2–3 readable columns ---- */
@media (min-width: 992px) {
  html body.path-blog.page-blog #wrapper .views-view-responsive-grid,
  html body.path-blog.page-blog #wrapper .view-blog .views-view-responsive-grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 310px), 1fr)) !important;
    gap: 1.65rem !important;
    row-gap: 1.85rem !important;
    column-gap: 1.65rem !important;
    column-count: auto !important;
    column-width: auto !important;
    align-items: stretch !important;
  }
}

@media (min-width: 768px) and (max-width: 991.98px) {
  html body.path-blog.page-blog #wrapper .views-view-responsive-grid,
  html body.path-blog.page-blog #wrapper .view-blog .views-view-responsive-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 1.25rem !important;
    row-gap: 1.4rem !important;
    column-count: auto !important;
  }
}

html body.path-blog.page-blog #wrapper .views-view-responsive-grid__item,
html body.path-blog.page-blog #wrapper .views-view-responsive-grid__item-inner {
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}

/* ---- Card shell ---- */
html body.path-blog.page-blog #wrapper article.blog-post-teaser.post-row,
html body.path-blog.page-blog #wrapper article.blog-post-teaser,
html body.path-blog.page-blog #wrapper .blog-post-teaser {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  width: 100% !important;
  max-width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 0 0.35rem !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 16px !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
  translate: 0 0;
  transition: translate 0.18s ease, filter 0.18s ease !important;
}

html body.path-blog.page-blog #wrapper article.blog-post-teaser:hover,
html body.path-blog.page-blog #wrapper .blog-post-teaser:hover {
  translate: 0 -4px !important;
  filter: drop-shadow(0 10px 18px rgba(59, 10, 92, 0.18)) !important;
}

html body.path-blog.page-blog #wrapper .blog-post-teaser .post-content-wrap {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  flex: 1 1 auto !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  gap: 0 !important;
  overflow: visible !important;
}

html body.path-blog.page-blog #wrapper .blog-post-teaser .content-wrap {
  display: flex !important;
  flex-direction: column !important;
  flex: 1 1 auto !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  min-height: 0 !important;
}

/* ---- Image hero 16:9 ---- */
html body.path-blog.page-blog #wrapper .blog-post-teaser .post-thumb,
html body.path-blog.page-blog #wrapper .blog-post-teaser .post-media {
  display: block !important;
  width: 100% !important;
  margin-bottom: 0 !important;
  padding: 0 0.35rem !important;
  position: relative !important;
  z-index: 3 !important;
  overflow: visible !important;
}

html body.path-blog.page-blog #wrapper .blog-post-teaser .post-image {
  width: 100% !important;
  max-width: 100% !important;
  height: auto;
  max-height: none !important;
  margin: 0.35rem 0 -1.15rem !important;
  padding: 0 !important;
  border: 3px solid #3b0a5c !important;
  border-radius: 14px !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
  background: #1a0a24 !important;
  position: relative !important;
  z-index: 3 !important;
  display: block !important;
  transform: none !important;
  scale: 1 !important;
}

html body.path-blog.page-blog #wrapper .blog-post-teaser .post-image img {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: 100% !important;
  min-height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
  border: 0 !important;
  border-radius: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  scale: 1 !important;
  transform: none !important;
}

/* ---- Content panel ---- */
html body.path-blog.page-blog #wrapper .blog-post-teaser .post-content,
html body.path-blog.page-blog #wrapper article.blog-post-teaser .post-content {
  display: flex !important;
  flex-direction: column !important;
  flex: 1 1 auto !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 1.65rem 1.1rem 1.15rem !important;
  box-sizing: border-box !important;
  background:
    radial-gradient(90% 70% at 15% 0%, rgba(201, 160, 232, 0.28) 0%, transparent 50%),
    linear-gradient(160deg, #7b2cbf 0%, #6716aa 48%, #3b0a5c 100%) !important;
  background-color: #6716aa !important;
  color: #ffffff !important;
  border: 2px solid #000 !important;
  border-radius: 14px !important;
  box-shadow: 0 4px 16px rgba(59, 10, 92, 0.16) !important;
  position: relative !important;
  z-index: 1 !important;
  min-height: 0 !important;
}

/* Hide Drupal field labels on listing cards */
html body.path-blog.page-blog #wrapper .blog-post-teaser .field-label,
html body.path-blog.page-blog #wrapper .blog-post-teaser .visually-hidden {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  position: absolute !important;
}

/* Title */
html body.path-blog.page-blog #wrapper .blog-post-teaser .post-title-wrap {
  margin: 1rem 0 0.45rem !important;
  padding: 0 !important;
  text-align: left !important;
}

html body.path-blog.page-blog #wrapper .blog-post-teaser .post-title,
html body.path-blog.page-blog #wrapper .blog-post-teaser .post-title a,
html body.path-blog.page-blog #wrapper .blog-post-teaser .post-content .post-title,
html body.path-blog.page-blog #wrapper .blog-post-teaser .post-content .post-title a {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.15) !important;
  font-weight: 800 !important;
  font-size: clamp(1.05rem, 1.8vw, 1.22rem) !important;
  line-height: 1.28 !important;
  text-align: left !important;
  margin: 0 !important;
  padding: 0 !important;
  text-decoration: none !important;
  display: -webkit-box !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 2 !important;
  overflow: hidden !important;
}

html body.path-blog.page-blog #wrapper .blog-post-teaser .post-title a:hover,
html body.path-blog.page-blog #wrapper .blog-post-teaser .post-title a:focus {
  color: #f3e8ff !important;
  -webkit-text-fill-color: #f3e8ff !important;
  text-decoration: underline !important;
  text-decoration-color: #c9a227 !important;
  text-underline-offset: 0.15em !important;
}

/* Excerpt: 3 lines */
html body.path-blog.page-blog #wrapper .blog-post-teaser .post-excerpt,
html body.path-blog.page-blog #wrapper .blog-post-teaser .post-excerpt .field-item,
html body.path-blog.page-blog #wrapper .blog-post-teaser .post-excerpt *,
html body.path-blog.page-blog #wrapper .blog-post-teaser .post-content > p {
  color: #f0fdf6 !important;
  -webkit-text-fill-color: #f0fdf6 !important;
  text-shadow: none !important;
  font-size: 0.92rem !important;
  line-height: 1.5 !important;
  text-align: left !important;
  margin: 0 0 0.65rem !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}

html body.path-blog.page-blog #wrapper .blog-post-teaser .post-excerpt .field-item,
html body.path-blog.page-blog #wrapper .blog-post-teaser .post-excerpt {
  display: -webkit-box !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 3 !important;
  overflow: hidden !important;
}

/* ---- Meta: only date + category, horizontal chips ---- */
html body.path-blog.page-blog #wrapper .blog-post-teaser .post-meta {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: flex-start !important;
  align-items: center !important;
  gap: 0.4rem !important;
  margin: 0.15rem 0 0.55rem !important;
  padding: 0 !important;
  width: 100% !important;
  height: auto !important;
  max-height: none !important;
}

/* Hide low-value meta on listing */
html body.path-blog.page-blog #wrapper .blog-post-teaser .post-meta-item.post-comment,
html body.path-blog.page-blog #wrapper .blog-post-teaser .post-meta-item.post-author {
  display: none !important;
}

html body.path-blog.page-blog #wrapper .blog-post-teaser .post-meta-item {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.25rem !important;
  background: #ffffff !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  border: 1.5px solid #3b0a5c !important;
  border-radius: 999px !important;
  padding: 0.22rem 0.55rem !important;
  font-size: 0.72rem !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  margin: 0 !important;
  white-space: nowrap !important;
  box-shadow: none !important;
}

html body.path-blog.page-blog #wrapper .blog-post-teaser .post-meta-item *,
html body.path-blog.page-blog #wrapper .blog-post-teaser .post-meta-item a,
html body.path-blog.page-blog #wrapper .blog-post-teaser .post-meta-item i {
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  text-shadow: none !important;
  background: transparent !important;
  border: 0 !important;
  font-size: inherit !important;
  padding: 0 !important;
  margin: 0 !important;
}

html body.path-blog.page-blog #wrapper .blog-post-teaser .post-meta-item a:hover {
  color: #6716aa !important;
  -webkit-text-fill-color: #6716aa !important;
}

/* Nested field chrome inside category chip */
html body.path-blog.page-blog #wrapper .blog-post-teaser .post-meta-item .field,
html body.path-blog.page-blog #wrapper .blog-post-teaser .post-meta-item .field-item {
  display: inline !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}

/* ---- Tags: hide on listing (reduce noise) ---- */
html body.path-blog.page-blog #wrapper .blog-post-teaser .post-tags {
  display: none !important;
}

/* ---- Read More: pill CTA pinned to bottom ---- */
html body.path-blog.page-blog #wrapper .blog-post-teaser .post-link {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  width: 100% !important;
  margin-top: auto !important;
  margin-bottom: 0 !important;
  padding-top: 0.65rem !important;
  position: relative !important;
  top: auto !important;
  bottom: auto !important;
}

html body.path-blog.page-blog #wrapper .blog-post-teaser .post-link .read-more,
html body.path-blog.page-blog #wrapper .blog-post-teaser a.read-more {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  min-width: 9.5rem !important;
  max-width: 14rem !important;
  min-height: 2.55rem !important;
  margin: 0 !important;
  padding: 0.45rem 1.35rem !important;
  background: linear-gradient(204deg, #e9d5ff 0%, #c9a0e8 22%, #b781e3 55%, #6716aa 100%) !important;
  background-color: #6716aa !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border: 2px solid #000 !important;
  border-radius: 999px !important;
  font-weight: 800 !important;
  font-size: 0.95rem !important;
  line-height: 1.2 !important;
  text-decoration: none !important;
  text-shadow: none !important;
  box-shadow: 0 3px 8px rgba(59, 10, 92, 0.22) !important;
  position: relative !important;
  top: auto !important;
  bottom: auto !important;
  transition: transform 0.15s ease, filter 0.15s ease !important;
}

html body.path-blog.page-blog #wrapper .blog-post-teaser .post-link .read-more:hover,
html body.path-blog.page-blog #wrapper .blog-post-teaser a.read-more:hover,
html body.path-blog.page-blog #wrapper .blog-post-teaser .post-link .read-more:focus {
  background: linear-gradient(180deg, #9b4dd4 0%, #6716aa 55%, #3b0a5c 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  transform: scale(1.03) !important;
  filter: none !important;
}

/* Focus rings */
html body.path-blog.page-blog #wrapper .blog-post-teaser .post-title a:focus-visible,
html body.path-blog.page-blog #wrapper .blog-post-teaser a.read-more:focus-visible {
  outline: 3px solid #c9a227 !important;
  outline-offset: 2px !important;
}

/* ---- Mobile ---- */
@media (max-width: 767.98px) {
  html body.path-blog.page-blog #wrapper .views-view-responsive-grid {
    display: flex !important;
    flex-direction: column !important;
    gap: 1.35rem !important;
    row-gap: 1.35rem !important;
  }

  html body.path-blog.page-blog #wrapper .blog-post-teaser .post-thumb {
    padding: 0 0.15rem !important;
  }

  html body.path-blog.page-blog #wrapper .blog-post-teaser .post-image {
    margin: 0.25rem 0 -1rem !important;
    border-radius: 12px !important;
  }

  html body.path-blog.page-blog #wrapper .blog-post-teaser .post-content {
    padding: 1.45rem 0.95rem 1.05rem !important;
    border-radius: 12px !important;
  }

  html body.path-blog.page-blog #wrapper .blog-post-teaser .post-title,
  html body.path-blog.page-blog #wrapper .blog-post-teaser .post-title a {
    font-size: 1.08rem !important;
  }

  html body.path-blog.page-blog #wrapper .blog-post-teaser .post-excerpt,
  html body.path-blog.page-blog #wrapper .blog-post-teaser .post-excerpt .field-item {
    font-size: 0.9rem !important;
  }

  html body.path-blog.page-blog #wrapper .blog-post-teaser .post-link .read-more {
    min-width: 10rem !important;
    max-width: 12rem !important;
    min-height: 2.65rem !important;
  }
}

/* END blog-listing-teaser-v2 */

/* ==========================================================================
   blog-listing-teaser-v2.1 — 2026-08-01
   Fixes from feedback:
   - Raise images; stop overlap into blog title (less negative margin)
   - Center date + category (+ author when shown)
   - Center Read More aesthetically (desktop + mobile)
   - Restore author + tags (were hidden in v2 declutter; now compact + centered)
   ========================================================================== */

/* Image higher, clear of title: positive gap under image, no deep overlap */
html body.path-blog.page-blog #wrapper .blog-post-teaser .post-thumb,
html body.path-blog.page-blog #wrapper .blog-post-teaser .post-media {
  padding: 0 0.4rem !important;
  margin-bottom: -1rem !important;
  order: 0 !important;
}

html body.path-blog.page-blog #wrapper .blog-post-teaser .post-image {
  margin-top: 0 !important;
  margin-bottom: 0.65rem !important; /* was ~-1.15rem — caused title under image */
  margin-left: 0 !important;
  margin-right: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  z-index: 2 !important;
}

/* Content panel sits fully below image (no title tucked under photo) */
html body.path-blog.page-blog #wrapper .blog-post-teaser .post-content,
html body.path-blog.page-blog #wrapper article.blog-post-teaser .post-content {
  margin-top: 0 !important;
  padding-top: 1rem !important;
  z-index: 1 !important;
}

/* Title safe from any residual overlap */
html body.path-blog.page-blog #wrapper .blog-post-teaser .post-title-wrap,
html body.path-blog.page-blog #wrapper .blog-post-teaser .post-title,
html body.path-blog.page-blog #wrapper .blog-post-teaser .post-title a {
  position: relative !important;
  z-index: 2 !important;
  text-align: center !important;
}

html body.path-blog.page-blog #wrapper .blog-post-teaser .post-excerpt,
html body.path-blog.page-blog #wrapper .blog-post-teaser .post-excerpt .field-item {
  text-align: center !important;
}

/* ---- Meta: restore author; center all chips ---- */
html body.path-blog.page-blog #wrapper .blog-post-teaser .post-meta {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 0.4rem !important;
  margin: 0.35rem auto 0.55rem !important;
  width: 100% !important;
  text-align: center !important;
}

/* Show author again; keep comments hidden (low value / "0 comments") */
html body.path-blog.page-blog #wrapper .blog-post-teaser .post-meta-item.post-author {
  display: inline-flex !important;
}

html body.path-blog.page-blog #wrapper .blog-post-teaser .post-meta-item.post-comment {
  display: none !important;
}

html body.path-blog.page-blog #wrapper .blog-post-teaser .post-meta-item {
  display: inline-flex !important;
  justify-content: center !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* ---- Tags: restore compact centered row ---- */
html body.path-blog.page-blog #wrapper .blog-post-teaser .post-tags {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 0.3rem !important;
  margin: 0.25rem auto 0.35rem !important;
  padding: 0.15rem 0 !important;
  width: 100% !important;
  text-align: center !important;
  border: 0 !important;
  border-top: 1px solid rgba(255, 255, 255, 0.18) !important;
  padding-top: 0.55rem !important;
  background: transparent !important;
  color: #eafff3 !important;
}

/* Hide "Tags:" label + tag icon noise; keep pill links */
html body.path-blog.page-blog #wrapper .blog-post-teaser .post-tags > i,
html body.path-blog.page-blog #wrapper .blog-post-teaser .post-tags .tags-label,
html body.path-blog.page-blog #wrapper .blog-post-teaser .post-tags .field-label {
  display: none !important;
}

html body.path-blog.page-blog #wrapper .blog-post-teaser .post-tags .tags-list,
html body.path-blog.page-blog #wrapper .blog-post-teaser .post-tags .field,
html body.path-blog.page-blog #wrapper .blog-post-teaser .post-tags .field-items {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 0.3rem !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}

html body.path-blog.page-blog #wrapper .blog-post-teaser .post-tags .field-item {
  display: inline-flex !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}

html body.path-blog.page-blog #wrapper .blog-post-teaser .post-tags a,
html body.path-blog.page-blog #wrapper .blog-post-teaser .tags-list a {
  display: inline-flex !important;
  background: #ffffff !important;
  color: #6716aa !important;
  -webkit-text-fill-color: #6716aa !important;
  border: 1px solid #3b0a5c !important;
  border-radius: 999px !important;
  font-weight: 700 !important;
  font-size: 0.7rem !important;
  line-height: 1.2 !important;
  padding: 0.18rem 0.5rem !important;
  margin: 0 !important;
  text-decoration: none !important;
}

html body.path-blog.page-blog #wrapper .blog-post-teaser .post-tags a:hover {
  background: #f3e8ff !important;
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
}

/* ---- Read More: centered, aesthetic ---- */
html body.path-blog.page-blog #wrapper .blog-post-teaser .post-link {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  width: 100% !important;
  margin-top: auto !important;
  margin-left: auto !important;
  margin-right: auto !important;
  margin-bottom: 0.15rem !important;
  padding: 0.75rem 0 0.25rem !important;
  text-align: center !important;
}

html body.path-blog.page-blog #wrapper .blog-post-teaser .post-link .read-more,
html body.path-blog.page-blog #wrapper .blog-post-teaser a.read-more {
  display: inline-flex !important;
  justify-content: center !important;
  align-items: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
  float: none !important;
  position: relative !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  bottom: auto !important;
  transform: none !important;
}

html body.path-blog.page-blog #wrapper .blog-post-teaser .post-link .read-more:hover,
html body.path-blog.page-blog #wrapper .blog-post-teaser a.read-more:hover {
  transform: scale(1.03) !important;
}

/* Mobile refinements */
@media (max-width: 767.98px) {
  html body.path-blog.page-blog #wrapper .blog-post-teaser .post-image {
    margin-bottom: 0.55rem !important;
  }

  html body.path-blog.page-blog #wrapper .blog-post-teaser .post-content {
    padding-top: 0.95rem !important;
  }

  html body.path-blog.page-blog #wrapper .blog-post-teaser .post-meta,
  html body.path-blog.page-blog #wrapper .blog-post-teaser .post-tags,
  html body.path-blog.page-blog #wrapper .blog-post-teaser .post-link {
    justify-content: center !important;
  }

  html body.path-blog.page-blog #wrapper .blog-post-teaser .post-link {
    padding-top: 0.85rem !important;
  }

  html body.path-blog.page-blog #wrapper .blog-post-teaser .post-link .read-more {
    margin-left: auto !important;
    margin-right: auto !important;
  }
}

/* END blog-listing-teaser-v2.1 */

/* blog-listing: center teaser titles on /blog */
html body.path-blog.page-blog #wrapper article.blog-post-teaser .post-title-wrap,
html body.path-blog.page-blog #wrapper .blog-post-teaser .post-title-wrap {
  text-align: center !important;
  width: 100% !important;
  display: block !important;
}

html body.path-blog.page-blog #wrapper article.blog-post-teaser .post-title,
html body.path-blog.page-blog #wrapper article.blog-post-teaser .post-title a,
html body.path-blog.page-blog #wrapper article.blog-post-teaser .post-content .post-title,
html body.path-blog.page-blog #wrapper article.blog-post-teaser .post-content .post-title a,
html body.path-blog.page-blog #wrapper .blog-post-teaser .post-title,
html body.path-blog.page-blog #wrapper .blog-post-teaser .post-title a,
html body.path-blog.page-blog #wrapper .blog-post-teaser .post-content .post-title,
html body.path-blog.page-blog #wrapper .blog-post-teaser .post-content .post-title a {
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
  width: 100% !important;
  max-width: 100% !important;
  display: -webkit-box !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 2 !important;
  overflow: hidden !important;
  /* webkit-box centering */
  -webkit-box-pack: center !important;
}

html body.path-blog.page-blog #wrapper article.blog-post-teaser .post-title a span,
html body.path-blog.page-blog #wrapper .blog-post-teaser .post-title a span {
  text-align: center !important;
}

/* END blog title center */

/* ==========================================================================
   blog-listing-pager-v1 — 2026-08-01
   Fix pagerer on /blog: no overlap, centered stack, green pill buttons
   Desktop + mobile
   ========================================================================== */

/* Container: block, full width, centered content, no weird table/neg margins */
html body.path-blog.page-blog #wrapper .pagerer-container,
html body.path-blog.page-blog #wrapper .view-blog .pagerer-container,
html body.path-blog.page-blog #wrapper .region-content .pagerer-container {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 1.75rem auto -3rem !important;
  padding: 0.75rem 0.5rem 1rem !important;
  float: none !important;
  clear: both !important;
  box-sizing: border-box !important;
  background: transparent !important;
  border: 0 !important;
  text-align: center !important;
}

/* Panes: stack vertically (label above numbers), not table-row overlap */
html body.path-blog.page-blog #wrapper .pagerer-container .pagerer-panes {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  padding: 0 !important;
  gap: 0.65rem !important;
  float: none !important;
}

html body.path-blog.page-blog #wrapper .pagerer-container .pagerer-left-pane,
html body.path-blog.page-blog #wrapper .pagerer-container .pagerer-center-pane,
html body.path-blog.page-blog #wrapper .pagerer-container .pagerer-right-pane {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
  text-align: center !important;
}

/* Hide empty center pane if any */
html body.path-blog.page-blog #wrapper .pagerer-container .pagerer-center-pane:empty {
  display: none !important;
}

/* Nav + list: horizontal centered flex */
html body.path-blog.page-blog #wrapper .pagerer-container nav.pager,
html body.path-blog.page-blog #wrapper .pagerer-container .pager {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  text-align: center !important;
  float: none !important;
}

html body.path-blog.page-blog #wrapper .pagerer-container ul.pager__items,
html body.path-blog.page-blog #wrapper .pagerer-container .js-pager__items {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 0.4rem !important;
  list-style: none !important;
  margin: 0 auto !important;
  padding: 0 !important;
  width: auto !important;
  max-width: 100% !important;
  float: none !important;
  text-align: center !important;
}

html body.path-blog.page-blog #wrapper .pagerer-container .pager__item {
  display: inline-flex !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
  background: transparent !important;
  border: 0 !important;
}

/* "Page X of Y" chip */
html body.path-blog.page-blog #wrapper .pagerer-container .pager__item.pagerer-prefix,
html body.path-blog.page-blog #wrapper .pagerer-container .pagerer-prefix {
  display: inline-flex !important;
  justify-content: center !important;
  align-items: center !important;
}

html body.path-blog.page-blog #wrapper .pagerer-container .pagerer-prefix span,
html body.path-blog.page-blog #wrapper .pagerer-container .pager__item.pagerer-prefix span {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: #f3e8ff !important;
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  border: 1px solid #e9d5ff !important;
  border-radius: 999px !important;
  padding: 0.4rem 0.95rem !important;
  font-weight: 700 !important;
  font-size: 0.9rem !important;
  line-height: 1.2 !important;
  box-shadow: 0 1px 4px rgba(59, 10, 92, 0.08) !important;
}

html body.path-blog.page-blog #wrapper .pagerer-container .pagerer-prefix b,
html body.path-blog.page-blog #wrapper .pagerer-container .pagerer-prefix strong {
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  font-weight: 800 !important;
}

/* Page number / next / last links */
html body.path-blog.page-blog #wrapper .pagerer-container .pager__item a,
html body.path-blog.page-blog #wrapper .pagerer-container .pager__item > span {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 2.65rem !important;
  min-height: 2.65rem !important;
  padding: 0.4rem 0.75rem !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  background: #f5f0fa !important;
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  border: 1.5px solid #e9d5ff !important;
  border-radius: 10px !important;
  font-weight: 800 !important;
  font-size: 0.95rem !important;
  line-height: 1 !important;
  text-decoration: none !important;
  text-align: center !important;
  box-shadow: 0 1px 3px rgba(59, 10, 92, 0.08) !important;
  transition: transform 0.15s ease, background 0.15s ease, border-color 0.15s ease !important;
}

html body.path-blog.page-blog #wrapper .pagerer-container .pager__item a:hover,
html body.path-blog.page-blog #wrapper .pagerer-container .pager__item a:focus {
  background: #f3e8ff !important;
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  border-color: #6716aa !important;
  transform: translateY(-1px) !important;
  text-decoration: none !important;
}

/* Active page */
html body.path-blog.page-blog #wrapper .pagerer-container .pager__item.is-active a,
html body.path-blog.page-blog #wrapper .pagerer-container .pager__item.is-active > span,
html body.path-blog.page-blog #wrapper .pagerer-container .pager__item.active a {
  background: linear-gradient(135deg, #3b0a5c 0%, #6716aa 55%, #7b2cbf 100%) !important;
  background-color: #6716aa !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border: 2px solid #000 !important;
  box-shadow: 0 2px 8px rgba(59, 10, 92, 0.22) !important;
  pointer-events: none !important;
}

/* Hide "Current page" / "Page" visually-hidden span glitches if not hidden */
html body.path-blog.page-blog #wrapper .pagerer-container .pager__item .visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* Next / last slightly wider for chevrons */
html body.path-blog.page-blog #wrapper .pagerer-container .pager__item--next a,
html body.path-blog.page-blog #wrapper .pagerer-container .pager__item--last a,
html body.path-blog.page-blog #wrapper .pagerer-container .pager__item--previous a,
html body.path-blog.page-blog #wrapper .pagerer-container .pager__item--first a {
  min-width: 2.75rem !important;
  font-size: 1.05rem !important;
}

/* Generic pager fallback (if pagerer absent) */
html body.path-blog.page-blog #wrapper nav.pager:not(.pagerer-pager-basic):not(.pagerer-pager-standard),
html body.path-blog.page-blog #wrapper ul.pager {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  gap: 0.4rem !important;
  margin: 1.5rem auto !important;
  padding: 0 !important;
  list-style: none !important;
}

/* Mobile */
@media (max-width: 767.98px) {
  html body.path-blog.page-blog #wrapper .pagerer-container {
    margin: 1.35rem auto 1.75rem !important;
    padding: 0.5rem 0.35rem 0.85rem !important;
  }

  html body.path-blog.page-blog #wrapper .pagerer-container .pagerer-panes {
    gap: 0.55rem !important;
  }

  html body.path-blog.page-blog #wrapper .pagerer-container ul.pager__items {
    gap: 0.3rem !important;
    max-width: 100% !important;
    padding: 0 0.25rem !important;
  }

  html body.path-blog.page-blog #wrapper .pagerer-container .pager__item a,
  html body.path-blog.page-blog #wrapper .pagerer-container .pager__item > span {
    min-width: 2.45rem !important;
    min-height: 2.45rem !important;
    padding: 0.35rem 0.55rem !important;
    font-size: 0.9rem !important;
    border-radius: 9px !important;
  }

  html body.path-blog.page-blog #wrapper .pagerer-container .pagerer-prefix span {
    font-size: 0.85rem !important;
    padding: 0.35rem 0.8rem !important;
  }
}

/* END blog-listing-pager-v1 */

/* ==========================================================================
   STOREFRONT CONTENT RAIL + CATALOG CHROME (2026-08-01)
   Unify left/right edges for: search, H1, categories, brands, catalog grid.
   Desktop: full ~1220px rail (kill 92% search width / H1 side margins).
   Mobile: shared inset matching container padding.
   ========================================================================== */

/* --- Desktop/shared: one content rail max-width --- */


html body.path-products #wrapper .commerce-content-header,
html body.path-taxonomy #wrapper .commerce-content-header,
html body.path-products #wrapper .commerce-content-header.brand-listing-h1,
html body.path-taxonomy #wrapper .commerce-content-header.brand-listing-h1,
html body.path-products #wrapper .commerce-content-header.category-listing-h1,
html body.path-taxonomy #wrapper .commerce-content-header.category-listing-h1,
html body.path-products .commerce-content-header,
html body.path-taxonomy .commerce-content-header {
  width: 100% !important;
  max-width: 1220px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  margin-top: 0.75rem !important;
  margin-bottom: 0.75rem !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  box-sizing: border-box !important;
  float: none !important;
}

html body.path-products #wrapper .commerce-content-header .commerce-content-h1,
html body.path-taxonomy #wrapper .commerce-content-header .commerce-content-h1,
html body.path-products #wrapper h1.commerce-content-h1,
html body.path-taxonomy #wrapper h1.commerce-content-h1,
html body.path-products h1.commerce-content-h1,
html body.path-taxonomy h1.commerce-content-h1 {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  box-sizing: border-box !important;
}

/* Catalog shell on same rail as search/H1 (fill parent content column) */
html body.path-products #wrapper .product-catalog,
html body.path-taxonomy #wrapper .product-catalog,
html body.path-products #wrapper .view-product-catalog,
html body.path-taxonomy #wrapper .view-product-catalog,
html body.path-products #wrapper .view-brand-product-listings,
html body.path-taxonomy #wrapper .view-brand-product-listings,
html body.path-products #wrapper .view-product-category-listings,
html body.path-taxonomy #wrapper .view-product-category-listings {
  width: 100% !important;
  max-width: 1220px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
}

/* Brand + category browse blocks: same horizontal rail as catalog */




/* Product detail: align shared search only (do not force product H1 full rail) */


/* --- Mobile rail: shared inset, full width of container --- */
@media (max-width: 991.98px) {
  

  /* If search was pulled outside region width, clamp to same as catalog */
  

  html body.path-products #wrapper .commerce-content-header,
  html body.path-taxonomy #wrapper .commerce-content-header,
  html body.path-products #wrapper .commerce-content-header.brand-listing-h1,
  html body.path-taxonomy #wrapper .commerce-content-header.brand-listing-h1,
  html body.path-products #wrapper .commerce-content-header.category-listing-h1,
  html body.path-taxonomy #wrapper .commerce-content-header.category-listing-h1,
  html body.path-products .commerce-content-header,
  html body.path-taxonomy .commerce-content-header {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  html body.path-products #wrapper .product-catalog,
  html body.path-taxonomy #wrapper .product-catalog,
  html body.path-products #wrapper .view-product-catalog,
  html body.path-taxonomy #wrapper .view-product-catalog {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  

  /* Keep region-content padding as the single inset source */
  html body.path-products #wrapper .region-content,
  html body.path-taxonomy #wrapper .region-content,
  html body.path-product #wrapper .region-content,
  html body.path-products #wrapper .col-md-9.left-content.main-content,
  html body.path-taxonomy #wrapper .col-md-9.left-content.main-content {
    padding-left: 0.75rem !important;
    padding-right: 0.75rem !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
  }

  html body.path-products #wrapper .page-wrapper > .container,
  html body.path-taxonomy #wrapper .page-wrapper > .container,
  html body.path-product #wrapper .page-wrapper > .container {
    padding-left: 0.75rem !important;
    padding-right: 0.75rem !important;
  }

  /* Switch + sort form stack: extra clear space on small screens */
  html body.path-products #wrapper .product-catalog > .view-header,
  html body.path-taxonomy #wrapper .product-catalog > .view-header {
    margin-bottom: 0.65rem !important;
    min-height: 46px !important;
  }

  html body.path-products #wrapper .product-catalog > form.views-exposed-form,
  html body.path-taxonomy #wrapper .product-catalog > form.views-exposed-form {
    margin-top: 0.5rem !important;
    margin-bottom: 0.75rem !important;
    background: transparent !important;
  }
}

/* END storefront-content-rail-2026-08-01 */

/* List mode (switch-icon): full-width rows override 2-col */
@media (max-width: 991.98px) {
  html body.path-products #wrapper .product-catalog .grid-wrapper > .grid-item.list-grid,
  html body.path-taxonomy #wrapper .product-catalog .grid-wrapper > .grid-item.list-grid {
    flex: 0 0 100% !important;
    max-width: 100% !important;
    width: 100% !important;
  }
}

/* Search lives in region-content-wide-top (full-bleed). Constrain to content rail. */


@media (max-width: 991.98px) {
  

  html body.path-blog.page-blog #wrapper .pagerer-container, html body.path-blog.page-blog #wrapper .view-blog .pagerer-container, html body.path-blog.page-blog #wrapper .region-content .pagerer-container {
    margin: 0rem auto -2rem !important;
  }

  /* Inner form fill padded block */
  
}

/* ==========================================================================
   store-product-polish-v5 — 2026-08-01
   1) path-product: Browse by Category / Brand match /products styling
   2) path-product: product-post clear of search block (no overlap)
   3) /products (+ listings): wider content rail — kill 920px search shrink,
      reduce double padding so catalog matches brand/category width
   ========================================================================== */

/* ---- 1) Browse by Category / Brand titles + cards on product detail too ---- */












/* Brand cards on product pages — same green cards as /products */












/* ---- 2) product-post: clear search block — kill negative pull ---- */
html body.path-product #wrapper .product-post,
html body.path-product .product-post,
html body.path-product #wrapper .commerce-product .product-post,
html body.path-product #wrapper .block-content .product-post,
html body.path-product #wrapper .product-content-wrap {
  margin-top: 1.25rem !important;
  margin-bottom: 1rem !important;
  position: relative !important;
  z-index: 1 !important;
  clear: both !important;
}

/* Search on product pages: solid bottom margin so content can't ride under it */


/* Main/content after search on product detail */
html body.path-product #wrapper .page-wrapper,
html body.path-product #wrapper .page-wrapper > .container,
html body.path-product #wrapper .col-md-9.left-content.main-content,
html body.path-product #wrapper .region-content {
  margin-top: 0 !important;
  padding-top: 0.5rem !important;
  position: relative !important;
  z-index: 1 !important;
}

/* Commerce product shell spacing under search */
html body.path-product #wrapper .commerce-product,
html body.path-product #wrapper article.commerce-product,
html body.path-product #wrapper .product-variation-wrap {
  margin-top: 0.5rem !important;
}

/* ---- 3) Wider rail on storefront pages (undo 920px shrink + double pad) ---- */


/* Catalog fills main content width (desktop) */
html body.path-products #wrapper .product-catalog,
html body.path-taxonomy #wrapper .product-catalog,
html body.path-products #wrapper .view-product-catalog,
html body.path-taxonomy #wrapper .view-product-catalog,
html body.path-products #wrapper .view-brand-product-listings,
html body.path-taxonomy #wrapper .view-brand-product-listings,
html body.path-products #wrapper .view-product-category-listings,
html body.path-taxonomy #wrapper .view-product-category-listings {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* Page container: allow full 1220 content */
html body.path-products #wrapper .page-wrapper > .container,
html body.path-taxonomy #wrapper .page-wrapper > .container,
html body.path-product #wrapper .page-wrapper > .container,
html body.path-store #wrapper .page-wrapper > .container {
  max-width: 1280px !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

html body.path-products #wrapper .col-md-9.left-content.main-content,
html body.path-taxonomy #wrapper .col-md-9.left-content.main-content,
html body.path-product #wrapper .col-md-9.left-content.main-content,
html body.path-products #wrapper .region-content,
html body.path-taxonomy #wrapper .region-content {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0.5rem !important;
  padding-right: 0.5rem !important;
  box-sizing: border-box !important;
}

@media (max-width: 991.98px) {
  /* Single inset source — wider usable catalog */
  html body.path-products #wrapper .page-wrapper > .container,
  html body.path-taxonomy #wrapper .page-wrapper > .container,
  html body.path-product #wrapper .page-wrapper > .container {
    padding-left: 0.5rem !important;
    padding-right: 0.5rem !important;
    max-width: 100% !important;
  }

  html body.path-products #wrapper .col-md-9.left-content.main-content,
  html body.path-taxonomy #wrapper .col-md-9.left-content.main-content,
  html body.path-product #wrapper .col-md-9.left-content.main-content,
  html body.path-products #wrapper .region-content,
  html body.path-taxonomy #wrapper .region-content,
  html body.path-product #wrapper .region-content {
    padding-left: 0.35rem !important;
    padding-right: 0.35rem !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  html body.path-products #wrapper .product-catalog,
  html body.path-taxonomy #wrapper .product-catalog {
    width: 100% !important;
    max-width: 100% !important;
  }

  

  /* product-post mobile clearance */
  html body.path-product #wrapper .product-post,
  html body.path-product .product-post {
    margin-top: 1rem !important;
    margin-bottom: 1rem !important;
  }

  
}

/* END store-product-polish-v5 */

/* Clamp mobile storefront columns — prevent l < 0 bleed after pad tighten */
@media (max-width: 991.98px) {
  html body.path-products #wrapper .col-md-9.left-content.main-content,
  html body.path-taxonomy #wrapper .col-md-9.left-content.main-content,
  html body.path-product #wrapper .col-md-9.left-content.main-content,
  html body.path-products #wrapper .region-content,
  html body.path-taxonomy #wrapper .region-content,
  html body.path-product #wrapper .region-content {
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0.5rem !important;
    padding-right: 0.5rem !important;
    overflow-x: hidden !important;
    box-sizing: border-box !important;
  }

  html body.path-products #wrapper .product-catalog,
  html body.path-taxonomy #wrapper .product-catalog {
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }
}

/* ==========================================================================
   store-product-grid-fullwidth-v1 — 2026-08-01
   Product teaser .row.grid-noppading.justify-content-center.grid-wrapper
   must span full content width edge-to-edge matching H1 (not a narrow
   centered 3-col cluster from flex 25% + gap).
   ========================================================================== */

/* Align catalog + H1 on same rail */
html body.path-products #wrapper .commerce-content-header,
html body.path-taxonomy #wrapper .commerce-content-header,
html body.path-products #wrapper .product-catalog,
html body.path-taxonomy #wrapper .product-catalog {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  box-sizing: border-box !important;
}

html body.path-products #wrapper h1.commerce-content-h1,
html body.path-taxonomy #wrapper h1.commerce-content-h1,
html body.path-products #wrapper .commerce-content-header .commerce-content-h1,
html body.path-taxonomy #wrapper .commerce-content-header .commerce-content-h1 {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  box-sizing: border-box !important;
}

/* Full-width product teaser grid — CSS grid so 4 equal cols fill edge-to-edge */
html body.path-products #wrapper .product-catalog .row.grid-noppading.justify-content-center.grid-wrapper,
html body.path-taxonomy #wrapper .product-catalog .row.grid-noppading.justify-content-center.grid-wrapper,
html body.path-products #wrapper .product-catalog .row.grid-wrapper,
html body.path-taxonomy #wrapper .product-catalog .row.grid-wrapper,
html body.path-products #wrapper .product-catalog .view-content.grid-wrapper,
html body.path-taxonomy #wrapper .product-catalog .view-content.grid-wrapper,
html body.path-products #wrapper .view-product-catalog .grid-wrapper,
html body.path-taxonomy #wrapper .view-product-catalog .grid-wrapper,
html body.path-products #wrapper .view-brand-product-listings .grid-wrapper,
html body.path-taxonomy #wrapper .view-brand-product-listings .grid-wrapper,
html body.path-products #wrapper .view-product-category-listings .grid-wrapper,
html body.path-taxonomy #wrapper .view-product-category-listings .grid-wrapper {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 0.85rem !important;
  row-gap: 1rem !important;
  column-gap: 0.85rem !important;
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  justify-content: stretch !important;
  justify-items: stretch !important;
  align-items: stretch !important;
  box-sizing: border-box !important;
  /* kill Bootstrap row negative margins */
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* Grid items fill their tracks — ignore Bootstrap col-6/col-lg-3 flex */
html body.path-products #wrapper .product-catalog .grid-wrapper > .grid-item,
html body.path-taxonomy #wrapper .product-catalog .grid-wrapper > .grid-item,
html body.path-products #wrapper .product-catalog .row.grid-wrapper > .grid-item,
html body.path-taxonomy #wrapper .product-catalog .row.grid-wrapper > .grid-item,
html body.path-products #wrapper .product-catalog .row.grid-noppading.justify-content-center.grid-wrapper > .col-6,
html body.path-taxonomy #wrapper .product-catalog .row.grid-noppading.justify-content-center.grid-wrapper > .col-6,
html body.path-products #wrapper .product-catalog .grid-wrapper > .col-6.col-sm-6.col-md-4.col-lg-3.grid-item,
html body.path-taxonomy #wrapper .product-catalog .grid-wrapper > .col-6.col-sm-6.col-md-4.col-lg-3.grid-item,
html body.path-products #wrapper .view-product-catalog .grid-wrapper > .grid-item,
html body.path-taxonomy #wrapper .view-product-catalog .grid-wrapper > .grid-item,
html body.path-products #wrapper .view-brand-product-listings .grid-wrapper > .grid-item,
html body.path-taxonomy #wrapper .view-brand-product-listings .grid-wrapper > .grid-item,
html body.path-products #wrapper .view-product-category-listings .grid-wrapper > .grid-item,
html body.path-taxonomy #wrapper .view-product-category-listings .grid-wrapper > .grid-item {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  flex: none !important;
  flex-basis: auto !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  box-sizing: border-box !important;
  float: none !important;
}

/* Teaser card fills cell */
html body.path-products #wrapper .product-catalog .grid-wrapper .grid-item > .product-teaser-wrap,
html body.path-taxonomy #wrapper .product-catalog .grid-wrapper .grid-item > .product-teaser-wrap {
  width: 100% !important;
  max-width: 100% !important;
  height: 100% !important;
}

/* List mode: single column full width */
html body.path-products #wrapper .product-catalog .grid-wrapper > .grid-item.list-grid,
html body.path-taxonomy #wrapper .product-catalog .grid-wrapper > .grid-item.list-grid {
  grid-column: 1 / -1 !important;
  width: 100% !important;
  max-width: 100% !important;
}

/* Tablet: 3 columns */
@media (max-width: 991.98px) {
  html body.path-products #wrapper .product-catalog .row.grid-noppading.justify-content-center.grid-wrapper,
  html body.path-taxonomy #wrapper .product-catalog .row.grid-noppading.justify-content-center.grid-wrapper,
  html body.path-products #wrapper .product-catalog .row.grid-wrapper,
  html body.path-taxonomy #wrapper .product-catalog .row.grid-wrapper,
  html body.path-products #wrapper .product-catalog .grid-wrapper,
  html body.path-taxonomy #wrapper .product-catalog .grid-wrapper,
  html body.path-products #wrapper .view-product-catalog .grid-wrapper,
  html body.path-taxonomy #wrapper .view-product-catalog .grid-wrapper,
  html body.path-products #wrapper .view-brand-product-listings .grid-wrapper,
  html body.path-taxonomy #wrapper .view-brand-product-listings .grid-wrapper,
  html body.path-products #wrapper .view-product-category-listings .grid-wrapper,
  html body.path-taxonomy #wrapper .view-product-category-listings .grid-wrapper {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0.65rem !important;
    column-gap: 0.65rem !important;
    row-gap: 0.75rem !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  html body.path-products #wrapper .product-catalog .grid-wrapper > .grid-item,
  html body.path-taxonomy #wrapper .product-catalog .grid-wrapper > .grid-item {
    width: 100% !important;
    max-width: none !important;
    flex: none !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  /* Keep H1 + catalog + grid aligned to same edges */
  html body.path-products #wrapper .commerce-content-header,
  html body.path-taxonomy #wrapper .commerce-content-header,
  html body.path-products #wrapper .product-catalog,
  html body.path-taxonomy #wrapper .product-catalog,
  html body.path-products #wrapper h1.commerce-content-h1,
  html body.path-taxonomy #wrapper h1.commerce-content-h1 {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}

/* Very small phones: still 2-col full width */
@media (max-width: 575.98px) {
  html body.path-products #wrapper .product-catalog .grid-wrapper,
  html body.path-taxonomy #wrapper .product-catalog .grid-wrapper {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0.5rem !important;
  }
}

/* END store-product-grid-fullwidth-v1 */

/* Align product catalog + H1 to identical region edges (kill 1220 cap mismatch) */
html body.path-products #wrapper .region-content > .commerce-content-header,
html body.path-taxonomy #wrapper .region-content > .commerce-content-header,
html body.path-products #wrapper .region-content .commerce-content-header,
html body.path-taxonomy #wrapper .region-content .commerce-content-header,
html body.path-products #wrapper .region-content .product-catalog,
html body.path-taxonomy #wrapper .region-content .product-catalog,
html body.path-products #wrapper .region-content .views-element-container .product-catalog,
html body.path-taxonomy #wrapper .region-content .views-element-container .product-catalog {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  box-sizing: border-box !important;
}

html body.path-products #wrapper .region-content h1.commerce-content-h1,
html body.path-taxonomy #wrapper .region-content h1.commerce-content-h1,
html body.path-products #wrapper .region-content .commerce-content-header .commerce-content-h1,
html body.path-taxonomy #wrapper .region-content .commerce-content-header .commerce-content-h1 {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  box-sizing: border-box !important;
}

html body.path-products #wrapper .region-content .product-catalog .row.grid-wrapper,
html body.path-taxonomy #wrapper .region-content .product-catalog .row.grid-wrapper,
html body.path-products #wrapper .region-content .product-catalog .grid-wrapper,
html body.path-taxonomy #wrapper .region-content .product-catalog .grid-wrapper {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* Main content column: no extra side margin that offsets catalog vs H1 */
html body.path-products #wrapper .col-md-9.left-content.main-content,
html body.path-taxonomy #wrapper .col-md-9.left-content.main-content {
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0.75rem !important;
  padding-right: 0.75rem !important;
  box-sizing: border-box !important;
}

html body.path-products #wrapper .region-content,
html body.path-taxonomy #wrapper .region-content {
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

@media (max-width: 991.98px) {
  html body.path-products #wrapper .col-md-9.left-content.main-content,
  html body.path-taxonomy #wrapper .col-md-9.left-content.main-content,
  html body.path-products #wrapper .page-wrapper > .container,
  html body.path-taxonomy #wrapper .page-wrapper > .container {
    padding-left: 0.65rem !important;
    padding-right: 0.65rem !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
  }

  html body.path-products #wrapper .region-content,
  html body.path-taxonomy #wrapper .region-content,
  html body.path-products #wrapper .product-catalog,
  html body.path-taxonomy #wrapper .product-catalog,
  html body.path-products #wrapper .commerce-content-header,
  html body.path-taxonomy #wrapper .commerce-content-header,
  html body.path-products #wrapper .product-catalog .grid-wrapper,
  html body.path-taxonomy #wrapper .product-catalog .grid-wrapper {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}

/* Kill .container-wrap 1220px cap that shrinks product-catalog vs H1 */
html body.path-products #wrapper .region-content .container-wrap,
html body.path-taxonomy #wrapper .region-content .container-wrap,
html body.path-products #wrapper .lc-main-content .container-wrap,
html body.path-taxonomy #wrapper .lc-main-content .container-wrap,
html body.path-products #wrapper .block-system-main-block .container-wrap,
html body.path-taxonomy #wrapper .block-system-main-block .container-wrap,
html body.path-products #wrapper .region-content .block-content,
html body.path-taxonomy #wrapper .region-content .block-content,
html body.path-products #wrapper .region-content .views-element-container,
html body.path-taxonomy #wrapper .region-content .views-element-container {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  box-sizing: border-box !important;
}

html body.path-products #wrapper .region-content .product-catalog,
html body.path-taxonomy #wrapper .region-content .product-catalog,
html body.path-products #wrapper .region-content .product-catalog .grid-wrapper,
html body.path-taxonomy #wrapper .region-content .product-catalog .grid-wrapper {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* H1 header same full region width */
html body.path-products #wrapper .region-content .commerce-content-header,
html body.path-taxonomy #wrapper .region-content .commerce-content-header {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* Final alignment: kill Bootstrap negative row margins so grid L/R = H1 L/R */
html body.path-products #wrapper .region-content .row,
html body.path-taxonomy #wrapper .region-content .row,
html body.path-products #wrapper .product-catalog.row,
html body.path-products #wrapper .product-catalog .row,
html body.path-taxonomy #wrapper .product-catalog .row,
html body.path-products #wrapper .content-layout.row,
html body.path-taxonomy #wrapper .content-layout.row {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

html body.path-products #wrapper .col-md-9.left-content.main-content,
html body.path-taxonomy #wrapper .col-md-9.left-content.main-content {
  padding-left: 0.85rem !important;
  padding-right: 0.85rem !important;
  overflow-x: hidden !important;
  box-sizing: border-box !important;
}

html body.path-products #wrapper .region-content .product-catalog,
html body.path-taxonomy #wrapper .region-content .product-catalog,
html body.path-products #wrapper .region-content .commerce-content-header,
html body.path-taxonomy #wrapper .region-content .commerce-content-header,
html body.path-products #wrapper .region-content .container-wrap,
html body.path-taxonomy #wrapper .region-content .container-wrap,
html body.path-products #wrapper .region-content .views-element-container,
html body.path-taxonomy #wrapper .region-content .views-element-container {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  left: auto !important;
  position: relative !important;
  box-sizing: border-box !important;
}

html body.path-products #wrapper .region-content .product-catalog .grid-wrapper,
html body.path-taxonomy #wrapper .region-content .product-catalog .grid-wrapper {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* ==========================================================================
   storefront-mobile-rail-v1 + title-chrome-v1 — 2026-08-01
   1) Mobile: brand grid / search / product teaser share one edge-to-edge rail
   2) Browse by Category + Brand: reliable underline + even gaps (all paths)
   ========================================================================== */

/* ---- Canonical title chrome (wins over earlier v3/v4 conflicts) ---- */






/* Kill title ::before icons */


/* Even gap: title → cards */




/* Section block spacing (no huge negative pull) */


/* ---- Mobile shared rail: brand grid ≈ search ≈ teaser (L~14, W~full-inset) ---- */
@media (max-width: 991.98px) {
  /* Content-wide host for brand block + search */
  html body.path-products #wrapper .region-content-wide-top,
  html body.path-taxonomy #wrapper .region-content-wide-top,
  html body.path-product #wrapper .region-content-wide-top,
  html body.path-products #wrapper .content-wide,
  html body.path-taxonomy #wrapper .content-wide {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  html body.path-products #wrapper #content-wide-bottom, html body.path-taxonomy #wrapper #content-wide-bottom {
    margin-top: -0.5rem !important;
  }

  /* Shared horizontal inset token ≈ brand grid (14px on 390) */
  html body.path-products #wrapper .page-wrapper > .container,
  html body.path-taxonomy #wrapper .page-wrapper > .container,
  html body.path-product #wrapper .page-wrapper > .container {
    padding-left: 0.875rem !important;
    padding-right: 0.875rem !important;
    max-width: 100% !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  html body.path-products #wrapper .col-md-9.left-content.main-content,
  html body.path-taxonomy #wrapper .col-md-9.left-content.main-content,
  html body.path-product #wrapper .col-md-9.left-content.main-content,
  html body.path-products #wrapper .region-content,
  html body.path-taxonomy #wrapper .region-content,
  html body.path-product #wrapper .region-content {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    box-sizing: border-box !important;
    overflow-x: hidden !important;
  }

  /* Brand + category blocks: same inset as main content */
  

  

  /* Search: same rail (content-wide-top full bleed → pad to match brand) */
  

  

  /* Catalog + teaser grid: match brand/search rail (no extra nested pad) */
  html body.path-products #wrapper .region-content .container-wrap,
  html body.path-taxonomy #wrapper .region-content .container-wrap,
  html body.path-products #wrapper .region-content .views-element-container,
  html body.path-taxonomy #wrapper .region-content .views-element-container,
  html body.path-products #wrapper .region-content .block-content,
  html body.path-taxonomy #wrapper .region-content .block-content,
  html body.path-products #wrapper .region-content .product-catalog,
  html body.path-taxonomy #wrapper .region-content .product-catalog,
  html body.path-products #wrapper .region-content .commerce-content-header,
  html body.path-taxonomy #wrapper .region-content .commerce-content-header {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    box-sizing: border-box !important;
  }

  html body.path-products #wrapper .product-catalog .grid-wrapper,
  html body.path-taxonomy #wrapper .product-catalog .grid-wrapper,
  html body.path-products #wrapper .product-catalog .row.grid-wrapper,
  html body.path-taxonomy #wrapper .product-catalog .row.grid-wrapper {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    box-sizing: border-box !important;
  }

  /* H1 same rail */
  html body.path-products #wrapper h1.commerce-content-h1,
  html body.path-taxonomy #wrapper h1.commerce-content-h1,
  html body.path-products #wrapper .commerce-content-header,
  html body.path-taxonomy #wrapper .commerce-content-header {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
  }
}

/* END storefront-mobile-rail-v1 + title-chrome-v1 */

/* ==========================================================================
   category-width-match-brand-v1 — 2026-08-01
   Browse by Category was narrower than Browse by Brand on mobile because
   padding was applied both on the outer block and .view-product-categories-block.
   Match brand block: pad outer shell once; view/list fill 100%.
   Also force path-product category chrome parity with /products.
   ========================================================================== */

/* Outer category block = same full-bleed shell as brand block */


/* Nested view + containers fill the shell (no second inset) */




/* Category parent cards fill rail */


/* path-product: full category card chrome (same as /products) */








@media (max-width: 991.98px) {
  /* Single shared inset on outer category + brand shells only */
  

  /* CRITICAL: strip padding we previously put on the category VIEW itself */
  

  /* Kill Bootstrap row negative margins on category wrapper */
  

  

  /* Brand grid inside padded shell — full content width of shell */
  
}

/* END category-width-match-brand-v1 */

/* ==========================================================================
   category-desktop-rail-v1 — 2026-08-01
   Desktop only: Browse by Category was forced max-width 100% / full viewport
   by category-width-match-brand-v1. Cap it to the same 1220px centered rail
   as Browse by Brand. Mobile (≤991.98) rules stay unchanged.
   ========================================================================== */
@media (min-width: 992px) {
  

  

  

  /* Keep brand block on the same 1220 rail for alignment */
  
}

/* END category-desktop-rail-v1 */

/* ==========================================================================
   path-product category/brand parity with listing pages — 2026-08-01
   Product detail pages were missing path-products/path-taxonomy soft-pill
   category chrome (mint child chips, padded parents, description chips).
   Brand cards already mostly match; lock remaining tokens.
   ========================================================================== */

/* Parent cards: same as listing (light green shell) */




/* Parent title link: match listing (white on green header when present; forest fallback) */


/* If header is not green-filled, forest text is more readable — header bar itself */






/* Description chip */


/* Child chips: soft mint pills — same size/padding as listing (0.9rem 1rem) */


/* Also lock listing child geometry so path-product and path-taxonomy stay identical */




/* Active child: soft mint + stronger green rail (no gold) */


/* Active ancestor parent card — brand green rail, not gold */




/* Children list spacing */


/* Brand grid on product pages — same green cards as listing */










/* END path-product-category-brand-parity-v1 */

/* ==========================================================================
   product-breadcrumb-parity-v1 — 2026-08-01
   Product URLs now mirror category hierarchy; keep breadcrumb chrome consistent
   desktop + mobile (wrap, colors, spacing).
   ========================================================================== */
html body.path-product #wrapper #block-breadcrumbs,
html body.path-product #wrapper .breadcrumb,
html body.path-products #wrapper #block-breadcrumbs,
html body.path-products #wrapper .breadcrumb,
html body.path-taxonomy #wrapper #block-breadcrumbs,
html body.path-taxonomy #wrapper .breadcrumb {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  overflow: visible !important;
}

html body.path-product #wrapper .breadcrumb ul,
html body.path-products #wrapper .breadcrumb ul,
html body.path-taxonomy #wrapper .breadcrumb ul {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.15rem 0.35rem !important;
  margin: 0 auto !important;
  padding: 0.5rem 0.75rem !important;
  list-style: none !important;
  max-width: 1220px !important;
  box-sizing: border-box !important;
}

html body.path-product #wrapper .breadcrumb li,
html body.path-products #wrapper .breadcrumb li,
html body.path-taxonomy #wrapper .breadcrumb li {
  display: inline-flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  float: none !important;
  margin: 0 !important;
  padding: 0 !important;
  font-size: 0.9rem !important;
  line-height: 1.35 !important;
  color: #3b0a5c !important;
}

html body.path-product #wrapper .breadcrumb a,
html body.path-products #wrapper .breadcrumb a,
html body.path-taxonomy #wrapper .breadcrumb a {
  color: #5b21b6 !important;
  -webkit-text-fill-color: #5b21b6 !important;
  font-weight: 600 !important;
  text-decoration: none !important;
}

html body.path-product #wrapper .breadcrumb a:hover,
html body.path-products #wrapper .breadcrumb a:hover,
html body.path-taxonomy #wrapper .breadcrumb a:hover {
  color: #6716aa !important;
  -webkit-text-fill-color: #6716aa !important;
  text-decoration: underline !important;
}

/* Current product title (last crumb, often no link) */
html body.path-product #wrapper .breadcrumb li:last-child,
html body.path-product #wrapper .breadcrumb li.active,
html body.path-product #wrapper .breadcrumb .active {
  color: #1a0a24 !important;
  font-weight: 700 !important;
}

@media (max-width: 767.98px) {
  html body.path-product #wrapper .breadcrumb ul,
  html body.path-products #wrapper .breadcrumb ul,
  html body.path-taxonomy #wrapper .breadcrumb ul {
    justify-content: center !important;
    padding: 0.5rem 0.65rem !important;
    gap: 0.1rem 0.3rem !important;
  }

  html body.path-product #wrapper .breadcrumb li,
  html body.path-products #wrapper .breadcrumb li,
  html body.path-taxonomy #wrapper .breadcrumb li {
    font-size: 0.85rem !important;
  }
}
/* END product-breadcrumb-parity-v1 */

/* ==========================================================================
   storefront-pagerer-and-overflow-v1 — 2026-08-01
   1) Match /blog pagerer green-pill style on /products + taxonomy storefronts
   2) Kill mobile scroll-in-column: overflow-x:hidden was computing overflow-y:auto
      on .col-md-9.left-content.main-content — force overflow visible like blog
   3) Neutralize shop-icon negative margins that widen body ~15px on mobile
   ========================================================================== */

/* --- Mobile overflow: no nested scroll column, no body horizontal bleed --- */
html body.path-products #wrapper .col-md-9.left-content.main-content,
html body.path-taxonomy #wrapper .col-md-9.left-content.main-content,
html body.path-product #wrapper .col-md-9.left-content.main-content,
html body.path-store #wrapper .col-md-9.left-content.main-content,
html body.path-products #wrapper .region-content,
html body.path-taxonomy #wrapper .region-content,
html body.path-product #wrapper .region-content {
  overflow: visible !important;
  overflow-x: visible !important;
  overflow-y: visible !important;
  max-height: none !important;
  height: auto !important;
}

html body.path-products,
html body.path-taxonomy,
html body.path-product,
html body.path-store {
  overflow-x: clip !important; /* clip page-level bleed without creating scroll containers */
}

html body.path-products #wrapper,
html body.path-taxonomy #wrapper,
html body.path-product #wrapper,
html body.path-store #wrapper,
html body.path-products #wrapper .page-wrapper,
html body.path-taxonomy #wrapper .page-wrapper {
  overflow-x: clip !important;
  max-width: 100vw !important;
}

@media (max-width: 991.98px) {
  /* Override earlier overflow-x:hidden on main/catalog at mobile */
  html body.path-products #wrapper .col-md-9.left-content.main-content,
  html body.path-taxonomy #wrapper .col-md-9.left-content.main-content,
  html body.path-product #wrapper .col-md-9.left-content.main-content,
  html body.path-store #wrapper .col-md-9.left-content.main-content,
  html body.path-products #wrapper .region-content,
  html body.path-taxonomy #wrapper .region-content,
  html body.path-products #wrapper .product-catalog,
  html body.path-taxonomy #wrapper .product-catalog,
  html body.path-products #wrapper .commerce-content-header,
  html body.path-taxonomy #wrapper .commerce-content-header {
    overflow: visible !important;
    overflow-x: visible !important;
    overflow-y: visible !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  /* Shop icon box was margin-right: -15px → body ~405px wide at 390vw */
  

  /* Kill bootstrap row negative margins inside storefront main */
  html body.path-products #wrapper .col-md-9.left-content.main-content .row,
  html body.path-taxonomy #wrapper .col-md-9.left-content.main-content .row,
  html body.path-product #wrapper .col-md-9.left-content.main-content .row {
    margin-left: 0 !important;
    margin-right: 0 !important;
    max-width: 100% !important;
  }
}

/* --- Pagerer: same green pills as /blog on storefront --- */
html body.path-products #wrapper .pagerer-container,
html body.path-taxonomy #wrapper .pagerer-container,
html body.path-product #wrapper .pagerer-container,
html body.path-products #wrapper .product-catalog .pagerer-container,
html body.path-taxonomy #wrapper .product-catalog .pagerer-container,
html body.path-products #wrapper .view-product-catalog .pagerer-container,
html body.path-taxonomy #wrapper .view-brand-product-listings .pagerer-container,
html body.path-taxonomy #wrapper .view-product-category-listings .pagerer-container {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 1.75rem auto 2rem !important;
  padding: 0.75rem 0.5rem 1rem !important;
  float: none !important;
  clear: both !important;
  box-sizing: border-box !important;
  background: transparent !important;
  border: 0 !important;
  text-align: center !important;
}

body.path-products #wrapper .pagerer-container .pagerer-panes {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: -2rem auto 0rem auto !important;
  padding: 0 !important;
  gap: 0.65rem !important;
  float: none !important;
}

html body.path-taxonomy #wrapper .pagerer-container .pagerer-panes {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 1rem auto -3rem auto !important;
  padding: 0 !important;
  gap: 0.65rem !important;
  float: none !important;
} 

html .page-products-brand #wrapper .pagerer-container .pagerer-panes {
  margin-top: -3rem !important;
  margin-bottom: 0rem !important;
}

html body.path-products #wrapper .product-catalog > .view-footer {
  margin-bottom: -3rem !important;
}

html body.path-products #wrapper .pagerer-container .pagerer-left-pane,
html body.path-products #wrapper .pagerer-container .pagerer-center-pane,
html body.path-products #wrapper .pagerer-container .pagerer-right-pane,
html body.path-taxonomy #wrapper .pagerer-container .pagerer-left-pane,
html body.path-taxonomy #wrapper .pagerer-container .pagerer-center-pane,
html body.path-taxonomy #wrapper .pagerer-container .pagerer-right-pane {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
  text-align: center !important;
}

html body.path-products #wrapper .pagerer-container .pagerer-center-pane:empty,
html body.path-taxonomy #wrapper .pagerer-container .pagerer-center-pane:empty {
  display: none !important;
}

html body.path-products #wrapper .pagerer-container nav.pager,
html body.path-products #wrapper .pagerer-container .pager,
html body.path-taxonomy #wrapper .pagerer-container nav.pager,
html body.path-taxonomy #wrapper .pagerer-container .pager,
/* Standard full pager fallback (if any display still uses it) */
html body.path-products #wrapper .product-catalog > nav.pager,
html body.path-taxonomy #wrapper .product-catalog > nav.pager,
html body.path-products #wrapper nav.pager,
html body.path-taxonomy #wrapper nav.pager {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  text-align: center !important;
  float: none !important;
}

html body.path-products #wrapper .pagerer-container ul.pager__items,
html body.path-products #wrapper .pagerer-container .js-pager__items,
html body.path-taxonomy #wrapper .pagerer-container ul.pager__items,
html body.path-taxonomy #wrapper .pagerer-container .js-pager__items,
html body.path-products #wrapper nav.pager ul.pager__items,
html body.path-taxonomy #wrapper nav.pager ul.pager__items,
html body.path-products #wrapper .product-catalog ul.pager__items,
html body.path-taxonomy #wrapper .product-catalog ul.pager__items {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 0.4rem !important;
  list-style: none !important;
  margin: 0 auto !important;
  padding: 0 !important;
  width: auto !important;
  max-width: 100% !important;
  float: none !important;
  text-align: center !important;
}

html body.path-products #wrapper .pagerer-container .pager__item,
html body.path-taxonomy #wrapper .pagerer-container .pager__item,
html body.path-products #wrapper nav.pager .pager__item,
html body.path-taxonomy #wrapper nav.pager .pager__item {
  display: inline-flex !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
  background: transparent !important;
  border: 0 !important;
}

/* "Page X of Y" chip */
html body.path-products #wrapper .pagerer-container .pagerer-prefix span,
html body.path-products #wrapper .pagerer-container .pager__item.pagerer-prefix span,
html body.path-taxonomy #wrapper .pagerer-container .pagerer-prefix span,
html body.path-taxonomy #wrapper .pagerer-container .pager__item.pagerer-prefix span {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: #f3e8ff !important;
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  border: 1px solid #e9d5ff !important;
  border-radius: 999px !important;
  padding: 0.4rem 0.95rem !important;
  font-weight: 700 !important;
  font-size: 0.9rem !important;
  line-height: 1.2 !important;
  box-shadow: 0 1px 4px rgba(59, 10, 92, 0.08) !important;
  margin: 0 !important;
}

html body.path-products #wrapper .pagerer-container .pagerer-prefix b,
html body.path-taxonomy #wrapper .pagerer-container .pagerer-prefix b {
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  font-weight: 800 !important;
}

/* Page number / next / last links */
html body.path-products #wrapper .pagerer-container .pager__item a,
html body.path-products #wrapper .pagerer-container .pager__item > span,
html body.path-taxonomy #wrapper .pagerer-container .pager__item a,
html body.path-taxonomy #wrapper .pagerer-container .pager__item > span,
html body.path-products #wrapper nav.pager .pager__item a,
html body.path-taxonomy #wrapper nav.pager .pager__item a,
html body.path-products #wrapper .product-catalog .pager__item a,
html body.path-taxonomy #wrapper .product-catalog .pager__item a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 2.65rem !important;
  min-height: 2.65rem !important;
  padding: 0.4rem 0.75rem !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  background: #f5f0fa !important;
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  border: 1.5px solid #e9d5ff !important;
  border-radius: 10px !important;
  font-weight: 800 !important;
  font-size: 0.95rem !important;
  line-height: 1 !important;
  text-decoration: none !important;
  text-align: center !important;
  box-shadow: 0 1px 3px rgba(59, 10, 92, 0.08) !important;
  transition: transform 0.15s ease, background 0.15s ease, border-color 0.15s ease !important;
}

html body.path-products #wrapper .pagerer-container .pager__item a:hover,
html body.path-products #wrapper .pagerer-container .pager__item a:focus,
html body.path-taxonomy #wrapper .pagerer-container .pager__item a:hover,
html body.path-products #wrapper nav.pager .pager__item a:hover,
html body.path-taxonomy #wrapper nav.pager .pager__item a:hover {
  background: #f3e8ff !important;
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  border-color: #6716aa !important;
  transform: translateY(-1px) !important;
  text-decoration: none !important;
}

/* Active page */
html body.path-products #wrapper .pagerer-container .pager__item.is-active a,
html body.path-products #wrapper .pagerer-container .pager__item.is-active > span,
html body.path-products #wrapper .pagerer-container .pager__item.active a,
html body.path-taxonomy #wrapper .pagerer-container .pager__item.is-active a,
html body.path-taxonomy #wrapper .pagerer-container .pager__item.is-active > span,
html body.path-products #wrapper nav.pager .pager__item.is-active a,
html body.path-taxonomy #wrapper nav.pager .pager__item.is-active a,
html body.path-products #wrapper .product-catalog .pager__item.is-active a,
html body.path-taxonomy #wrapper .product-catalog .pager__item.is-active a {
  background: linear-gradient(135deg, #3b0a5c 0%, #6716aa 55%, #7b2cbf 100%) !important;
  background-color: #6716aa !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border: 2px solid #000 !important;
  box-shadow: 0 2px 8px rgba(59, 10, 92, 0.22) !important;
  pointer-events: none !important;
}

html body.path-products #wrapper .pagerer-container .pager__item .visually-hidden,
html body.path-taxonomy #wrapper .pagerer-container .pager__item .visually-hidden,
html body.path-products #wrapper nav.pager .pager__item .visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

html body.path-products #wrapper .pagerer-container .pager__item--next a,
html body.path-products #wrapper .pagerer-container .pager__item--last a,
html body.path-products #wrapper .pagerer-container .pager__item--previous a,
html body.path-products #wrapper .pagerer-container .pager__item--first a,
html body.path-taxonomy #wrapper .pagerer-container .pager__item--next a,
html body.path-taxonomy #wrapper .pagerer-container .pager__item--last a,
html body.path-taxonomy #wrapper .pagerer-container .pager__item--previous a,
html body.path-taxonomy #wrapper .pagerer-container .pager__item--first a {
  min-width: 2.75rem !important;
  font-size: 1.05rem !important;
}

/* Kill custom_css negative pull on storefront pagerer */
html body.path-products #wrapper .pagerer-container,
html body.path-taxonomy #wrapper .pagerer-container {
  margin-top: 1.75rem !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-bottom: 0.75rem !important;
}

@media (max-width: 767.98px) {
  html body.path-products #wrapper .pagerer-container,
  html body.path-taxonomy #wrapper .pagerer-container {
    margin: 1.35rem auto 1.75rem !important;
    padding: 0.5rem 0.35rem 0.85rem !important;
  }

  html body.path-products #wrapper .pagerer-container .pagerer-panes,
  html body.path-taxonomy #wrapper .pagerer-container .pagerer-panes {
    gap: 0.55rem !important;
  }

  html body.path-products #wrapper .pagerer-container ul.pager__items,
  html body.path-taxonomy #wrapper .pagerer-container ul.pager__items,
  html body.path-products #wrapper nav.pager ul.pager__items {
    gap: 0.3rem !important;
    max-width: 100% !important;
    padding: 0 0.25rem !important;
  }

  html body.path-products #wrapper .pagerer-container .pager__item a,
  html body.path-products #wrapper .pagerer-container .pager__item > span,
  html body.path-taxonomy #wrapper .pagerer-container .pager__item a,
  html body.path-products #wrapper nav.pager .pager__item a {
    min-width: 2.45rem !important;
    min-height: 2.45rem !important;
    padding: 0.35rem 0.55rem !important;
    font-size: 0.9rem !important;
    border-radius: 9px !important;
  }

  html body.path-products #wrapper .pagerer-container .pagerer-prefix span,
  html body.path-taxonomy #wrapper .pagerer-container .pagerer-prefix span {
    font-size: 0.85rem !important;
    padding: 0.35rem 0.8rem !important;
  }
}
/* END storefront-pagerer-and-overflow-v1 */

/* ==========================================================================
   storefront-mobile-container-shop-v1 — 2026-08-01
   - Kill horizontal overflow from .container / .row on products storefront
   - Shop icon box: same edge-to-edge rail width as Browse by Category
   - Category parent cards: light green (also reinforced here for path-product)
   ========================================================================== */

/* Light green parent cards (all storefront paths) */


@media (max-width: 991.98px) {
  /* Page containers: no bleed, shared inset, no nested scroll */
  html body.path-products #wrapper .page-wrapper,
  html body.path-taxonomy #wrapper .page-wrapper,
  html body.path-product #wrapper .page-wrapper,
  html body.path-store #wrapper .page-wrapper {
    width: 100% !important;
    max-width: 100vw !important;
    overflow-x: clip !important;
    box-sizing: border-box !important;
  }

  

  html body.path-products #wrapper .page-wrapper > .container,
  html body.path-taxonomy #wrapper .page-wrapper > .container,
  html body.path-product #wrapper .page-wrapper > .container,
  html body.path-store #wrapper .page-wrapper > .container,
  html body.path-products #wrapper .container,
  html body.path-taxonomy #wrapper .container {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0.875rem !important;
    padding-right: 0.875rem !important;
    overflow-x: clip !important;
    box-sizing: border-box !important;
  }

  /* Bootstrap rows inside storefront must not use -15px gutters */
  html body.path-products #wrapper .page-wrapper > .container > .row,
  html body.path-taxonomy #wrapper .page-wrapper > .container > .row,
  html body.path-product #wrapper .page-wrapper > .container > .row,
  html body.path-products #wrapper .row.content-layout,
  html body.path-taxonomy #wrapper .row.content-layout,
  html body.path-product #wrapper .row.content-layout {
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  html body.path-products #wrapper .page-wrapper > .container > .row > [class*="col-"],
  html body.path-taxonomy #wrapper .page-wrapper > .container > .row > [class*="col-"],
  html body.path-product #wrapper .page-wrapper > .container > .row > [class*="col-"],
  html body.path-products #wrapper .row.content-layout > [class*="col-"],
  html body.path-taxonomy #wrapper .row.content-layout > [class*="col-"] {
    padding-left: 0 !important;
    padding-right: 0 !important;
    max-width: 100% !important;
    margin-top: 0rem !important;
  }

  /* Main content: no overflow-x:hidden (computes to overflow-y:auto) */
  html body.path-products #wrapper .col-md-9.left-content.main-content,
  html body.path-taxonomy #wrapper .col-md-9.left-content.main-content,
  html body.path-product #wrapper .col-md-9.left-content.main-content,
  html body.path-store #wrapper .col-md-9.left-content.main-content,
  html body.path-products #wrapper .region-content,
  html body.path-taxonomy #wrapper .region-content,
  html body.path-product #wrapper .region-content {
    overflow: visible !important;
    overflow-x: visible !important;
    overflow-y: visible !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  /* ---- Shop icon box = same outer rail as Browse by Category ---- */
  

  

  /* Critical: inner Bootstrap .container was ~358px inset — force full rail */
  

  /* Shop icon rows/cols fill the rail */
  

  

  /* Align category outer shell pad with shop (same 0.875rem) */
  
}
/* END storefront-mobile-container-shop-v1 */

/* ==========================================================================
   product-post-brand-rail-v1 — 2026-08-01
   product-post edge-to-edge matches Browse by Brand block
   Desktop: shared centered 1220px rail
   Mobile: full viewport width with same 0.875rem side inset as brand
   ========================================================================== */

/* Desktop/shared: main column full container width so post can share brand rail */
html body.path-product #wrapper .page-wrapper > .container {
  max-width: 1220px !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  box-sizing: border-box !important;
}

html body.path-product #wrapper .row.content-layout {
  margin-left: 0 !important;
  margin-right: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  box-sizing: border-box !important;
}

html body.path-product #wrapper .col-md-9.left-content.main-content,
html body.path-product #wrapper .main-content,
html body.path-product #wrapper .region-content,
html body.path-product #wrapper #block-martis-content--3,
html body.path-product #wrapper #block-martis-content--3.lc-main-content {
  flex: 0 0 100% !important;
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  box-sizing: border-box !important;
  float: none !important;
}

html body.path-product #wrapper #block-martis-content--3 .container-wrap,
html body.path-product #wrapper #block-martis-content--3 .block-content,
html body.path-product #wrapper .commerce-product,
html body.path-product #wrapper article.commerce-product {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  box-sizing: border-box !important;
}

/* product-post = brand block outer geometry (1220 centered desktop) */
html body.path-product #wrapper .product-post,
html body.path-product .product-post,
html body.path-product #wrapper .commerce-product .product-post,
html body.path-product #wrapper .block-content .product-post {
  width: 100% !important;
  max-width: 1220px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
  float: none !important;
  clear: both !important;
}

/* Keep brand block on the same 1220 rail (already is; lock it) */


@media (max-width: 991.98px) {
  /* Full-bleed page shell like content-wide brand region */
  html body.path-product #wrapper .page-wrapper > .container {
    max-width: 100% !important;
    width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  html body.path-taxonomy #wrapper .pagerer-container .pagerer-panes {
    margin: 1rem auto -3rem auto !important;
  } 

   body.path-products #wrapper .pagerer-container .pagerer-panes {
    margin: -1rem auto 0rem auto !important;
  }

  html body.path-product #wrapper .row.content-layout {
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  html body.path-product #wrapper .col-md-9.left-content.main-content,
  html body.path-product #wrapper .main-content,
  html body.path-product #wrapper .region-content,
  html body.path-product #wrapper #block-martis-content--3,
  html body.path-product #wrapper #block-martis-content--3 .container-wrap,
  html body.path-product #wrapper #block-martis-content--3 .block-content,
  html body.path-product #wrapper .commerce-product,
  html body.path-product #wrapper article.commerce-product {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  /* product-post full width = brand block (390 @ 390vw), same side inset 0.875rem */
  html body.path-product #wrapper .product-post,
  html body.path-product .product-post,
  html body.path-product #wrapper .commerce-product .product-post,
  html body.path-product #wrapper .block-content .product-post {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0.875rem !important;
    padding-right: 0.875rem !important;
    padding-top: 1rem !important;
    padding-bottom: 1rem !important;
    box-sizing: border-box !important;
  }

  
}

@media (min-width: 992px) {
  /* Desktop: zero container pad so product-post and brand share exact 1220 edges */
  html body.path-product #wrapper .page-wrapper > .container {
    max-width: 1220px !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  html body.path-product #wrapper .product-post,
  html body.path-product .product-post {
    max-width: 1220px !important;
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}
/* END product-post-brand-rail-v1 */

/* ==========================================================================
   product-post-search-category-width-v1 — 2026-08-01
   product-post + product search: a bit narrower, match Browse by Category
   content rail (category outer 1220 with 12px sides → content 1196 desktop;
   mobile 14px sides → content 362 @ 390vw).
   ========================================================================== */

/* Desktop/tablet+: same content width as category inner rail */
@media (min-width: 992px) {
  

  html body.path-product #wrapper .product-post,
  html body.path-product .product-post,
  html body.path-product #wrapper .commerce-product .product-post,
  html body.path-product #wrapper .block-content .product-post {
    width: 100% !important;
    max-width: 1196px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 1.5rem !important; /* was 40px; slightly airier but not edge-to-edge of 1220 */
    padding-right: 1.5rem !important;
    padding-top: 1.75rem !important;
    padding-bottom: 1.75rem !important;
    box-sizing: border-box !important;
  }
}

/* Mobile: match category shell (full width + 0.875rem / 14px sides) */
@media (max-width: 991.98px) {
  

  html body.path-taxonomy #wrapper .pagerer-container .pagerer-panes {
    margin-bottom: -1rem !important;
  }

  html body.path-product #wrapper .product-post,
  html body.path-product .product-post,
  html body.path-product #wrapper .commerce-product .product-post,
  html body.path-product #wrapper .block-content .product-post {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0.875rem !important;
    padding-right: 0.875rem !important;
    padding-top: 1rem !important;
    padding-bottom: 1rem !important;
    box-sizing: border-box !important;
  }
}
/* END product-post-search-category-width-v1 */

/* ==========================================================================
   product-post-search-category-width-v2 — force 1196 (category content rail)
   Higher specificity + last-wins over earlier max-width: 1220 search rules
   ========================================================================== */
@media (min-width: 992px) {
  

  html body.path-product.path-product #wrapper .product-post,
  html body.path-product #wrapper .block-content .product-post,
  html body.path-product #wrapper .commerce-product .product-post,
  html body.path-product #wrapper .product-post {
    width: min(100%, 1196px) !important;
    max-width: min(100%, 1196px) !important;
    min-width: 0 !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 1.5rem !important;
    padding-right: 1.5rem !important;
    box-sizing: border-box !important;
  }
}

@media (max-width: 991.98px) {
  /* Match category outer: 100% width, 14px sides (content 362 @ 390) */
  

  html body.path-product.path-product #wrapper .product-post,
  html body.path-product #wrapper .product-post {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0.875rem !important;
    padding-right: 0.875rem !important;
    box-sizing: border-box !important;
  }
}
/* END product-post-search-category-width-v2 */

/* ==========================================================================
   mobile-search-post-match-category-v1 — 2026-08-01
   Mobile: product-post + search outer box = category/brand content rail
   (cat cards sit at left 14 / width 362 @ 390vw — not full 390).
   Apply on path-product, path-products, path-taxonomy.
   ========================================================================== */
@media (max-width: 991.98px) {
  /* Search on product detail, product listing, brand & taxonomy */
  

  /* Search inner form fills the narrowed shell */
  

  /* product-post on product nodes only — same outer rail as category cards */
  html body.path-product #wrapper .product-post,
  html body.path-product .product-post,
  html body.path-product #wrapper .commerce-product .product-post,
  html body.path-product #wrapper .block-content .product-post {
    width: calc(105% - 0rem) !important;
    max-width: calc(105% - 0rem) !important;
    margin-left: -0.5rem !important;
    margin-right: 0rem !important;
    padding-left: 0.85rem !important;
    padding-right: 0.85rem !important;
    padding-top: 1rem !important;
    padding-bottom: 1rem !important;
    box-sizing: border-box !important;
    float: none !important;
  }

  /* Ancestors must not force full-bleed wider than the post */
  html body.path-product #wrapper #block-martis-content--3 .container-wrap,
  html body.path-product #wrapper #block-martis-content--3 .block-content,
  html body.path-product #wrapper .commerce-product,
  html body.path-product #wrapper article.commerce-product {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
  }
}
/* END mobile-search-post-match-category-v1 */

/* ==========================================================================
   product-pdp-short-desc-h1-mobile-v1 — 2026-08-01
   1) Short description: card-style callout (desktop + mobile)
   2) Mobile: stop text bleeding outside product-post card
   3) Mobile: narrower product H1 chip
   ========================================================================== */

/* ---- Short description callout (product detail only) ---- */
html body.path-product #wrapper .product-content-wrap .product-short-description,
html body.path-product #wrapper .product-post .product-short-description,
html body.path-product .product-post .product-short-description {
  display: block !important;
  margin: 0.85rem 0 1.1rem !important;
  padding: 0.9rem 1.05rem !important;
  background: #fff !important;
  background-color: #fff !important;
  border: 1px solid #e9d5ff !important;
  border-left: 4px solid #6716aa !important;
  border-radius: 12px !important;
  box-shadow: 0 2px 10px rgba(59, 10, 92, 0.07) !important;
  color: #1f2937 !important;
  -webkit-text-fill-color: #1f2937 !important;
  font-size: 1rem !important;
  line-height: 1.65 !important;
  font-weight: 500 !important;
  box-sizing: border-box !important;
  max-width: 100% !important;
  width: 100% !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
  white-space: normal !important;
  opacity: 1 !important;
  visibility: visible !important;
}

/* Hide field label "Short Description" — the callout is self-evident */
html body.path-product #wrapper .product-short-description .field-label,
html body.path-product #wrapper .product-short-description .field__label,
html body.path-product .product-short-description .field-label,
html body.path-product .product-short-description .field__label {
  display: none !important;
}

html body.path-product #wrapper .product-short-description .field,
html body.path-product #wrapper .product-short-description .field-item,
html body.path-product #wrapper .product-short-description .field__item,
html body.path-product #wrapper .product-short-description p,
html body.path-product .product-short-description .field-item,
html body.path-product .product-short-description p {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #1f2937 !important;
  -webkit-text-fill-color: #1f2937 !important;
  font-size: inherit !important;
  line-height: inherit !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
}

/* ---- Product card: keep all text inside the white shell ---- */
html body.path-product #wrapper .product-post,
html body.path-product .product-post {
  overflow-x: clip !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
  min-width: 0 !important;
}

html body.path-product #wrapper .product-post .row,
html body.path-product #wrapper .product-post .col-md-6,
html body.path-product #wrapper .product-content-wrap,
html body.path-product #wrapper .product-image-wrap,
html body.path-product #wrapper .product-info,
html body.path-product #wrapper .product-tab-item,
html body.path-product #wrapper .tab-content {
  max-width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
}

/* Kill negative horizontal row pull that bleeds text past the card edge */
html body.path-product #wrapper .product-post > .row,
html body.path-product #wrapper .product-post .row {
  margin-left: 0 !important;
  margin-right: 0 !important;
  width: 100% !important;
}

/*
 * Long description (body tab) — restore designed palette.
 * Do NOT paint every div/span/li flat gray (that flattened feature chips).
 * Only fix true white-on-white from custom_css while keeping list cards.
 */
html body.path-product #wrapper .product-post #product-detail .product-tab-item > div > p,
html body.path-product #wrapper .product-post .product-tab-item > div > p,
html body.path-product #wrapper .product-post #product-detail .field--name-body > p,
html body.path-product #wrapper .product-post .field--name-body > p,
html body.path-product #wrapper .product-post .product-tab-item p {
  color: #4b5563 !important;
  -webkit-text-fill-color: #4b5563 !important;
  background: transparent !important;
}

/* Feature list chips — mint cards, dark readable text (designed look) */
html body.path-product #wrapper .product-post .product-tab-item ul,
html body.path-product #wrapper .product-post #product-detail ul {
  list-style: none !important;
  padding: 0 !important;
  margin: 1.25rem 0 !important;
}

html body.path-product #wrapper .product-post .product-tab-item ul li,
html body.path-product #wrapper .product-post #product-detail ul li,
html body.path-product #wrapper .product-post .field--name-body ul li {
  position: relative !important;
  color: #374151 !important;
  -webkit-text-fill-color: #374151 !important;
  background: linear-gradient(180deg, #f4fbf6 0%, #ffffff 100%) !important;
  border: 1px solid rgba(123, 44, 191, 0.12) !important;
  border-radius: 16px !important;
  padding: 16px 18px 16px 55px !important;
  margin-bottom: 12px !important;
  font-weight: 500 !important;
  box-sizing: border-box !important;
  max-width: 100% !important;
}

html body.path-product #wrapper .product-post .product-tab-item ul li::before,
html body.path-product #wrapper .product-post #product-detail ul li::before,
html body.path-product #wrapper .product-post .field--name-body ul li::before {
  content: "✓" !important;
  position: absolute !important;
  left: 18px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 26px !important;
  height: 26px !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  background: linear-gradient(135deg, #6716aa, #7b2cbf) !important;
}

/* Strong emphasis: forest green (readable) — not white-on-white */
html body.path-product #wrapper .product-post .product-tab-item strong,
html body.path-product #wrapper .product-post .product-tab-item b,
html body.path-product #wrapper .product-post #product-detail strong,
html body.path-product #wrapper .product-post .field--name-body strong,
html body.path-product #wrapper .product-post .product-tab-item p strong {
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  font-weight: 800 !important;
  background: transparent !important;
}

html body.path-product #wrapper .product-post .product-tab-item h2,
html body.path-product #wrapper .product-post .product-tab-item h3,
html body.path-product #wrapper .product-post #product-detail h2,
html body.path-product #wrapper .product-post #product-detail h3,
html body.path-product #wrapper .product-post .field--name-body h2,
html body.path-product #wrapper .product-post .field--name-body h3 {
  color: #1f2937 !important;
  -webkit-text-fill-color: #1f2937 !important;
  font-weight: 800 !important;
  background: transparent !important;
}

/* Desktop short-desc + H1 refinements */
@media (min-width: 992px) {
  html body.path-product #wrapper .product-content-wrap .product-short-description,
  html body.path-product #wrapper .product-post .product-short-description {
    padding: 1rem 1.25rem !important;
    font-size: 1.05rem !important;
    line-height: 1.7 !important;
    margin: 1rem 0 1.25rem !important;
  }

  html body.path-product #wrapper h1.commerce-product-h1,
  html body.path-product #wrapper h1.product-title.commerce-product-h1 {
    max-width: min(36rem, 100%) !important;
    width: auto !important;
    margin-left: 0 !important;
    margin-right: auto !important;
    text-align: left !important;
    padding: 0.65rem 1rem !important;
    font-size: clamp(1.15rem, 1.6vw, 1.45rem) !important;
    line-height: 1.3 !important;
    overflow-wrap: anywhere !important;
  }
}

/* Mobile / tablet product detail polish */
@media (max-width: 991.98px) {

  html body.path-taxonomy #wrapper .product-catalog ul.pager__items {
    margin-bottom: -3rem !important;
  }
  /* Narrower H1 chip — not edge-to-edge of the card */
  html body.path-product #wrapper h1.commerce-product-h1,
  html body.path-product #wrapper h1.product-title.commerce-product-h1,
  html body.path-product #wrapper .product-content-wrap h1.commerce-product-h1 {
    width: auto !important;
    max-width: calc(100% - 1.25rem) !important;
    margin-left: auto !important;
    margin-right: auto !important;
    margin-top: 0.35rem !important;
    margin-bottom: 0.75rem !important;
    padding: 0.5rem 0.7rem !important;
    font-size: 1.02rem !important;
    line-height: 1.28 !important;
    letter-spacing: 0 !important;
    text-align: center !important;
    box-sizing: border-box !important;
    overflow-wrap: anywhere !important;
    word-break: break-word !important;
    hyphens: auto !important;
  }

  /* Extra inner inset so copy never sits on the card border */
  html body.path-product #wrapper .product-post,
  html body.path-product .product-post,
  html body.path-product #wrapper .commerce-product .product-post,
  html body.path-product #wrapper .block-content .product-post {
    padding-left: 1rem !important;
    padding-right: 1rem !important;
    padding-top: 1.05rem !important;
    padding-bottom: 1.15rem !important;
    overflow-x: clip !important;
  }

  html body.path-product #wrapper .product-content-wrap {
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-top: 0.75rem !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  html body.path-product #wrapper .product-image-wrap {
    margin: 0 0 0.75rem 0 !important;
    padding: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  html body.path-product #wrapper .product-content-wrap .product-short-description,
  html body.path-product #wrapper .product-post .product-short-description {
    margin: 0.7rem 0 0.95rem !important;
    padding: 0.75rem 0.85rem !important;
    font-size: 0.92rem !important;
    line-height: 1.55 !important;
    border-radius: 10px !important;
  }

  /* Stock / meta chips wrap cleanly inside card */
  html body.path-product #wrapper .product-stock,
  html body.path-product #wrapper .product-meta {
    max-width: 100% !important;
    flex-wrap: wrap !important;
    box-sizing: border-box !important;
  }

  html body.path-product #wrapper .product-stock,
  html body.path-product #wrapper .product-price,
  html body.path-product #wrapper .product-meta-item {
    overflow-wrap: anywhere !important;
    word-break: break-word !important;
  }

  /* Tabs: no negative pull under content; keep text in pane */
  html body.path-product #wrapper .product-info .nav.nav-tabs,
  html body.path-product #wrapper .nav.nav-tabs {
    margin-top: 0.75rem !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    max-width: 100% !important;
  }

  html body.path-product #wrapper .product-tab-item,
  html body.path-product #wrapper #product-detail {
    padding: 0.15rem 0 !important;
    max-width: 100% !important;
    overflow-wrap: anywhere !important;
  }

  html body.path-product #wrapper .product-tab-item ul li {
    padding-left: 3rem !important;
    padding-right: 0.75rem !important;
    transform: none !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  html body.path-product #wrapper .product-tab-item ul li:hover {
    transform: none !important;
  }

  /* Variation / add-to-cart form full width without overflow */
  html body.path-product #wrapper .product-variation-wrap,
  html body.path-product #wrapper .product-add-cart,
  html body.path-product #wrapper .commerce-order-item-add-to-cart-form {
    max-width: 100% !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  html body.path-product #wrapper .commerce-order-item-add-to-cart-form input,
  html body.path-product #wrapper .commerce-order-item-add-to-cart-form select,
  html body.path-product #wrapper .commerce-order-item-add-to-cart-form .form-control {
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  /* Add to cart: full-width pill, centered label (beats custom_css width:50%) */
  html body.path-product #wrapper .product-post .product-variation-wrap,
  html body.path-product #wrapper .product-content-wrap .product-variation-wrap {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 0.5rem !important;
    padding-right: 0.5rem !important;
    box-sizing: border-box !important;
  }

  html body.path-product #wrapper .product-post .product-add-cart,
  html body.path-product #wrapper .product-post .product-add-cart .field,
  html body.path-product #wrapper .product-post .product-add-cart .field-items,
  html body.path-product #wrapper .product-post .product-add-cart .field-item,
  html body.path-product #wrapper .product-post .commerce-order-item-add-to-cart-form,
  html body.path-product #wrapper .product-content-wrap .commerce-order-item-add-to-cart-form {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  html body.path-product #wrapper .product-post .commerce-order-item-add-to-cart-form {
    padding: 0.75rem 0 !important; /* no side pad so ATC spans full rail */
  }

  html body.path-product #wrapper .product-post .commerce-order-item-add-to-cart-form .form-actions,
  html body.path-product #wrapper .product-post .commerce-order-item-add-to-cart-form .form-actions.form-wrapper,
  html body.path-product #wrapper .product-content-wrap .commerce-order-item-add-to-cart-form .form-actions {
    width: 100% !important;
    max-width: 100% !important;
    display: block !important;
    text-align: center !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
  }

  html body.path-product.path-product #wrapper .product-post input.button--add-to-cart,
  html body.path-product #wrapper .product-post .button--add-to-cart,
  html body.path-product #wrapper .product-post input#edit-submit.button--add-to-cart,
  html body.path-product #wrapper .product-post input.button.button--primary.button--add-to-cart,
  html body.path-product #wrapper .product-post .commerce-order-item-add-to-cart-form input.button--add-to-cart,
  html body.path-product #wrapper .product-post .commerce-order-item-add-to-cart-form .form-actions input.button,
  html body.path-product #wrapper .product-post .commerce-order-item-add-to-cart-form .form-actions input#edit-submit,
  html body.path-product #wrapper .product-content-wrap input.button--add-to-cart,
  html body.path-product #wrapper .product-content-wrap .form-actions .button--add-to-cart {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-top: 0.65rem !important;
    padding: 0.95rem 1rem !important;
    text-align: center !important;
    box-sizing: border-box !important;
    font-weight: 800 !important;
    font-size: 1.05rem !important;
    line-height: 1.25 !important;
    letter-spacing: 0.02em !important;
  }
}

@media (max-width: 575.98px) {
  html body.path-product #wrapper h1.commerce-product-h1,
  html body.path-product #wrapper h1.product-title.commerce-product-h1 {
    max-width: calc(100% - 0.75rem) !important;
    font-size: 0.98rem !important;
    padding: 0.45rem 0.6rem !important;
  }

  html body.path-product #wrapper .product-content-wrap .product-short-description,
  html body.path-product #wrapper .product-post .product-short-description {
    font-size: 0.9rem !important;
    padding: 0.7rem 0.75rem !important;
  }
}
/* END product-pdp-short-desc-h1-mobile-v1 */

/* ==========================================================================
   storefront-mobile-menu-width-v2 — 2026-08-01
   Keep homepage-like header-info inset (1rem sides on navbar container) on
   taxonomy/brand/products, while still full-bleeding the open hamburger menu
   to viewport width (same ~366px pills as homepage).
   v1 zeroed container pad and pushed header-info flush to the screen edge.
   ========================================================================== */
@media (max-width: 991.98px) {
  /* Restore homepage side inset for brand / header-info / contact row */
  html body.path-products #wrapper .page-wrapper > .container > .row > [class*="col-"],
  html body.path-taxonomy #wrapper .page-wrapper > .container > .row > [class*="col-"],
  html body.path-product #wrapper .page-wrapper > .container > .row > [class*="col-"],
  html body.path-products #wrapper .row.content-layout > [class*="col-"],
  html body.path-taxonomy #wrapper .row.content-layout > [class*="col-"] {
    margin-top: 1.5rem !important;
  }
  @media (max-width: 767.98px) {
  html body.path-taxonomy #wrapper .header .navbar > .container,
  html body.path-taxonomy #wrapper .header .navbar > .container.p-0,
  html body.path-products #wrapper .header .navbar > .container,
  html body.path-products #wrapper .header .navbar > .container.p-0,
  html body.path-product #wrapper .header .navbar > .container,
  html body.path-product #wrapper .header .navbar > .container.p-0,
  html body.path-store #wrapper .header .navbar > .container,
  html body.path-store #wrapper .header .navbar > .container.p-0,
  html body.path-taxonomy header.header .navbar > .container,
  html body.path-products header.header .navbar > .container,
  html body.path-product header.header .navbar > .container {
    padding-left: 1rem !important;  /* match homepage ~16px */
    padding-right: 1rem !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
  }
  
  html .page-products-brand #wrapper .pagerer-container .pagerer-panes {
    margin-top: -1rem !important;
    margin-bottom: 1rem !important;
  }

  html body.path-products #wrapper .product-catalog > .view-footer {
    margin-bottom: 0rem !important;
    margin-top: -2rem !important;
  }


  /* header-main-wrap + header-info: same content rail as homepage */
  @media (max-width: 767.98px) {
  html body.path-taxonomy #wrapper .header .header-main-wrap,
  html body.path-taxonomy #wrapper .header .navbar > .container > .header-main-wrap,
  html body.path-products #wrapper .header .header-main-wrap,
  html body.path-products #wrapper .header .navbar > .container > .header-main-wrap,
  html body.path-product #wrapper .header .header-main-wrap,
  html body.path-product #wrapper .header .navbar > .container > .header-main-wrap,
  html body.path-store #wrapper .header .header-main-wrap {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    box-sizing: border-box !important;
  }
  }

  @media (max-width: 767.98px) {
  html body.path-taxonomy #wrapper .header .header-info,
  html body.path-taxonomy #wrapper .header .header-main-wrap .header-info,
  html body.path-products #wrapper .header .header-info,
  html body.path-products #wrapper .header .header-main-wrap .header-info,
  html body.path-product #wrapper .header .header-info,
  html body.path-product #wrapper .header .header-main-wrap .header-info,
  html body.path-store #wrapper .header .header-info {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    box-sizing: border-box !important;
  }
  }

  @media (max-width: 767.98px) {
  html body.path-taxonomy #wrapper .header .header-info .header-info-container,
  html body.path-products #wrapper .header .header-info .header-info-container,
  html body.path-product #wrapper .header .header-info .header-info-container,
  html body.path-store #wrapper .header .header-info .header-info-container {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    justify-content: space-between !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 0 !important;
    box-sizing: border-box !important;
  }
  }

  /* Keep shared mobile margins so the location divider matches the homepage. */
  @media (max-width: 767.98px) {
  html body.path-taxonomy #wrapper .header .header-info .header-info-item,
  html body.path-taxonomy #wrapper .header .header-info .header-info-location,
  html body.path-taxonomy #wrapper .header .header-info .header-info-item--location,
  html body.path-taxonomy #wrapper .header .header-info .header-info-hours,
  html body.path-taxonomy #wrapper .header .header-info .header-info-item--hours,
  html body.path-products #wrapper .header .header-info .header-info-item,
  html body.path-products #wrapper .header .header-info .header-info-location,
  html body.path-products #wrapper .header .header-info .header-info-item--location,
  html body.path-products #wrapper .header .header-info .header-info-hours,
  html body.path-products #wrapper .header .header-info .header-info-item--hours,
  html body.path-product #wrapper .header .header-info .header-info-item,
  html body.path-product #wrapper .header .header-info .header-info-location,
  html body.path-product #wrapper .header .header-info .header-info-item--location,
  html body.path-product #wrapper .header .header-info .header-info-hours,
  html body.path-product #wrapper .header .header-info .header-info-item--hours,
  html body.path-store #wrapper .header .header-info .header-info-item,
  html body.path-store #wrapper .header .header-info .header-info-location,
  html body.path-store #wrapper .header .header-info .header-info-hours {
    flex: 1 1 50% !important;
    max-width: 50% !important;
    min-width: 0 !important;
    width: auto !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    margin-left: 0 !important;
    box-sizing: border-box !important;
  }
  }

  /* Retain the existing tablet reset; mobile uses the shared homepage rule. */
  @media (min-width: 768px) {
    @media (max-width: 767.98px) {
  html body:is(.path-taxonomy, .path-products, .path-product, .path-store) #wrapper .header .header-info :is(.header-info-item, .header-info-location, .header-info-item--location, .header-info-hours, .header-info-item--hours) {
      margin-right: 0 !important;
    }
  }
  }

  @media (max-width: 767.98px) {
  html body.path-taxonomy #wrapper .header .header-info .header-info-location,
  html body.path-taxonomy #wrapper .header .header-info .header-info-item--location,
  html body.path-products #wrapper .header .header-info .header-info-location,
  html body.path-products #wrapper .header .header-info .header-info-item--location,
  html body.path-product #wrapper .header .header-info .header-info-location,
  html body.path-product #wrapper .header .header-info .header-info-item--location,
  html body.path-store #wrapper .header .header-info .header-info-location,
  html body.path-store #wrapper .header .header-info .header-info-item--location {
    padding-right: 0.65rem !important;
    padding-left: 0 !important;
    border-right: 1px solid rgba(255, 255, 255, 0.28) !important;
    justify-content: flex-start !important;
    text-align: left !important;
  }
  }

  @media (max-width: 767.98px) {
  html body.path-taxonomy #wrapper .header .header-info .header-info-hours,
  html body.path-taxonomy #wrapper .header .header-info .header-info-item--hours,
  html body.path-products #wrapper .header .header-info .header-info-hours,
  html body.path-products #wrapper .header .header-info .header-info-item--hours,
  html body.path-product #wrapper .header .header-info .header-info-hours,
  html body.path-product #wrapper .header .header-info .header-info-item--hours,
  html body.path-store #wrapper .header .header-info .header-info-hours,
  html body.path-store #wrapper .header .header-info .header-info-item--hours {
    padding-left: 0.65rem !important;
    padding-right: 0 !important;
    border-right: 0 !important;
    justify-content: flex-end !important;
    text-align: right !important;
  }
  }

  @media (max-width: 767.98px) {
  html body.path-taxonomy #wrapper .header .header-right-wrap,
  html body.path-products #wrapper .header .header-right-wrap,
  html body.path-product #wrapper .header .header-right-wrap,
  html body.path-store #wrapper .header .header-right-wrap {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    box-sizing: border-box !important;
  }
  }

  /*
   * Open hamburger: escape the 1rem container pad so pills match homepage
   * (~366 @ 390). Prefer calc breakout over 100vw+transform (parent overflow).
   */
  @media (max-width: 767.98px) {
  html body.path-taxonomy #wrapper #main-menu.show,
  html body.path-taxonomy #wrapper #main-menu.collapse.show,
  html body.path-taxonomy #wrapper .header #main-menu.show,
  html body.path-products #wrapper #main-menu.show,
  html body.path-products #wrapper #main-menu.collapse.show,
  html body.path-products #wrapper .header #main-menu.show,
  html body.path-product #wrapper #main-menu.show,
  html body.path-product #wrapper #main-menu.collapse.show,
  html body.path-product #wrapper .header #main-menu.show,
  html body.path-store #wrapper #main-menu.show,
  html body.path-store #wrapper .header #main-menu.show {
    width: calc(100% + 2rem) !important; /* container pad 1rem * 2 */
    max-width: none !important;
    min-width: calc(100% + 2rem) !important;
    position: relative !important;
    left: auto !important;
    right: auto !important;
    transform: none !important;
    margin-left: -1rem !important;
    margin-right: -1rem !important;
    padding-left: 0.75rem !important;
    padding-right: 0.75rem !important;
    box-sizing: border-box !important;
  }
  }

  /* Allow menu to paint outside padded container */
  @media (max-width: 767.98px) {
  html body.path-taxonomy #wrapper .header .navbar > .container,
  html body.path-products #wrapper .header .navbar > .container,
  html body.path-product #wrapper .header .navbar > .container,
  html body.path-store #wrapper .header .navbar > .container,
  html body.path-taxonomy #wrapper .header .navbar,
  html body.path-products #wrapper .header .navbar,
  html body.path-product #wrapper .header .navbar,
  html body.path-store #wrapper .header .navbar,
  html body.path-taxonomy #wrapper .header,
  html body.path-products #wrapper .header,
  html body.path-product #wrapper .header,
  html body.path-store #wrapper .header {
    overflow: visible !important;
  }
  }

  @media (max-width: 767.98px) {
  html body.path-taxonomy #wrapper #main-menu.show li.menu-item,
  html body.path-taxonomy #wrapper #main-menu.show .menu-item,
  html body.path-products #wrapper #main-menu.show li.menu-item,
  html body.path-products #wrapper #main-menu.show .menu-item,
  html body.path-product #wrapper #main-menu.show li.menu-item,
  html body.path-product #wrapper #main-menu.show .menu-item,
  html body.path-store #wrapper #main-menu.show li.menu-item {
    width: 100% !important;
    max-width: 100% !important;
  }
  }

  @media (max-width: 767.98px) {
  html body.path-taxonomy #wrapper #main-menu.show a,
  html body.path-taxonomy #wrapper #main-menu.show .menu-item a,
  html body.path-products #wrapper #main-menu.show a,
  html body.path-products #wrapper #main-menu.show .menu-item a,
  html body.path-product #wrapper #main-menu.show a,
  html body.path-product #wrapper #main-menu.show .menu-item a,
  html body.path-store #wrapper #main-menu.show a,
  html body.path-store #wrapper #main-menu.show .menu-item a {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
  }
}

/* Desktop / tablet: keep header-info centered rail like homepage */
@media (min-width: 992px) {
  html body.path-taxonomy #wrapper .header .header-info,
  html body.path-products #wrapper .header .header-info,
  html body.path-product #wrapper .header .header-info,
  html body.path-store #wrapper .header .header-info {
    width: 100% !important;
    max-width: 520px !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  html body.path-taxonomy #wrapper .header .header-info .header-info-container,
  html body.path-products #wrapper .header .header-info .header-info-container,
  html body.path-product #wrapper .header .header-info .header-info-container,
  html body.path-store #wrapper .header .header-info .header-info-container {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    width: 100% !important;
    max-width: 100% !important;
    gap: 0 !important;
  }

  html body.path-taxonomy #wrapper .header .header-info .header-info-location,
  html body.path-taxonomy #wrapper .header .header-info .header-info-item--location,
  html body.path-products #wrapper .header .header-info .header-info-location,
  html body.path-products #wrapper .header .header-info .header-info-item--location,
  html body.path-product #wrapper .header .header-info .header-info-location,
  html body.path-product #wrapper .header .header-info .header-info-item--location,
  html body.path-store #wrapper .header .header-info .header-info-location {
    margin: 0 !important;
    padding-right: 1.5rem !important;
    padding-left: 0.25rem !important;
    border-right: 1px solid rgba(255, 255, 255, 0.28) !important;
    justify-content: flex-end !important;
  }

  html body.path-taxonomy #wrapper .header .header-info .header-info-hours,
  html body.path-taxonomy #wrapper .header .header-info .header-info-item--hours,
  html body.path-products #wrapper .header .header-info .header-info-hours,
  html body.path-products #wrapper .header .header-info .header-info-item--hours,
  html body.path-product #wrapper .header .header-info .header-info-hours,
  html body.path-product #wrapper .header .header-info .header-info-item--hours,
  html body.path-store #wrapper .header .header-info .header-info-hours {
    margin: 0 !important;
    padding-left: 1.5rem !important;
    padding-right: 0.25rem !important;
    border-right: 0 !important;
    justify-content: flex-start !important;
  }
}
/* END storefront-mobile-menu-width-v2 */

/* ==========================================================================
   blog-h1-green-badge-v1 — 2026-08-01
   All blog H1s: Johnny Detail purple badge aesthetic (front/city title pattern).
   - Full post page title (.post-title h1)
   - /blog listing title block (#block-martis-blogh1title)
   - Any stray h1 in post body
   Beats global h1 { color:#fff } and theme custom_css.
   ========================================================================== */

/* ---- Full blog post page H1 ---- */
html body.page-node-type-blog #wrapper .blog-post-full .post-header,
html body.page-node-type-blog #wrapper header.post-header {
  text-align: center !important;
  margin: 0.5rem 0 1.15rem !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

html body.page-node-type-blog #wrapper .blog-post-full h1.post-title,
html body.page-node-type-blog #wrapper .blog-post-full .post-header h1.post-title,
html body.page-node-type-blog #wrapper header.post-header h1.post-title,
html body.page-node-type-blog #wrapper h1.post-title,
html body.page-node-type-blog #wrapper .post-header .post-title {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0.65rem auto 1rem !important;
  padding: 0.85rem 1.2rem !important;
  background-color: #b781e3 !important;
  background: linear-gradient(135deg, #b781e3 0%, #7b2cbf 55%, #6716aa 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border: 2px solid #000000 !important;
  border-radius: 8px !important;
  text-align: center !important;
  font-size: clamp(1.25rem, 2.8vw, 1.75rem) !important;
  font-weight: 800 !important;
  line-height: 1.3 !important;
  letter-spacing: 0.01em !important;
  text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000 !important;
  word-wrap: break-word !important;
  overflow-wrap: anywhere !important;
  hyphens: auto !important;
  box-shadow: 0 3px 12px rgba(59, 10, 92, 0.22) !important;
  position: relative !important;
  z-index: 2 !important;
}

/* Title text often wrapped in <span> by theme / custom CSS */
html body.page-node-type-blog #wrapper .blog-post-full h1.post-title span,
html body.page-node-type-blog #wrapper .post-header h1.post-title span,
html body.page-node-type-blog #wrapper h1.post-title span,
html body.page-node-type-blog #wrapper .post-header .post-title span,
html body.page-node-type-blog #wrapper h1.post-title *,
html body.page-node-type-blog #wrapper .post-header .post-title * {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  background: transparent !important;
  background-color: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  text-shadow: inherit !important;
  font-weight: inherit !important;
}

/* Meta under H1: keep green chips readable on light page */
html body.page-node-type-blog #wrapper .post-header .post-meta {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  gap: 0.45rem 0.55rem !important;
  margin: 0.35rem auto 0.75rem !important;
}

/* ---- Listing page H1 (/blog) — same badge language as front/city titles ---- */
html body.path-blog.page-blog #wrapper #block-martis-blogh1title,
html body.path-blog.page-blog #wrapper #block-martis-blogh1title .container-wrap,
html body.path-blog.page-blog #wrapper #block-martis-blogh1title .block-content {
  text-align: center !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding-left: 0.75rem !important;
  padding-right: 0.75rem !important;
}

html body.path-blog.page-blog #wrapper #block-martis-blogh1title .field-item,
html body.path-blog.page-blog #wrapper #block-martis-blogh1title .field-body {
  display: block !important;
  position: relative !important;
  margin: 0.5rem auto 1rem !important;
  padding: 0 !important;
  max-width: min(920px, 100%) !important;
  background: transparent !important;
  border: 0 !important;
}

/* Kill soft mint + dual underline from earlier listing palette; solid badge wins */
html body.path-blog.page-blog #wrapper #block-martis-blogh1title .field-item::after,
html body.path-blog.page-blog #wrapper #block-martis-blogh1title .field-body::after {
  content: none !important;
  display: none !important;
  background: none !important;
  border: 0 !important;
  height: 0 !important;
  width: 0 !important;
}

html body.path-blog.page-blog #wrapper #block-martis-blogh1title h1,
html body.path-blog #wrapper #block-martis-blogh1title h1,
html body.page-blog #wrapper #block-martis-blogh1title h1 {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0.65rem auto 0.85rem !important;
  padding: 0.85rem 1.2rem !important;
  background-color: #b781e3 !important;
  background: linear-gradient(135deg, #b781e3 0%, #7b2cbf 55%, #6716aa 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border: 2px solid #000000 !important;
  border-radius: 8px !important;
  text-align: center !important;
  font-size: clamp(1.2rem, 2.6vw, 1.65rem) !important;
  font-weight: 800 !important;
  line-height: 1.3 !important;
  letter-spacing: 0.01em !important;
  text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000 !important;
  word-wrap: break-word !important;
  overflow-wrap: anywhere !important;
  hyphens: auto !important;
  box-shadow: 0 3px 12px rgba(59, 10, 92, 0.22) !important;
  position: relative !important;
  z-index: 2 !important;
}

html body.path-blog.page-blog #wrapper #block-martis-blogh1title h1 span,
html body.path-blog.page-blog #wrapper #block-martis-blogh1title h1 * {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* ---- In-body h1 (rare; align with section heading chips) ---- */
html body.page-node-type-blog #wrapper .post-body h1,
html body.page-node-type-blog #wrapper .region.region-content .post-body h1,
html body.page-node-type-blog #wrapper .region.region-content .field-body h1,
html body.page-node-type-blog #wrapper .field-body h1 {
  display: inline-block !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  margin: 1.5rem 0 0.9rem !important;
  padding: 0.6rem 1.1rem !important;
  background: linear-gradient(135deg, #3b0a5c 0%, #6716aa 55%, #7b2cbf 100%) !important;
  background-color: #3b0a5c !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border: 2px solid #000000 !important;
  border-radius: 8px !important;
  font-weight: 800 !important;
  font-size: clamp(1.15rem, 2.4vw, 1.4rem) !important;
  line-height: 1.35 !important;
  text-shadow: none !important;
  box-shadow: 0 3px 10px rgba(59, 10, 92, 0.22) !important;
}

html body.page-node-type-blog #wrapper .post-body h1 *,
html body.page-node-type-blog #wrapper .field-body h1 * {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  background: transparent !important;
}

/* ---- Mobile: tighter type / padding, keep badge readable ---- */
@media (max-width: 991.98px) {
  html body.page-node-type-blog #wrapper .blog-post-full h1.post-title,
  html body.page-node-type-blog #wrapper .post-header h1.post-title,
  html body.page-node-type-blog #wrapper h1.post-title,
  html body.page-node-type-blog #wrapper .post-header .post-title {
    font-size: clamp(1.1rem, 4.2vw, 1.4rem) !important;
    padding: 0.75rem 0.95rem !important;
    margin: 0.5rem auto 0.85rem !important;
    border-radius: 7px !important;
  }

  html body.path-blog.page-blog #wrapper #block-martis-blogh1title h1,
  html body.path-blog #wrapper #block-martis-blogh1title h1 {
    font-size: clamp(1.05rem, 4vw, 1.3rem) !important;
    padding: 0.7rem 0.9rem !important;
    margin: 0.45rem auto 0.75rem !important;
    border-radius: 7px !important;
  }

  html body.path-blog.page-blog #wrapper #block-martis-blogh1title {
    padding-left: 0.5rem !important;
    padding-right: 0.5rem !important;
  }
}

@media (max-width: 575.98px) {
  html body.page-node-type-blog #wrapper .blog-post-full h1.post-title,
  html body.page-node-type-blog #wrapper .post-header h1.post-title,
  html body.page-node-type-blog #wrapper h1.post-title {
    font-size: 1.1rem !important;
    padding: 0.65rem 0.8rem !important;
    line-height: 1.35 !important;
  }

  html body.path-blog.page-blog #wrapper #block-martis-blogh1title h1 {
    font-size: 1.05rem !important;
    padding: 0.6rem 0.75rem !important;
  }
}

/* END blog-h1-green-badge-v1 */

/* ==========================================================================
   product-category-active-green-v1 — 2026-08-01
   Active product categories: green mint theme only (no gold).
   Align /products + taxonomy listings with product-node active chips.
   ========================================================================== */

/* Active child chips — listing / category / store / product */


/* Active parent link underline — green, not gold */


/* Active-ancestor parent card rail — green */




/* Hover underline on parent titles — green */


/* END product-category-active-green-v1 */

/* ==========================================================================
   browse-by-brand-logo-parity-v1 — 2026-08-01
   Product nodes, taxonomy (category + brand), store: match /products/
   Browse by Brand logo frames + img object-fit on desktop and mobile.
   Nested media markup: .field-content > div > .field > .field-item > img
   ========================================================================== */

/* Shared scopes: listing + PDP + taxonomy brand/category + store */


/* Outer + nested wrappers shrink-wrap the white plate (not full card width) */


/* White logo plate — desktop matches /products/ (130×130) */


/* Hide media field label if it ever unhides */


/* The img itself — contain inside white plate (kill 480×479 intrinsic blowout) */


/* Mobile / tablet — match /products/ 96×96 plate + tighter pad */
@media (max-width: 991.98px) {
  

  

  
}

/* END browse-by-brand-logo-parity-v1 */

/* ==========================================================================
   blog-full-post-meta-v1 — 2026-08-01
   Full blog article meta row (date / author / category / comments)
   Green-themed chips under the H1, readable on desktop + mobile.
   ========================================================================== */

/* Meta row under H1 */
html body.page-node-type-blog #wrapper .blog-post-full .post-header .post-meta,
html body.page-node-type-blog #wrapper header.post-header .post-meta,
html body.page-node-type-blog #wrapper .post-header .post-meta,
html body.page-node-type-blog #wrapper .blog-post-full .post-meta {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 0.45rem 0.55rem !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0.15rem auto 1.1rem !important;
  padding: 0.55rem 0.65rem !important;
  box-sizing: border-box !important;
  background: #f5f0fa !important;
  background-image: none !important;
  border: 1px solid #e9d5ff !important;
  border-radius: 12px !important;
  box-shadow: 0 2px 8px rgba(59, 10, 92, 0.06) !important;
  text-align: center !important;
}

/* Individual chips */
html body.page-node-type-blog #wrapper .blog-post-full .post-meta .post-meta-item,
html body.page-node-type-blog #wrapper header.post-header .post-meta .post-meta-item,
html body.page-node-type-blog #wrapper .post-header .post-meta .post-meta-item,
html body.page-node-type-blog #wrapper .blog-post-full .post-meta-item {
  display: inline-flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.35rem !important;
  margin: 0 !important;
  padding: 0.4rem 0.75rem !important;
  background: #ffffff !important;
  background-color: #ffffff !important;
  background-image: none !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  border: 1.5px solid #6716aa !important;
  border-radius: 999px !important;
  box-shadow: 0 1px 0 rgba(59, 10, 92, 0.05) !important;
  font-size: 0.88rem !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  letter-spacing: 0.01em !important;
  white-space: nowrap !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  float: none !important;
  text-align: left !important;
}

/* Icons */
html body.page-node-type-blog #wrapper .blog-post-full .post-meta .post-meta-item i,
html body.page-node-type-blog #wrapper .post-header .post-meta .post-meta-item i,
html body.page-node-type-blog #wrapper .blog-post-full .post-meta-item i {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 auto !important;
  color: #6716aa !important;
  -webkit-text-fill-color: #6716aa !important;
  font-size: 0.95rem !important;
  line-height: 1 !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  text-shadow: none !important;
  opacity: 1 !important;
}

/* Text / links / nested fields inside chips */
html body.page-node-type-blog #wrapper .blog-post-full .post-meta .post-meta-item,
html body.page-node-type-blog #wrapper .blog-post-full .post-meta .post-meta-item a,
html body.page-node-type-blog #wrapper .blog-post-full .post-meta .post-meta-item span,
html body.page-node-type-blog #wrapper .post-header .post-meta .post-meta-item a,
html body.page-node-type-blog #wrapper .post-header .post-meta .post-meta-item span {
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  text-shadow: none !important;
  text-decoration: none !important;
}

html body.page-node-type-blog #wrapper .blog-post-full .post-meta .post-meta-item a:hover,
html body.page-node-type-blog #wrapper .blog-post-full .post-meta .post-meta-item a:focus-visible,
html body.page-node-type-blog #wrapper .post-header .post-meta .post-meta-item a:hover {
  color: #6716aa !important;
  -webkit-text-fill-color: #6716aa !important;
  text-decoration: underline !important;
  text-underline-offset: 0.12em !important;
}

/* Category field nesting (kill label + block layout) */
html body.page-node-type-blog #wrapper .blog-post-full .post-meta .post-meta-item .field,
html body.page-node-type-blog #wrapper .blog-post-full .post-meta .post-meta-item .field-item,
html body.page-node-type-blog #wrapper .post-header .post-meta .post-meta-item .field,
html body.page-node-type-blog #wrapper .post-header .post-meta .post-meta-item .field-item {
  display: inline !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  width: auto !important;
  max-width: 100% !important;
  color: inherit !important;
  -webkit-text-fill-color: inherit !important;
}

html body.page-node-type-blog #wrapper .blog-post-full .post-meta .post-meta-item .field-label,
html body.page-node-type-blog #wrapper .post-header .post-meta .post-meta-item .field-label {
  display: none !important;
}

/* Soft hover lift on chips */
html body.page-node-type-blog #wrapper .blog-post-full .post-meta .post-meta-item:hover,
html body.page-node-type-blog #wrapper .post-header .post-meta .post-meta-item:hover {
  background: #f3e8ff !important;
  border-color: #3b0a5c !important;
  box-shadow: 0 2px 6px rgba(59, 10, 92, 0.1) !important;
}

/* Mobile: allow wrap, slightly smaller chips */
@media (max-width: 575.98px) {
  html body.page-node-type-blog #wrapper .blog-post-full .post-header .post-meta,
  html body.page-node-type-blog #wrapper header.post-header .post-meta,
  html body.page-node-type-blog #wrapper .blog-post-full .post-meta {
    gap: 0.4rem !important;
    padding: 0.5rem 0.5rem !important;
    margin-bottom: 0.95rem !important;
  }

  html body.page-node-type-blog #wrapper .blog-post-full .post-meta .post-meta-item,
  html body.page-node-type-blog #wrapper .post-header .post-meta .post-meta-item {
    font-size: 0.78rem !important;
    padding: 0.35rem 0.6rem !important;
    white-space: normal !important;
    max-width: 100% !important;
  }

  html body.page-node-type-blog #wrapper .blog-post-full .post-meta .post-meta-item i {
    font-size: 0.88rem !important;
  }
}

/* END blog-full-post-meta-v1 */

/* ==========================================================================
   pdp-content-experience-v1 — 2026-08-01
   All product-node content: green system, scannable body, interactive sections,
   polished buy column + tabs + reviews. Desktop + mobile.
   ========================================================================== */

/* ---- Shell ---- */
html body.path-product #wrapper .product-post.pdp-content,
html body.path-product #wrapper .product-post {
  --pdp-forest: #3b0a5c;
  --pdp-brand: #6716aa;
  --pdp-mid: #7b2cbf;
  --pdp-leaf: #b781e3;
  --pdp-mint: #f3e8ff;
  --pdp-mist: #f5f0fa;
  --pdp-ink: #1a0a24;
  --pdp-body: #1f2937;
  --pdp-muted: #4b5563;
}

/* ---- Stock / price row ---- */
html body.path-product #wrapper .product-post .product-stock {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 0.45rem 0.65rem !important;
  margin: 0.65rem 0 0.85rem !important;
  padding: 0.65rem 0.75rem !important;
  background: var(--pdp-mist) !important;
  border: 1px solid #e9d5ff !important;
  border-radius: 12px !important;
  box-sizing: border-box !important;
}

html body.path-product #wrapper .product-post .product-stock .field-label,
html body.path-product #wrapper .product-post .product-stock .stock-availability {
  color: var(--pdp-muted) !important;
  -webkit-text-fill-color: var(--pdp-muted) !important;
  font-weight: 700 !important;
  font-size: 0.85rem !important;
  margin: 0 !important;
}

html body.path-product #wrapper .product-post .product-stock .available-stock {
  display: inline-flex !important;
  align-items: center !important;
  padding: 0.28rem 0.65rem !important;
  background: #ffffff !important;
  color: var(--pdp-brand) !important;
  -webkit-text-fill-color: var(--pdp-brand) !important;
  border: 1.5px solid var(--pdp-brand) !important;
  border-radius: 999px !important;
  font-weight: 800 !important;
  font-size: 0.82rem !important;
}

html body.path-product #wrapper .product-post .product-stock .out-of-stock {
  display: none !important;
}

html body.path-product #wrapper .product-post .product-stock .product-price {
  color: var(--pdp-forest) !important;
  -webkit-text-fill-color: var(--pdp-forest) !important;
  font-weight: 800 !important;
  font-size: 1.15rem !important;
  margin-left: auto !important;
}

html body.path-product #wrapper .product-post .product-stock .product-old-price {
  color: #6b7280 !important;
  -webkit-text-fill-color: #6b7280 !important;
  font-weight: 600 !important;
  text-decoration: line-through !important;
}

/* ---- Ratings ---- */
html body.path-product #wrapper .product-post .product-ratings {
  margin: 0.35rem 0 0.5rem !important;
  color: var(--pdp-mid) !important;
}

/* ---- Meta chips (SKU / brand / category) ---- */
html body.path-product #wrapper .product-post .product-content-wrap > .product-meta {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 0.4rem 0.5rem !important;
  margin: 0.35rem 0 0.85rem !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}

html body.path-product #wrapper .product-post .product-meta-item {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.3rem !important;
  margin: 0 !important;
  padding: 0.35rem 0.7rem !important;
  background: #ffffff !important;
  border: 1.5px solid var(--pdp-brand) !important;
  border-radius: 999px !important;
  color: var(--pdp-ink) !important;
  -webkit-text-fill-color: var(--pdp-ink) !important;
  font-size: 0.82rem !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  box-shadow: 0 1px 0 rgba(59, 10, 92, 0.05) !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

html body.path-product #wrapper .product-post .product-meta-item a {
  color: var(--pdp-brand) !important;
  -webkit-text-fill-color: var(--pdp-brand) !important;
  text-decoration: none !important;
  font-weight: 800 !important;
}

html body.path-product #wrapper .product-post .product-meta-item a:hover,
html body.path-product #wrapper .product-post .product-meta-item a:focus-visible {
  color: var(--pdp-forest) !important;
  -webkit-text-fill-color: var(--pdp-forest) !important;
  text-decoration: underline !important;
}

html body.path-product #wrapper .product-post .product-meta-item .field,
html body.path-product #wrapper .product-post .product-meta-item .field-item,
html body.path-product #wrapper .product-post .product-meta-item .field-label {
  display: inline !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  color: inherit !important;
}

html body.path-product #wrapper .product-post .product-meta-item .field-label {
  display: none !important;
}

html body.path-product #wrapper .product-post .product-meta-item:hover {
  background: var(--pdp-mint) !important;
}

/* ---- Variation + ATC ---- */
html body.path-product #wrapper .product-post .product-variation-wrap {
  margin: 0.75rem 0 1rem !important;
  padding: 0.85rem !important;
  background: var(--pdp-mist) !important;
  border: 1px solid #e9d5ff !important;
  border-radius: 12px !important;
  box-sizing: border-box !important;
}

html body.path-product #wrapper .product-post .product-variation-selector label {
  display: block !important;
  margin-bottom: 0.35rem !important;
  color: var(--pdp-forest) !important;
  -webkit-text-fill-color: var(--pdp-forest) !important;
  font-weight: 800 !important;
  font-size: 0.9rem !important;
}

html body.path-product #wrapper .product-post .product-variation-selector select,
html body.path-product #wrapper .product-post .product-add-cart select,
html body.path-product #wrapper .product-post .product-add-cart input[type="number"] {
  width: 100% !important;
  max-width: 100% !important;
  border: 2px solid var(--pdp-brand) !important;
  border-radius: 8px !important;
  padding: 0.55rem 0.75rem !important;
  background: #ffffff !important;
  color: var(--pdp-ink) !important;
  -webkit-text-fill-color: var(--pdp-ink) !important;
  font-weight: 600 !important;
  box-sizing: border-box !important;
}

html body.path-product #wrapper .product-post .product-variation-selector select:focus,
html body.path-product #wrapper .product-post .product-add-cart select:focus,
html body.path-product #wrapper .product-post .product-add-cart input:focus {
  outline: 3px solid #c9a0e8 !important;
  outline-offset: 1px !important;
}

html body.path-product #wrapper .product-post .product-add-cart .button--add-to-cart,
html body.path-product #wrapper .product-post .product-add-cart .button--primary,
html body.path-product #wrapper .product-post .product-add-cart input.form-submit,
html body.path-product #wrapper .product-post .product-add-cart button[type="submit"] {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  max-width: 100% !important;
  margin-top: 0.65rem !important;
  padding: 0.75rem 1.15rem !important;
  min-height: 2.75rem !important;
  background: linear-gradient(135deg, var(--pdp-mid) 0%, var(--pdp-brand) 55%, var(--pdp-forest) 100%) !important;
  background-color: var(--pdp-brand) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border: 2px solid #000 !important;
  border-radius: 10px !important;
  font-weight: 800 !important;
  font-size: 1rem !important;
  letter-spacing: 0.02em !important;
  box-shadow: 0 3px 10px rgba(59, 10, 92, 0.22) !important;
  cursor: pointer !important;
  transition: transform 0.15s ease, box-shadow 0.15s ease !important;
}

html body.path-product #wrapper .product-post .product-add-cart .button--add-to-cart:hover,
html body.path-product #wrapper .product-post .product-add-cart .button--primary:hover,
html body.path-product #wrapper .product-post .product-add-cart input.form-submit:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 5px 14px rgba(59, 10, 92, 0.28) !important;
}

/* ---- Wishlist / compare icons ---- */
html body.path-product #wrapper .product-post .product-icon-wrap {
  flex-wrap: wrap !important;
  gap: 0.5rem !important;
  margin: 0.5rem 0 0.75rem !important;
}

html body.path-product #wrapper .product-post .product-icon {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 2.75rem !important;
  min-height: 2.75rem !important;
  padding: 0.4rem 0.65rem !important;
  background: #ffffff !important;
  border: 2px solid var(--pdp-brand) !important;
  border-radius: 10px !important;
  color: var(--pdp-brand) !important;
  box-sizing: border-box !important;
  transition: background 0.15s ease, color 0.15s ease !important;
}

html body.path-product #wrapper .product-post .product-icon:hover {
  background: var(--pdp-mint) !important;
}

html body.path-product #wrapper .product-post .product-icon a {
  color: var(--pdp-brand) !important;
  -webkit-text-fill-color: var(--pdp-brand) !important;
  text-decoration: none !important;
}

/* ---- Tabs chrome ---- */
html body.path-product #wrapper .product-post .product-info {
  margin-top: 1.75rem !important;
  padding: 0 !important;
  max-width: 100% !important;
}

html body.path-product #wrapper .product-post .product-info > .nav.nav-tabs,
html body.path-product #wrapper .product-post .pdp-tabs {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 0.45rem !important;
  margin: 0 0 0.85rem !important;
  padding: 0.35rem !important;
  list-style: none !important;
  border: 0 !important;
  border-bottom: 0 !important;
  background: var(--pdp-mist) !important;
  border-radius: 12px !important;
  box-sizing: border-box !important;
  z-index: 20 !important;
  box-shadow: 0 2px 10px rgba(59, 10, 92, 0.08) !important;
}

html body.path-product #wrapper .product-post .product-info > .nav.nav-tabs > li,
html body.path-product #wrapper .product-post .pdp-tabs > li {
  margin: 0 !important;
  float: none !important;
  flex: 1 1 auto !important;
  min-width: 7rem !important;
}

html body.path-product #wrapper .product-post .product-info > .nav.nav-tabs > li > a,
html body.path-product #wrapper .product-post .pdp-tabs > li > a {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0.65rem 1rem !important;
  min-height: 2.75rem !important;
  background: #ffffff !important;
  color: var(--pdp-forest) !important;
  -webkit-text-fill-color: var(--pdp-forest) !important;
  border: 2px solid #e9d5ff !important;
  border-radius: 10px !important;
  font-weight: 800 !important;
  font-size: 0.95rem !important;
  text-decoration: none !important;
  text-align: center !important;
  box-sizing: border-box !important;
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease !important;
}

html body.path-product #wrapper .product-post .product-info > .nav.nav-tabs > li.active > a,
html body.path-product #wrapper .product-post .product-info > .nav.nav-tabs > li > a.active,
html body.path-product #wrapper .product-post .pdp-tabs > li.active > a {
  background: linear-gradient(135deg, var(--pdp-mid) 0%, var(--pdp-brand) 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border-color: #000 !important;
  box-shadow: 0 2px 8px rgba(59, 10, 92, 0.2) !important;
}

html body.path-product #wrapper .product-post .product-info .tab-content {
  background: #ffffff !important;
  border: 1px solid #e9d5ff !important;
  border-radius: 14px !important;
  padding: 1rem 1.1rem 1.25rem !important;
  box-shadow: 0 3px 12px rgba(59, 10, 92, 0.06) !important;
  box-sizing: border-box !important;
}

/* Jump chips (built by JS) */
html body.path-product #wrapper .product-post .pdp-jump-nav {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 0.4rem !important;
  margin: 0 0 1rem !important;
  padding: 0 !important;
  list-style: none !important;
}

html body.path-product #wrapper .product-post .pdp-jump-nav a {
  display: inline-flex !important;
  align-items: center !important;
  padding: 0.35rem 0.75rem !important;
  min-height: 2.25rem !important;
  background: var(--pdp-mint) !important;
  color: var(--pdp-forest) !important;
  -webkit-text-fill-color: var(--pdp-forest) !important;
  border: 1.5px solid var(--pdp-brand) !important;
  border-radius: 999px !important;
  font-size: 0.8rem !important;
  font-weight: 800 !important;
  text-decoration: none !important;
}

html body.path-product #wrapper .product-post .pdp-jump-nav a:hover,
html body.path-product #wrapper .product-post .pdp-jump-nav a:focus-visible {
  background: var(--pdp-brand) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

/* ---- Description panel title ---- */
html body.path-product #wrapper .product-post #product-detail .product-tab-item > h2,
html body.path-product #wrapper .product-post .product-tab-item > h2.margin-bottom-20 {
  display: inline-block !important;
  max-width: 100% !important;
  margin: 0 0 1rem !important;
  padding: 0.55rem 1.05rem !important;
  background: linear-gradient(135deg, var(--pdp-forest) 0%, var(--pdp-brand) 55%, var(--pdp-mid) 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border: 2px solid #000 !important;
  border-radius: 8px !important;
  font-size: clamp(1.05rem, 2.2vw, 1.28rem) !important;
  font-weight: 800 !important;
  line-height: 1.3 !important;
  box-shadow: 0 3px 10px rgba(59, 10, 92, 0.22) !important;
  box-sizing: border-box !important;
}

/* ---- Body sections (preprocess or JS-wrapped) ---- */
html body.path-product #wrapper .product-post .pdp-section {
  margin: 0 0 1rem !important;
  padding: 0 !important;
  border: 1px solid #e9d5ff !important;
  border-radius: 12px !important;
  background: var(--pdp-mist) !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}

html body.path-product #wrapper .product-post .pdp-section__toggle {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 0.75rem !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0.75rem 1rem !important;
  background: linear-gradient(135deg, #6716aa 0%, #3b0a5c 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(0, 0, 0, 0.12) !important;
  font-weight: 800 !important;
  font-size: 1rem !important;
  text-align: left !important;
  cursor: pointer !important;
  min-height: 2.85rem !important;
  box-sizing: border-box !important;
}

html body.path-product #wrapper .product-post .pdp-section__toggle::after {
  content: "▾" !important;
  flex: 0 0 auto !important;
  font-size: 1rem !important;
  transition: transform 0.2s ease !important;
}

html body.path-product #wrapper .product-post .pdp-section.is-collapsed .pdp-section__toggle::after {
  transform: rotate(-90deg) !important;
}

html body.path-product #wrapper .product-post .pdp-section__body {
  padding: 0.85rem 1rem 1rem !important;
  box-sizing: border-box !important;
}

html body.path-product #wrapper .product-post .pdp-section.is-collapsed .pdp-section__body {
  display: none !important;
}

/* Overview / generic paragraphs in description */
html body.path-product #wrapper .product-post #product-detail .product-tab-item p,
html body.path-product #wrapper .product-post .product-tab-item .pdp-section__body > p,
html body.path-product #wrapper .product-post #product-detail .field--name-body > p {
  background: #f3e8ff !important;
  color: var(--pdp-body) !important;
  -webkit-text-fill-color: var(--pdp-body) !important;
  border-top: 1px solid #e9d5ff !important;
  border-right: 1px solid #e9d5ff !important;
  border-bottom: 1px solid #e9d5ff !important;
  border-left: 5px solid var(--pdp-leaf) !important;
  border-radius: 8px !important;
  padding: 0.85rem 1.05rem !important;
  margin: 0 0 0.85rem !important;
  line-height: 1.7 !important;
  font-size: 1.02rem !important;
  box-shadow: 0 1px 0 rgba(59, 10, 92, 0.04) !important;
  box-sizing: border-box !important;
}

/* Best-for callout */
html body.path-product #wrapper .product-post #product-detail .product-tab-item p:has(strong:first-child),
html body.path-product #wrapper .product-post .pdp-section--best-for p {
  background: linear-gradient(180deg, #f8f4fb 0%, #faf5ff 100%) !important;
  border-left-width: 5px !important;
  font-weight: 500 !important;
}

/* h3 inside body (when not using section toggles as sole heading) */
html body.path-product #wrapper .product-post #product-detail .product-tab-item h3,
html body.path-product #wrapper .product-post .product-tab-item .pdp-section__body h3 {
  display: inline-block !important;
  max-width: 100% !important;
  margin: 0.35rem 0 0.75rem !important;
  padding: 0.45rem 0.9rem !important;
  background: var(--pdp-mid) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border: 2px solid #000 !important;
  border-radius: 7px !important;
  font-size: 1.05rem !important;
  font-weight: 800 !important;
  line-height: 1.3 !important;
  box-sizing: border-box !important;
}

/* Feature + specs lists (keep check chips, refine hover) */
html body.path-product #wrapper .product-post #product-detail .product-tab-item ul,
html body.path-product #wrapper .product-post .pdp-section__body ul {
  list-style: none !important;
  padding: 0 !important;
  margin: 0.5rem 0 0.85rem !important;
}

html body.path-product #wrapper .product-post #product-detail .product-tab-item ul li,
html body.path-product #wrapper .product-post .pdp-section__body ul li {
  position: relative !important;
  color: #374151 !important;
  -webkit-text-fill-color: #374151 !important;
  background: linear-gradient(180deg, #f6f4fb 0%, #fff 100%) !important;
  border: 1px solid rgba(123, 44, 191, 0.14) !important;
  border-radius: 12px !important;
  padding: 0.85rem 1rem 0.85rem 3.1rem !important;
  margin-bottom: 0.55rem !important;
  font-weight: 500 !important;
  line-height: 1.5 !important;
  box-sizing: border-box !important;
  max-width: 100% !important;
  transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease !important;
}

html body.path-product #wrapper .product-post #product-detail .product-tab-item ul li:hover,
html body.path-product #wrapper .product-post .pdp-section__body ul li:hover {
  transform: translateY(-1px) !important;
  border-color: var(--pdp-brand) !important;
  box-shadow: 0 3px 10px rgba(59, 10, 92, 0.1) !important;
}

html body.path-product #wrapper .product-post #product-detail .product-tab-item ul li::before,
html body.path-product #wrapper .product-post .pdp-section__body ul li::before {
  content: "✓" !important;
  position: absolute !important;
  left: 0.85rem !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 1.55rem !important;
  height: 1.55rem !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  font-size: 0.72rem !important;
  font-weight: 700 !important;
  background: linear-gradient(135deg, #6716aa, #7b2cbf) !important;
}

/* Specs section denser cards */
html body.path-product #wrapper .product-post .pdp-section--specs ul li {
  border-left: 4px solid var(--pdp-brand) !important;
  font-size: 0.95rem !important;
}

html body.path-product #wrapper .product-post #product-detail .product-tab-item strong,
html body.path-product #wrapper .product-post .pdp-section__body strong {
  color: var(--pdp-forest) !important;
  -webkit-text-fill-color: var(--pdp-forest) !important;
  font-weight: 800 !important;
  background: transparent !important;
}

html body.path-product #wrapper .product-post #product-detail .product-tab-item a,
html body.path-product #wrapper .product-post .pdp-section__body a {
  color: #5b21b6 !important;
  -webkit-text-fill-color: #5b21b6 !important;
  font-weight: 700 !important;
  text-decoration: underline !important;
  text-underline-offset: 0.12em !important;
}

/* Phone CTA emphasis */
html body.path-product #wrapper .product-post #product-detail .product-tab-item a[href^="tel:"],
html body.path-product #wrapper .product-post .pdp-section__body a[href^="tel:"] {
  display: inline-flex !important;
  align-items: center !important;
  padding: 0.25rem 0.65rem !important;
  background: var(--pdp-mint) !important;
  border: 1.5px solid var(--pdp-brand) !important;
  border-radius: 999px !important;
  text-decoration: none !important;
  color: var(--pdp-forest) !important;
  -webkit-text-fill-color: var(--pdp-forest) !important;
}

/* ---- Reviews tab ---- */
html body.path-product #wrapper .product-post #product-review {
  min-height: 8rem !important;
  color: var(--pdp-body) !important;
}

html body.path-product #wrapper .product-post #product-review,
html body.path-product #wrapper .product-post #product-review * {
  color: var(--pdp-body) !important;
  -webkit-text-fill-color: var(--pdp-body) !important;
}

html body.path-product #wrapper .product-post #product-review h2,
html body.path-product #wrapper .product-post #product-review h3,
html body.path-product #wrapper .product-post #product-review h4,
html body.path-product #wrapper .product-post #product-review label {
  color: var(--pdp-forest) !important;
  -webkit-text-fill-color: var(--pdp-forest) !important;
  font-weight: 800 !important;
  background: transparent !important;
}

html body.path-product #wrapper .product-post #product-review .comment-form,
html body.path-product #wrapper .product-post #product-review form.comment-form {
  background: var(--pdp-mist) !important;
  border: 1px solid #e9d5ff !important;
  border-radius: 12px !important;
  padding: 1rem 1.1rem !important;
  margin-top: 0.85rem !important;
  box-shadow: 0 2px 8px rgba(59, 10, 92, 0.06) !important;
}

html body.path-product #wrapper .product-post #product-review .comment-form input[type="text"],
html body.path-product #wrapper .product-post #product-review .comment-form input[type="email"],
html body.path-product #wrapper .product-post #product-review .comment-form textarea {
  width: 100% !important;
  max-width: 100% !important;
  border: 2px solid #e9d5ff !important;
  border-radius: 8px !important;
  padding: 0.55rem 0.75rem !important;
  background: #ffffff !important;
  color: var(--pdp-ink) !important;
  -webkit-text-fill-color: var(--pdp-ink) !important;
  box-sizing: border-box !important;
}

html body.path-product #wrapper .product-post #product-review .comment-form .button,
html body.path-product #wrapper .product-post #product-review .comment-form .form-submit {
  background: linear-gradient(135deg, var(--pdp-mid), var(--pdp-brand)) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border: 2px solid #000 !important;
  border-radius: 8px !important;
  font-weight: 800 !important;
  padding: 0.6rem 1.1rem !important;
  min-height: 2.75rem !important;
}

html body.path-product #wrapper .product-post #product-review .pdp-reviews-empty {
  margin: 0.5rem 0 1rem !important;
  padding: 0.9rem 1.05rem !important;
  background: var(--pdp-mint) !important;
  border: 1px solid #e9d5ff !important;
  border-left: 4px solid var(--pdp-brand) !important;
  border-radius: 10px !important;
  color: var(--pdp-body) !important;
  -webkit-text-fill-color: var(--pdp-body) !important;
  font-weight: 600 !important;
  line-height: 1.55 !important;
}

/* ---- Mobile ---- */
@media (max-width: 991.98px) {
  html body.path-product #wrapper .product-post .product-stock .product-price {
    margin-left: 0 !important;
    width: 100% !important;
  }

  html body.path-product #wrapper .product-post .product-info > .nav.nav-tabs,
  html body.path-product #wrapper .product-post .pdp-tabs {
    top: 0.25rem !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }

  html body.path-product #wrapper .product-post .product-info .tab-content {
    padding: 0.85rem 0.75rem 1rem !important;
  }

  html body.path-product #wrapper .product-post #product-detail .product-tab-item ul li,
  html body.path-product #wrapper .product-post .pdp-section__body ul li {
    padding: 0.75rem 0.85rem 0.75rem 2.85rem !important;
    font-size: 0.95rem !important;
  }

  html body.path-product #wrapper .product-post #product-detail .product-tab-item p {
    font-size: 0.98rem !important;
    padding: 0.75rem 0.9rem !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  html body.path-product #wrapper .product-post .product-add-cart .button--add-to-cart,
  html body.path-product #wrapper .product-post #product-detail .product-tab-item ul li,
  html body.path-product #wrapper .product-post .pdp-section__toggle::after {
    transition: none !important;
  }
}

/* END pdp-content-experience-v1 */

/* ==========================================================================
   product-tax-brand-desc-no-truncate-v1 — 2026-08-01
   Full brand/category description content (no clamp/ellipsis/server trim).
   2026-08-09: Browse by Brand — Cyber-style fixed panel + Y-axis scroll.
   ========================================================================== */



/* Browse by Brand card descriptions — full text in DOM; fixed equal-height
   panel with Y-axis scroll (matches the storefront brand cards). Beats
   theme custom_css line-clamp:3 via late inline CSS + higher specificity. */




/* WebKit scrollbar polish on brand desc Y-scroller (purple) */




@media (max-width: 991.98px) {
  
}

/* END product-tax-brand-desc-no-truncate-v1 */

/* ==========================================================================
   browse-category-no-motion-v1 — 2026-08-01
   Browse by Category parents + children: no lift/slide on hover or active.
   ========================================================================== */





/* Children: lock padding so hover/active never slide text left/right */


/* Active rail via inset shadow so border-width does not reflow layout */


/* END browse-category-no-motion-v1 */

/* ==========================================================================
   pdp-jump-scroll-offset-v1 — 2026-08-01
   Jump chips (Key Features / Specs / Best for) clear sticky Description/Reviews.
   scroll-margin reserves space under sticky tab bar (esp. mobile).
   ========================================================================== */

html body.path-product #wrapper .product-post .pdp-section,
html body.path-product #wrapper .product-post .pdp-section__toggle,
html body.path-product #wrapper .product-post .pdp-section__body,
html body.path-product #wrapper .product-post [id^="pdp-section-"] {
  scroll-margin-top: 5.5rem !important;
  scroll-snap-margin-top: 5.5rem; /* older Safari */
}

@media (max-width: 991.98px) {
  html body.path-product #wrapper .product-post .pdp-section,
  html body.path-product #wrapper .product-post .pdp-section__toggle,
  html body.path-product #wrapper .product-post .pdp-section__body,
  html body.path-product #wrapper .product-post [id^="pdp-section-"] {
    /* Sticky tabs (~3rem) + top gap + buffer under mobile chrome */
    scroll-margin-top: 6.75rem !important;
    scroll-snap-margin-top: 6.75rem;
  }

  /* Keep sticky Description/Reviews under admin/header if present */
  html body.path-product #wrapper .product-post .product-info > .nav.nav-tabs,
  html body.path-product #wrapper .product-post .pdp-tabs {
    top: 0.35rem !important;
    z-index: 30 !important;
  }
}

@media (max-width: 575.98px) {
  html body.path-product #wrapper .product-post .pdp-section,
  html body.path-product #wrapper .product-post .pdp-section__toggle,
  html body.path-product #wrapper .product-post .pdp-section__body,
  html body.path-product #wrapper .product-post [id^="pdp-section-"] {
    scroll-margin-top: 7.25rem !important;
    scroll-snap-margin-top: 7.25rem;
  }
}

/* END pdp-jump-scroll-offset-v1 */

/* ==========================================================================
   breadcrumb-global-v1 — 2026-08-01
   Sitewide breadcrumb chrome — full-bleed edge-to-edge bar, roomy type/padding.
   Policy: current page is last non-linked segment; green system; mobile wrap.
   ========================================================================== */

/* Full viewport width strip (break out of boxed page columns) */
html body #wrapper #block-breadcrumbs,
html body #wrapper .block-system-breadcrumb-block,
html body #wrapper .region-breadcrumb #block-breadcrumbs,
html body #wrapper .region-breadcrumb .block-system-breadcrumb-block {
  display: block !important;
  width: 100vw !important;
  max-width: 100vw !important;
  position: relative !important;
  left: 50% !important;
  right: auto !important;
  margin-left: -50vw !important;
  margin-right: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0.65rem !important;
  padding: 0 !important;
  background: #f3e8ff !important;
  border: 0 !important;
  border-top: 1px solid #e9d5ff !important;
  border-bottom: 2px solid #6716aa !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
  overflow: visible !important;
  z-index: 2 !important;
}

/* No inner max-width rail — content uses full bar width */
html body #wrapper #block-breadcrumbs .container-wrap,
html body #wrapper .block-system-breadcrumb-block .container-wrap,
html body #wrapper #block-breadcrumbs .block-content,
html body #wrapper .block-system-breadcrumb-block .block-content {
  max-width: none !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}

html body #wrapper .breadcrumb,
html body #wrapper nav.breadcrumb {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0.85rem 1.35rem !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-sizing: border-box !important;
  overflow: visible !important;
}

/* Prefer ol.breadcrumb__list; keep ul for legacy */
html body #wrapper .breadcrumb ul,
html body #wrapper .breadcrumb ol,
html body #wrapper .breadcrumb .breadcrumb__list {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 0.25rem 0.2rem !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  max-width: none !important;
  width: 100% !important;
  box-sizing: border-box !important;
  justify-content: center !important;
}

html body #wrapper .breadcrumb li,
html body #wrapper .breadcrumb .breadcrumb__item {
  display: inline-flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  position: relative !important;
  float: none !important;
  margin: 0 !important;
  padding: 0.25rem 0.15rem !important;
  max-width: 100% !important;
  font-size: 1.05rem !important;
  line-height: 1.45 !important;
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  box-sizing: border-box !important;
  word-break: break-word !important;
  overflow-wrap: anywhere !important;
}

/* Kill absolute chevrons from style.css that break on wrap */
html body #wrapper .breadcrumb li:after,
html body #wrapper .breadcrumb li::after,
html body #wrapper .breadcrumb .breadcrumb__item:after,
html body #wrapper .breadcrumb .breadcrumb__item::after {
  content: none !important;
  display: none !important;
  border: 0 !important;
  width: 0 !important;
  height: 0 !important;
}

/* Flex-safe separators */
html body #wrapper .breadcrumb li + li::before,
html body #wrapper .breadcrumb .breadcrumb__item + .breadcrumb__item::before {
  content: "›" !important;
  display: inline-block !important;
  margin: 0 0.45rem 0 0.2rem !important;
  color: #7b2cbf !important;
  -webkit-text-fill-color: #7b2cbf !important;
  font-weight: 800 !important;
  font-size: 1.05em !important;
  line-height: 1 !important;
  speak: none;
}

html body #wrapper .breadcrumb a,
html body #wrapper .breadcrumb .breadcrumb__link {
  color: #5b21b6 !important;
  -webkit-text-fill-color: #5b21b6 !important;
  font-weight: 700 !important;
  font-size: inherit !important;
  text-decoration: none !important;
  text-shadow: none !important;
  background: transparent !important;
  border: 0 !important;
  padding: 0.15rem 0.1rem !important;
}

html body #wrapper .breadcrumb a:hover,
html body #wrapper .breadcrumb a:focus-visible,
html body #wrapper .breadcrumb .breadcrumb__link:hover,
html body #wrapper .breadcrumb .breadcrumb__link:focus-visible {
  color: #6716aa !important;
  -webkit-text-fill-color: #6716aa !important;
  text-decoration: underline !important;
  text-underline-offset: 0.14em !important;
}

/* Current page leaf — non-linked */
html body #wrapper .breadcrumb li:last-child,
html body #wrapper .breadcrumb .breadcrumb__item--current,
html body #wrapper .breadcrumb li.active,
html body #wrapper .breadcrumb .active,
html body #wrapper .breadcrumb .breadcrumb__current {
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  font-weight: 800 !important;
  font-size: inherit !important;
  background: transparent !important;
  text-decoration: none !important;
}

html body #wrapper .breadcrumb li:last-child a,
html body #wrapper .breadcrumb .breadcrumb__item--current a {
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  font-weight: 800 !important;
  pointer-events: none !important;
  text-decoration: none !important;
  cursor: default !important;
}

/* Tablet / mobile: still edge-to-edge, bigger type + padding */
@media (max-width: 991.98px) {
  html body #wrapper #block-breadcrumbs,
  html body #wrapper .block-system-breadcrumb-block {
    width: 100vw !important;
    max-width: 100vw !important;
    left: 50% !important;
    margin-left: -50vw !important;
    margin-bottom: 0.75rem !important;
  }

  html body #wrapper #block-breadcrumbs .container-wrap,
  html body #wrapper .block-system-breadcrumb-block .container-wrap,
  html body #wrapper #block-breadcrumbs .block-content,
  html body #wrapper .block-system-breadcrumb-block .block-content {
    max-width: none !important;
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  html body #wrapper .breadcrumb,
  html body #wrapper nav.breadcrumb {
    padding: 0.95rem 1rem !important;
  }

  html body #wrapper .breadcrumb li,
  html body #wrapper .breadcrumb .breadcrumb__item {
    font-size: 1.02rem !important;
    line-height: 1.45 !important;
    padding: 0.3rem 0.1rem !important;
  }

  html body #wrapper .breadcrumb li + li::before,
  html body #wrapper .breadcrumb .breadcrumb__item + .breadcrumb__item::before {
    margin: 0 0.4rem 0 0.15rem !important;
    font-size: 1.1em !important;
  }
}

@media (max-width: 575.98px) {
  html body #wrapper .breadcrumb,
  html body #wrapper nav.breadcrumb {
    padding: 1rem 0.9rem !important;
  }

  html body #wrapper .breadcrumb li,
  html body #wrapper .breadcrumb .breadcrumb__item {
    font-size: 1rem !important;
    line-height: 1.5 !important;
  }

  /* Long PDP product titles wrap fully inside the trail */
  html body #wrapper .breadcrumb li:last-child,
  html body #wrapper .breadcrumb .breadcrumb__item--current {
    flex: 1 1 100% !important;
    min-width: 100% !important;
    max-width: 100% !important;
  }

  html body #wrapper .breadcrumb li:last-child::before,
  html body #wrapper .breadcrumb .breadcrumb__item--current::before {
    /* Keep separator with previous line on wrap when current takes full row */
  }
}

/* END breadcrumb-global-v1 */

/* breadcrumb-fullbleed-v2 — force edge-to-edge over older product parity rails */
html body.path-product #wrapper #block-breadcrumbs,
html body.path-products #wrapper #block-breadcrumbs,
html body.path-taxonomy #wrapper #block-breadcrumbs,
html body.path-blog #wrapper #block-breadcrumbs,
html body.path-store #wrapper #block-breadcrumbs,
html body #wrapper #block-breadcrumbs {
  width: 100vw !important;
  max-width: 100vw !important;
  left: 50% !important;
  margin-left: -50vw !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

html body.path-product #wrapper .breadcrumb ul,
html body.path-products #wrapper .breadcrumb ul,
html body.path-taxonomy #wrapper .breadcrumb ul,
html body.path-product #wrapper .breadcrumb ol,
html body.path-products #wrapper .breadcrumb ol,
html body.path-taxonomy #wrapper .breadcrumb ol,
html body #wrapper .breadcrumb ul,
html body #wrapper .breadcrumb ol,
html body #wrapper .breadcrumb .breadcrumb__list {
  max-width: none !important;
  width: 100% !important;
  justify-content: center !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin-top: 0.5rem !important;
}

html body.path-product #wrapper .breadcrumb,
html body.path-products #wrapper .breadcrumb,
html body.path-taxonomy #wrapper .breadcrumb,
html body #wrapper .breadcrumb {
  max-width: none !important;
  width: 100% !important;
}

/* END breadcrumb-fullbleed-v2 */

/* ==========================================================================
   breadcrumb-unify-all-v3 — 2026-08-01
   Force product-style full-bleed, large-type crumbs on ALL pages
   (services, blog, city, node, marketing, etc.).
   Beats martis-custom: last-child display:none, grey bar, -25px margin,
   small padding; and content-wide-top clipping.
   ========================================================================== */

/* Parent region must allow full-bleed (no clip) */
html body #wrapper #content-wide-top,
html body #wrapper .content-wide.region-content-wide-top,
html body #wrapper #main-content > #content-wide-top,
html body #wrapper section#content-wide-top.content-wide,
html body #wrapper .region.region-content-wide-top {
  overflow: visible !important;
  max-width: none !important;
}

html body #wrapper #content-wide-top > .region,
html body #wrapper .region.region-content-wide-top {
  overflow: visible !important;
  max-width: none !important;
  width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* Full-bleed bar — every path (services use path-node / path-automotive-services) */
html body #wrapper #block-breadcrumbs,
html body #wrapper .block-system-breadcrumb-block,
html body.path-automotive-services #wrapper #block-breadcrumbs,
html body.path-marine-and-rv-services #wrapper #block-breadcrumbs,
html body.path-node #wrapper #block-breadcrumbs,
html body.page-node-type-service #wrapper #block-breadcrumbs,
html body.page-node-type-page #wrapper #block-breadcrumbs,
html body.path-blog #wrapper #block-breadcrumbs,
html body.path-frontpage #wrapper #block-breadcrumbs,
html body.path-product #wrapper #block-breadcrumbs,
html body.path-products #wrapper #block-breadcrumbs,
html body.path-taxonomy #wrapper #block-breadcrumbs,
html body.path-store #wrapper #block-breadcrumbs {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  width: 100vw !important;
  max-width: 100vw !important;
  min-width: 100vw !important;
  position: relative !important;
  left: 50% !important;
  right: auto !important;
  transform: none !important;
  margin: 0 0 0.75rem !important;
  margin-left: -50vw !important;
  margin-right: 0 !important;
  padding: 0 !important;
  background: #f3e8ff !important;
  background-color: #f3e8ff !important;
  border: 0 !important;
  border-top: 1px solid #e9d5ff !important;
  border-bottom: 2px solid #6716aa !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
  overflow: visible !important;
  z-index: 5 !important;
  float: none !important;
  clear: both !important;
  text-align: left !important;
}

html body #wrapper #block-breadcrumbs .container-wrap,
html body #wrapper #block-breadcrumbs .container-wrap.clearfix,
html body #wrapper .block-system-breadcrumb-block .container-wrap,
html body #wrapper #block-breadcrumbs .block-content,
html body #wrapper #block-breadcrumbs .block-content.clearfix,
html body.path-automotive-services #wrapper #block-breadcrumbs .container-wrap,
html body.path-node #wrapper #block-breadcrumbs .container-wrap,
html body.page-node-type-service #wrapper #block-breadcrumbs .container-wrap {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
  box-sizing: border-box !important;
}

/* Nav strip inside block */
html body #wrapper .breadcrumb,
html body #wrapper nav.breadcrumb,
html body.path-automotive-services #wrapper .breadcrumb,
html body.path-marine-and-rv-services #wrapper .breadcrumb,
html body.path-node #wrapper .breadcrumb,
html body.page-node-type-service #wrapper .breadcrumb,
html body.path-blog #wrapper .breadcrumb,
html body.path-product #wrapper .breadcrumb,
html body.path-products #wrapper .breadcrumb,
html body.path-taxonomy #wrapper .breadcrumb {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  margin-top: 0 !important;
  padding: 0.95rem 1.35rem !important;
  background: transparent !important;
  background-color: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  text-align: left !important;
  box-sizing: border-box !important;
  overflow: visible !important;
}

html body #wrapper .breadcrumb ul,
html body #wrapper .breadcrumb ol,
html body #wrapper .breadcrumb .breadcrumb__list,
html body.path-automotive-services #wrapper .breadcrumb ul,
html body.path-automotive-services #wrapper .breadcrumb ol,
html body.path-node #wrapper .breadcrumb ol,
html body.page-node-type-service #wrapper .breadcrumb ol,
html body.path-product #wrapper .breadcrumb ul,
html body.path-products #wrapper .breadcrumb ul,
html body.path-taxonomy #wrapper .breadcrumb ul {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 0.2rem 0.15rem !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  margin-bottom: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  box-sizing: border-box !important;
  justify-content: center !important;
}

/* Items: ALWAYS show (kill martis-custom display:none on last-child) */
html body #wrapper .breadcrumb li,
html body #wrapper .breadcrumb ul li,
html body #wrapper .breadcrumb ol li,
html body #wrapper .breadcrumb .breadcrumb__item,
html body #wrapper .breadcrumb ul li:last-child,
html body #wrapper .breadcrumb ol li:last-child,
html body #wrapper .breadcrumb li:last-child,
html body #wrapper .breadcrumb .breadcrumb__item--current,
html body.path-automotive-services #wrapper .breadcrumb li,
html body.path-node #wrapper .breadcrumb li,
html body.page-node-type-service #wrapper .breadcrumb li,
html body.path-automotive-services #wrapper .breadcrumb li:last-child,
html body.path-node #wrapper .breadcrumb li:last-child,
html body.page-node-type-service #wrapper .breadcrumb li:last-child {
  display: inline-flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  float: none !important;
  position: relative !important;
  margin: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding: 0.3rem 0.15rem !important;
  padding-right: 0.15rem !important;
  max-width: 100% !important;
  font-size: 1.08rem !important;
  line-height: 1.45 !important;
  font-weight: 600 !important;
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  box-sizing: border-box !important;
  word-break: break-word !important;
  overflow-wrap: anywhere !important;
  text-align: left !important;
}

/* Kill absolute chevrons / custom after rules */
html body #wrapper .breadcrumb li::after,
html body #wrapper .breadcrumb ul li::after,
html body #wrapper .breadcrumb li:after,
html body #wrapper .breadcrumb ul li:after,
html body #wrapper .breadcrumb li:last-child::after,
html body #wrapper .breadcrumb ul li:last-child::after {
  content: none !important;
  display: none !important;
  border: 0 !important;
  width: 0 !important;
  height: 0 !important;
  background: none !important;
}

html body #wrapper .breadcrumb li + li::before,
html body #wrapper .breadcrumb .breadcrumb__item + .breadcrumb__item::before,
html body.path-automotive-services #wrapper .breadcrumb li + li::before,
html body.path-node #wrapper .breadcrumb li + li::before,
html body.page-node-type-service #wrapper .breadcrumb li + li::before {
  content: "›" !important;
  display: inline-block !important;
  visibility: visible !important;
  margin: 0 0.5rem 0 0.2rem !important;
  color: #7b2cbf !important;
  -webkit-text-fill-color: #7b2cbf !important;
  font-weight: 800 !important;
  font-size: 1.1em !important;
  line-height: 1 !important;
}

html body #wrapper .breadcrumb a,
html body #wrapper .breadcrumb .breadcrumb__link,
html body #wrapper .breadcrumb ul li a,
html body.path-automotive-services #wrapper .breadcrumb a,
html body.path-marine-and-rv-services #wrapper .breadcrumb a,
html body.path-node #wrapper .breadcrumb a,
html body.page-node-type-service #wrapper .breadcrumb a,
html body.path-blog #wrapper .breadcrumb a {
  display: inline !important;
  color: #5b21b6 !important;
  -webkit-text-fill-color: #5b21b6 !important;
  font-weight: 700 !important;
  font-size: inherit !important;
  line-height: inherit !important;
  text-decoration: none !important;
  text-shadow: none !important;
  background: transparent !important;
  border: 0 !important;
  padding: 0.2rem 0.15rem !important;
  margin: 0 !important;
}

html body #wrapper .breadcrumb a:hover,
html body #wrapper .breadcrumb a:focus-visible,
html body.path-automotive-services #wrapper .breadcrumb a:hover,
html body.page-node-type-service #wrapper .breadcrumb a:hover {
  color: #6716aa !important;
  -webkit-text-fill-color: #6716aa !important;
  text-decoration: underline !important;
}

/* Current leaf always visible + bold */
html body #wrapper .breadcrumb li:last-child,
html body #wrapper .breadcrumb .breadcrumb__item--current,
html body #wrapper .breadcrumb .breadcrumb__current,
html body #wrapper .breadcrumb ul li:last-child,
html body.path-automotive-services #wrapper .breadcrumb li:last-child,
html body.path-node #wrapper .breadcrumb li:last-child,
html body.page-node-type-service #wrapper .breadcrumb li:last-child {
  display: inline-flex !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  font-weight: 800 !important;
  font-size: inherit !important;
}

html body #wrapper .breadcrumb .breadcrumb__current {
  display: inline !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  font-weight: 800 !important;
  font-size: inherit !important;
}

@media (max-width: 991.98px) {
  html body #wrapper #block-breadcrumbs,
  html body #wrapper .block-system-breadcrumb-block,
  html body.path-automotive-services #wrapper #block-breadcrumbs,
  html body.path-node #wrapper #block-breadcrumbs,
  html body.page-node-type-service #wrapper #block-breadcrumbs {
    width: 100vw !important;
    max-width: 100vw !important;
    min-width: 100vw !important;
    left: 50% !important;
    margin-left: -50vw !important;
    margin-bottom: 0.85rem !important;
  }

  html body #wrapper .breadcrumb,
  html body #wrapper nav.breadcrumb,
  html body.path-automotive-services #wrapper .breadcrumb,
  html body.path-node #wrapper .breadcrumb,
  html body.page-node-type-service #wrapper .breadcrumb {
    padding: 1.05rem 1.05rem !important;
    margin: 0 !important;
  }

  html body #wrapper .breadcrumb li,
  html body #wrapper .breadcrumb ul li,
  html body #wrapper .breadcrumb .breadcrumb__item,
  html body #wrapper .breadcrumb li:last-child,
  html body.path-automotive-services #wrapper .breadcrumb li,
  html body.path-node #wrapper .breadcrumb li,
  html body.page-node-type-service #wrapper .breadcrumb li,
  html body.path-product #wrapper .breadcrumb li,
  html body.path-products #wrapper .breadcrumb li,
  html body.path-taxonomy #wrapper .breadcrumb li {
    display: inline-flex !important;
    font-size: 1.05rem !important;
    line-height: 1.5 !important;
    padding: 0.35rem 0.12rem !important;
  }

  html body #wrapper .breadcrumb li + li::before {
    margin: 0 0.45rem 0 0.15rem !important;
    font-size: 1.15em !important;
  }
}

@media (max-width: 575.98px) {
  html body #wrapper .breadcrumb,
  html body.path-automotive-services #wrapper .breadcrumb,
  html body.page-node-type-service #wrapper .breadcrumb {
    padding: 1.1rem 0.95rem !important;
  }

  html body #wrapper .breadcrumb li,
  html body #wrapper .breadcrumb ul li,
  html body #wrapper .breadcrumb .breadcrumb__item,
  html body #wrapper .breadcrumb li:last-child {
    display: inline-flex !important;
    font-size: 1.02rem !important;
    line-height: 1.5 !important;
  }

  html body #wrapper .breadcrumb li:last-child,
  html body #wrapper .breadcrumb .breadcrumb__item--current {
    display: inline-flex !important;
    flex: 1 1 100% !important;
    min-width: 100% !important;
    max-width: 100% !important;
  }
}

/* END breadcrumb-unify-all-v3 */

/* ==========================================================================
   Service node blog teaser .post-meta centering (mobile fix)
   Theme custom_css forces margin-left: 2rem on
   #content-wide [id*="views-block-blog"] .post-meta which shifts the flex
   row off-center to the left. Kill that and center on all breakpoints.
   ========================================================================== */
html body.page-node-type-service #content-wide [id*="views-block-blog"].block .post-meta,
html body.page-node-type-service .region.region-content-wide [id*="views-block-blog"].block .post-meta,
html body.page-node-type-service #wrapper [id*="views-block-blog"] .blog-post-teaser.post-row .post-meta,
html body.page-node-type-service #wrapper [id*="views-block-blog"] .blog-post-teaser .post-meta,
html body.page-node-type-service .blog-post-teaser.post-row .post-meta {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 0.45rem !important;
  width: 100% !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  margin-top: 0.65rem !important;
  margin-bottom: 0.35rem !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  text-align: center !important;
  box-sizing: border-box !important;
  float: none !important;
  position: relative !important;
  left: auto !important;
  right: auto !important;
  transform: none !important;
}

html body.page-node-type-service #content-wide [id*="views-block-blog"].block .post-meta-item,
html body.page-node-type-service .region.region-content-wide [id*="views-block-blog"].block .post-meta-item,
html body.page-node-type-service #wrapper [id*="views-block-blog"] .blog-post-teaser .post-meta-item,
html body.page-node-type-service .blog-post-teaser.post-row .post-meta-item {
  margin-left: 0 !important;
  margin-right: 0 !important;
  float: none !important;
}

@media (max-width: 991.98px) {
  html body.page-node-type-service #content-wide [id*="views-block-blog"].block .post-meta,
  html body.page-node-type-service .region.region-content-wide [id*="views-block-blog"].block .post-meta,
  html body.page-node-type-service #wrapper [id*="views-block-blog"] .blog-post-teaser.post-row .post-meta,
  html body.page-node-type-service #wrapper [id*="views-block-blog"] .blog-post-teaser .post-meta,
  html body.page-node-type-service .blog-post-teaser.post-row .post-meta {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    align-items: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    text-align: center !important;
    padding-left: 0.25rem !important;
    padding-right: 0.25rem !important;
    /* Beat custom_css margin-left: 2rem */
    margin-inline: auto !important;
  }

  html body.page-node-type-service #content-wide [id*="views-block-blog"].block .post-meta-item,
  html body.page-node-type-service .region.region-content-wide [id*="views-block-blog"].block .post-meta-item,
  html body.page-node-type-service .blog-post-teaser.post-row .post-meta-item {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}

@media (max-width: 575.98px) {
  html body.page-node-type-service #content-wide [id*="views-block-blog"].block .post-meta,
  html body.page-node-type-service .region.region-content-wide [id*="views-block-blog"].block .post-meta,
  html body.page-node-type-service .blog-post-teaser.post-row .post-meta {
    justify-content: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
    width: 100% !important;
  }
}


/* ==========================================================================
   PACK EXTRACT 2026-08-12 (shop-icon-border-fix-v1 through city-hub-breadcrumb-v1)
   Remapped green→purple. Latest named block wins. Do not replace earlier chrome.
   ========================================================================== */
/* ===== PACK EXTRACT: Aug 12 blocks: shop-icon-border-fix-v1 through city-hub-breadcrumb-v1  (CY lines 27508-30873) ===== */
/* ==========================================================================
   shop-icon-border-fix-v1 — 2026-08-12
   Title became <p class="box-icon-title"> for heading hierarchy, so it
   inherited .box-desc p inner chrome (nested black frames). Scope pills
   to the body copy only and even the section/tile borders on storefronts.
   ========================================================================== */







/* Title is a <p> now — do not paint the inner pill on it */






@media (max-width: 991.98px) {
  

  

  
  
}

/* END shop-icon-border-fix-v1 */

/* ==========================================================================
   blog-term-listing-v2 — 2026-08-12
   Category + tag taxonomy pages: match /blog teaser chips. Global .post-meta
   { border + gray box } was wrapping date/author/category in one form-like frame.
   ========================================================================== */

html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-meta,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-meta,
html body.path-taxonomy.vocabulary-category #wrapper .blog-post-teaser .post-meta,
html body.path-taxonomy.vocabulary-tags #wrapper .blog-post-teaser .post-meta {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 0.4rem !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0.45rem 0 0.5rem !important;
  padding: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}

html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-meta-item,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-meta-item,
html body.path-taxonomy.vocabulary-category #wrapper .blog-post-teaser .post-meta-item,
html body.path-taxonomy.vocabulary-tags #wrapper .blog-post-teaser .post-meta-item {
  display: inline-flex !important;
  flex: 0 1 auto !important;
  width: auto !important;
  max-width: 100% !important;
  align-items: center !important;
  gap: 0.28rem !important;
  margin: 0 !important;
  padding: 0.22rem 0.6rem !important;
  background: #ffffff !important;
  background-color: #ffffff !important;
  border: 1px solid #3b0a5c !important;
  border-radius: 999px !important;
  box-shadow: none !important;
  font-size: 0.75rem !important;
  font-weight: 600 !important;
  line-height: 1.25 !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  box-sizing: border-box !important;
}

html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-meta-item *,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-meta-item *,
html body.path-taxonomy.vocabulary-category #wrapper .blog-post-teaser .post-meta-item *,
html body.path-taxonomy.vocabulary-tags #wrapper .blog-post-teaser .post-meta-item * {
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  width: auto !important;
  display: inline !important;
  padding: 0 !important;
  margin: 0 !important;
}

html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-meta-item i,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-meta-item i,
html body.path-taxonomy.vocabulary-category #wrapper .blog-post-teaser .post-meta-item i,
html body.path-taxonomy.vocabulary-tags #wrapper .blog-post-teaser .post-meta-item i {
  display: inline-block !important;
  font-size: 0.72rem !important;
  line-height: 1 !important;
  margin-right: 0.15rem !important;
}

/* Category field wrappers must not stretch the chip into a full-width box */
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-meta-item .field,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-meta-item .field-items,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-meta-item .field-item,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-meta-item .field,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-meta-item .field-item,
html body.path-taxonomy.vocabulary-tags #wrapper .blog-post-teaser .post-meta-item .field,
html body.path-taxonomy.vocabulary-tags #wrapper .blog-post-teaser .post-meta-item .field-item {
  display: inline !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}

html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-meta-item.post-comment,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-meta-item.post-comment,
html body.path-taxonomy.vocabulary-tags #wrapper .blog-post-teaser .post-meta-item.post-comment {
  display: none !important;
}

/* Tags: chips only, no "Tags:" label */
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-tags,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-tags,
html body.path-taxonomy.vocabulary-tags #wrapper .blog-post-teaser .post-tags {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  gap: 0.3rem !important;
  margin: 0.2rem 0 0.35rem !important;
  padding: 0.45rem 0 0 !important;
  border: 0 !important;
  border-top: 1px solid rgba(255, 255, 255, 0.18) !important;
  background: transparent !important;
}

html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-tags > i,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-tags .tags-label,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-tags .field-label,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-tags > i,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-tags .tags-label,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-tags .field-label,
html body.path-taxonomy.vocabulary-tags #wrapper .blog-post-teaser .post-tags > i,
html body.path-taxonomy.vocabulary-tags #wrapper .blog-post-teaser .post-tags .tags-label {
  display: none !important;
}

html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-tags a,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-tags a,
html body.path-taxonomy.vocabulary-tags #wrapper .blog-post-teaser .post-tags a {
  display: inline-flex !important;
  background: #ffffff !important;
  color: #6716aa !important;
  -webkit-text-fill-color: #6716aa !important;
  border: 1px solid #3b0a5c !important;
  border-radius: 999px !important;
  font-weight: 700 !important;
  font-size: 0.68rem !important;
  padding: 0.14rem 0.5rem !important;
  text-decoration: none !important;
}

/* Hide leftover RSS "Subscribe to …" */
html body.path-taxonomy.page-blog-category #wrapper .feed-icons,
html body.path-taxonomy.page-blog-tag #wrapper .feed-icons,
html body.path-taxonomy.vocabulary-category #wrapper .feed-icons,
html body.path-taxonomy.vocabulary-tags #wrapper .feed-icons {
  display: none !important;
}

/* Term body copy under intro: quiet subtitle, not a third card */
html body.path-taxonomy.page-blog-category #wrapper .view-header .taxonomy-term,
html body.path-taxonomy.page-blog-tag #wrapper .view-header .taxonomy-term,
html body.path-taxonomy.vocabulary-tags #wrapper .view-header .taxonomy-term {
  max-width: 40rem !important;
  margin: 0.15rem auto 1.15rem !important;
  padding: 0 1rem !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

html body.path-taxonomy.page-blog-category #wrapper .view-header .taxonomy-term p,
html body.path-taxonomy.page-blog-tag #wrapper .view-header .taxonomy-term p,
html body.path-taxonomy.vocabulary-tags #wrapper .view-header .taxonomy-term p {
  margin: 0 !important;
  color: #3d5c4a !important;
  -webkit-text-fill-color: #3d5c4a !important;
  font-size: 0.95rem !important;
  line-height: 1.5 !important;
  font-style: italic !important;
  text-align: center !important;
}

html body.path-taxonomy.page-blog-category #wrapper #block-martis-exposedformblog-searchblog-search .form-item,
html body.path-taxonomy.page-blog-tag #wrapper #block-martis-exposedformblog-searchblog-search .form-item,
html body.path-taxonomy.vocabulary-tags #wrapper #block-martis-exposedformblog-searchblog-search .form-item {
  width: 100% !important;
  max-width: 36rem !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

html body.path-taxonomy.page-blog-category #wrapper #block-martis-exposedformblog-searchblog-search input[type="text"],
html body.path-taxonomy.page-blog-tag #wrapper #block-martis-exposedformblog-searchblog-search input[type="text"],
html body.path-taxonomy.vocabulary-category #wrapper #block-martis-exposedformblog-searchblog-search input.form-text,
html body.path-taxonomy.vocabulary-tags #wrapper #block-martis-exposedformblog-searchblog-search input.form-text,
html body.path-taxonomy.page-blog-category #wrapper #block-martis-exposedformblog-searchblog-search input.form-text,
html body.path-taxonomy.page-blog-tag #wrapper #block-martis-exposedformblog-searchblog-search input.form-text {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

/* Search: don't clip the placeholder on mobile */
@media (max-width: 767.98px) {
  html body.path-taxonomy.page-blog-category #wrapper #block-martis-exposedformblog-searchblog-search input[type="text"],
  html body.path-taxonomy.page-blog-tag #wrapper #block-martis-exposedformblog-searchblog-search input[type="text"],
  html body.path-taxonomy.vocabulary-category #wrapper #block-martis-exposedformblog-searchblog-search input.form-text,
  html body.path-taxonomy.vocabulary-tags #wrapper #block-martis-exposedformblog-searchblog-search input.form-text {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-meta-item,
  html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-meta-item,
  html body.path-taxonomy.vocabulary-tags #wrapper .blog-post-teaser .post-meta-item {
    font-size: 0.72rem !important;
    padding: 0.2rem 0.5rem !important;
  }

  html body.path-taxonomy.page-blog-category #wrapper .breadcrumb,
  html body.path-taxonomy.page-blog-tag #wrapper .breadcrumb {
    padding-left: 0.75rem !important;
    padding-right: 0.75rem !important;
  }
}

/* END blog-term-listing-v2 */

/* ==========================================================================
   blog-term-listing-v3 — 2026-08-12
   Match /blog: white page shell, ~1rem header/footer gap, smaller meta chips
   and the same compact tag pills on category + tag taxonomy pages.
   ========================================================================== */

html body.path-taxonomy.page-blog-category #wrapper .page-wrapper,
html body.path-taxonomy.page-blog-tag #wrapper .page-wrapper,
html body.path-taxonomy.vocabulary-category #wrapper .page-wrapper,
html body.path-taxonomy.vocabulary-tags #wrapper .page-wrapper,
html body.path-taxonomy.page-blog-category #wrapper .page-wrapper > .container,
html body.path-taxonomy.page-blog-tag #wrapper .page-wrapper > .container,
html body.path-taxonomy.vocabulary-category #wrapper .page-wrapper > .container,
html body.path-taxonomy.vocabulary-tags #wrapper .page-wrapper > .container {
  background: #ffffff !important;
  margin-top: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 1rem !important;
  box-sizing: border-box !important;
}

/* Search lives in content-wide-top (outside page-wrapper) — keep it on the same white shell */
html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .region-content-wide-top,
html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper .region-content-wide-top,
html body.path-taxonomy.page-blog-category #wrapper .region-content-wide-top,
html body.path-taxonomy.page-blog-tag #wrapper .region-content-wide-top,
html body.path-taxonomy.vocabulary-category #wrapper .region-content-wide-top,
html body.path-taxonomy.vocabulary-tags #wrapper .region-content-wide-top,
html body.path-taxonomy.page-blog-category #wrapper #content-wide-top,
html body.path-taxonomy.page-blog-tag #wrapper #content-wide-top,
html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper #content-wide-top,
html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper #content-wide-top {
  background: #ffffff !important;
  background-color: #ffffff !important;
  padding-top: 1rem !important;
  padding-bottom: 0.35rem !important;
  margin: 0 !important;
}

html body.path-taxonomy.page-blog-category #wrapper .blog-tag-listing-view,
html body.path-taxonomy.page-blog-tag #wrapper .blog-tag-listing-view,
html body.path-taxonomy.page-blog-category #wrapper .view-taxonomy-term,
html body.path-taxonomy.page-blog-tag #wrapper .view-taxonomy-term,
html body.path-taxonomy.vocabulary-tags #wrapper .view-taxonomy-term {
  background: #ffffff !important;
  background-color: #ffffff !important;
}

html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .region.region-content,
html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper .region.region-content,
html body.path-taxonomy.page-blog-category #wrapper .region.region-content,
html body.path-taxonomy.page-blog-tag #wrapper .region.region-content,
html body.path-taxonomy.vocabulary-category #wrapper .region.region-content,
html body.path-taxonomy.vocabulary-tags #wrapper .region.region-content,
html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper #main-content,
html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper #main-content,
html body.path-taxonomy.page-blog-category #wrapper #main-content,
html body.path-taxonomy.page-blog-tag #wrapper #main-content,
html body.path-taxonomy.vocabulary-category #wrapper #main-content,
html body.path-taxonomy.vocabulary-tags #wrapper #main-content,
html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .col-md-9.left-content.main-content,
html body.path-taxonomy.page-blog-category #wrapper .col-md-9.left-content.main-content,
html body.path-taxonomy.page-blog-tag #wrapper .col-md-9.left-content.main-content {
  background: #ffffff !important;
  background-color: #ffffff !important;
}

html body.path-taxonomy.page-blog-category #wrapper .region-content-wide-top,
html body.path-taxonomy.page-blog-tag #wrapper .region-content-wide-top {
  background: #ffffff !important;
}

/* Meta chips — same size as /blog (date + category + author) */
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-meta-item,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-meta-item,
html body.path-taxonomy.vocabulary-category #wrapper .blog-post-teaser .post-meta-item,
html body.path-taxonomy.vocabulary-tags #wrapper .blog-post-teaser .post-meta-item {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.25rem !important;
  padding: 0.22rem 0.55rem !important;
  font-size: 0.72rem !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  border: 1.5px solid #3b0a5c !important;
  border-radius: 999px !important;
  background: #ffffff !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  white-space: nowrap !important;
  width: auto !important;
  max-width: 100% !important;
  flex: 0 1 auto !important;
}

html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-meta-item *,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-meta-item *,
html body.path-taxonomy.vocabulary-category #wrapper .blog-post-teaser .post-meta-item *,
html body.path-taxonomy.vocabulary-tags #wrapper .blog-post-teaser .post-meta-item *,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-meta-item a,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-meta-item a {
  font-size: inherit !important;
  font-weight: inherit !important;
  line-height: inherit !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
}

html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-meta-item i,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-meta-item i,
html body.path-taxonomy.vocabulary-tags #wrapper .blog-post-teaser .post-meta-item i {
  font-size: 0.68rem !important;
}

/* Tags — same compact pills as /blog */
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-tags a,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-tags a,
html body.path-taxonomy.vocabulary-category #wrapper .blog-post-teaser .post-tags a,
html body.path-taxonomy.vocabulary-tags #wrapper .blog-post-teaser .post-tags a,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .tags-list a,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .tags-list a,
html body.path-taxonomy.vocabulary-tags #wrapper .blog-post-teaser .tags-list a {
  display: inline-flex !important;
  background: #ffffff !important;
  color: #6716aa !important;
  -webkit-text-fill-color: #6716aa !important;
  border: 1px solid #3b0a5c !important;
  border-radius: 999px !important;
  font-weight: 700 !important;
  font-size: 0.7rem !important;
  line-height: 1.2 !important;
  padding: 0.18rem 0.5rem !important;
  margin: 0 !important;
  text-decoration: none !important;
}

html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-tags a:hover,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-tags a:hover,
html body.path-taxonomy.vocabulary-tags #wrapper .blog-post-teaser .post-tags a:hover {
  background: #f3e8ff !important;
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
}

@media (max-width: 767.98px) {
  html body.path-taxonomy.page-blog-category #wrapper .page-wrapper,
  html body.path-taxonomy.page-blog-tag #wrapper .page-wrapper,
  html body.path-taxonomy.vocabulary-category #wrapper .page-wrapper,
  html body.path-taxonomy.vocabulary-tags #wrapper .page-wrapper,
  html body.path-taxonomy.page-blog-category #wrapper .page-wrapper > .container,
  html body.path-taxonomy.page-blog-tag #wrapper .page-wrapper > .container {
    padding-top: 1rem !important;
    padding-bottom: 1rem !important;
    padding-left: 0.85rem !important;
    padding-right: 0.85rem !important;
  }

  html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-meta-item,
  html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-meta-item,
  html body.path-taxonomy.vocabulary-tags #wrapper .blog-post-teaser .post-meta-item {
    font-size: 0.72rem !important;
    padding: 0.22rem 0.55rem !important;
  }
}

/* END blog-term-listing-v3 */

/* ==========================================================================
   blog-term-listing-v4 — 2026-08-12
   1) Category post tags: field wrappers were block, so pills stacked.
      Match /blog horizontal chip row.
   2) Breadcrumbs: keep a single wrapping trail like /blog. Do not force
      current crumbs to 100% width (that stacked Category/Tag + term).
   ========================================================================== */

/* ---- Category (and tag) post-tag chips = /blog ---- */
html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .blog-post-teaser .post-tags,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-tags,
html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper .blog-post-teaser .post-tags,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-tags {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 0.3rem !important;
  width: 100% !important;
  margin: 0.25rem auto 0.35rem !important;
  padding: 0.55rem 0 0.15rem !important;
  border: 0 !important;
  border-top: 1px solid rgba(255, 255, 255, 0.18) !important;
  background: transparent !important;
}

html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .blog-post-teaser .post-tags > i,
html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .blog-post-teaser .post-tags .tags-label,
html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .blog-post-teaser .post-tags .field-label,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-tags > i,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-tags .tags-label,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-tags .field-label,
html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper .blog-post-teaser .post-tags > i,
html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper .blog-post-teaser .post-tags .tags-label,
html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper .blog-post-teaser .post-tags .field-label,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-tags > i,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-tags .tags-label,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-tags .field-label {
  display: none !important;
}

html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .blog-post-teaser .post-tags .tags-list,
html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .blog-post-teaser .post-tags .field,
html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .blog-post-teaser .post-tags .field-items,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-tags .tags-list,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-tags .field,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-tags .field-items,
html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper .blog-post-teaser .post-tags .tags-list,
html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper .blog-post-teaser .post-tags .field,
html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper .blog-post-teaser .post-tags .field-items,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-tags .tags-list,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-tags .field,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-tags .field-items {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 0.3rem !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}

html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .blog-post-teaser .post-tags .field-item,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-tags .field-item,
html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper .blog-post-teaser .post-tags .field-item,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-tags .field-item {
  display: inline-flex !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}

html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .blog-post-teaser .post-tags a,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-tags a,
html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .blog-post-teaser .tags-list a,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .tags-list a {
  display: inline-flex !important;
  background: #ffffff !important;
  color: #6716aa !important;
  -webkit-text-fill-color: #6716aa !important;
  border: 1px solid #3b0a5c !important;
  border-radius: 999px !important;
  font-weight: 700 !important;
  font-size: 0.7rem !important;
  line-height: 1.2 !important;
  padding: 0.18rem 0.5rem !important;
  margin: 0 !important;
  text-decoration: none !important;
}

/* ---- Breadcrumbs: one wrapping trail like /blog ---- */
html body.path-taxonomy.page-blog-category #wrapper #block-breadcrumbs,
html body.path-taxonomy.page-blog-tag #wrapper #block-breadcrumbs,
html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper #block-breadcrumbs,
html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper #block-breadcrumbs {
  width: 100vw !important;
  max-width: 100vw !important;
  left: 50% !important;
  margin-left: -50vw !important;
  margin-right: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding: 0 !important;
  background: #f3e8ff !important;
  border-top: 1px solid #e9d5ff !important;
  border-bottom: 2px solid #6716aa !important;
}

html body.path-taxonomy.page-blog-category #wrapper .breadcrumb,
html body.path-taxonomy.page-blog-tag #wrapper .breadcrumb,
html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .breadcrumb,
html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper .breadcrumb,
html body.path-taxonomy.page-blog-category #wrapper nav.breadcrumb,
html body.path-taxonomy.page-blog-tag #wrapper nav.breadcrumb {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0.85rem 1.35rem !important;
  background: transparent !important;
  border: 0 !important;
}

html body.path-taxonomy.page-blog-category #wrapper .breadcrumb ol,
html body.path-taxonomy.page-blog-tag #wrapper .breadcrumb ol,
html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .breadcrumb ol,
html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper .breadcrumb ol,
html body.path-taxonomy.page-blog-category #wrapper .breadcrumb .breadcrumb__list,
html body.path-taxonomy.page-blog-tag #wrapper .breadcrumb .breadcrumb__list,
html body.path-taxonomy.page-blog-category #wrapper .breadcrumb ul,
html body.path-taxonomy.page-blog-tag #wrapper .breadcrumb ul {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.15rem 0.2rem !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
}

html body.path-taxonomy.page-blog-category #wrapper .breadcrumb li,
html body.path-taxonomy.page-blog-tag #wrapper .breadcrumb li,
html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .breadcrumb li,
html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper .breadcrumb li,
html body.path-taxonomy.page-blog-category #wrapper .breadcrumb .breadcrumb__item,
html body.path-taxonomy.page-blog-tag #wrapper .breadcrumb .breadcrumb__item,
html body.path-taxonomy.page-blog-category #wrapper .breadcrumb li:last-child,
html body.path-taxonomy.page-blog-tag #wrapper .breadcrumb li:last-child,
html body.path-taxonomy.page-blog-category #wrapper .breadcrumb .breadcrumb__item--current,
html body.path-taxonomy.page-blog-tag #wrapper .breadcrumb .breadcrumb__item--current {
  display: inline-flex !important;
  align-items: center !important;
  flex: 0 1 auto !important;
  flex-wrap: nowrap !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  float: none !important;
  margin: 0 !important;
  padding: 0.2rem 0.1rem !important;
  font-size: 1.05rem !important;
  line-height: 1.4 !important;
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
}

html body.path-taxonomy.page-blog-category #wrapper .breadcrumb a,
html body.path-taxonomy.page-blog-tag #wrapper .breadcrumb a,
html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .breadcrumb a,
html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper .breadcrumb a {
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  font-weight: 600 !important;
  text-decoration: none !important;
}

html body.path-taxonomy.page-blog-category #wrapper .breadcrumb .breadcrumb__current,
html body.path-taxonomy.page-blog-tag #wrapper .breadcrumb .breadcrumb__current {
  font-weight: 700 !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
}

@media (max-width: 767.98px) {
  html body.path-taxonomy.page-blog-category #wrapper .breadcrumb,
  html body.path-taxonomy.page-blog-tag #wrapper .breadcrumb,
  html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .breadcrumb,
  html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper .breadcrumb {
    padding: 0.75rem 0.9rem !important;
  }

  html body.path-taxonomy.page-blog-category #wrapper .breadcrumb li,
  html body.path-taxonomy.page-blog-tag #wrapper .breadcrumb li,
  html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .breadcrumb li,
  html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper .breadcrumb li,
  html body.path-taxonomy.page-blog-category #wrapper .breadcrumb .breadcrumb__item,
  html body.path-taxonomy.page-blog-tag #wrapper .breadcrumb .breadcrumb__item,
  html body.path-taxonomy.page-blog-category #wrapper .breadcrumb li:last-child,
  html body.path-taxonomy.page-blog-tag #wrapper .breadcrumb li:last-child,
  html body.path-taxonomy.page-blog-category #wrapper .breadcrumb .breadcrumb__item--current,
  html body.path-taxonomy.page-blog-tag #wrapper .breadcrumb .breadcrumb__item--current {
    flex: 0 1 auto !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    font-size: 0.95rem !important;
  }
}

/* END blog-term-listing-v4 */

/* ==========================================================================
   blog-term-listing-v5 — 2026-08-12
   Category post tags still stacked: Drupal .field / .field-items / .field-item
   stay block even when .post-tags is flex. Use display:contents so the <a>
   pills become flex children of .post-tags (same row as /blog + tag archives).

   Breadcrumbs: global ≤575px rule forces .breadcrumb__item--current to 100%
   width. Easy Breadcrumb marks both Category/Tag AND the term as current, so
   the trail becomes three rows. Keep a single wrapping mint trail like /blog.
   ========================================================================== */

html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .blog-post-teaser .post-tags,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-tags,
html body.path-taxonomy.vocabulary-category #wrapper .blog-post-teaser .post-tags,
html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper .blog-post-teaser .post-tags,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-tags,
html body.path-taxonomy.vocabulary-tags #wrapper .blog-post-teaser .post-tags {
  display: flex !important;
  flex-flow: row wrap !important;
  justify-content: center !important;
  align-items: center !important;
  align-content: center !important;
  gap: 0.3rem !important;
  width: 100% !important;
  margin: 0.25rem auto 0.35rem !important;
  padding: 0.55rem 0 0.15rem !important;
  border: 0 !important;
  border-top: 1px solid rgba(255, 255, 255, 0.18) !important;
  background: transparent !important;
  text-align: center !important;
}

html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .blog-post-teaser .post-tags > i,
html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .blog-post-teaser .post-tags .tags-label,
html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .blog-post-teaser .post-tags .field-label,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-tags > i,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-tags .tags-label,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-tags .field-label,
html body.path-taxonomy.vocabulary-category #wrapper .blog-post-teaser .post-tags > i,
html body.path-taxonomy.vocabulary-category #wrapper .blog-post-teaser .post-tags .tags-label,
html body.path-taxonomy.vocabulary-category #wrapper .blog-post-teaser .post-tags .field-label,
html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper .blog-post-teaser .post-tags > i,
html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper .blog-post-teaser .post-tags .tags-label,
html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper .blog-post-teaser .post-tags .field-label,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-tags > i,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-tags .tags-label,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-tags .field-label,
html body.path-taxonomy.vocabulary-tags #wrapper .blog-post-teaser .post-tags > i,
html body.path-taxonomy.vocabulary-tags #wrapper .blog-post-teaser .post-tags .tags-label,
html body.path-taxonomy.vocabulary-tags #wrapper .blog-post-teaser .post-tags .field-label {
  display: none !important;
}

/* Unwrap Drupal field chrome so pills sit on one wrapping row */
html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .blog-post-teaser .post-tags .tags-list,
html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .blog-post-teaser .post-tags .field,
html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .blog-post-teaser .post-tags .field-items,
html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .blog-post-teaser .post-tags .field-item,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-tags .tags-list,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-tags .field,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-tags .field-items,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-tags .field-item,
html body.path-taxonomy.vocabulary-category #wrapper .blog-post-teaser .post-tags .tags-list,
html body.path-taxonomy.vocabulary-category #wrapper .blog-post-teaser .post-tags .field,
html body.path-taxonomy.vocabulary-category #wrapper .blog-post-teaser .post-tags .field-items,
html body.path-taxonomy.vocabulary-category #wrapper .blog-post-teaser .post-tags .field-item,
html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper .blog-post-teaser .post-tags .tags-list,
html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper .blog-post-teaser .post-tags .field,
html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper .blog-post-teaser .post-tags .field-items,
html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper .blog-post-teaser .post-tags .field-item,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-tags .tags-list,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-tags .field,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-tags .field-items,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-tags .field-item,
html body.path-taxonomy.vocabulary-tags #wrapper .blog-post-teaser .post-tags .tags-list,
html body.path-taxonomy.vocabulary-tags #wrapper .blog-post-teaser .post-tags .field,
html body.path-taxonomy.vocabulary-tags #wrapper .blog-post-teaser .post-tags .field-items,
html body.path-taxonomy.vocabulary-tags #wrapper .blog-post-teaser .post-tags .field-item {
  display: contents !important;
  width: auto !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
  background: transparent !important;
  border: 0 !important;
  column-count: auto !important;
}

html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .blog-post-teaser .post-tags a,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-tags a,
html body.path-taxonomy.vocabulary-category #wrapper .blog-post-teaser .post-tags a,
html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .blog-post-teaser .tags-list a,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .tags-list a,
html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper .blog-post-teaser .post-tags a,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-tags a,
html body.path-taxonomy.vocabulary-tags #wrapper .blog-post-teaser .post-tags a {
  display: inline-flex !important;
  flex: 0 0 auto !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  max-width: 100% !important;
  background: #ffffff !important;
  color: #6716aa !important;
  -webkit-text-fill-color: #6716aa !important;
  border: 1px solid #3b0a5c !important;
  border-radius: 999px !important;
  font-weight: 700 !important;
  font-size: 0.7rem !important;
  line-height: 1.2 !important;
  padding: 0.18rem 0.5rem !important;
  margin: 0 !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  float: none !important;
}

html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .blog-post-teaser .post-tags a:hover,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-tags a:hover,
html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper .blog-post-teaser .post-tags a:hover,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-tags a:hover {
  background: #f3e8ff !important;
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
}

/* ---- Breadcrumbs: same mint trail as /blog, never a 100% current row ---- */
html body.path-taxonomy.page-blog-category #wrapper #block-breadcrumbs,
html body.path-taxonomy.page-blog-tag #wrapper #block-breadcrumbs,
html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper #block-breadcrumbs,
html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper #block-breadcrumbs,
html body.path-taxonomy.vocabulary-category #wrapper #block-breadcrumbs,
html body.path-taxonomy.vocabulary-tags #wrapper #block-breadcrumbs {
  width: 100vw !important;
  max-width: 100vw !important;
  left: 50% !important;
  margin-left: -50vw !important;
  margin-right: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding: 0 !important;
  background: #f3e8ff !important;
  border-top: 1px solid #e9d5ff !important;
  border-bottom: 2px solid #6716aa !important;
}

html body.path-taxonomy.page-blog-category #wrapper .breadcrumb,
html body.path-taxonomy.page-blog-tag #wrapper .breadcrumb,
html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .breadcrumb,
html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper .breadcrumb,
html body.path-taxonomy.vocabulary-category #wrapper .breadcrumb,
html body.path-taxonomy.vocabulary-tags #wrapper .breadcrumb,
html body.path-taxonomy.page-blog-category #wrapper nav.breadcrumb,
html body.path-taxonomy.page-blog-tag #wrapper nav.breadcrumb {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0.85rem 1.35rem !important;
  background: transparent !important;
  border: 0 !important;
}

html body.path-taxonomy.page-blog-category #wrapper .breadcrumb ol,
html body.path-taxonomy.page-blog-tag #wrapper .breadcrumb ol,
html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .breadcrumb ol,
html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper .breadcrumb ol,
html body.path-taxonomy.page-blog-category #wrapper .breadcrumb .breadcrumb__list,
html body.path-taxonomy.page-blog-tag #wrapper .breadcrumb .breadcrumb__list,
html body.path-taxonomy.vocabulary-category #wrapper .breadcrumb .breadcrumb__list,
html body.path-taxonomy.vocabulary-tags #wrapper .breadcrumb .breadcrumb__list,
html body.path-taxonomy.page-blog-category #wrapper .breadcrumb ul,
html body.path-taxonomy.page-blog-tag #wrapper .breadcrumb ul {
  display: flex !important;
  flex-flow: row wrap !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.15rem 0.2rem !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
}

html body.path-taxonomy.page-blog-category #wrapper .breadcrumb li,
html body.path-taxonomy.page-blog-tag #wrapper .breadcrumb li,
html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .breadcrumb li,
html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper .breadcrumb li,
html body.path-taxonomy.page-blog-category #wrapper .breadcrumb .breadcrumb__item,
html body.path-taxonomy.page-blog-tag #wrapper .breadcrumb .breadcrumb__item,
html body.path-taxonomy.vocabulary-category #wrapper .breadcrumb .breadcrumb__item,
html body.path-taxonomy.vocabulary-tags #wrapper .breadcrumb .breadcrumb__item,
html body.path-taxonomy.page-blog-category #wrapper .breadcrumb li:last-child,
html body.path-taxonomy.page-blog-tag #wrapper .breadcrumb li:last-child,
html body.path-taxonomy.page-blog-category #wrapper .breadcrumb .breadcrumb__item--current,
html body.path-taxonomy.page-blog-tag #wrapper .breadcrumb .breadcrumb__item--current,
html body.path-taxonomy.vocabulary-category #wrapper .breadcrumb .breadcrumb__item--current,
html body.path-taxonomy.vocabulary-tags #wrapper .breadcrumb .breadcrumb__item--current {
  display: inline-flex !important;
  align-items: center !important;
  flex: 0 1 auto !important;
  flex-grow: 0 !important;
  flex-shrink: 1 !important;
  flex-basis: auto !important;
  flex-wrap: nowrap !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  float: none !important;
  margin: 0 !important;
  padding: 0.2rem 0.1rem !important;
  font-size: 1.05rem !important;
  line-height: 1.4 !important;
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
}

html body.path-taxonomy.page-blog-category #wrapper .breadcrumb li + li::before,
html body.path-taxonomy.page-blog-tag #wrapper .breadcrumb li + li::before,
html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .breadcrumb li + li::before,
html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper .breadcrumb li + li::before,
html body.path-taxonomy.page-blog-category #wrapper .breadcrumb .breadcrumb__item + .breadcrumb__item::before,
html body.path-taxonomy.page-blog-tag #wrapper .breadcrumb .breadcrumb__item + .breadcrumb__item::before,
html body.path-taxonomy.vocabulary-category #wrapper .breadcrumb .breadcrumb__item + .breadcrumb__item::before,
html body.path-taxonomy.vocabulary-tags #wrapper .breadcrumb .breadcrumb__item + .breadcrumb__item::before {
  content: "›" !important;
  display: inline-block !important;
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: 0 !important;
  margin: 0 0.4rem 0 0.15rem !important;
  font-size: 1.1em !important;
  line-height: 1 !important;
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
}

html body.path-taxonomy.page-blog-category #wrapper .breadcrumb a,
html body.path-taxonomy.page-blog-tag #wrapper .breadcrumb a,
html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .breadcrumb a,
html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper .breadcrumb a,
html body.path-taxonomy.page-blog-category #wrapper .breadcrumb .breadcrumb__link,
html body.path-taxonomy.page-blog-tag #wrapper .breadcrumb .breadcrumb__link {
  color: #5b21b6 !important;
  -webkit-text-fill-color: #5b21b6 !important;
  font-weight: 600 !important;
  text-decoration: none !important;
}

html body.path-taxonomy.page-blog-category #wrapper .breadcrumb .breadcrumb__current,
html body.path-taxonomy.page-blog-tag #wrapper .breadcrumb .breadcrumb__current,
html body.path-taxonomy.vocabulary-category #wrapper .breadcrumb .breadcrumb__current,
html body.path-taxonomy.vocabulary-tags #wrapper .breadcrumb .breadcrumb__current {
  font-weight: 700 !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
}

@media (max-width: 767.98px) {
  html body.path-taxonomy.page-blog-category #wrapper .breadcrumb,
  html body.path-taxonomy.page-blog-tag #wrapper .breadcrumb,
  html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .breadcrumb,
  html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper .breadcrumb,
  html body.path-taxonomy.vocabulary-category #wrapper .breadcrumb,
  html body.path-taxonomy.vocabulary-tags #wrapper .breadcrumb {
    padding: 0.75rem 0.9rem !important;
  }

  html body.path-taxonomy.page-blog-category #wrapper .breadcrumb li,
  html body.path-taxonomy.page-blog-tag #wrapper .breadcrumb li,
  html body.path-taxonomy.vocabulary-category #wrapper .breadcrumb li,
  html body.path-taxonomy.vocabulary-tags #wrapper .breadcrumb li,
  html body.path-taxonomy.page-blog-category #wrapper .breadcrumb .breadcrumb__item,
  html body.path-taxonomy.page-blog-tag #wrapper .breadcrumb .breadcrumb__item,
  html body.path-taxonomy.page-blog-category #wrapper .breadcrumb li:last-child,
  html body.path-taxonomy.page-blog-tag #wrapper .breadcrumb li:last-child,
  html body.path-taxonomy.page-blog-category #wrapper .breadcrumb .breadcrumb__item--current,
  html body.path-taxonomy.page-blog-tag #wrapper .breadcrumb .breadcrumb__item--current,
  html body.path-taxonomy.vocabulary-category #wrapper .breadcrumb .breadcrumb__item--current,
  html body.path-taxonomy.vocabulary-tags #wrapper .breadcrumb .breadcrumb__item--current {
    flex: 0 1 auto !important;
    flex-grow: 0 !important;
    flex-basis: auto !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    font-size: 0.95rem !important;
  }
}

/* Beat breadcrumb-global-v1 + unify-v3 100% current-row (≤575px) */
@media (max-width: 575.98px) {
  html body.path-taxonomy.page-blog-category #wrapper .breadcrumb li,
  html body.path-taxonomy.page-blog-tag #wrapper .breadcrumb li,
  html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .breadcrumb li,
  html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper .breadcrumb li,
  html body.path-taxonomy.page-blog-category #wrapper .breadcrumb ul li,
  html body.path-taxonomy.page-blog-tag #wrapper .breadcrumb ul li,
  html body.path-taxonomy.page-blog-category #wrapper .breadcrumb ol li,
  html body.path-taxonomy.page-blog-tag #wrapper .breadcrumb ol li,
  html body.path-taxonomy.page-blog-category #wrapper .breadcrumb .breadcrumb__item,
  html body.path-taxonomy.page-blog-tag #wrapper .breadcrumb .breadcrumb__item,
  html body.path-taxonomy.page-blog-category #wrapper .breadcrumb li:last-child,
  html body.path-taxonomy.page-blog-tag #wrapper .breadcrumb li:last-child,
  html body.path-taxonomy.page-blog-category #wrapper .breadcrumb ul li:last-child,
  html body.path-taxonomy.page-blog-tag #wrapper .breadcrumb ul li:last-child,
  html body.path-taxonomy.page-blog-category #wrapper .breadcrumb .breadcrumb__item--current,
  html body.path-taxonomy.page-blog-tag #wrapper .breadcrumb .breadcrumb__item--current,
  html body.path-taxonomy.vocabulary-category #wrapper .breadcrumb .breadcrumb__item--current,
  html body.path-taxonomy.vocabulary-tags #wrapper .breadcrumb .breadcrumb__item--current {
    display: inline-flex !important;
    flex: 0 1 auto !important;
    flex-grow: 0 !important;
    flex-shrink: 1 !important;
    flex-basis: auto !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    font-size: 0.95rem !important;
  }

  html body.path-taxonomy.page-blog-category #wrapper .breadcrumb li + li::before,
  html body.path-taxonomy.page-blog-tag #wrapper .breadcrumb li + li::before,
  html body.path-taxonomy.page-blog-category #wrapper .breadcrumb .breadcrumb__item + .breadcrumb__item::before,
  html body.path-taxonomy.page-blog-tag #wrapper .breadcrumb .breadcrumb__item + .breadcrumb__item::before {
    display: inline-block !important;
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: 0 !important;
    margin: 0 0.35rem 0 0.1rem !important;
  }
}

/* END blog-term-listing-v5 */

/* ==========================================================================
   blog-term-listing-v6 — 2026-08-12
   1) Kill white band above #block-breadcrumbs on category + tag
      (bar lives in #page-title > .container; #page-title is #f7f7f7).
   2) Category .post-image = /blog + tag desktop card-cap.
   3) Category + tag mobile .post-image = /blog mobile.
   ========================================================================== */

html body.path-taxonomy.page-blog-category #wrapper #page-title,
html body.path-taxonomy.page-blog-tag #wrapper #page-title,
html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper #page-title,
html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper #page-title,
html body.path-taxonomy.vocabulary-category #wrapper #page-title,
html body.path-taxonomy.vocabulary-tags #wrapper #page-title,
html body.path-taxonomy.page-blog-category #wrapper section.page-title,
html body.path-taxonomy.page-blog-tag #wrapper section.page-title {
  margin: 0 !important;
  margin-top: 0 !important;
  padding: 0 !important;
  padding-top: 0 !important;
  min-height: 0 !important;
  height: auto !important;
  background: #f3e8ff !important;
  background-color: #f3e8ff !important;
  border: 0 !important;
  box-shadow: none !important;
}

html body.path-taxonomy.page-blog-category #wrapper #page-title > .container,
html body.path-taxonomy.page-blog-tag #wrapper #page-title > .container,
html body.path-taxonomy.vocabulary-category #wrapper #page-title > .container,
html body.path-taxonomy.vocabulary-tags #wrapper #page-title > .container,
html body.path-taxonomy.page-blog-category #wrapper section.page-title > .container,
html body.path-taxonomy.page-blog-tag #wrapper section.page-title > .container {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
}

html body.path-taxonomy.page-blog-category #wrapper #block-breadcrumbs,
html body.path-taxonomy.page-blog-tag #wrapper #block-breadcrumbs,
html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper #block-breadcrumbs,
html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper #block-breadcrumbs,
html body.path-taxonomy.vocabulary-category #wrapper #block-breadcrumbs,
html body.path-taxonomy.vocabulary-tags #wrapper #block-breadcrumbs {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* ---- Category post-image = /blog / tag desktop card-cap ---- */
html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .blog-post-teaser .post-thumb,
html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .blog-post-teaser .post-media,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-thumb,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-media,
html body.path-taxonomy.vocabulary-category #wrapper .blog-post-teaser .post-thumb,
html body.path-taxonomy.vocabulary-category #wrapper .blog-post-teaser .post-media {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 0.4rem !important;
  order: 0 !important;
  position: relative !important;
  z-index: 3 !important;
}

html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .blog-post-teaser .post-image,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-image,
html body.path-taxonomy.vocabulary-category #wrapper .blog-post-teaser .post-image {
  width: 100% !important;
  max-width: 100% !important;
  aspect-ratio: 16 / 9 !important;
  height: auto !important;
  max-height: none !important;
  margin: 0 0 0.65rem !important;
  padding: 0 !important;
  border: 3px solid #3b0a5c !important;
  border-radius: 14px !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
  background: #1a0a24 !important;
  box-shadow: 0 4px 14px rgba(59, 10, 92, 0.2) !important;
  position: relative !important;
  z-index: 3 !important;
  display: block !important;
}

html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .blog-post-teaser .post-image img,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-image img,
html body.path-taxonomy.vocabulary-category #wrapper .blog-post-teaser .post-image img {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: 100% !important;
  min-height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
  border: 0 !important;
  border-radius: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Align tag desktop image margin with /blog card-cap */
html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper .blog-post-teaser .post-image,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-image,
html body.path-taxonomy.vocabulary-tags #wrapper .blog-post-teaser .post-image {
  margin-top: 0 !important;
  margin-bottom: 0.65rem !important;
}

@media (max-width: 767.98px) {
  html body.path-taxonomy.page-blog-category #wrapper #page-title,
  html body.path-taxonomy.page-blog-tag #wrapper #page-title,
  html body.path-taxonomy.vocabulary-category #wrapper #page-title,
  html body.path-taxonomy.vocabulary-tags #wrapper #page-title {
    margin: 0 !important;
    padding: 0 !important;
  }

  html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .blog-post-teaser .post-thumb,
  html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-thumb,
  html body.path-taxonomy.vocabulary-category #wrapper .blog-post-teaser .post-media,
  html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper .blog-post-teaser .post-thumb,
  html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-thumb,
  html body.path-taxonomy.vocabulary-tags #wrapper .blog-post-teaser .post-media {
    padding: 0 0.15rem !important;
  }

  html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .blog-post-teaser .post-image,
  html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-image,
  html body.path-taxonomy.vocabulary-category #wrapper .blog-post-teaser .post-image,
  html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper .blog-post-teaser .post-image,
  html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-image,
  html body.path-taxonomy.vocabulary-tags #wrapper .blog-post-teaser .post-image {
    margin: 0.25rem 0 0.55rem !important;
    border-radius: 12px !important;
  }
}

/* END blog-term-listing-v6 */

/* ==========================================================================
   blog-term-listing-v6.1 — 2026-08-12
   Desktop still showed a white strip above the mint bar. #content-wide-top
   sits ABOVE #page-title in page.html.twig and v3 gave it 1rem white padding.
   Collapse that shell (search already renders below the crumbs).
   ========================================================================== */

html body.path-taxonomy.page-blog-category #wrapper #content-wide-top,
html body.path-taxonomy.page-blog-tag #wrapper #content-wide-top,
html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper #content-wide-top,
html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper #content-wide-top,
html body.path-taxonomy.vocabulary-category #wrapper #content-wide-top,
html body.path-taxonomy.vocabulary-tags #wrapper #content-wide-top,
html body.path-taxonomy.page-blog-category #wrapper section#content-wide-top,
html body.path-taxonomy.page-blog-tag #wrapper section#content-wide-top,
html body.path-taxonomy.page-blog-category #wrapper .region-content-wide-top,
html body.path-taxonomy.page-blog-tag #wrapper .region-content-wide-top {
  padding-top: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  min-height: 0 !important;
  height: auto !important;
  background: transparent !important;
  background-color: transparent !important;
  border: 0 !important;
}

html body.path-taxonomy.page-blog-category #wrapper #header,
html body.path-taxonomy.page-blog-tag #wrapper #header,
html body.path-taxonomy.vocabulary-category #wrapper #header,
html body.path-taxonomy.vocabulary-tags #wrapper #header,
html body.path-taxonomy.page-blog-category #wrapper .header,
html body.path-taxonomy.page-blog-tag #wrapper .header {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

html body.path-taxonomy.page-blog-category #wrapper #header .header-menu,
html body.path-taxonomy.page-blog-tag #wrapper #header .header-menu,
html body.path-taxonomy.page-blog-category #wrapper #header .nav-menu,
html body.path-taxonomy.page-blog-tag #wrapper #header .nav-menu {
  margin-bottom: 0 !important;
}

/* Category image stack: same attached card-cap as tag /blog */
html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .blog-post-teaser,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser {
  padding: 0 !important;
}

html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .blog-post-teaser .post-content,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-content {
  box-sizing: border-box !important;
  max-width: 100% !important;
}

/* END blog-term-listing-v6.1 */

/* ==========================================================================
   blog-term-listing-v6.2 — 2026-08-12
   Theme .content-wide .block { padding-top: 10–45px } and
   .content-wide .container-wrap { padding-top: 15px } sit on the breadcrumb
   block (it lives in #content-wide-top). That is the white strip.
   ========================================================================== */

html body.path-taxonomy.page-blog-category #wrapper #content-wide-top.content-wide,
html body.path-taxonomy.page-blog-tag #wrapper #content-wide-top.content-wide,
html body.path-taxonomy.page-blog-category #wrapper #main-content,
html body.path-taxonomy.page-blog-tag #wrapper #main-content {
  padding-top: 0 !important;
  margin-top: 0 !important;
}

html body.path-taxonomy.page-blog-category #wrapper #content-wide-top #block-breadcrumbs,
html body.path-taxonomy.page-blog-tag #wrapper #content-wide-top #block-breadcrumbs,
html body.path-taxonomy.page-blog-category #wrapper .content-wide #block-breadcrumbs.block,
html body.path-taxonomy.page-blog-tag #wrapper .content-wide #block-breadcrumbs.block,
html body.path-taxonomy.page-blog-category #wrapper .content-wide .block.block-system-breadcrumb-block,
html body.path-taxonomy.page-blog-tag #wrapper .content-wide .block.block-system-breadcrumb-block {
  padding: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  margin-top: 0 !important;
}

html body.path-taxonomy.page-blog-category #wrapper #content-wide-top #block-breadcrumbs .container-wrap,
html body.path-taxonomy.page-blog-tag #wrapper #content-wide-top #block-breadcrumbs .container-wrap,
html body.path-taxonomy.page-blog-category #wrapper .content-wide #block-breadcrumbs .container-wrap,
html body.path-taxonomy.page-blog-tag #wrapper .content-wide #block-breadcrumbs .container-wrap,
html body.path-taxonomy.page-blog-category #wrapper .content-wide .container-wrap,
html body.path-taxonomy.page-blog-tag #wrapper .content-wide .container-wrap {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  margin-top: 0 !important;
}

/* Attach category images to the green card like /blog */
html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .blog-post-teaser .post-image,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-image {
  margin-bottom: 0.15rem !important;
}

/* END blog-term-listing-v6.2 */

/* ==========================================================================
   blog-term-listing-v7 — 2026-08-12
   Flush menu→breadcrumb (theme .content-wide .block pad), category image =
   tag//blog card-cap, mobile teasers full width like /blog.
   Also chrome for /blog/category and /blog/tag index pages.
   ========================================================================== */

html body.path-taxonomy.page-blog-category #wrapper #main-content,
html body.path-taxonomy.page-blog-tag #wrapper #main-content,
html body.path-taxonomy.vocabulary-category #wrapper #main-content,
html body.path-taxonomy.vocabulary-tags #wrapper #main-content,
html body.page-blog-term-index #wrapper #main-content,
html body.path-taxonomy.page-blog-category #wrapper #content-wide-top,
html body.path-taxonomy.page-blog-tag #wrapper #content-wide-top,
html body.path-taxonomy.vocabulary-category #wrapper #content-wide-top,
html body.path-taxonomy.vocabulary-tags #wrapper #content-wide-top,
html body.page-blog-term-index #wrapper #content-wide-top,
html body.path-taxonomy.page-blog-category #wrapper #content-wide-top.content-wide,
html body.path-taxonomy.page-blog-tag #wrapper #content-wide-top.content-wide,
html body.page-blog-term-index #wrapper #content-wide-top.content-wide,
html body.path-taxonomy.page-blog-category #wrapper .region.region-content-wide-top,
html body.path-taxonomy.page-blog-tag #wrapper .region.region-content-wide-top,
html body.page-blog-term-index #wrapper .region.region-content-wide-top {
  padding: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  margin: 0 !important;
  margin-top: 0 !important;
  min-height: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
}

html body.path-taxonomy.page-blog-category #wrapper #header,
html body.path-taxonomy.page-blog-tag #wrapper #header,
html body.path-taxonomy.vocabulary-category #wrapper #header,
html body.path-taxonomy.vocabulary-tags #wrapper #header,
html body.page-blog-term-index #wrapper #header,
html body.path-taxonomy.page-blog-category #wrapper .header,
html body.path-taxonomy.page-blog-tag #wrapper .header,
html body.page-blog-term-index #wrapper .header,
html body.path-taxonomy.page-blog-category #wrapper .header-menu,
html body.path-taxonomy.page-blog-tag #wrapper .header-menu,
html body.page-blog-term-index #wrapper .header-menu,
html body.path-taxonomy.page-blog-category #wrapper .navbar.nav-menu,
html body.path-taxonomy.page-blog-tag #wrapper .navbar.nav-menu,
html body.page-blog-term-index #wrapper .navbar.nav-menu {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

html body.path-taxonomy.page-blog-category #wrapper .content-wide .block,
html body.path-taxonomy.page-blog-tag #wrapper .content-wide .block,
html body.page-blog-term-index #wrapper .content-wide .block,
html body.path-taxonomy.page-blog-category #wrapper .content-wide #block-breadcrumbs,
html body.path-taxonomy.page-blog-tag #wrapper .content-wide #block-breadcrumbs,
html body.page-blog-term-index #wrapper .content-wide #block-breadcrumbs,
html body.path-taxonomy.page-blog-category #wrapper .content-wide #block-breadcrumbs.block,
html body.path-taxonomy.page-blog-tag #wrapper .content-wide #block-breadcrumbs.block,
html body.page-blog-term-index #wrapper .content-wide #block-breadcrumbs.block,
html body.path-taxonomy.page-blog-category #wrapper .content-wide .block.block-system-breadcrumb-block,
html body.path-taxonomy.page-blog-tag #wrapper .content-wide .block.block-system-breadcrumb-block,
html body.page-blog-term-index #wrapper .content-wide .block.block-system-breadcrumb-block {
  padding: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  margin: 0 !important;
  margin-top: 0 !important;
}

html body.path-taxonomy.page-blog-category #wrapper .content-wide .container-wrap,
html body.path-taxonomy.page-blog-tag #wrapper .content-wide .container-wrap,
html body.page-blog-term-index #wrapper .content-wide .container-wrap,
html body.path-taxonomy.page-blog-category #wrapper .content-wide #block-breadcrumbs .container-wrap,
html body.path-taxonomy.page-blog-tag #wrapper .content-wide #block-breadcrumbs .container-wrap,
html body.page-blog-term-index #wrapper .content-wide #block-breadcrumbs .container-wrap,
html body.path-taxonomy.page-blog-category #wrapper .content-wide .block-content,
html body.path-taxonomy.page-blog-tag #wrapper .content-wide .block-content,
html body.page-blog-term-index #wrapper .content-wide .block-content {
  padding: 0 !important;
  padding-top: 0 !important;
  margin: 0 !important;
}

/* Category post-image = tag desktop card-cap */
html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .blog-post-teaser .post-thumb,
html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .blog-post-teaser .post-media,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-thumb,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-media,
html body.path-taxonomy.vocabulary-category #wrapper .blog-post-teaser .post-thumb,
html body.path-taxonomy.vocabulary-category #wrapper .blog-post-teaser .post-media {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 0.4rem !important;
  order: 0 !important;
  position: relative !important;
  z-index: 3 !important;
}

html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .blog-post-teaser .post-image,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-image,
html body.path-taxonomy.vocabulary-category #wrapper .blog-post-teaser .post-image,
html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper .blog-post-teaser .post-image,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-image {
  width: 100% !important;
  max-width: 100% !important;
  aspect-ratio: 16 / 9 !important;
  height: auto !important;
  margin: 0 0 0 !important;
  padding: 0 !important;
  border: 3px solid #3b0a5c !important;
  border-radius: 14px 14px 0 0 !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
  background: #1a0a24 !important;
  box-shadow: none !important;
  position: relative !important;
  z-index: 3 !important;
  display: block !important;
}

html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .blog-post-teaser .post-content,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-content,
html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper .blog-post-teaser .post-content,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-content {
  margin-top: 0 !important;
  border-radius: 0 0 14px 14px !important;
}

html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .blog-post-teaser .post-image img,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-image img,
html body.path-taxonomy.vocabulary-category #wrapper .blog-post-teaser .post-image img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
  border: 0 !important;
  border-radius: 0 !important;
}

@media (max-width: 767.98px) {
  html body.path-taxonomy.page-blog-category #wrapper .page-wrapper,
  html body.path-taxonomy.page-blog-tag #wrapper .page-wrapper,
  html body.path-taxonomy.vocabulary-category #wrapper .page-wrapper,
  html body.path-taxonomy.vocabulary-tags #wrapper .page-wrapper,
  html body.page-blog-term-index #wrapper .page-wrapper,
  html body.path-taxonomy.page-blog-category #wrapper .page-wrapper > .container,
  html body.path-taxonomy.page-blog-tag #wrapper .page-wrapper > .container,
  html body.path-taxonomy.vocabulary-category #wrapper .page-wrapper > .container,
  html body.path-taxonomy.vocabulary-tags #wrapper .page-wrapper > .container,
  html body.page-blog-term-index #wrapper .page-wrapper > .container {
    padding-left: 0.35rem !important;
    padding-right: 0.35rem !important;
  }

  html body.path-taxonomy.page-blog-category #wrapper .blog-tag-listing-view,
  html body.path-taxonomy.page-blog-tag #wrapper .blog-tag-listing-view,
  html body.path-taxonomy.vocabulary-category #wrapper .blog-tag-listing-view,
  html body.path-taxonomy.vocabulary-tags #wrapper .blog-tag-listing-view,
  html body.page-blog-term-index #wrapper .blog-term-index-view {
    padding-left: 0 !important;
    padding-right: 0 !important;
    width: 100% !important;
  }

  html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser,
  html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser,
  html body.path-taxonomy.vocabulary-category #wrapper .blog-post-teaser,
  html body.path-taxonomy.vocabulary-tags #wrapper .blog-post-teaser {
    width: 100% !important;
    max-width: 100% !important;
  }

  html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-thumb,
  html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-thumb,
  html body.path-taxonomy.vocabulary-category #wrapper .blog-post-teaser .post-media,
  html body.path-taxonomy.vocabulary-tags #wrapper .blog-post-teaser .post-media {
    padding: 0 0.15rem !important;
  }

  html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-image,
  html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-image {
    margin: 0.25rem 0 0 !important;
    border-radius: 12px 12px 0 0 !important;
  }

  html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-content,
  html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-content {
    border-radius: 0 0 12px 12px !important;
  }
}

/* ---- Index pages: /blog/category and /blog/tag ---- */
html body.page-blog-term-index #wrapper .page-wrapper,
html body.page-blog-term-index #wrapper .page-wrapper > .container,
html body.page-blog-term-index #wrapper .region.region-content,
html body.page-blog-term-index #wrapper #main-content .region-content {
  background: #ffffff !important;
}

html body.page-blog-term-index #wrapper #block-breadcrumbs {
  width: 100vw !important;
  max-width: 100vw !important;
  left: 50% !important;
  margin-left: -50vw !important;
  margin-top: 0 !important;
  padding: 0 !important;
  background: #f3e8ff !important;
  border-top: 1px solid #e9d5ff !important;
  border-bottom: 2px solid #6716aa !important;
}

html body.page-blog-term-index #wrapper .breadcrumb ol,
html body.page-blog-term-index #wrapper .breadcrumb .breadcrumb__list {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  align-items: center !important;
  margin: 0 !important;
  padding: 0.75rem 1rem !important;
  list-style: none !important;
}

html body.page-blog-term-index #wrapper .breadcrumb li,
html body.page-blog-term-index #wrapper .breadcrumb .breadcrumb__item,
html body.page-blog-term-index #wrapper .breadcrumb .breadcrumb__item--current {
  display: inline-flex !important;
  flex: 0 1 auto !important;
  width: auto !important;
  max-width: none !important;
}

html body.page-blog-term-index #wrapper .col-md-3.sidebar,
html body.page-blog-term-index #wrapper .sidebar {
  display: none !important;
}

html body.page-blog-term-index #wrapper .col-md-9.left-content.main-content,
html body.page-blog-term-index #wrapper .main-content {
  width: 100% !important;
  max-width: 100% !important;
  flex: 0 0 100% !important;
}

html body.page-blog-term-index #wrapper h1,
html body.page-blog-term-index #wrapper h1.blog-term-index-h1,
html body.page-blog-term-index #wrapper .block-page-title-block h1 {
  display: inline-flex !important;
  margin: 1.25rem auto 0.85rem !important;
  padding: 0.45rem 1.35rem !important;
  background: #f3e8ff !important;
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  border-radius: 999px !important;
  font-size: 1.35rem !important;
  font-weight: 800 !important;
  text-align: center !important;
}

html body.page-blog-term-index #wrapper .block-page-title-block,
html body.page-blog-term-index #wrapper .block-page-title-block .container-wrap {
  text-align: center !important;
  background: transparent !important;
  border: 0 !important;
}

html body.page-blog-term-index #wrapper .blog-term-index-view,
html body.page-blog-term-index #wrapper .view-blog-taxonomy {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 1.25rem !important;
  max-width: 1100px !important;
  margin: 0 auto 2rem !important;
  padding: 0 0.75rem 1.5rem !important;
}

html body.page-blog-term-index #wrapper .blog-term-index-view > .view-header,
html body.page-blog-term-index #wrapper .view-blog-taxonomy > .view-header,
html body.page-blog-term-index #wrapper .blog-term-index-view > .view-footer,
html body.page-blog-term-index #wrapper .view-blog-taxonomy > .pagerer-container,
html body.page-blog-term-index #wrapper .view-blog-taxonomy > nav.pager {
  grid-column: 1 / -1 !important;
}

html body.page-blog-term-index #wrapper .blog-term-index-card,
html body.page-blog-term-index #wrapper .view-blog-taxonomy .views-row {
  display: flex !important;
  flex-direction: column !important;
  margin: 0 !important;
  padding: 1.15rem 1.2rem 1.2rem !important;
  background:
    radial-gradient(90% 70% at 15% 0%, rgba(201, 160, 232, 0.28) 0%, transparent 50%),
    linear-gradient(160deg, #7b2cbf 0%, #6716aa 48%, #3b0a5c 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border: 2px solid #000 !important;
  border-radius: 14px !important;
  box-sizing: border-box !important;
}

html body.page-blog-term-index #wrapper .blog-term-index-card a,
html body.page-blog-term-index #wrapper .view-blog-taxonomy .views-row a {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-weight: 800 !important;
  font-size: 1.15rem !important;
  text-decoration: none !important;
}

html body.page-blog-term-index #wrapper .blog-term-index-card .views-field-description,
html body.page-blog-term-index #wrapper .view-blog-taxonomy .views-row .views-field-description,
html body.page-blog-term-index #wrapper .blog-term-index-card .views-field-description * {
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  font-size: 0.92rem !important;
  line-height: 1.45 !important;
  margin-top: 0.45rem !important;
}

@media (max-width: 991.98px) {
  html body.page-blog-term-index #wrapper .blog-term-index-view,
  html body.page-blog-term-index #wrapper .view-blog-taxonomy {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 767.98px) {
  html body.page-blog-term-index #wrapper .blog-term-index-view,
  html body.page-blog-term-index #wrapper .view-blog-taxonomy {
    grid-template-columns: 1fr !important;
    padding-left: 0.35rem !important;
    padding-right: 0.35rem !important;
  }
}

/* END blog-term-listing-v7 */

/* ==========================================================================
   blog-term-listing-v7.1 — 2026-08-12
   100vw / left:50% / -50vw broke when #content-wide-top padding was zeroed
   (bar sat on the right, white on the left). Use a simple 100% bar.
   Keep search as a centered card; do not strip its padding.
   ========================================================================== */

html body.path-taxonomy.page-blog-category #wrapper #content-wide-top,
html body.path-taxonomy.page-blog-tag #wrapper #content-wide-top,
html body.path-taxonomy.vocabulary-category #wrapper #content-wide-top,
html body.path-taxonomy.vocabulary-tags #wrapper #content-wide-top,
html body.page-blog-term-index #wrapper #content-wide-top,
html body.path-taxonomy.page-blog-category #wrapper #content-wide-top.content-wide,
html body.path-taxonomy.page-blog-tag #wrapper #content-wide-top.content-wide,
html body.page-blog-term-index #wrapper #content-wide-top.content-wide {
  width: 100% !important;
  max-width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: visible !important;
}

html body.path-taxonomy.page-blog-category #wrapper #block-breadcrumbs,
html body.path-taxonomy.page-blog-tag #wrapper #block-breadcrumbs,
html body.path-taxonomy.vocabulary-category #wrapper #block-breadcrumbs,
html body.path-taxonomy.vocabulary-tags #wrapper #block-breadcrumbs,
html body.page-blog-term-index #wrapper #block-breadcrumbs,
html body.path-taxonomy.page-blog-category #wrapper #content-wide-top #block-breadcrumbs,
html body.path-taxonomy.page-blog-tag #wrapper #content-wide-top #block-breadcrumbs,
html body.page-blog-term-index #wrapper #content-wide-top #block-breadcrumbs {
  position: relative !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding: 0 !important;
  transform: none !important;
  background: #f3e8ff !important;
  border-top: 1px solid #e9d5ff !important;
  border-bottom: 2px solid #6716aa !important;
}

html body.path-taxonomy.page-blog-category #wrapper #block-martis-exposedformblog-searchblog-search,
html body.path-taxonomy.page-blog-tag #wrapper #block-martis-exposedformblog-searchblog-search,
html body.page-blog-term-index #wrapper #block-martis-exposedformblog-searchblog-search {
  width: min(40rem, calc(100% - 2rem)) !important;
  max-width: 40rem !important;
  margin: 1rem auto 0.5rem !important;
  padding: 1.1rem 1.25rem 1.15rem !important;
  background: #f3fbf6 !important;
  border: 1px solid #e9d5ff !important;
  border-radius: 14px !important;
  box-sizing: border-box !important;
}

html body.path-taxonomy.page-blog-category #wrapper #block-martis-exposedformblog-searchblog-search .block-title,
html body.path-taxonomy.page-blog-tag #wrapper #block-martis-exposedformblog-searchblog-search .block-title,
html body.page-blog-term-index #wrapper #block-martis-exposedformblog-searchblog-search .block-title {
  background: transparent !important;
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  text-align: center !important;
}

html body.page-blog-term-index #wrapper #views-exposed-form-blog-search-blog-search input.form-text,
html body.path-taxonomy.page-blog-category #wrapper #views-exposed-form-blog-search-blog-search input.form-text,
html body.path-taxonomy.page-blog-tag #wrapper #views-exposed-form-blog-search-blog-search input.form-text {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

/* END blog-term-listing-v7.1 */

/* ==========================================================================
   blog-term-listing-v8 — 2026-08-12
   Category/tag/index breadcrumb bars were thinner than /blog.
   Keep #block-breadcrumbs padding:0 (avoids theme .content-wide .block gap)
   but restore /blog nav + item padding and type size.
   ========================================================================== */

html body.path-taxonomy.page-blog-category #wrapper .breadcrumb,
html body.path-taxonomy.page-blog-tag #wrapper .breadcrumb,
html body.path-taxonomy.vocabulary-category #wrapper .breadcrumb,
html body.path-taxonomy.vocabulary-tags #wrapper .breadcrumb,
html body.page-blog-term-index #wrapper .breadcrumb,
html body.path-taxonomy.page-blog-category #wrapper nav.breadcrumb,
html body.path-taxonomy.page-blog-tag #wrapper nav.breadcrumb,
html body.page-blog-term-index #wrapper nav.breadcrumb {
  padding: 0.95rem 1.35rem !important;
}

html body.path-taxonomy.page-blog-category #wrapper .breadcrumb ol,
html body.path-taxonomy.page-blog-tag #wrapper .breadcrumb ol,
html body.path-taxonomy.vocabulary-category #wrapper .breadcrumb ol,
html body.path-taxonomy.vocabulary-tags #wrapper .breadcrumb ol,
html body.page-blog-term-index #wrapper .breadcrumb ol,
html body.path-taxonomy.page-blog-category #wrapper .breadcrumb .breadcrumb__list,
html body.path-taxonomy.page-blog-tag #wrapper .breadcrumb .breadcrumb__list,
html body.page-blog-term-index #wrapper .breadcrumb .breadcrumb__list {
  padding: 0 !important;
  gap: 0.2rem 0.15rem !important;
}

html body.path-taxonomy.page-blog-category #wrapper .breadcrumb li,
html body.path-taxonomy.page-blog-tag #wrapper .breadcrumb li,
html body.path-taxonomy.vocabulary-category #wrapper .breadcrumb li,
html body.path-taxonomy.vocabulary-tags #wrapper .breadcrumb li,
html body.page-blog-term-index #wrapper .breadcrumb li,
html body.path-taxonomy.page-blog-category #wrapper .breadcrumb .breadcrumb__item,
html body.path-taxonomy.page-blog-tag #wrapper .breadcrumb .breadcrumb__item,
html body.page-blog-term-index #wrapper .breadcrumb .breadcrumb__item,
html body.path-taxonomy.page-blog-category #wrapper .breadcrumb li:last-child,
html body.path-taxonomy.page-blog-tag #wrapper .breadcrumb li:last-child,
html body.page-blog-term-index #wrapper .breadcrumb li:last-child,
html body.path-taxonomy.page-blog-category #wrapper .breadcrumb .breadcrumb__item--current,
html body.path-taxonomy.page-blog-tag #wrapper .breadcrumb .breadcrumb__item--current,
html body.page-blog-term-index #wrapper .breadcrumb .breadcrumb__item--current {
  padding: 0.3rem 0.15rem !important;
  font-size: 1.08rem !important;
  line-height: 1.45 !important;
}

@media (max-width: 767.98px) {
  html body.path-taxonomy.page-blog-category #wrapper .breadcrumb,
  html body.path-taxonomy.page-blog-tag #wrapper .breadcrumb,
  html body.path-taxonomy.vocabulary-category #wrapper .breadcrumb,
  html body.path-taxonomy.vocabulary-tags #wrapper .breadcrumb,
  html body.page-blog-term-index #wrapper .breadcrumb,
  html body.path-taxonomy.page-blog-category #wrapper nav.breadcrumb,
  html body.path-taxonomy.page-blog-tag #wrapper nav.breadcrumb,
  html body.page-blog-term-index #wrapper nav.breadcrumb {
    padding: 0.95rem 1rem !important;
  }

  html body.path-taxonomy.page-blog-category #wrapper .breadcrumb li,
  html body.path-taxonomy.page-blog-tag #wrapper .breadcrumb li,
  html body.path-taxonomy.vocabulary-category #wrapper .breadcrumb li,
  html body.path-taxonomy.vocabulary-tags #wrapper .breadcrumb li,
  html body.page-blog-term-index #wrapper .breadcrumb li,
  html body.path-taxonomy.page-blog-category #wrapper .breadcrumb .breadcrumb__item,
  html body.path-taxonomy.page-blog-tag #wrapper .breadcrumb .breadcrumb__item,
  html body.page-blog-term-index #wrapper .breadcrumb .breadcrumb__item,
  html body.path-taxonomy.page-blog-category #wrapper .breadcrumb li:last-child,
  html body.path-taxonomy.page-blog-tag #wrapper .breadcrumb li:last-child,
  html body.page-blog-term-index #wrapper .breadcrumb li:last-child,
  html body.path-taxonomy.page-blog-category #wrapper .breadcrumb .breadcrumb__item--current,
  html body.path-taxonomy.page-blog-tag #wrapper .breadcrumb .breadcrumb__item--current,
  html body.page-blog-term-index #wrapper .breadcrumb .breadcrumb__item--current {
    padding: 0.3rem 0.1rem !important;
    font-size: 1.02rem !important;
    line-height: 1.45 !important;
  }
}

@media (max-width: 575.98px) {
  html body.path-taxonomy.page-blog-category #wrapper .breadcrumb,
  html body.path-taxonomy.page-blog-tag #wrapper .breadcrumb,
  html body.page-blog-term-index #wrapper .breadcrumb {
    padding: 1rem 0.9rem !important;
  }

  html body.path-taxonomy.page-blog-category #wrapper .breadcrumb li,
  html body.path-taxonomy.page-blog-tag #wrapper .breadcrumb li,
  html body.page-blog-term-index #wrapper .breadcrumb li,
  html body.path-taxonomy.page-blog-category #wrapper .breadcrumb .breadcrumb__item,
  html body.path-taxonomy.page-blog-tag #wrapper .breadcrumb .breadcrumb__item,
  html body.page-blog-term-index #wrapper .breadcrumb .breadcrumb__item {
    font-size: 1rem !important;
    line-height: 1.5 !important;
  }
}

/* END blog-term-listing-v8 */

/* ==========================================================================
   blog-term-listing-v9 — 2026-08-12
   Term pages still looked thin: older
   html body.path-taxonomy #wrapper #block-breadcrumbs .breadcrumb
   { padding-top:0; padding-bottom:0.35rem } has TWO IDs and beat v8.
   Match /blog with higher-specificity longhands.
   ========================================================================== */

html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper #content-wide-top #block-breadcrumbs.block nav.breadcrumb,
html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper #content-wide-top #block-breadcrumbs.block nav.breadcrumb,
html body.path-taxonomy.page-blog-category #wrapper #content-wide-top #block-breadcrumbs nav.breadcrumb,
html body.path-taxonomy.page-blog-tag #wrapper #content-wide-top #block-breadcrumbs nav.breadcrumb,
html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper #block-breadcrumbs .breadcrumb,
html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper #block-breadcrumbs .breadcrumb {
  padding: 0.95rem 1.35rem !important;
  padding-top: 0.95rem !important;
  padding-right: 1.35rem !important;
  padding-bottom: 0.95rem !important;
  padding-left: 1.35rem !important;
  min-height: 3.4rem !important;
  box-sizing: border-box !important;
}

html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper #content-wide-top #block-breadcrumbs .breadcrumb ol.breadcrumb__list,
html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper #content-wide-top #block-breadcrumbs .breadcrumb ol.breadcrumb__list,
html body.path-taxonomy.page-blog-category #wrapper #block-breadcrumbs .breadcrumb ol,
html body.path-taxonomy.page-blog-tag #wrapper #block-breadcrumbs .breadcrumb ol {
  padding: 0 !important;
  margin: 0 !important;
}

html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper #content-wide-top #block-breadcrumbs .breadcrumb li.breadcrumb__item,
html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper #content-wide-top #block-breadcrumbs .breadcrumb li.breadcrumb__item,
html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper #block-breadcrumbs .breadcrumb li,
html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper #block-breadcrumbs .breadcrumb li,
html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper #block-breadcrumbs .breadcrumb .breadcrumb__item--current,
html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper #block-breadcrumbs .breadcrumb .breadcrumb__item--current {
  padding: 0.3rem 0.15rem !important;
  padding-top: 0.3rem !important;
  padding-bottom: 0.3rem !important;
  font-size: 1.08rem !important;
  line-height: 1.45 !important;
}

@media (max-width: 767.98px) {
  html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper #content-wide-top #block-breadcrumbs.block nav.breadcrumb,
  html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper #content-wide-top #block-breadcrumbs.block nav.breadcrumb,
  html body.path-taxonomy.page-blog-category #wrapper #block-breadcrumbs .breadcrumb,
  html body.path-taxonomy.page-blog-tag #wrapper #block-breadcrumbs .breadcrumb {
    padding: 0.95rem 1rem !important;
    padding-top: 0.95rem !important;
    padding-bottom: 0.95rem !important;
    min-height: 3.2rem !important;
  }

  html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper #content-wide-top #block-breadcrumbs .breadcrumb li.breadcrumb__item,
  html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper #content-wide-top #block-breadcrumbs .breadcrumb li.breadcrumb__item,
  html body.path-taxonomy.page-blog-category #wrapper #block-breadcrumbs .breadcrumb li,
  html body.path-taxonomy.page-blog-tag #wrapper #block-breadcrumbs .breadcrumb li {
    padding: 0.3rem 0.1rem !important;
    font-size: 1.02rem !important;
    line-height: 1.45 !important;
  }
}

@media (max-width: 575.98px) {
  html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper #content-wide-top #block-breadcrumbs.block nav.breadcrumb,
  html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper #content-wide-top #block-breadcrumbs.block nav.breadcrumb {
    padding: 1rem 0.9rem !important;
    padding-top: 1rem !important;
    padding-bottom: 1rem !important;
    min-height: 3.25rem !important;
  }

  html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper #content-wide-top #block-breadcrumbs .breadcrumb li.breadcrumb__item,
  html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper #content-wide-top #block-breadcrumbs .breadcrumb li.breadcrumb__item {
    font-size: 1rem !important;
    line-height: 1.5 !important;
  }
}

/* END blog-term-listing-v9 */

/* ==========================================================================
   blog-term-index-v10 — 2026-08-12
   /blog/category and /blog/tag: real H1 + intro, 2-col cards with
   term descriptions. Do not change per-term archive listing CSS.
   ========================================================================== */

html body.page-blog-term-index #wrapper .blog-term-index-view,
html body.page-blog-term-index #wrapper .view-blog-taxonomy.blog-term-index-view {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 1.35rem 1.4rem !important;
  max-width: 920px !important;
  margin: 0 auto 2.25rem !important;
  padding: 0 0.85rem 2rem !important;
}

html body.page-blog-term-index #wrapper .blog-term-index-view > .view-header,
html body.page-blog-term-index #wrapper .view-blog-taxonomy > .view-header,
html body.page-blog-term-index #wrapper .blog-term-index-hero,
html body.page-blog-term-index #wrapper .blog-term-index-intro {
  grid-column: 1 / -1 !important;
  width: 100% !important;
  max-width: 760px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

html body.page-blog-term-index #wrapper .blog-term-index-hero {
  display: block !important;
  text-align: center !important;
  padding: 0.35rem 0 1.35rem !important;
}

html body.page-blog-term-index #wrapper .blog-term-index-hero h1,
html body.page-blog-term-index #wrapper .blog-term-index-hero h1.blog-term-index-h1,
html body.page-blog-term-index #wrapper h1.blog-term-index-h1 {
  display: block !important;
  width: 100% !important;
  max-width: 760px !important;
  margin: 0.85rem auto 0.85rem !important;
  padding: 0 !important;
  background: transparent !important;
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  border: 0 !important;
  border-radius: 0 !important;
  font-size: 1.85rem !important;
  line-height: 1.25 !important;
  font-weight: 800 !important;
  letter-spacing: -0.02em !important;
  text-align: center !important;
}

html body.page-blog-term-index #wrapper .blog-term-index-intro {
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  font-size: 1.05rem !important;
  line-height: 1.6 !important;
  text-align: left !important;
}

html body.page-blog-term-index #wrapper .blog-term-index-intro p {
  margin: 0 0 0.75rem !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
}

html body.page-blog-term-index #wrapper .blog-term-index-intro p:last-child {
  margin-bottom: 0 !important;
}

html body.page-blog-term-index #wrapper .blog-term-index-intro a,
html body.page-blog-term-index #wrapper .blog-term-index-back a {
  color: #6716aa !important;
  -webkit-text-fill-color: #6716aa !important;
  font-weight: 700 !important;
  text-decoration: underline !important;
  text-underline-offset: 0.15em !important;
}

html body.page-blog-term-index #wrapper .blog-term-index-card,
html body.page-blog-term-index #wrapper .blog-term-index-view .views-row {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  min-height: 11.5rem !important;
  padding: 1.25rem 1.3rem 1.15rem !important;
}

html body.page-blog-term-index #wrapper .blog-term-index-card h2,
html body.page-blog-term-index #wrapper .blog-term-index-card h2.blog-term-index-title,
html body.page-blog-term-index #wrapper .blog-term-index-title {
  margin: 0 0 0.55rem !important;
  font-size: 1.22rem !important;
  line-height: 1.3 !important;
  font-weight: 800 !important;
}

html body.page-blog-term-index #wrapper .blog-term-index-card .blog-term-index-desc,
html body.page-blog-term-index #wrapper .blog-term-index-card .views-field-description,
html body.page-blog-term-index #wrapper .blog-term-index-card .views-field-description *,
html body.page-blog-term-index #wrapper .blog-term-index-desc {
  display: block !important;
  margin: 0 !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  font-size: 0.96rem !important;
  line-height: 1.5 !important;
  font-weight: 500 !important;
}

html body.page-blog-term-index #wrapper .blog-term-index-cue-wrap,
html body.page-blog-term-index #wrapper .blog-term-index-card .views-field-nothing {
  margin-top: auto !important;
  padding-top: 0.85rem !important;
}

html body.page-blog-term-index #wrapper .blog-term-index-cue {
  display: inline-block !important;
  color: #c8f5dc !important;
  -webkit-text-fill-color: #c8f5dc !important;
  font-size: 0.82rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
}

html body.page-blog-term-index #wrapper .blog-term-index-cue::after {
  content: " →";
}

@media (max-width: 767.98px) {
  html body.page-blog-term-index #wrapper .blog-term-index-view,
  html body.page-blog-term-index #wrapper .view-blog-taxonomy.blog-term-index-view {
    grid-template-columns: 1fr !important;
    padding-left: 0.4rem !important;
    padding-right: 0.4rem !important;
  }

  html body.page-blog-term-index #wrapper .blog-term-index-hero h1.blog-term-index-h1,
  html body.page-blog-term-index #wrapper h1.blog-term-index-h1 {
    font-size: 1.45rem !important;
    line-height: 1.28 !important;
    margin-top: 0.65rem !important;
  }

  html body.page-blog-term-index #wrapper .blog-term-index-intro {
    font-size: 1rem !important;
  }

  html body.page-blog-term-index #wrapper .blog-term-index-card,
  html body.page-blog-term-index #wrapper .blog-term-index-view .views-row {
    min-height: 0 !important;
  }
}

/* END blog-term-index-v10 */

/* ==========================================================================
   blog-term-index-v11 — 2026-08-12
   Restyle /blog/category and /blog/tag to match /blog + term archives:
   green listing H1 badge, mint intro panel, white directory cards.
   Scoped to body.page-blog-term-index only.
   ========================================================================== */

html body.page-blog-term-index #wrapper .page-wrapper,
html body.page-blog-term-index #wrapper .page-wrapper > .container,
html body.page-blog-term-index #wrapper .region.region-content,
html body.page-blog-term-index #wrapper #main-content,
html body.page-blog-term-index #wrapper #main-content .region-content,
html body.page-blog-term-index #wrapper .col-md-9.left-content.main-content {
  background: #ffffff !important;
  background-color: #ffffff !important;
}

html body.page-blog-term-index #wrapper .blog-term-index-view,
html body.page-blog-term-index #wrapper .view-blog-taxonomy.blog-term-index-view,
html body.page-blog-term-index #wrapper .view-blog-taxonomy {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  align-items: stretch !important;
  gap: 1.15rem 1.15rem !important;
  max-width: 1120px !important;
  margin: 0 auto 2.25rem !important;
  padding: 0 0.85rem 2rem !important;
  background: transparent !important;
}

html body.page-blog-term-index #wrapper .blog-term-index-view > .view-header,
html body.page-blog-term-index #wrapper .view-blog-taxonomy > .view-header,
html body.page-blog-term-index #wrapper .blog-term-index-hero,
html body.page-blog-term-index #wrapper .blog-term-index-intro {
  grid-column: 1 / -1 !important;
}

html body.page-blog-term-index #wrapper .blog-term-index-hero {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  width: 100% !important;
  max-width: 920px !important;
  margin: 0.35rem auto 1.15rem !important;
  padding: 0.15rem 0 0 !important;
  background: transparent !important;
  border: 0 !important;
  text-align: center !important;
}

html body.page-blog-term-index #wrapper .blog-term-index-eyebrow {
  margin: 0 0 0.45rem !important;
  padding: 0 !important;
  color: #7b2cbf !important;
  -webkit-text-fill-color: #7b2cbf !important;
  font-size: 0.78rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  background: transparent !important;
}

html body.page-blog-term-index #wrapper h1,
html body.page-blog-term-index #wrapper h1.blog-term-index-h1,
html body.page-blog-term-index #wrapper .blog-term-index-hero h1.blog-term-index-h1,
html body.page-blog-term-index #wrapper .block-page-title-block h1 {
  display: block !important;
  visibility: visible !important;
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto 0.95rem !important;
  padding: 0.85rem 1.2rem !important;
  background: linear-gradient(135deg, #b781e3 0%, #7b2cbf 55%, #6716aa 100%) !important;
  background-color: #7b2cbf !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border: 2px solid #000000 !important;
  border-radius: 8px !important;
  text-align: center !important;
  font-size: clamp(1.15rem, 2.5vw, 1.6rem) !important;
  font-weight: 800 !important;
  line-height: 1.3 !important;
  letter-spacing: 0.01em !important;
  text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000 !important;
  word-wrap: break-word !important;
  overflow-wrap: anywhere !important;
  box-shadow: 0 3px 12px rgba(59, 10, 92, 0.22) !important;
}

html body.page-blog-term-index #wrapper .blog-term-index-intro {
  display: block !important;
  width: 100% !important;
  max-width: 46rem !important;
  margin: 0 auto 0.35rem !important;
  padding: 1.2rem 1.35rem 1.25rem !important;
  background: #ffffff !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  border: 1px solid #e9d5ff !important;
  border-left: 5px solid #6716aa !important;
  border-radius: 14px !important;
  box-shadow: 0 4px 14px rgba(59, 10, 92, 0.08) !important;
  box-sizing: border-box !important;
  text-align: left !important;
  font-size: 1.05rem !important;
  line-height: 1.6 !important;
}

html body.page-blog-term-index #wrapper .blog-term-index-intro p {
  margin: 0 0 0.75rem !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  font-size: inherit !important;
  line-height: inherit !important;
}

html body.page-blog-term-index #wrapper .blog-term-index-intro p:last-child {
  margin-bottom: 0 !important;
}

html body.page-blog-term-index #wrapper .blog-term-index-back {
  margin-top: 0.95rem !important;
}

html body.page-blog-term-index #wrapper .blog-term-index-back-btn,
html body.page-blog-term-index #wrapper .blog-term-index-intro a.blog-term-index-back-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 44px !important;
  padding: 0.45rem 1.15rem !important;
  background: #ffffff !important;
  color: #5b21b6 !important;
  -webkit-text-fill-color: #5b21b6 !important;
  border: 2px solid #000000 !important;
  border-radius: 999px !important;
  font-weight: 800 !important;
  font-size: 0.95rem !important;
  text-decoration: none !important;
  box-shadow: 0 2px 0 #000 !important;
}

html body.page-blog-term-index #wrapper .blog-term-index-back-btn:hover,
html body.page-blog-term-index #wrapper .blog-term-index-intro a.blog-term-index-back-btn:hover {
  background: #f3e8ff !important;
  transform: translateY(-1px);
}

html body.page-blog-term-index #wrapper .blog-term-index-card,
html body.page-blog-term-index #wrapper .blog-term-index-view .views-row,
html body.page-blog-term-index #wrapper .view-blog-taxonomy .blog-term-index-card {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  min-height: 12.5rem !important;
  margin: 0 !important;
  padding: 1.15rem 1.2rem 1.1rem !important;
  background: #ffffff !important;
  background-image: none !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  border: 2px solid #000000 !important;
  border-radius: 14px !important;
  box-shadow: 0 3px 0 rgba(0, 0, 0, 0.08) !important;
  box-sizing: border-box !important;
  translate: 0 0;
  transition: translate 0.16s ease, box-shadow 0.16s ease !important;
}

html body.page-blog-term-index #wrapper .blog-term-index-card:hover,
html body.page-blog-term-index #wrapper .blog-term-index-view .views-row:hover {
  translate: 0 -3px;
  box-shadow: 0 8px 18px rgba(59, 10, 92, 0.14) !important;
}

html body.page-blog-term-index #wrapper .blog-term-index-card::before {
  content: "Category" !important;
  display: inline-block !important;
  margin: 0 0 0.55rem !important;
  padding: 0.12rem 0.55rem !important;
  background: #f3e8ff !important;
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  border: 1px solid #3b0a5c !important;
  border-radius: 999px !important;
  font-size: 0.68rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  line-height: 1.3 !important;
}

html body.page-blog-tag-index #wrapper .blog-term-index-card::before {
  content: "Topic" !important;
}

html body.page-blog-term-index #wrapper .blog-term-index-card h2,
html body.page-blog-term-index #wrapper .blog-term-index-card h2.blog-term-index-title,
html body.page-blog-term-index #wrapper .blog-term-index-title {
  margin: 0 0 0.5rem !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  font-size: 1.18rem !important;
  line-height: 1.3 !important;
  font-weight: 800 !important;
}

html body.page-blog-term-index #wrapper .blog-term-index-card a,
html body.page-blog-term-index #wrapper .blog-term-index-card h2 a,
html body.page-blog-term-index #wrapper .view-blog-taxonomy .views-row a {
  position: static !important;
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  font-weight: 800 !important;
  font-size: inherit !important;
  text-decoration: none !important;
  background: transparent !important;
}

html body.page-blog-term-index #wrapper .blog-term-index-card h2 a::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 2 !important;
}

html body.page-blog-term-index #wrapper .blog-term-index-card .blog-term-index-desc,
html body.page-blog-term-index #wrapper .blog-term-index-card .views-field-description,
html body.page-blog-term-index #wrapper .blog-term-index-card .views-field-description *,
html body.page-blog-term-index #wrapper .blog-term-index-desc {
  display: block !important;
  margin: 0 !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  font-size: 0.95rem !important;
  line-height: 1.5 !important;
  font-weight: 500 !important;
  background: transparent !important;
}

html body.page-blog-term-index #wrapper .blog-term-index-cue-wrap,
html body.page-blog-term-index #wrapper .blog-term-index-card .views-field-nothing {
  margin-top: auto !important;
  padding-top: 0.9rem !important;
  position: relative !important;
  z-index: 1 !important;
}

html body.page-blog-term-index #wrapper .blog-term-index-cue {
  display: inline-flex !important;
  align-items: center !important;
  color: #6716aa !important;
  -webkit-text-fill-color: #6716aa !important;
  font-size: 0.78rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
}

html body.page-blog-term-index #wrapper .blog-term-index-cue::after {
  content: " →" !important;
}

@media (max-width: 1099.98px) {
  html body.page-blog-term-index #wrapper .blog-term-index-view,
  html body.page-blog-term-index #wrapper .view-blog-taxonomy.blog-term-index-view,
  html body.page-blog-term-index #wrapper .view-blog-taxonomy {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 767.98px) {
  html body.page-blog-term-index #wrapper .blog-term-index-view,
  html body.page-blog-term-index #wrapper .view-blog-taxonomy.blog-term-index-view,
  html body.page-blog-term-index #wrapper .view-blog-taxonomy {
    grid-template-columns: 1fr !important;
    gap: 0.85rem !important;
    padding-left: 0.35rem !important;
    padding-right: 0.35rem !important;
  }

  html body.page-blog-term-index #wrapper h1.blog-term-index-h1,
  html body.page-blog-term-index #wrapper .blog-term-index-hero h1.blog-term-index-h1 {
    font-size: 1.08rem !important;
    padding: 0.7rem 0.85rem !important;
    line-height: 1.35 !important;
    margin-bottom: 0.8rem !important;
  }

  html body.page-blog-term-index #wrapper .blog-term-index-intro {
    width: 100% !important;
    padding: 1rem 0.95rem 1.05rem !important;
    font-size: 1rem !important;
    border-radius: 12px !important;
  }

  html body.page-blog-term-index #wrapper .blog-term-index-back-btn,
  html body.page-blog-term-index #wrapper .blog-term-index-intro a.blog-term-index-back-btn {
    width: 100% !important;
  }

  html body.page-blog-term-index #wrapper .blog-term-index-card,
  html body.page-blog-term-index #wrapper .blog-term-index-view .views-row {
    min-height: 0 !important;
    padding: 1rem 1rem 0.95rem !important;
    border-radius: 12px !important;
  }

  html body.page-blog-term-index #wrapper .blog-term-index-card:hover,
  html body.page-blog-term-index #wrapper .blog-term-index-view .views-row:hover {
    translate: none;
  }

  html body.page-blog-term-index #wrapper .blog-term-index-title {
    font-size: 1.12rem !important;
  }
}

/* END blog-term-index-v11 */

/* ==========================================================================
   blog-term-index-v11.1 — 2026-08-12
   Beat Martis custom_css .region.region-content p { bg #6716aa; color #fff }
   so the intro reads like term-archive .blog-tag-intro, not green boxes.
   ========================================================================== */

html body.page-blog-term-index #wrapper .region.region-content .blog-term-index-intro,
html body.page-blog-term-index.path-blog #wrapper .region.region-content .blog-term-index-intro,
html body.page-blog-category-index #wrapper .region.region-content .blog-term-index-intro,
html body.page-blog-tag-index #wrapper .region.region-content .blog-term-index-intro {
  background: #ffffff !important;
  background-color: #ffffff !important;
  background-image: none !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
}

html body.page-blog-term-index #wrapper .region.region-content .blog-term-index-intro p,
html body.page-blog-term-index.path-blog #wrapper .region.region-content .blog-term-index-intro p,
html body.page-blog-term-index #wrapper .region.region-content .blog-term-index-hero p,
html body.page-blog-term-index #wrapper .region.region-content .blog-term-index-intro p.blog-term-index-back,
html body.page-blog-category-index #wrapper .region.region-content .blog-term-index-intro p,
html body.page-blog-tag-index #wrapper .region.region-content .blog-term-index-intro p {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  text-shadow: none !important;
  padding: 0 !important;
  margin: 0 0 0.75rem !important;
  display: block !important;
  width: auto !important;
  max-width: none !important;
}

html body.page-blog-term-index #wrapper .region.region-content .blog-term-index-intro p:last-child,
html body.page-blog-term-index.path-blog #wrapper .region.region-content .blog-term-index-intro p:last-child {
  margin-bottom: 0 !important;
}

html body.page-blog-term-index #wrapper .region.region-content .blog-term-index-eyebrow,
html body.page-blog-term-index.path-blog #wrapper .region.region-content .blog-term-index-eyebrow {
  background: transparent !important;
  background-color: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: #7b2cbf !important;
  -webkit-text-fill-color: #7b2cbf !important;
  padding: 0 !important;
  margin: 0 0 0.45rem !important;
}

html body.page-blog-term-index #wrapper .region.region-content .blog-term-index-back,
html body.page-blog-term-index.path-blog #wrapper .region.region-content p.blog-term-index-back {
  margin-top: 0.95rem !important;
  margin-bottom: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}

html body.page-blog-term-index #wrapper .region.region-content .blog-term-index-back-btn,
html body.page-blog-term-index.path-blog #wrapper .region.region-content a.blog-term-index-back-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 44px !important;
  padding: 0.45rem 1.15rem !important;
  background: #ffffff !important;
  background-color: #ffffff !important;
  color: #5b21b6 !important;
  -webkit-text-fill-color: #5b21b6 !important;
  border: 2px solid #000000 !important;
  border-radius: 999px !important;
  font-weight: 800 !important;
  text-decoration: none !important;
  box-shadow: 0 2px 0 #000 !important;
  text-shadow: none !important;
}

/* END blog-term-index-v11.1 */

/* ==========================================================================
   blog-term-teaser-v12 — 2026-08-12
   /blog/category/* and /blog/tag/* post cards = /blog overlap stack.
   Beats v7 16:9 card-cap (3px green, detached image).
   Do not apply to page-blog-term-index directory cards.
   ========================================================================== */

html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper article.blog-post-teaser,
html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .blog-post-teaser,
html body.path-taxonomy.page-blog-category #wrapper article.blog-post-teaser,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser,
html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper article.blog-post-teaser,
html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper .blog-post-teaser,
html body.path-taxonomy.page-blog-tag #wrapper article.blog-post-teaser,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 0 0.35rem !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  overflow: visible !important;
}

html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .blog-post-teaser .post-content-wrap,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-content-wrap,
html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper .blog-post-teaser .post-content-wrap,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-content-wrap {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  gap: 0 !important;
  overflow: visible !important;
}

html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .blog-post-teaser .content-wrap,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .content-wrap,
html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper .blog-post-teaser .content-wrap,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .content-wrap {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  width: 100% !important;
  margin: 0 auto !important;
  padding: 0 !important;
}

html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .blog-post-teaser .post-thumb,
html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .blog-post-teaser .post-media,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-thumb,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-media,
html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper .blog-post-teaser .post-thumb,
html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper .blog-post-teaser .post-media,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-thumb,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-media {
  display: flex !important;
  justify-content: center !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  order: 0 !important;
  overflow: visible !important;
  height: auto !important;
  position: relative !important;
  z-index: 3 !important;
}

html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .blog-post-teaser .post-image,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-image,
html body.path-taxonomy.vocabulary-category #wrapper .blog-post-teaser .post-image,
html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper .blog-post-teaser .post-image,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-image,
html body.path-taxonomy.vocabulary-tags #wrapper .blog-post-teaser .post-image {
  width: 92% !important;
  max-width: 92% !important;
  aspect-ratio: auto !important;
  height: auto !important;
  max-height: none !important;
  margin: 0.55rem auto -0.95rem !important;
  padding: 0 !important;
  border: 2px solid #000000 !important;
  border-radius: 1.35rem !important;
  overflow: visible !important;
  box-sizing: border-box !important;
  background: transparent !important;
  box-shadow: none !important;
  position: relative !important;
  z-index: 3 !important;
  display: block !important;
}

html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .blog-post-teaser .post-image img,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-image img,
html body.path-taxonomy.vocabulary-category #wrapper .blog-post-teaser .post-image img,
html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper .blog-post-teaser .post-image img,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-image img,
html body.path-taxonomy.vocabulary-tags #wrapper .blog-post-teaser .post-image img {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  object-fit: contain !important;
  object-position: center !important;
  border: 0 !important;
  border-radius: 1.2rem !important;
  margin: 0 !important;
  padding: 0 !important;
  scale: 1 !important;
  transform: none !important;
}

html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .blog-post-teaser .post-content,
html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper article.blog-post-teaser .post-content,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-content,
html body.path-taxonomy.page-blog-category #wrapper article.blog-post-teaser .post-content,
html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper .blog-post-teaser .post-content,
html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper article.blog-post-teaser .post-content,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-content,
html body.path-taxonomy.page-blog-tag #wrapper article.blog-post-teaser .post-content {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  margin-top: 0 !important;
  padding: 2.85rem 1.1rem 1.15rem !important;
  border: 2px solid #000000 !important;
  border-radius: 10px !important;
  box-sizing: border-box !important;
  position: relative !important;
  z-index: 1 !important;
}

html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .blog-post-teaser .post-title,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-title,
html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper .blog-post-teaser .post-title,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-title {
  margin-top: 0.15rem !important;
  position: relative !important;
  z-index: 2 !important;
}

@media (min-width: 992px) {
  html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .blog-post-teaser .post-image,
  html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-image,
  html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper .blog-post-teaser .post-image,
  html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-image {
    width: 92% !important;
    max-width: 92% !important;
    margin: 0.55rem auto -0.95rem !important;
  }

  html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .blog-post-teaser .post-content,
  html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper article.blog-post-teaser .post-content,
  html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-content,
  html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper .blog-post-teaser .post-content,
  html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper article.blog-post-teaser .post-content,
  html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-content {
    padding: 3.1rem 1.1rem 1.15rem !important;
  }
}

@media (max-width: 767.98px) {
  html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .blog-post-teaser .post-image,
  html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-image,
  html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper .blog-post-teaser .post-image,
  html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-image {
    width: 92% !important;
    max-width: 92% !important;
    margin: 0.45rem auto -0.85rem !important;
    border-radius: 1.2rem !important;
  }

  html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .blog-post-teaser .post-content,
  html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-content,
  html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper .blog-post-teaser .post-content,
  html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-content {
    padding: 2.65rem 1rem 1.1rem !important;
    border-radius: 10px !important;
  }
}

/* END blog-term-teaser-v12 */

/* ==========================================================================
   blog-chrome-v13 — 2026-08-12
   /blog intro under search; 1rem crumb/footer edges; tighter stack on
   /blog, /blog/category, /blog/tag, and term archives.
   ========================================================================== */

html body.path-blog.page-blog #wrapper .blog-listing-intro,
html body.path-blog.page-blog #wrapper .region.region-content .blog-listing-intro,
html body.path-blog.page-blog #wrapper .view-blog > .view-header .blog-listing-intro {
  display: block !important;
  width: 100% !important;
  max-width: 46rem !important;
  margin: 0.5rem auto 0.85rem !important;
  padding: 1.1rem 1.25rem 1.15rem !important;
  background: #ffffff !important;
  background-color: #ffffff !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  border: 1px solid #e9d5ff !important;
  border-left: 5px solid #6716aa !important;
  border-radius: 14px !important;
  box-shadow: 0 4px 14px rgba(59, 10, 92, 0.08) !important;
  box-sizing: border-box !important;
  text-align: left !important;
  font-size: 1.05rem !important;
  line-height: 1.6 !important;
}

html body.path-blog.page-blog #wrapper .region.region-content .blog-listing-intro p,
html body.path-blog.page-blog #wrapper .view-blog .blog-listing-intro p {
  background: transparent !important;
  background-color: transparent !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  text-shadow: none !important;
  padding: 0 !important;
  margin: 0 0 0.7rem !important;
  display: block !important;
}

html body.path-blog.page-blog #wrapper .region.region-content .blog-listing-intro p:last-child,
html body.path-blog.page-blog #wrapper .view-blog .blog-listing-intro p:last-child {
  margin-bottom: 0 !important;
}

html body.path-blog.page-blog #wrapper .blog-listing-intro__actions {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 0.55rem 0.65rem !important;
  margin-top: 0.85rem !important;
}

html body.path-blog.page-blog #wrapper .region.region-content .blog-listing-intro a.blog-term-index-back-btn,
html body.path-blog.page-blog #wrapper .blog-listing-intro a.blog-term-index-back-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 44px !important;
  padding: 0.45rem 1.15rem !important;
  background: #ffffff !important;
  color: #5b21b6 !important;
  -webkit-text-fill-color: #5b21b6 !important;
  border: 2px solid #000000 !important;
  border-radius: 999px !important;
  font-weight: 800 !important;
  text-decoration: none !important;
  box-shadow: 0 2px 0 #000 !important;
}

html body.path-taxonomy.page-blog-category #wrapper .view-header .taxonomy-term,
html body.path-taxonomy.page-blog-tag #wrapper .view-header .taxonomy-term,
html body.path-taxonomy.vocabulary-category #wrapper .view-header .taxonomy-term,
html body.path-taxonomy.vocabulary-tags #wrapper .view-header .taxonomy-term {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
  height: 0 !important;
  overflow: hidden !important;
}

html body.path-blog.page-blog #wrapper #content-wide-top,
html body.page-blog-term-index #wrapper #content-wide-top,
html body.path-taxonomy.page-blog-category #wrapper #content-wide-top,
html body.path-taxonomy.page-blog-tag #wrapper #content-wide-top {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
}

html body.path-blog.page-blog #wrapper #block-breadcrumbs,
html body.page-blog-term-index #wrapper #block-breadcrumbs,
html body.path-taxonomy.page-blog-category #wrapper #block-breadcrumbs,
html body.path-taxonomy.page-blog-tag #wrapper #block-breadcrumbs {
  margin-bottom: 0 !important;
}

html body.path-blog.page-blog #wrapper #content-wide-top .region-content-wide-top > #block-breadcrumbs + .block,
html body.page-blog-term-index #wrapper #content-wide-top .region-content-wide-top > #block-breadcrumbs + .block,
html body.path-taxonomy.page-blog-category #wrapper #content-wide-top .region-content-wide-top > #block-breadcrumbs + .block,
html body.path-taxonomy.page-blog-tag #wrapper #content-wide-top .region-content-wide-top > #block-breadcrumbs + .block,
html body.path-blog.page-blog #wrapper #content-wide-top #block-breadcrumbs + .block,
html body.page-blog-term-index #wrapper #content-wide-top #block-breadcrumbs + .block,
html body.path-taxonomy.page-blog-category #wrapper #content-wide-top #block-breadcrumbs + .block,
html body.path-taxonomy.page-blog-tag #wrapper #content-wide-top #block-breadcrumbs + .block {
  margin-top: 1rem !important;
}

html body.path-blog.page-blog #wrapper #block-martis-exposedformblog-searchblog-search,
html body.page-blog-term-index #wrapper #block-martis-exposedformblog-searchblog-search,
html body.path-taxonomy.page-blog-category #wrapper #block-martis-exposedformblog-searchblog-search,
html body.path-taxonomy.page-blog-tag #wrapper #block-martis-exposedformblog-searchblog-search {
  margin-bottom: 0.65rem !important;
  padding-top: 0.85rem !important;
  padding-bottom: 0.85rem !important;
}

html body.path-blog.page-blog #wrapper #block-martis-blogh1title,
html body.path-blog.page-blog #wrapper #block-martis-blogh1title .field-item,
html body.path-blog.page-blog #wrapper #block-martis-blogh1title .field-body {
  margin-top: 0 !important;
  margin-bottom: 0.55rem !important;
  padding-bottom: 0 !important;
}

html body.path-blog.page-blog #wrapper #block-martis-blogh1title h1 {
  margin: 0 auto !important;
}

html body.page-blog-term-index #wrapper .blog-term-index-hero {
  margin-top: 0.35rem !important;
  margin-bottom: 0.75rem !important;
  padding-top: 0 !important;
}

html body.page-blog-term-index #wrapper h1.blog-term-index-h1 {
  margin-bottom: 0.7rem !important;
}

html body.path-taxonomy.page-blog-category #wrapper .blog-tag-h1-wrap,
html body.path-taxonomy.page-blog-tag #wrapper .blog-tag-h1-wrap {
  margin-top: 0.25rem !important;
  margin-bottom: 0.45rem !important;
  padding-top: 0.2rem !important;
  padding-bottom: 0.7rem !important;
}

html body.path-taxonomy.page-blog-category #wrapper .blog-tag-intro,
html body.path-taxonomy.page-blog-tag #wrapper .blog-tag-intro {
  margin-top: 0.35rem !important;
  margin-bottom: 0.75rem !important;
}

html body.path-blog.page-blog #wrapper .page-wrapper,
html body.page-blog-term-index #wrapper .page-wrapper,
html body.path-taxonomy.page-blog-category #wrapper .page-wrapper,
html body.path-taxonomy.page-blog-tag #wrapper .page-wrapper,
html body.path-blog.page-blog #wrapper .page-wrapper > .container,
html body.page-blog-term-index #wrapper .page-wrapper > .container,
html body.path-taxonomy.page-blog-category #wrapper .page-wrapper > .container,
html body.path-taxonomy.page-blog-tag #wrapper .page-wrapper > .container {
  padding-top: 0.65rem !important;
  padding-bottom: 1rem !important;
  margin-bottom: 0 !important;
}

html body.path-blog.page-blog #wrapper #main-content,
html body.page-blog-term-index #wrapper #main-content,
html body.path-taxonomy.page-blog-category #wrapper #main-content,
html body.path-taxonomy.page-blog-tag #wrapper #main-content {
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
}

html body.path-blog.page-blog #wrapper .view-blog,
html body.page-blog-term-index #wrapper .blog-term-index-view,
html body.path-taxonomy.page-blog-category #wrapper .blog-tag-listing-view,
html body.path-taxonomy.page-blog-tag #wrapper .blog-tag-listing-view {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

html body.path-blog.page-blog #wrapper .view-blog > .view-header,
html body.page-blog-term-index #wrapper .blog-term-index-view > .view-header,
html body.path-taxonomy.page-blog-category #wrapper .blog-tag-listing-view > .view-header,
html body.path-taxonomy.page-blog-tag #wrapper .blog-tag-listing-view > .view-header {
  margin-bottom: 0.65rem !important;
}

html body.path-blog.page-blog #wrapper #footer,
html body.page-blog-term-index #wrapper #footer,
html body.path-taxonomy.page-blog-category #wrapper #footer,
html body.path-taxonomy.page-blog-tag #wrapper #footer {
  margin-top: 0 !important;
}

@media (max-width: 767.98px) {
  html body.path-blog.page-blog #wrapper .blog-listing-intro__actions {
    flex-direction: column !important;
    align-items: stretch !important;
  }

  html body.path-blog.page-blog #wrapper .blog-listing-intro a.blog-term-index-back-btn {
    width: 100% !important;
  }

  html body.path-blog.page-blog #wrapper .page-wrapper,
  html body.page-blog-term-index #wrapper .page-wrapper,
  html body.path-taxonomy.page-blog-category #wrapper .page-wrapper,
  html body.path-taxonomy.page-blog-tag #wrapper .page-wrapper {
    padding-top: 0.55rem !important;
    padding-bottom: 1rem !important;
  }
}

/* END blog-chrome-v13 */

/* ==========================================================================
   blog-chrome-v14 — 2026-08-12
   Even 1rem gaps on /blog, indexes, and term archives.
   Mobile /blog buttons: flex was beaten by .intro p { display:block },
   so they stacked with no gap.
   ========================================================================== */

html body.path-blog.page-blog #wrapper .region.region-content .blog-listing-intro p.blog-listing-intro__actions,
html body.path-blog.page-blog #wrapper .view-blog .blog-listing-intro p.blog-listing-intro__actions,
html body.path-blog.page-blog #wrapper .blog-listing-intro__actions {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: stretch !important;
  gap: 1rem !important;
  row-gap: 1rem !important;
  column-gap: 1rem !important;
  margin: 1rem 0 0 !important;
  padding: 0 !important;
}

html body.path-blog.page-blog #wrapper .region.region-content .blog-listing-intro a.blog-term-index-back-btn,
html body.path-blog.page-blog #wrapper .blog-listing-intro a.blog-term-index-back-btn {
  margin: 0 !important;
  position: relative !important;
  z-index: 1 !important;
}

html body.path-blog.page-blog #wrapper #content-wide-top,
html body.page-blog-term-index #wrapper #content-wide-top,
html body.path-taxonomy.page-blog-category #wrapper #content-wide-top,
html body.path-taxonomy.page-blog-tag #wrapper #content-wide-top {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  margin: 0 !important;
}

html body.path-blog.page-blog #wrapper #content-wide-top #block-breadcrumbs + .block,
html body.page-blog-term-index #wrapper #content-wide-top #block-breadcrumbs + .block,
html body.path-taxonomy.page-blog-category #wrapper #content-wide-top #block-breadcrumbs + .block,
html body.path-taxonomy.page-blog-tag #wrapper #content-wide-top #block-breadcrumbs + .block,
html body.path-blog.page-blog #wrapper #content-wide-top .region-content-wide-top > #block-breadcrumbs + .block,
html body.page-blog-term-index #wrapper #content-wide-top .region-content-wide-top > #block-breadcrumbs + .block,
html body.path-taxonomy.page-blog-category #wrapper #content-wide-top .region-content-wide-top > #block-breadcrumbs + .block,
html body.path-taxonomy.page-blog-tag #wrapper #content-wide-top .region-content-wide-top > #block-breadcrumbs + .block {
  margin-top: 1rem !important;
  margin-bottom: 0 !important;
}

html body.path-blog.page-blog #wrapper #content-wide-top .block:not(#block-breadcrumbs) + .block,
html body.page-blog-term-index #wrapper #content-wide-top .block:not(#block-breadcrumbs) + .block,
html body.path-taxonomy.page-blog-category #wrapper #content-wide-top .block:not(#block-breadcrumbs) + .block,
html body.path-taxonomy.page-blog-tag #wrapper #content-wide-top .block:not(#block-breadcrumbs) + .block {
  margin-top: 1rem !important;
}

html body.path-blog.page-blog #wrapper #block-martis-blogh1title,
html body.path-blog.page-blog #wrapper #block-martis-blogh1title .container-wrap,
html body.path-blog.page-blog #wrapper #block-martis-blogh1title .block-content,
html body.path-blog.page-blog #wrapper #block-martis-blogh1title .field-item,
html body.path-blog.page-blog #wrapper #block-martis-blogh1title .field-body {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

html body.path-blog.page-blog #wrapper #block-martis-blogh1title h1 {
  margin: 0 auto !important;
}

html body.path-blog.page-blog #wrapper #block-martis-exposedformblog-searchblog-search,
html body.page-blog-term-index #wrapper #block-martis-exposedformblog-searchblog-search,
html body.path-taxonomy.page-blog-category #wrapper #block-martis-exposedformblog-searchblog-search,
html body.path-taxonomy.page-blog-tag #wrapper #block-martis-exposedformblog-searchblog-search {
  margin-bottom: 0 !important;
}

html body.path-blog.page-blog #wrapper .page-wrapper,
html body.page-blog-term-index #wrapper .page-wrapper,
html body.path-taxonomy.page-blog-category #wrapper .page-wrapper,
html body.path-taxonomy.page-blog-tag #wrapper .page-wrapper,
html body.path-blog.page-blog #wrapper .page-wrapper > .container,
html body.page-blog-term-index #wrapper .page-wrapper > .container,
html body.path-taxonomy.page-blog-category #wrapper .page-wrapper > .container,
html body.path-taxonomy.page-blog-tag #wrapper .page-wrapper > .container {
  padding-top: 1rem !important;
  padding-bottom: 1rem !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

html body.path-blog.page-blog #wrapper .view-blog > .view-header,
html body.page-blog-term-index #wrapper .blog-term-index-view > .view-header,
html body.path-taxonomy.page-blog-category #wrapper .blog-tag-listing-view > .view-header,
html body.path-taxonomy.page-blog-tag #wrapper .blog-tag-listing-view > .view-header {
  margin: 0 0 1rem !important;
  padding: 0 !important;
}

html body.path-blog.page-blog #wrapper .blog-listing-intro,
html body.path-blog.page-blog #wrapper .region.region-content .blog-listing-intro {
  margin: 0 auto 1rem !important;
}

html body.page-blog-term-index #wrapper .blog-term-index-hero {
  margin: 0 auto 1rem !important;
  padding: 0 !important;
}

html body.page-blog-term-index #wrapper h1.blog-term-index-h1,
html body.page-blog-term-index #wrapper .blog-term-index-hero h1.blog-term-index-h1 {
  margin: 0 auto 1rem !important;
}

html body.page-blog-term-index #wrapper .blog-term-index-intro {
  margin: 0 auto !important;
}

html body.path-taxonomy.page-blog-category #wrapper .blog-tag-h1-wrap,
html body.path-taxonomy.page-blog-tag #wrapper .blog-tag-h1-wrap {
  margin: 0 auto 1rem !important;
  padding: 0 0 0.55rem !important;
}

html body.path-taxonomy.page-blog-category #wrapper .blog-tag-intro,
html body.path-taxonomy.page-blog-tag #wrapper .blog-tag-intro {
  margin: 0 auto 1rem !important;
}

html body.path-blog.page-blog #wrapper .view-blog,
html body.page-blog-term-index #wrapper .blog-term-index-view,
html body.path-taxonomy.page-blog-category #wrapper .blog-tag-listing-view,
html body.path-taxonomy.page-blog-tag #wrapper .blog-tag-listing-view {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

html body.path-blog.page-blog #wrapper .views-view-responsive-grid,
html body.page-blog-term-index #wrapper .blog-term-index-view,
html body.path-taxonomy.page-blog-category #wrapper .blog-tag-listing-view,
html body.path-taxonomy.page-blog-tag #wrapper .blog-tag-listing-view {
  gap: 1rem !important;
  row-gap: 1rem !important;
}

@media (max-width: 767.98px) {
  html body.path-blog.page-blog #wrapper .region.region-content .blog-listing-intro p.blog-listing-intro__actions,
  html body.path-blog.page-blog #wrapper .blog-listing-intro__actions {
    display: flex !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    gap: 1rem !important;
    row-gap: 1rem !important;
  }

  html body.path-blog.page-blog #wrapper .region.region-content .blog-listing-intro a.blog-term-index-back-btn,
  html body.path-blog.page-blog #wrapper .blog-listing-intro a.blog-term-index-back-btn {
    display: flex !important;
    width: 100% !important;
    margin: 0 !important;
    box-sizing: border-box !important;
  }

  html body.path-blog.page-blog #wrapper .page-wrapper,
  html body.page-blog-term-index #wrapper .page-wrapper,
  html body.path-taxonomy.page-blog-category #wrapper .page-wrapper,
  html body.path-taxonomy.page-blog-tag #wrapper .page-wrapper {
    padding-top: 1rem !important;
    padding-bottom: 1rem !important;
  }
}

/* END blog-chrome-v14 */

/* ==========================================================================
   blog-chrome-v15 — 2026-08-12
   /blog/category: search 2rem top; listing views -2rem bottom (desktop).
   Center hero on desktop; left-align card descriptions on mobile.
   Same rhythm on /blog, /blog/tag, and term archives.
   ========================================================================== */

html body.path-blog.page-blog #wrapper #block-martis-exposedformblog-searchblog-search,
html body.page-blog-term-index #wrapper #block-martis-exposedformblog-searchblog-search,
html body.path-taxonomy.page-blog-category #wrapper #block-martis-exposedformblog-searchblog-search,
html body.path-taxonomy.page-blog-tag #wrapper #block-martis-exposedformblog-searchblog-search,
html body.path-blog.page-blog #wrapper #content-wide-top #block-breadcrumbs + #block-martis-exposedformblog-searchblog-search,
html body.page-blog-term-index #wrapper #content-wide-top #block-breadcrumbs + #block-martis-exposedformblog-searchblog-search,
html body.path-taxonomy.page-blog-category #wrapper #content-wide-top #block-breadcrumbs + #block-martis-exposedformblog-searchblog-search,
html body.path-taxonomy.page-blog-tag #wrapper #content-wide-top #block-breadcrumbs + #block-martis-exposedformblog-searchblog-search,
html body.path-blog.page-blog #wrapper #content-wide-top .block:not(#block-breadcrumbs) + #block-martis-exposedformblog-searchblog-search,
html body.page-blog-term-index #wrapper #content-wide-top .block:not(#block-breadcrumbs) + #block-martis-exposedformblog-searchblog-search {
  margin-top: 2rem !important;
}

html body.path-blog.page-blog #wrapper .view-blog,
html body.page-blog-term-index #wrapper .blog-term-index-view,
html body.path-taxonomy.page-blog-category #wrapper .blog-tag-listing-view,
html body.path-taxonomy.page-blog-tag #wrapper .blog-tag-listing-view {
  margin-bottom: -2rem !important;
}

html body.page-blog-term-index #wrapper .blog-term-index-hero,
html body.page-blog-term-index #wrapper .blog-term-index-view > .view-header,
html body.path-blog.page-blog #wrapper .blog-listing-intro,
html body.path-taxonomy.page-blog-category #wrapper .blog-tag-h1-wrap,
html body.path-taxonomy.page-blog-tag #wrapper .blog-tag-h1-wrap,
html body.path-taxonomy.page-blog-category #wrapper .blog-tag-intro,
html body.path-taxonomy.page-blog-tag #wrapper .blog-tag-intro {
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
}

html body.page-blog-term-index #wrapper .blog-term-index-hero {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  width: 100% !important;
  max-width: 46rem !important;
}

html body.page-blog-term-index #wrapper .blog-term-index-intro,
html body.path-blog.page-blog #wrapper .blog-listing-intro {
  width: 100% !important;
  max-width: 46rem !important;
  text-align: center !important;
}

html body.page-blog-term-index #wrapper .blog-term-index-intro p,
html body.path-blog.page-blog #wrapper .blog-listing-intro p,
html body.path-taxonomy.page-blog-category #wrapper .blog-tag-intro p,
html body.path-taxonomy.page-blog-tag #wrapper .blog-tag-intro p {
  text-align: center !important;
}

html body.page-blog-term-index #wrapper .blog-term-index-back,
html body.page-blog-term-index #wrapper .blog-term-index-intro p.blog-term-index-back {
  display: flex !important;
  justify-content: center !important;
  text-align: center !important;
}

html body.page-blog-term-index #wrapper .blog-term-index-card,
html body.page-blog-term-index #wrapper .blog-term-index-title,
html body.page-blog-term-index #wrapper .blog-term-index-desc {
  text-align: left !important;
}

@media (max-width: 767.98px) {
  html body.path-blog.page-blog #wrapper #block-martis-exposedformblog-searchblog-search,
  html body.page-blog-term-index #wrapper #block-martis-exposedformblog-searchblog-search,
  html body.path-taxonomy.page-blog-category #wrapper #block-martis-exposedformblog-searchblog-search,
  html body.path-taxonomy.page-blog-tag #wrapper #block-martis-exposedformblog-searchblog-search,
  html body.page-blog-term-index #wrapper #content-wide-top #block-breadcrumbs + #block-martis-exposedformblog-searchblog-search,
  html body.path-taxonomy.page-blog-category #wrapper #content-wide-top #block-breadcrumbs + #block-martis-exposedformblog-searchblog-search,
  html body.path-taxonomy.page-blog-tag #wrapper #content-wide-top #block-breadcrumbs + #block-martis-exposedformblog-searchblog-search,
  html body.path-blog.page-blog #wrapper #content-wide-top .block:not(#block-breadcrumbs) + #block-martis-exposedformblog-searchblog-search {
    margin-top: 1.5rem !important;
  }

  html body.path-blog.page-blog #wrapper .view-blog,
  html body.page-blog-term-index #wrapper .blog-term-index-view,
  html body.path-taxonomy.page-blog-category #wrapper .blog-tag-listing-view,
  html body.path-taxonomy.page-blog-tag #wrapper .blog-tag-listing-view {
    margin-bottom: -1.25rem !important;
  }

  html body.page-blog-term-index #wrapper .blog-term-index-card,
  html body.page-blog-term-index #wrapper .blog-term-index-card .blog-term-index-desc,
  html body.page-blog-term-index #wrapper .blog-term-index-desc,
  html body.page-blog-term-index #wrapper .blog-term-index-card .views-field-description,
  html body.page-blog-term-index #wrapper .blog-term-index-card .views-field-description * {
    text-align: left !important;
  }

  html body.page-blog-term-index #wrapper .blog-term-index-intro,
  html body.page-blog-term-index #wrapper .blog-term-index-intro p,
  html body.path-blog.page-blog #wrapper .blog-listing-intro,
  html body.path-blog.page-blog #wrapper .blog-listing-intro p,
  html body.path-taxonomy.page-blog-category #wrapper .blog-tag-intro,
  html body.path-taxonomy.page-blog-category #wrapper .blog-tag-intro p,
  html body.path-taxonomy.page-blog-tag #wrapper .blog-tag-intro,
  html body.path-taxonomy.page-blog-tag #wrapper .blog-tag-intro p {
    text-align: left !important;
  }
}

/* END blog-chrome-v15 */

/* --- Clearance sales link + intro (existing JD header) --- */
.header-top #block-clearance-sales a.clearance-499-link,
.header-top.dark-header-top #block-clearance-sales a.clearance-499-link,
header.header #block-clearance-sales a.clearance-499-link,
div#block-clearance-sales a.clearance-499-link {
  color: inherit !important;
  text-decoration: underline !important;
  text-underline-offset: 0.15em !important;
  font-weight: 700 !important;
}
.header-top #block-clearance-sales a.clearance-499-link:hover,
.header-top.dark-header-top #block-clearance-sales a.clearance-499-link:hover,
header.header #block-clearance-sales a.clearance-499-link:hover {
  color: #22c55e !important;
}

html body.page-form-499-website #content-wide-top .deal-499-hero p,
html body.path-webform.page-form-499-website #content-wide-top .deal-499-hero p,
html body.page-form-499-website #wrapper .region.region-content p,
html body.page-form-499-website #wrapper .region.region-content .description {
  display: block !important;
  background: transparent !important;
  background-color: transparent !important;
  border: 0 !important;
  color: #334155 !important;
  padding: 0 !important;
}
html body.page-form-499-website #content-wide-top .deal-499-hero a,
html body.path-webform.page-form-499-website #content-wide-top .deal-499-hero a {
  color: #6716aa !important;
  text-decoration: underline !important;
}
@media (max-width: 767.98px) {
  html body.page-form-499-website #content-wide-top .deal-499-hero p {
    text-align: left !important;
    font-size: 1rem !important;
  }
}



/* ==========================================================================
   blog-term-archive-h1-v1 — 2026-08-12
   TVI term archives have no page-title block. Match /blog H1 chip + intro.
   ========================================================================== */
html body.path-taxonomy #wrapper .blog-tag-listing-view .blog-term-archive-hero,
html body.path-taxonomy #wrapper .view-taxonomy-term .blog-term-archive-hero {
  margin: 0 0 1.15rem !important;
  padding: 0 !important;
}
html body.path-taxonomy #wrapper .blog-tag-listing-view h1.blog-term-archive-h1,
html body.path-taxonomy #wrapper .view-taxonomy-term h1.blog-term-archive-h1 {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 0 0.75rem !important;
  padding: 0.85rem 1.15rem !important;
  background: #6716aa !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border: 2px solid #000 !important;
  border-radius: 5px !important;
  text-align: center !important;
  font-size: 1.65rem !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  text-shadow: none !important;
}
html body.path-taxonomy #wrapper .blog-tag-listing-view .blog-term-archive-intro,
html body.path-taxonomy #wrapper .view-taxonomy-term .blog-term-archive-intro {
  margin: 0 0 1rem !important;
  padding: 0 0.15rem !important;
  color: #1a0a24 !important;
  font-size: 1.05rem !important;
  line-height: 1.55 !important;
  background: transparent !important;
  border: 0 !important;
}
@media (max-width: 767px) {
  html body.path-taxonomy #wrapper .blog-tag-listing-view h1.blog-term-archive-h1,
  html body.path-taxonomy #wrapper .view-taxonomy-term h1.blog-term-archive-h1 {
    font-size: 1.35rem !important;
    padding: 0.7rem 0.85rem !important;
  }
}
/* END blog-term-archive-h1-v1 */

/* ==========================================================================
   blog-term-archive-chrome-v2 — 2026-08-12
   Match /blog H1 badge + lilac search card on category/tag archives.
   ========================================================================== */
html body.path-taxonomy[class*="page-blog-"] #wrapper .blog-tag-listing-view h1.blog-term-archive-h1,
html body.path-taxonomy[class*="page-blog-"] #wrapper .view-taxonomy-term h1.blog-term-archive-h1 {
  display: block !important;
  width: auto !important;
  max-width: 56rem !important;
  margin: 0.75rem auto 1rem !important;
  padding: 0.85rem 1.35rem !important;
  background: linear-gradient(180deg, #b781e3 0%, #6716aa 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border: 2px solid #000 !important;
  border-radius: 10px !important;
  box-shadow: none !important;
}

html body.path-taxonomy[class*="page-blog-"] #wrapper #block-martis-exposedformblog-searchblog-search,
html body.page-blog-term-index #wrapper #block-martis-exposedformblog-searchblog-search {
  background: #faf5ff !important;
  background-color: #faf5ff !important;
  color: #1a0a24 !important;
  border: 1px solid #e9d5ff !important;
  border-radius: 16px !important;
  box-shadow: none !important;
  padding: 1.25rem 1.35rem 1.1rem !important;
  max-width: 52rem !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
html body.path-taxonomy[class*="page-blog-"] #wrapper #block-martis-exposedformblog-searchblog-search .block-title,
html body.page-blog-term-index #wrapper #block-martis-exposedformblog-searchblog-search .block-title,
html body.path-taxonomy[class*="page-blog-"] #wrapper #block-martis-exposedformblog-searchblog-search h2,
html body.page-blog-term-index #wrapper #block-martis-exposedformblog-searchblog-search h2 {
  background: transparent !important;
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  border: 0 !important;
  text-shadow: none !important;
}
html body.path-taxonomy[class*="page-blog-"] #wrapper #block-martis-exposedformblog-searchblog-search label,
html body.path-taxonomy[class*="page-blog-"] #wrapper #block-martis-exposedformblog-searchblog-search .form-item,
html body.page-blog-term-index #wrapper #block-martis-exposedformblog-searchblog-search label {
  color: #1a0a24 !important;
  background: transparent !important;
}
/* END blog-term-archive-chrome-v2 */

/* ===== JD2 EXTRACT-chrome-post-jd.css ===== */
/* JD2: remapped Cyberlytics green → Johnny Detail purple. Do not paste leftover CY greens. */
/* JD2 EXTRACT — chrome-layout-fix.css blocks added after JD/ pack */
   partners-listing-v1 — 2026-08-08
   /partners + /{city}/partners listing pages (Views page displays).
   Scoped so full partner nodes + homepage slideshow stay untouched.
   ========================================================================== */

/* Page canvas */
html body.path-partners:not(.page-node-type-partners) #wrapper .region.region-content,
html body[class*="-partners"]:not(.page-node-type-partners) #wrapper .region.region-content {
  background: #f5f0fa !important;
}

/* H1 chip */
html body.path-partners:not(.page-node-type-partners) .partners-listing-h1,
html body[class*="-partners"]:not(.page-node-type-partners) .partners-listing-h1,
html body.path-partners:not(.page-node-type-partners) h1.partners-listing-h1 {
  display: block !important;
  width: 100% !important;
  max-width: 48rem !important;
  margin: 0.75rem auto 1rem !important;
  padding: 0.85rem 1.2rem !important;
  box-sizing: border-box !important;
  text-align: center !important;
  font-weight: 800 !important;
  font-size: clamp(1.25rem, 2.6vw, 1.75rem) !important;
  line-height: 1.3 !important;
  background: linear-gradient(135deg, #3b0a5c 0%, #6716aa 55%, #7b2cbf 100%) !important;
  background-color: #3b0a5c !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border: 2px solid #000 !important;
  border-radius: 10px !important;
  box-shadow: 0 3px 12px rgba(59, 10, 92, 0.22) !important;
}

/* Intro card */
html body.path-partners:not(.page-node-type-partners) .partners-listing-intro.hub-intro,
html body[class*="-partners"]:not(.page-node-type-partners) .partners-listing-intro.hub-intro {
  display: block !important;
  max-width: 48rem !important;
  margin: 0.5rem auto 1.75rem !important;
  padding: 1.25rem 1.35rem 1.35rem !important;
  background: #ffffff !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  border: 1px solid #e9d5ff !important;
  border-left: 5px solid #6716aa !important;
  border-radius: 14px !important;
  box-shadow: 0 4px 14px rgba(59, 10, 92, 0.08) !important;
  box-sizing: border-box !important;
}

html body.path-partners:not(.page-node-type-partners) .partners-listing-intro .hub-intro__deck,
html body[class*="-partners"]:not(.page-node-type-partners) .partners-listing-intro .hub-intro__deck {
  margin: 0 0 0.85rem !important;
  font-size: 1.05rem !important;
  line-height: 1.6 !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
}

html body.path-partners:not(.page-node-type-partners) .partners-listing-intro .hub-intro__links,
html body[class*="-partners"]:not(.page-node-type-partners) .partners-listing-intro .hub-intro__links {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 0.55rem 0.65rem !important;
  margin-top: 0.85rem !important;
}

html body.path-partners:not(.page-node-type-partners) .partners-listing-intro .hub-intro__btn,
html body[class*="-partners"]:not(.page-node-type-partners) .partners-listing-intro .hub-intro__btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 44px !important;
  padding: 0.5rem 1.1rem !important;
  border: 2px solid #000 !important;
  border-radius: 999px !important;
  background: linear-gradient(135deg, #6716aa 0%, #7b2cbf 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  font-size: 0.95rem !important;
}

html body.path-partners:not(.page-node-type-partners) .partners-listing-intro .hub-intro__btn--ghost,
html body[class*="-partners"]:not(.page-node-type-partners) .partners-listing-intro .hub-intro__btn--ghost {
  background: #ffffff !important;
  color: #5b21b6 !important;
  -webkit-text-fill-color: #5b21b6 !important;
}

/* Grid spacing */
html body.path-partners:not(.page-node-type-partners) .view-partners .views-view-grid,
html body.path-partners:not(.page-node-type-partners) .view-partners .row,
html body[class*="-partners"]:not(.page-node-type-partners) .view-partners .row {
  margin-left: -0.5rem !important;
  margin-right: -0.5rem !important;
  justify-content: center !important;
}

html body.path-partners:not(.page-node-type-partners) .view-partners .partners-listing-col,
html body[class*="-partners"]:not(.page-node-type-partners) .view-partners .partners-listing-col,
html body.path-partners:not(.page-node-type-partners) .view-partners [class*="col-"],
html body[class*="-partners"]:not(.page-node-type-partners) .view-partners [class*="col-"] {
  padding: 0.65rem !important;
  margin-bottom: 0.5rem !important;
}

/* Partner cards on listing only */
html body.path-partners:not(.page-node-type-partners) .partner-teaser--card,
html body[class*="-partners"]:not(.page-node-type-partners) .partner-teaser--card {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  height: 100% !important;
  min-height: 16rem !important;
  margin: 0 !important;
  padding: 1.25rem 1rem 1.15rem !important;
  background: #ffffff !important;
  border-top: 1px solid #e9d5ff !important;
  border-right: 1px solid #e9d5ff !important;
  border-bottom: 1px solid #e9d5ff !important;
  border-left: 5px solid #6716aa !important;
  border-radius: 16px !important;
  box-shadow: 0 4px 14px rgba(59, 10, 92, 0.1) !important;
  box-sizing: border-box !important;
  text-align: center !important;
  translate: 0 0;
  transition: translate 0.18s ease, box-shadow 0.18s ease !important;
}

html body.path-partners:not(.page-node-type-partners) .partner-teaser--card:hover,
html body[class*="-partners"]:not(.page-node-type-partners) .partner-teaser--card:hover {
  translate: 0 -3px !important;
  box-shadow: 0 8px 20px rgba(59, 10, 92, 0.14) !important;
}

html body.path-partners:not(.page-node-type-partners) .partner-teaser__link,
html body[class*="-partners"]:not(.page-node-type-partners) .partner-teaser__link {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  flex: 1 1 auto !important;
  width: 100% !important;
  text-decoration: none !important;
  color: inherit !important;
}

html body.path-partners:not(.page-node-type-partners) .partner-teaser__logo,
html body[class*="-partners"]:not(.page-node-type-partners) .partner-teaser__logo {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 7.5rem !important;
  height: 7.5rem !important;
  margin: 0 auto 0.85rem !important;
  padding: 0.65rem !important;
  background: #f5f0fa !important;
  border: 2px solid #e9d5ff !important;
  border-radius: 50% !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
}

html body.path-partners:not(.page-node-type-partners) .partner-teaser__logo img,
html body[class*="-partners"]:not(.page-node-type-partners) .partner-teaser__logo img {
  max-width: 100% !important;
  max-height: 100% !important;
  width: auto !important;
  height: auto !important;
  object-fit: contain !important;
}

html body.path-partners:not(.page-node-type-partners) .partner-teaser__title,
html body.path-partners:not(.page-node-type-partners) .partner-teaser__title a,
html body[class*="-partners"]:not(.page-node-type-partners) .partner-teaser__title,
html body[class*="-partners"]:not(.page-node-type-partners) .partner-teaser__title a {
  margin: 0 0 0.75rem !important;
  padding: 0 !important;
  font-size: 1.05rem !important;
  font-weight: 800 !important;
  line-height: 1.35 !important;
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  text-decoration: none !important;
  background: transparent !important;
  border: 0 !important;
}

html body.path-partners:not(.page-node-type-partners) .partner-teaser__cta,
html body[class*="-partners"]:not(.page-node-type-partners) .partner-teaser__cta {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin-top: auto !important;
  min-height: 2.5rem !important;
  padding: 0.45rem 1.15rem !important;
  border: 2px solid #000 !important;
  border-radius: 999px !important;
  background: linear-gradient(135deg, #6716aa 0%, #7b2cbf 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-weight: 700 !important;
  font-size: 0.9rem !important;
  text-decoration: none !important;
}

html body.path-partners:not(.page-node-type-partners) .partner-teaser__cta:hover,
html body[class*="-partners"]:not(.page-node-type-partners) .partner-teaser__cta:hover {
  background: #3b0a5c !important;
  color: #ffffff !important;
}

/* Hide teaser body dump if teaser mode still prints body */
html body.path-partners:not(.page-node-type-partners) .partner-teaser .field-body,
html body[class*="-partners"]:not(.page-node-type-partners) .partner-teaser .field-body {
  display: none !important;
}

@media (max-width: 767.98px) {
  html body.path-partners:not(.page-node-type-partners) .partners-listing-intro .hub-intro__links,
  html body[class*="-partners"]:not(.page-node-type-partners) .partners-listing-intro .hub-intro__links {
    flex-direction: column !important;
    align-items: stretch !important;
  }
  html body.path-partners:not(.page-node-type-partners) .partners-listing-intro .hub-intro__btn,
  html body[class*="-partners"]:not(.page-node-type-partners) .partners-listing-intro .hub-intro__btn {
    width: 100% !important;
  }
  html body.path-partners:not(.page-node-type-partners) .partners-listing-h1,
  html body[class*="-partners"]:not(.page-node-type-partners) .partners-listing-h1 {
    margin-left: 0.5rem !important;
    margin-right: 0.5rem !important;
    max-width: none !important;
    font-size: 1.15rem !important;
  }
}

/* END partners-listing-v1 */

/* ==========================================================================
   partners-listing-v2 — readable text + centered H1 (mobile + desktop)
   Covers hub path-partners and city page-*-partners.
   ========================================================================== */

/* Shared scope helper classes used below */
html body.path-partners:not(.page-node-type-partners),
html body.page-katy-tx-partners:not(.page-node-type-partners),
html body.page-houston-tx-partners:not(.page-node-type-partners),
html body.page-cypress-tx-partners:not(.page-node-type-partners),
html body.page-spring-tx-partners:not(.page-node-type-partners),
html body.page-jersey-village-tx-partners:not(.page-node-type-partners),
html body.page-tomball-tx-partners:not(.page-node-type-partners),
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) {
  --pl-ink: #1a0a24;
  --pl-ink-soft: #2e1065;
  --pl-forest: #3b0a5c;
  --pl-brand: #6716aa;
}

/* Content region: page content should be white on partner listing pages */
html body.path-partners:not(.page-node-type-partners) #wrapper #main-content,
html body.path-partners:not(.page-node-type-partners) #wrapper .region.region-content,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) #wrapper #main-content,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) #wrapper .region.region-content,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) #wrapper .main-content,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .content-layout,
html body.path-partners:not(.page-node-type-partners) .content-layout {
  background: #ffffff !important;
  background-color: #ffffff !important;
  background-image: none !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
}

html body.path-partners:not(.page-node-type-partners) .views-element-container,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .views-element-container,
html body.path-partners:not(.page-node-type-partners) .partners-listing-view,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partners-listing-view,
html body.page-spring-tx-partners:not(.page-node-type-partners) .views-element-container,
html body.page-cypress-tx-partners:not(.page-node-type-partners) .views-element-container,
html body.page-katy-tx-partners:not(.page-node-type-partners) .views-element-container,
html body.page-jersey-village-tx-partners:not(.page-node-type-partners) .views-element-container,
html body.page-spring-tx-partners:not(.page-node-type-partners) .partners-listing-view,
html body.page-cypress-tx-partners:not(.page-node-type-partners) .partners-listing-view,
html body.page-katy-tx-partners:not(.page-node-type-partners) .partners-listing-view,
html body.page-jersey-village-tx-partners:not(.page-node-type-partners) .partners-listing-view {
  background: #ffffff !important;
}

html body.path-partners:not(.page-node-type-partners) .partners-listing-view .view-header,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partners-listing-view .view-header,
html body.page-spring-tx-partners:not(.page-node-type-partners) .partners-listing-view .view-header,
html body.page-cypress-tx-partners:not(.page-node-type-partners) .partners-listing-view .view-header,
html body.page-katy-tx-partners:not(.page-node-type-partners) .partners-listing-view .view-header,
html body.page-jersey-village-tx-partners:not(.page-node-type-partners) .partners-listing-view .view-header {
  background: #ffffff !important;
  border: 1px solid #e8f0ec !important;
  border-radius: 18px !important;
  box-shadow: 0 10px 28px rgba(59, 10, 92, 0.08) !important;
  padding: 1.2rem 1.3rem 1.4rem !important;
  margin-bottom: 1.1rem !important;
}

html body.path-partners:not(.page-node-type-partners) .partners-listing-view .view-header h1,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partners-listing-view .view-header h1 {
  margin-top: 0 !important;
}

/* Center H1 chip hard (desktop + mobile) */
html body.path-partners:not(.page-node-type-partners) .partners-listing-h1,
html body.path-partners:not(.page-node-type-partners) h1.partners-listing-h1,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partners-listing-h1,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) h1.partners-listing-h1,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .view-header h1,
html body.path-partners:not(.page-node-type-partners) .view-header h1 {
  display: block !important;
  width: calc(100% - 1.5rem) !important;
  max-width: 46rem !important;
  margin-left: auto !important;
  margin-right: auto !important;
  margin-top: 0.85rem !important;
  margin-bottom: 1.1rem !important;
  padding: 0.9rem 1.25rem !important;
  box-sizing: border-box !important;
  text-align: center !important;
  justify-self: center !important;
  float: none !important;
  position: relative !important;
  left: auto !important;
  right: auto !important;
  transform: none !important;
  font-weight: 800 !important;
  font-size: clamp(1.2rem, 2.5vw, 1.7rem) !important;
  line-height: 1.3 !important;
  letter-spacing: 0.01em !important;
  background: linear-gradient(135deg, #3b0a5c 0%, #6716aa 55%, #7b2cbf 100%) !important;
  background-color: #3b0a5c !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  text-shadow: none !important;
  border: 2px solid #000 !important;
  border-radius: 10px !important;
  box-shadow: 0 3px 12px rgba(59, 10, 92, 0.22) !important;
  word-wrap: break-word !important;
  overflow-wrap: anywhere !important;
}

/* Force white type on H1 children (beats fill leaks) */
html body.path-partners:not(.page-node-type-partners) .partners-listing-h1 *,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partners-listing-h1 * {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  background: transparent !important;
}

/* Intro: readable dark ink on white (never white-on-white) */
html body.path-partners:not(.page-node-type-partners) .partners-listing-intro,
html body.path-partners:not(.page-node-type-partners) .partners-listing-intro.hub-intro,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partners-listing-intro,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partners-listing-intro.hub-intro,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .view-header .partners-listing-intro {
  display: block !important;
  width: calc(100% - 1.5rem) !important;
  max-width: 46rem !important;
  margin-left: auto !important;
  margin-right: auto !important;
  margin-bottom: 1.75rem !important;
  padding: 1.25rem 1.35rem 1.4rem !important;
  background: #ffffff !important;
  background-color: #ffffff !important;
  background-image: none !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  border: 1px solid #e9d5ff !important;
  border-left: 5px solid #6716aa !important;
  border-radius: 14px !important;
  box-shadow: 0 4px 14px rgba(59, 10, 92, 0.08) !important;
  box-sizing: border-box !important;
  text-align: left !important;
  opacity: 1 !important;
  filter: none !important;
}

html body.path-partners:not(.page-node-type-partners) .partners-listing-intro p,
html body.path-partners:not(.page-node-type-partners) .partners-listing-intro .hub-intro__deck,
html body.path-partners:not(.page-node-type-partners) .partners-listing-intro span,
html body.path-partners:not(.page-node-type-partners) .partners-listing-intro li,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partners-listing-intro p,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partners-listing-intro .hub-intro__deck,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partners-listing-intro span,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partners-listing-intro li {
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  text-shadow: none !important;
  opacity: 1 !important;
  font-size: 1.05rem !important;
  line-height: 1.62 !important;
  font-weight: 500 !important;
}

/* Card titles: dark forest, not white/pale */
html body.path-partners:not(.page-node-type-partners) .partner-teaser--card,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partner-teaser--card {
  background: #ffffff !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
}

html body.path-partners:not(.page-node-type-partners) .partner-teaser__title,
html body.path-partners:not(.page-node-type-partners) .partner-teaser__title a,
html body.path-partners:not(.page-node-type-partners) .partner-teaser__title span,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partner-teaser__title,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partner-teaser__title a,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partner-teaser__title span {
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  text-align: center !important;
  font-weight: 800 !important;
  text-shadow: none !important;
  background: transparent !important;
}

/* CTA keeps white-on-green intentionally */
html body.path-partners:not(.page-node-type-partners) .partner-teaser__cta,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partner-teaser__cta {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

/* Center the view content column on all sizes */
html body.path-partners:not(.page-node-type-partners) .view-partners,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .view-partners {
  width: 100% !important;
  max-width: 1100px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 0.75rem !important;
  padding-right: 0.75rem !important;
  box-sizing: border-box !important;
}

html body.path-partners:not(.page-node-type-partners) .view-partners .view-header,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .view-partners .view-header {
  text-align: center !important;
  width: 100% !important;
}

/* Mobile: full usable width, centered H1, readable intro */
@media (max-width: 991.98px) {
  html body.path-partners:not(.page-node-type-partners) .partners-listing-h1,
  html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partners-listing-h1 {
    width: calc(100% - 1rem) !important;
    max-width: none !important;
    margin-left: auto !important;
    margin-right: auto !important;
    font-size: 1.18rem !important;
    padding: 0.8rem 0.95rem !important;
    text-align: center !important;
  }

  html body.path-partners:not(.page-node-type-partners) .partners-listing-intro,
  html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partners-listing-intro {
    width: calc(100% - 1rem) !important;
    max-width: none !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding: 1.1rem 1rem 1.15rem !important;
  }

  html body.path-partners:not(.page-node-type-partners) .partners-listing-intro p,
  html body.path-partners:not(.page-node-type-partners) .partners-listing-intro .hub-intro__deck,
  html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partners-listing-intro p,
  html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partners-listing-intro .hub-intro__deck {
    font-size: 1.02rem !important;
    line-height: 1.58 !important;
    color: #1a0a24 !important;
    -webkit-text-fill-color: #1a0a24 !important;
  }

  html body.path-partners:not(.page-node-type-partners) .partner-teaser__title,
  html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partner-teaser__title {
    font-size: 1.02rem !important;
    color: #3b0a5c !important;
    -webkit-text-fill-color: #3b0a5c !important;
  }
}

@media (max-width: 575.98px) {
  html body.path-partners:not(.page-node-type-partners) .partners-listing-h1,
  html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partners-listing-h1 {
    font-size: 1.08rem !important;
    padding: 0.72rem 0.8rem !important;
  }
}

/* END partners-listing-v2 */


/* ==========================================================================
   partners-listing-v3 — fix unreadable intro (green-on-green)
   ========================================================================== */

html body.path-partners:not(.page-node-type-partners) .partners-listing-intro,
html body.path-partners:not(.page-node-type-partners) .partners-listing-intro.hub-intro,
html body.path-partners:not(.page-node-type-partners) .view-header .partners-listing-intro,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partners-listing-intro,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partners-listing-intro.hub-intro,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .view-header .partners-listing-intro {
  background: #ffffff !important;
  background-color: #ffffff !important;
  background-image: none !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
}

/* Kill any green chip/box on intro paragraphs */
html body.path-partners:not(.page-node-type-partners) .partners-listing-intro p,
html body.path-partners:not(.page-node-type-partners) .partners-listing-intro .hub-intro__deck,
html body.path-partners:not(.page-node-type-partners) .partners-listing-intro .hub-intro__deck p,
html body.path-partners:not(.page-node-type-partners) .partners-listing-intro div,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partners-listing-intro p,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partners-listing-intro .hub-intro__deck,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partners-listing-intro .hub-intro__deck p,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partners-listing-intro > div:not(.hub-intro__links) {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  text-shadow: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0.85rem !important;
  font-size: 1.06rem !important;
  line-height: 1.65 !important;
  font-weight: 500 !important;
  opacity: 1 !important;
  filter: none !important;
  mix-blend-mode: normal !important;
}

/* Explicit ink on every text node inside intro */
html body.path-partners:not(.page-node-type-partners) .partners-listing-intro,
html body.path-partners:not(.page-node-type-partners) .partners-listing-intro *,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partners-listing-intro,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partners-listing-intro * {
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
}

/* Restore white type on CTA buttons only */
html body.path-partners:not(.page-node-type-partners) .partners-listing-intro .hub-intro__btn:not(.hub-intro__btn--ghost),
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partners-listing-intro .hub-intro__btn:not(.hub-intro__btn--ghost) {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  background: linear-gradient(135deg, #6716aa 0%, #7b2cbf 100%) !important;
  border: 2px solid #000 !important;
}

html body.path-partners:not(.page-node-type-partners) .partners-listing-intro .hub-intro__btn--ghost,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partners-listing-intro .hub-intro__btn--ghost {
  color: #5b21b6 !important;
  -webkit-text-fill-color: #5b21b6 !important;
  background: #ffffff !important;
  border: 2px solid #000 !important;
}

/* H1 stays white-on-green and centered */
html body.path-partners:not(.page-node-type-partners) .partners-listing-h1,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partners-listing-h1 {
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}
html body.path-partners:not(.page-node-type-partners) .partners-listing-h1 *,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partners-listing-h1 * {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

/* END partners-listing-v3 */

   Service node blog teasers — mobile post-tags
   Beat Custom CSS column-gap: 7rem + clearfix floats.
   ========================================================================== */
@media (max-width: 767.98px) {
  html body.page-node-type-service #wrapper .blog-post-teaser .post-tags.clearfix,
  html body.page-node-type-service #wrapper [id*="views-block-blog"] .post-tags.clearfix,
  html body.page-node-type-service #wrapper [id*="views-block-blog"] .blog-post-teaser .post-tags,
  html body.page-node-type-service #content-wide [id*="views-block-blog"] .post-tags.clearfix {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 0.35rem !important;
    column-gap: 0.35rem !important;
    row-gap: 0.35rem !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0.4rem 0 0.15rem !important;
    padding: 0.5rem 0 0 !important;
    border-top: 1px solid rgba(234, 255, 243, 0.28) !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
    float: none !important;
  }

  html body.page-node-type-service #wrapper .blog-post-teaser .post-tags > i,
  html body.page-node-type-service #wrapper [id*="views-block-blog"] .post-tags > i,
  html body.page-node-type-service #wrapper .blog-post-teaser .post-tags .field-label,
  html body.page-node-type-service #wrapper [id*="views-block-blog"] .post-tags .field-label {
    display: none !important;
  }

  html body.page-node-type-service #wrapper .blog-post-teaser .post-tags .tags-label,
  html body.page-node-type-service #wrapper [id*="views-block-blog"] .post-tags .tags-label {
    display: inline-block !important;
    margin: 0 0.15rem 0 0 !important;
    padding: 0 !important;
    color: #f3e8ff !important;
    -webkit-text-fill-color: #f3e8ff !important;
    font-size: 0.72rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.04em !important;
    text-transform: uppercase !important;
    flex: 0 0 auto !important;
  }

  html body.page-node-type-service #wrapper .blog-post-teaser .post-tags .tags-list,
  html body.page-node-type-service #wrapper .blog-post-teaser .post-tags .field,
  html body.page-node-type-service #wrapper .blog-post-teaser .post-tags .field-items,
  html body.page-node-type-service #wrapper [id*="views-block-blog"] .post-tags .tags-list,
  html body.page-node-type-service #wrapper [id*="views-block-blog"] .post-tags .field-items {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 0.35rem !important;
    column-gap: 0.35rem !important;
    row-gap: 0.35rem !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
    background: transparent !important;
    border: 0 !important;
  }

  html body.page-node-type-service #wrapper .blog-post-teaser .post-tags .field-item,
  html body.page-node-type-service #wrapper [id*="views-block-blog"] .post-tags .field-item {
    display: inline-flex !important;
    float: none !important;
    width: auto !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
  }

  html body.page-node-type-service #wrapper .blog-post-teaser .post-tags a,
  html body.page-node-type-service #wrapper [id*="views-block-blog"] .post-tags a,
  html body.page-node-type-service #wrapper [id*="views-block-blog"] .tags-list a {
    display: inline-flex !important;
    align-items: center !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0.28rem 0.62rem !important;
    background: #ffffff !important;
    color: #6716aa !important;
    -webkit-text-fill-color: #6716aa !important;
    border: 1px solid #3b0a5c !important;
    border-radius: 999px !important;
    font-size: 0.74rem !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    box-sizing: border-box !important;
  }
}



/* ==========================================================================
   JD3 EXTRACT merge — 2026-08-15
   Term-index hover lock (do not kill fadeIn mid-play) + blog team carousel H2.
   Partners 2-col / white canvas live in partners-listing.css + high-intent-cta.css.
   ========================================================================== */

html body.page-node-type-blog #wrapper .region.region-content-wide #block-martis-views-block-team-team-carousel-2 h2,
html body.page-node-type-blog #wrapper .region.region-content-wide [id*="team-team-carousel"] h2,
html body.page-node-type-blog #wrapper .region.region-content-wide .block-views-blockteam-team-carousel h2,
html body.page-node-type-blog #wrapper .region.region-content-wide div.views-element-container h2 {
  font-size: 1.25rem !important;
  padding-top: 1rem !important;
  margin-top: 0 !important;
}

/* ==========================================================================
   Catalog nav — accordions + brand Load more (win over custom CSS grid)
   ========================================================================== */











/* Mobile: center divider between content, not at screen center (2026-10-01).
   Override rigid 50/50 flex with content-sized items centered in container.
   Divider (border-right on location) sits between header-info-desc and hours. */
@media (max-width: 767.98px) {
  html body #wrapper .header .header-info .header-info-container,
  html body.path-frontpage #wrapper .header .header-info .header-info-container,
  html body.path-taxonomy #wrapper .header .header-info .header-info-container,
  html body.path-products #wrapper .header .header-info .header-info-container,
  html body.path-product #wrapper .header .header-info .header-info-container,
  html body.path-store #wrapper .header .header-info .header-info-container {
    justify-content: center !important;
  }
  html body #wrapper .header .header-info .header-info-item--location,
  html body #wrapper .header .header-info .header-info-item--hours,
  html body.path-frontpage #wrapper .header .header-info .header-info-item--location,
  html body.path-frontpage #wrapper .header .header-info .header-info-item--hours,
  html body.path-taxonomy #wrapper .header .header-info .header-info-item--location,
  html body.path-taxonomy #wrapper .header .header-info .header-info-item--hours,
  html body.path-products #wrapper .header .header-info .header-info-item--location,
  html body.path-products #wrapper .header .header-info .header-info-item--hours {
    flex: 0 1 auto !important;
    max-width: none !important;
  }
}

/* Mobile: balance divider spacing - gap adds right-side only, use padding (2026-10-01). */
@media (max-width: 767.98px) {
  html body #wrapper .header .header-info .header-info-container,
  html body.path-frontpage #wrapper .header .header-info .header-info-container,
  html body.path-taxonomy #wrapper .header .header-info .header-info-container,
  html body.path-products #wrapper .header .header-info .header-info-container,
  html body.path-product #wrapper .header .header-info .header-info-container,
  html body.path-store #wrapper .header .header-info .header-info-container {
    gap: 0 !important;
    column-gap: 0 !important;
  }
}

/* Mobile: equal 50/50 splits for balanced divider (2026-10-01).
   Overrides content-sized flex that pushed divider to 39%. */
@media (max-width: 767.98px) {
  html body #wrapper .header .header-info .header-info-container,
  html body.path-frontpage #wrapper .header .header-info .header-info-container,
  html body.path-taxonomy #wrapper .header .header-info .header-info-container,
  html body.path-products #wrapper .header .header-info .header-info-container,
  html body.path-product #wrapper .header .header-info .header-info-container,
  html body.path-store #wrapper .header .header-info .header-info-container {
    justify-content: space-between !important;
  }
  html body #wrapper .header .header-info .header-info-item--location,
  html body #wrapper .header .header-info .header-info-item--hours,
  html body.path-frontpage #wrapper .header .header-info .header-info-item--location,
  html body.path-frontpage #wrapper .header .header-info .header-info-item--hours,
  html body.path-taxonomy #wrapper .header .header-info .header-info-item--location,
  html body.path-taxonomy #wrapper .header .header-info .header-info-item--hours,
  html body.path-products #wrapper .header .header-info .header-info-item--location,
  html body.path-products #wrapper .header .header-info .header-info-item--hours,
  html body.path-product #wrapper .header .header-info .header-info-item--location,
  html body.path-product #wrapper .header .header-info .header-info-item--hours {
    flex: 1 1 50% !important;
    max-width: 50% !important;
    min-width: 0 !important;
  }
}

/* assets/css/partners-listing.css */
/**
 * Partners listing — /partners and /{city}-tx/partners.
 * Late-loaded after chrome-layout-fix, before high-intent-cta.css.
 * Listing only: never touch page-node-type-partners or the homepage slideshow.
 */

html body.path-partners:not(.page-node-type-partners),
html body.page-partners:not(.page-node-type-partners),
html body.page-katy-tx-partners:not(.page-node-type-partners),
html body.page-houston-tx-partners:not(.page-node-type-partners),
html body.page-cypress-tx-partners:not(.page-node-type-partners),
html body.page-spring-tx-partners:not(.page-node-type-partners),
html body.page-jersey-village-tx-partners:not(.page-node-type-partners),
html body.page-tomball-tx-partners:not(.page-node-type-partners),
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) {
  --pl-ink: #1a0a24;
  --pl-forest: #3b0a5c;
  --pl-brand: #6716aa;
  --pl-mist: #f5f0fa;
}

/* -------------------------------------------------------------------------- */
/* White canvas — match /spring-tx/partners (no mint #f5f0fa slab)            */
/* -------------------------------------------------------------------------- */

html body.path-partners:not(.page-node-type-partners) #wrapper #main-content,
html body.path-partners:not(.page-node-type-partners) #wrapper .region.region-content,
html body.path-partners:not(.page-node-type-partners) #wrapper .main-content,
html body.path-partners:not(.page-node-type-partners) .content-layout,
html body.path-partners.page-partners #wrapper #main-content,
html body.path-partners.page-partners #wrapper .region.region-content,
html body.path-partners.page-partners #wrapper .main-content,
html body.path-partners.page-partners .content-layout,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) #wrapper #main-content,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) #wrapper .region.region-content,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) #wrapper .main-content,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .content-layout {
  background: #ffffff !important;
  background-color: #ffffff !important;
  background-image: none !important;
  color: #1a0a24 !important;
}

html body.path-partners:not(.page-node-type-partners) .views-element-container,
html body.path-partners:not(.page-node-type-partners) .partners-listing-view,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .views-element-container,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partners-listing-view,
html body.page-spring-tx-partners:not(.page-node-type-partners) .views-element-container,
html body.page-cypress-tx-partners:not(.page-node-type-partners) .views-element-container,
html body.page-katy-tx-partners:not(.page-node-type-partners) .views-element-container,
html body.page-jersey-village-tx-partners:not(.page-node-type-partners) .views-element-container,
html body.page-houston-tx-partners:not(.page-node-type-partners) .views-element-container,
html body.page-tomball-tx-partners:not(.page-node-type-partners) .views-element-container {
  background: transparent !important;
  background-color: transparent !important;
}

/* -------------------------------------------------------------------------- */
/* Flatten nested view-header card                                            */
/* -------------------------------------------------------------------------- */

html body.path-partners:not(.page-node-type-partners) .partners-listing-view .view-header,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partners-listing-view .view-header,
html body.page-spring-tx-partners:not(.page-node-type-partners) .partners-listing-view .view-header,
html body.page-cypress-tx-partners:not(.page-node-type-partners) .partners-listing-view .view-header,
html body.page-katy-tx-partners:not(.page-node-type-partners) .partners-listing-view .view-header,
html body.page-jersey-village-tx-partners:not(.page-node-type-partners) .partners-listing-view .view-header,
html body.page-houston-tx-partners:not(.page-node-type-partners) .partners-listing-view .view-header,
html body.page-tomball-tx-partners:not(.page-node-type-partners) .partners-listing-view .view-header {
  background: transparent !important;
  background-color: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 0 0.35rem !important;
  text-align: center !important;
  width: 100% !important;
}

/* -------------------------------------------------------------------------- */
/* Column measure: 52rem H1 + intro, 1100px grid                              */
/* -------------------------------------------------------------------------- */

html body.path-partners:not(.page-node-type-partners) .view-partners,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .view-partners {
  width: 100% !important;
  max-width: 1190px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 0.75rem !important;
  padding-right: 0.75rem !important;
  box-sizing: border-box !important;
}

html body.path-partners:not(.page-node-type-partners) .partners-listing-h1,
html body.path-partners:not(.page-node-type-partners) h1.partners-listing-h1,
html body.path-partners:not(.page-node-type-partners) .view-header h1,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partners-listing-h1,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) h1.partners-listing-h1,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .view-header h1 {
  display: block !important;
  width: 100% !important;
  max-width: 52rem !important;
  margin: 0.85rem auto 1.1rem !important;
  padding: 0.9rem 1.25rem !important;
  box-sizing: border-box !important;
  text-align: center !important;
  float: none !important;
  position: relative !important;
  left: auto !important;
  right: auto !important;
  transform: none !important;
  font-weight: 800 !important;
  font-size: clamp(1.25rem, 2.6vw, 1.75rem) !important;
  line-height: 1.3 !important;
  letter-spacing: 0.01em !important;
  background: linear-gradient(135deg, #3b0a5c 0%, #6716aa 55%, #7b2cbf 100%) !important;
  background-color: #3b0a5c !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  text-shadow: none !important;
  border: 2px solid #000 !important;
  border-radius: 10px !important;
  box-shadow: 0 3px 12px rgba(59, 10, 92, 0.22) !important;
  word-wrap: break-word !important;
  overflow-wrap: anywhere !important;
}

html body.path-partners:not(.page-node-type-partners) .partners-listing-h1 *,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partners-listing-h1 * {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  background: transparent !important;
}

html body.path-partners:not(.page-node-type-partners) .partners-listing-intro,
html body.path-partners:not(.page-node-type-partners) .partners-listing-intro.hub-intro,
html body.path-partners:not(.page-node-type-partners) .view-header .partners-listing-intro.hub-intro,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partners-listing-intro,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partners-listing-intro.hub-intro,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .view-header .partners-listing-intro,
html body[class*="-partners"]:not(.page-node-type-partners) .view-header .partners-listing-intro.hub-intro {
  display: block !important;
  width: 100% !important;
  max-width: 52rem !important;
  margin: 0.5rem auto 1.75rem !important;
  padding: 1.25rem 1.35rem 1.4rem !important;
  background: #ffffff !important;
  background-color: #ffffff !important;
  background-image: none !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  border: 1px solid #e9d5ff !important;
  border-left: 5px solid #6716aa !important;
  border-radius: 16px !important;
  box-shadow: 0 4px 14px rgba(59, 10, 92, 0.08) !important;
  box-sizing: border-box !important;
  text-align: left !important;
  opacity: 1 !important;
  filter: none !important;
}

html body.path-partners:not(.page-node-type-partners) .partners-listing-intro p,
html body.path-partners:not(.page-node-type-partners) .partners-listing-intro .hub-intro__deck,
html body.path-partners:not(.page-node-type-partners) .partners-listing-intro .hub-intro__deck p,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partners-listing-intro p,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partners-listing-intro .hub-intro__deck,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partners-listing-intro .hub-intro__deck p {
  display: block !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  text-shadow: none !important;
  padding: 0 !important;
  margin: 0 0 0.85rem !important;
  max-width: none !important;
  font-size: 1.05rem !important;
  line-height: 1.62 !important;
  font-weight: 500 !important;
  opacity: 1 !important;
}

html body.path-partners:not(.page-node-type-partners) .partners-listing-intro .hub-intro__links,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partners-listing-intro .hub-intro__links,
html body.path-partners:not(.page-node-type-partners) .view-header .hub-intro__links,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .view-header .hub-intro__links {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 0.55rem 0.65rem !important;
  margin: 0.95rem 0 0 !important;
  max-width: none !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* Ghosts only here — primary fill comes from high-intent-cta.css */
html body.path-partners:not(.page-node-type-partners) .partners-listing-intro .hub-intro__btn--ghost,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partners-listing-intro .hub-intro__btn--ghost,
html body.path-partners:not(.page-node-type-partners) .view-header .hub-intro__btn--ghost,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .view-header .hub-intro__btn--ghost {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 2.75rem !important;
  padding: 0.5rem 1.15rem !important;
  border: 2px solid #000 !important;
  border-radius: 999px !important;
  background: #ffffff !important;
  background-image: none !important;
  color: #5b21b6 !important;
  -webkit-text-fill-color: #5b21b6 !important;
  font-weight: 700 !important;
  font-size: 0.95rem !important;
  text-decoration: none !important;
  box-shadow: 0 2px 0 #000 !important;
  box-sizing: border-box !important;
}

html body.path-partners:not(.page-node-type-partners) .partners-listing-intro .hub-intro__btn--ghost:hover,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partners-listing-intro .hub-intro__btn--ghost:hover {
  background: #f5f0fa !important;
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  transform: translateY(-1px);
}

/* -------------------------------------------------------------------------- */
/* Cards                                                                      */
/* -------------------------------------------------------------------------- */

html body.path-partners.page-partners #wrapper .row.grid-noppading.grid-wrapper,
html body.path-partners:not(.page-node-type-partners) #wrapper .row.grid-noppading.grid-wrapper,
html body.path-partners:not(.page-node-type-partners) .partners-listing-view .row.grid-noppading.grid-wrapper,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) #wrapper .row.grid-noppading.grid-wrapper,
html body.path-partners:not(.page-node-type-partners) .view-partners .views-view-grid,
html body.path-partners:not(.page-node-type-partners) .view-partners .row,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .view-partners .row {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  column-gap: 0px !important;
  row-gap: 0px !important;
}

html body.path-partners.page-partners #wrapper .partners-listing-col.col-12.col-sm-12.col-md-6.col-lg-4.grid-item,
html body.path-partners:not(.page-node-type-partners) #wrapper .partners-listing-col.col-12.col-sm-12.col-md-6.col-lg-4.grid-item,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) #wrapper .partners-listing-col.col-12.col-sm-12.col-md-6.col-lg-4.grid-item,
html body.path-partners:not(.page-node-type-partners) .partners-listing-view .partners-listing-col,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partners-listing-view .partners-listing-col,
html body.path-partners:not(.page-node-type-partners) .view-partners .partners-listing-col,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .view-partners .partners-listing-col,
html body.path-partners:not(.page-node-type-partners) .view-partners [class*="col-"],
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .view-partners [class*="col-"] {
  padding: 0 !important;
  margin: 0 !important;
}

html body.path-partners:not(.page-node-type-partners) .partner-teaser--card,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partner-teaser--card {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 16rem !important;
  margin: 0 !important;
  padding: 1.25rem 1rem 1.15rem !important;
  background: #ffffff !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  border-top: 1px solid #e9d5ff !important;
  border-right: 1px solid #e9d5ff !important;
  border-bottom: 1px solid #e9d5ff !important;
  border-left: 5px solid #6716aa !important;
  border-radius: 16px !important;
  box-shadow: 0 4px 14px rgba(59, 10, 92, 0.1) !important;
  box-sizing: border-box !important;
  text-align: center !important;
  translate: 0 0;
  transition: translate 0.18s ease, box-shadow 0.18s ease !important;
}

html body.path-partners:not(.page-node-type-partners) .partner-teaser--card:hover,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partner-teaser--card:hover {
  translate: 0 -3px !important;
  box-shadow: 0 8px 20px rgba(59, 10, 92, 0.14) !important;
}

html body.path-partners:not(.page-node-type-partners) .partner-teaser__link,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partner-teaser__link {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  flex: 1 1 auto !important;
  width: 100% !important;
  text-decoration: none !important;
  color: inherit !important;
}

html body.path-partners:not(.page-node-type-partners) .partner-teaser__logo,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partner-teaser__logo {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 7.5rem !important;
  height: 7.5rem !important;
  margin: 0 auto 0.85rem !important;
  padding: 0.65rem !important;
  background: white !important;
  border: 2px solid #e9d5ff !important;
  border-radius: 50% !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
}

html body.path-partners:not(.page-node-type-partners) .partner-teaser__logo img,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partner-teaser__logo img {
  max-width: 100% !important;
  max-height: 100% !important;
  width: auto !important;
  height: auto !important;
  object-fit: contain !important;
}

html body.path-partners:not(.page-node-type-partners) .partner-teaser__title,
html body.path-partners:not(.page-node-type-partners) .partner-teaser__title a,
html body.path-partners:not(.page-node-type-partners) .partner-teaser__title span,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partner-teaser__title,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partner-teaser__title a,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partner-teaser__title span {
  margin: 0 0 0.65rem !important;
  padding: 0 !important;
  font-size: 1.05rem !important;
  font-weight: 800 !important;
  line-height: 1.35 !important;
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  text-decoration: none !important;
  text-align: center !important;
  background: transparent !important;
  border: 0 !important;
  text-shadow: none !important;
}

html body.path-partners:not(.page-node-type-partners) .partner-teaser__summary,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partner-teaser__summary {
  display: -webkit-box !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 2 !important;
  line-clamp: 2;
  overflow: hidden !important;
  width: 100% !important;
  max-width: 16rem !important;
  margin: 0 0 0.85rem !important;
  padding: 0 !important;
  background: #ffffff !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  font-size: 0.92rem !important;
  font-weight: 500 !important;
  line-height: 1.45 !important;
  text-align: center !important;
}

html body.path-partners:not(.page-node-type-partners) .partner-teaser .field-body,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partner-teaser .field-body {
  display: none !important;
}

html body[class*="path-"].page-partners-hub #wrapper .partners-hub {
  margin-top: 1rem !important;
  margin-bottom: -3rem !important;
}

html body.path-partners.page-partners #wrapper .row.grid-noppading.grid-wrapper, html body.path-partners:not(.page-node-type-partners) #wrapper .row.grid-noppading.grid-wrapper, html body.path-partners:not(.page-node-type-partners) #wrapper .partners-listing-view .row.grid-noppading.grid-wrapper, html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) #wrapper .row.grid-noppading.grid-wrapper {
  margin-top: -1.5rem !important;
  margin-bottom: -0.5rem !important;
}
/* -------------------------------------------------------------------------- */
/* Mobile                                                                     */
/* -------------------------------------------------------------------------- */

@media (max-width: 767.98px) {
  html body.path-partners:not(.page-node-type-partners) .view-partners,
  html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .view-partners {
    padding-left: 1.35rem !important;
    padding-right: 1.35rem !important;
  }
  html body.path-partners.page-partners #wrapper .row.grid-noppading.grid-wrapper, html body.path-partners:not(.page-node-type-partners) #wrapper .row.grid-noppading.grid-wrapper, html body.path-partners:not(.page-node-type-partners) #wrapper .partners-listing-view .row.grid-noppading.grid-wrapper, html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) #wrapper .row.grid-noppading.grid-wrapper {
    margin-top: 1rem !important;
    margin-bottom: 0rem !important;
  }

  html body[class*="path-"].page-partners-hub #wrapper .partners-hub {
    margin-top: -1rem !important;
    margin-bottom: -1.5rem !important;
  }

  html body.path-partners:not(.page-node-type-partners) .partner-teaser--card, html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partner-teaser--card {
    width: 105% !important;
    margin-left: -0.5rem !important;
    margin-top: -1rem !important;
  }

  html body.path-partners:not(.page-node-type-partners) .partners-listing-h1,
  html body.path-partners:not(.page-node-type-partners) h1.partners-listing-h1,
  html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partners-listing-h1,
  html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) h1.partners-listing-h1 {
    width: 100% !important;
    max-width: 52rem !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding: 0.8rem 0.95rem !important;
    font-size: 1.15rem !important;
  }

  html body.path-partners:not(.page-node-type-partners) .partners-listing-intro,
  html body.path-partners:not(.page-node-type-partners) .partners-listing-intro.hub-intro,
  html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partners-listing-intro,
  html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partners-listing-intro.hub-intro {
    width: 100% !important;
    max-width: 52rem !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding: 1.1rem 1.05rem 1.2rem !important;
  }

  html body.path-partners:not(.page-node-type-partners) .partners-listing-intro p,
  html body.path-partners:not(.page-node-type-partners) .partners-listing-intro .hub-intro__deck,
  html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partners-listing-intro p,
  html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partners-listing-intro .hub-intro__deck {
    font-size: 1.02rem !important;
    line-height: 1.58 !important;
  }

  html body.path-partners:not(.page-node-type-partners) .partners-listing-intro .hub-intro__links,
  html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partners-listing-intro .hub-intro__links,
  html body.path-partners:not(.page-node-type-partners) .view-header .hub-intro__links,
  html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .view-header .hub-intro__links {
    flex-direction: column !important;
    align-items: stretch !important;
  }

  html body.path-partners:not(.page-node-type-partners) .partners-listing-intro .hub-intro__btn,
  html body.path-partners:not(.page-node-type-partners) .partners-listing-intro .hub-intro__btn--ghost,
  html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partners-listing-intro .hub-intro__btn,
  html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partners-listing-intro .hub-intro__btn--ghost {
    width: 100% !important;
    max-width: 100% !important;
  }

  html body.path-partners:not(.page-node-type-partners) .view-partners .views-view-grid,
  html body.path-partners:not(.page-node-type-partners) .view-partners .row,
  html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .view-partners .row {
    margin-left: -0.25rem !important;
    margin-right: -0.25rem !important;
  }

  html body.path-partners.page-partners #wrapper .row.grid-noppading.grid-wrapper,
  html body.path-partners:not(.page-node-type-partners) #wrapper .row.grid-noppading.grid-wrapper,
  html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) #wrapper .row.grid-noppading.grid-wrapper {
    column-gap: 1rem !important;
    row-gap: 1rem !important;
  }

  html body.path-partners:not(.page-node-type-partners) .view-partners .partners-listing-col,
  html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .view-partners .partners-listing-col,
  html body.path-partners:not(.page-node-type-partners) .view-partners [class*="col-"],
  html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .view-partners [class*="col-"],
  html body.path-partners.page-partners #wrapper .partners-listing-col.col-12.col-sm-12.col-md-6.col-lg-4.grid-item {
    flex: 0 0 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  html body.path-partners:not(.page-node-type-partners) .partner-teaser__cta,
  html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partner-teaser__cta {
    width: 100% !important;
  }
}

/* Shared listing shell: one gutter, with matching heading and intro measures. */
html body[class*="path-"].page-partners-hub #wrapper .partners-hub {
  max-width: 1190px !important;
  padding: 0 0 2.25rem !important;
}

html body[class*="path-"].page-partners-hub #wrapper .partners-hub .partners-listing-intro {
  width: 100% !important;
  max-width: 52rem !important;
  margin-inline: auto !important;
}

@media (max-width: 767.98px) {
  html body[class*="path-"].page-partners-hub #wrapper #page-wrapper > .container {
    padding-inline: 15px !important;
  }

  html body[class*="path-"].page-partners-hub #wrapper .partners-hub .row.grid-noppading.grid-wrapper {
    padding-inline: 0 !important;
  }
}

/* assets/css/featured-products-slider.css */
/* Featured products carousel: same inset as the product grid, not full bleed */
.featured-products-embed,
.view-product-category-listings .featured-products-embed,
.view-product-catalog .featured-products-embed {
  display: block !important;
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0.75rem 0 1.35rem !important;
  padding: 0 !important;
}

.featured-products-embed .view-product-catalog-basic,
.featured-products-embed .view-item {
  width: 100%;
  max-width: 100%;
}

.featured-products-embed .featured-products-embed__title,
.featured-products-embed .view-header,
.featured-products-embed h2.block-title,
.featured-products-embed .view-product-catalog-basic .view-header {
  position: relative;
  margin: 0 0 0.85rem;
  padding: 0 0 0.5rem;
  font-size: clamp(1.15rem, 2.5vw, 1.45rem);
  font-weight: 700;
  line-height: 1.3;
  color: var(--commerce-purple-dark);
  border-bottom: 2px solid transparent;
  border-image: linear-gradient(90deg, var(--commerce-purple) 0%, var(--commerce-purple-light) 45%, transparent 100%) 1;
}

.featured-products-embed .fps {
  position: relative;
  width: 100%;
}

.featured-products-embed .fps__viewport {
  overflow: hidden;
  overscroll-behavior-inline: contain;
  width: 100%;
  cursor: grab;
  touch-action: pan-y pinch-zoom;
  -webkit-user-select: none;
  user-select: none;
}

.featured-products-embed .fps__viewport:active {
  cursor: grabbing;
}

.featured-products-embed .fps__track {
  display: flex;
  align-items: stretch;
  will-change: transform;
}

.featured-products-embed .fps__slide {
  box-sizing: border-box;
  min-width: 0;
  padding-bottom: 12px;
}

.featured-products-embed .fps a,
.featured-products-embed .fps img,
.featured-products-embed img {
  -webkit-user-drag: none;
  user-select: none;
  -webkit-user-select: none;
}

.featured-products-embed .product-teaser-wrap,
.featured-products-embed .product-teaser,
.featured-products-embed .product-teaser:hover,
.featured-products-embed .product-teaser:focus,
.featured-products-embed .fps__slide:hover .product-teaser {
  height: 100%;
  max-width: 100%;
  overflow: visible !important;
  transform: none !important;
  transition: box-shadow 0.2s ease, border-color 0.2s ease !important;
  box-shadow: var(--commerce-card-shadow) !important;
}

.featured-products-embed .product-teaser:hover {
  box-shadow: var(--commerce-card-shadow-hover) !important;
  transform: none !important;
}

.featured-products-embed .product-teaser .product-price,
.featured-products-embed .product-price {
  color: var(--commerce-purple) !important;
}

.featured-products-embed .fps__nav {
  position: absolute !important;
  top: 42% !important;
  transform: translateY(-50%) !important;
  z-index: 6 !important;
  margin: 0 !important;
  padding: 0 !important;
  width: 2.5rem !important;
  height: 2.5rem !important;
  border-radius: 50% !important;
  border: 1px solid rgba(103, 22, 170, 0.28) !important;
  background: rgba(255, 255, 255, 0.95) !important;
  color: var(--commerce-purple-dark) !important;
  box-shadow: 0 4px 14px rgba(91, 33, 182, 0.18) !important;
  font-size: 1.65rem !important;
  line-height: 1 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer;
}

.featured-products-embed .fps__prev {
  left: 0.75rem !important;
  right: auto !important;
}

.featured-products-embed .fps__next {
  right: 0.75rem !important;
  left: auto !important;
}

.featured-products-embed .fps__nav:hover,
.featured-products-embed .fps__nav:focus {
  background: var(--commerce-purple) !important;
  color: #fff !important;
  border-color: var(--commerce-purple) !important;
}

@media (max-width: 767px) {
  .featured-products-embed {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow: visible !important;
  }

  .featured-products-embed .fps__nav {
    width: 2.1rem !important;
    height: 2.1rem !important;
    font-size: 1.4rem !important;
    top: 38% !important;
  }
}

/* assets/css/catalog-search-blocks.css */
/**
 * Blog + product exposed search blocks — one white card on every surface.
 * Late-loaded after chrome-layout-fix, before high-intent-cta.css
 * so Search submit stays the 3D green pill.
 */

html body #wrapper #content-wide-top #block-martis-exposedformblog-searchblog-search,
html body #wrapper #content-wide-top #block-martis-exposedformproduct-catalogproduct-catalog-search,
html body.path-blog #wrapper #block-martis-exposedformblog-searchblog-search,
html body.page-blog #wrapper #block-martis-exposedformblog-searchblog-search,
html body.page-blog-term-index #wrapper #block-martis-exposedformblog-searchblog-search,
html body.page-blog-category #wrapper #block-martis-exposedformblog-searchblog-search,
html body.page-blog-tag #wrapper #block-martis-exposedformblog-searchblog-search,
html body.page-node-type-blog #wrapper #block-martis-exposedformblog-searchblog-search,
html body.path-taxonomy #wrapper #block-martis-exposedformblog-searchblog-search,
html body.path-products #wrapper #block-martis-exposedformproduct-catalogproduct-catalog-search,
html body.path-product #wrapper #block-martis-exposedformproduct-catalogproduct-catalog-search,
html body.path-taxonomy #wrapper #block-martis-exposedformproduct-catalogproduct-catalog-search,
html body.path-store #wrapper #block-martis-exposedformproduct-catalogproduct-catalog-search {
  display: block !important;
  width: 100% !important;
  max-width: 52rem !important;
  margin: 0.75rem auto 1.15rem !important;
  padding: 1rem 1.15rem 2.1rem !important;
  background: #ffffff !important;
  background-image: none !important;
  border: 1px solid #f3e8ff !important;
  border-left: 5px solid #6716aa !important;
  border-radius: 16px !important;
  box-shadow: 0 10px 28px rgba(26, 10, 36, 0.06) !important;
  box-sizing: border-box !important;
}

html body #wrapper #content-wide-top #block-martis-exposedformblog-searchblog-search .container-wrap,
html body #wrapper #content-wide-top #block-martis-exposedformproduct-catalogproduct-catalog-search .container-wrap,
html body #wrapper #content-wide-top #block-martis-exposedformblog-searchblog-search .block-content,
html body #wrapper #content-wide-top #block-martis-exposedformproduct-catalogproduct-catalog-search .block-content {
  background: transparent !important;
  padding: 0 !important;
  margin: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  box-shadow: none !important;
  border: 0 !important;
}

html body #wrapper #content-wide-top #block-martis-exposedformblog-searchblog-search .block-title-wrap,
html body #wrapper #content-wide-top #block-martis-exposedformproduct-catalogproduct-catalog-search .block-title-wrap,
html body #wrapper #content-wide-top #block-martis-exposedformblog-searchblog-search .block-title-content,
html body #wrapper #content-wide-top #block-martis-exposedformproduct-catalogproduct-catalog-search .block-title-content,
html body #wrapper #content-wide-top #block-martis-exposedformblog-searchblog-search h2.block-title,
html body #wrapper #content-wide-top #block-martis-exposedformproduct-catalogproduct-catalog-search h2.block-title,
html body.path-blog #wrapper #block-martis-exposedformblog-searchblog-search h2.block-title,
html body.path-products #wrapper #block-martis-exposedformproduct-catalogproduct-catalog-search h2.block-title,
html body.path-taxonomy #wrapper #block-martis-exposedformblog-searchblog-search h2.block-title,
html body.path-taxonomy #wrapper #block-martis-exposedformproduct-catalogproduct-catalog-search h2.block-title {
  display: block !important;
  width: 100% !important;
  margin: 0 0 0.65rem !important;
  padding: 0 !important;
  background: none !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  font-size: 1.08rem !important;
  font-weight: 800 !important;
  line-height: 1.25 !important;
  text-align: left !important;
  text-shadow: none !important;
  animation: none !important;
  animation-name: none !important;
  transform: none !important;
}

html body #wrapper #content-wide-top #views-exposed-form-blog-search-blog-search,
html body #wrapper #content-wide-top #views-exposed-form-product-catalog-product-catalog-search,
html body #wrapper #content-wide-top #block-martis-exposedformblog-searchblog-search .views-exposed-form,
html body #wrapper #content-wide-top #block-martis-exposedformproduct-catalogproduct-catalog-search .views-exposed-form {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: flex-end !important;
  gap: 0.65rem !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

html body #wrapper #content-wide-top #block-martis-exposedformblog-searchblog-search .form-item,
html body #wrapper #content-wide-top #block-martis-exposedformproduct-catalogproduct-catalog-search .form-item,
html body #wrapper #content-wide-top #block-martis-exposedformblog-searchblog-search .form-item-keys,
html body #wrapper #content-wide-top #block-martis-exposedformproduct-catalogproduct-catalog-search .form-item-keys {
  flex: 1 1 16rem !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

html body #wrapper #content-wide-top #block-martis-exposedformblog-searchblog-search .control-label,
html body #wrapper #content-wide-top #block-martis-exposedformproduct-catalogproduct-catalog-search .control-label,
html body #wrapper #content-wide-top #views-exposed-form-blog-search-blog-search label,
html body #wrapper #content-wide-top #views-exposed-form-product-catalog-product-catalog-search label,
html body.path-blog #wrapper #block-martis-exposedformblog-searchblog-search .control-label,
html body.path-products #wrapper #block-martis-exposedformproduct-catalogproduct-catalog-search .control-label,
html body.path-taxonomy #wrapper #block-martis-exposedformblog-searchblog-search .control-label,
html body.path-taxonomy #wrapper #block-martis-exposedformproduct-catalogproduct-catalog-search .control-label {
  display: block !important;
  margin: 0 0 0.3rem !important;
  padding: 0 !important;
  background: transparent !important;
  color: #10231a !important;
  -webkit-text-fill-color: #10231a !important;
  font-size: 0.86rem !important;
  font-weight: 650 !important;
  text-align: left !important;
  text-shadow: none !important;
  justify-content: flex-start !important;
}

html body #wrapper #content-wide-top #views-exposed-form-blog-search-blog-search input.form-text,
html body #wrapper #content-wide-top #views-exposed-form-product-catalog-product-catalog-search input.form-text,
html body #wrapper #content-wide-top #block-martis-exposedformblog-searchblog-search input[type="text"],
html body #wrapper #content-wide-top #block-martis-exposedformproduct-catalogproduct-catalog-search input[type="text"],
html body #wrapper #content-wide-top #edit-keys,
html body.path-blog #wrapper #views-exposed-form-blog-search-blog-search input.form-text,
html body.path-products #wrapper #views-exposed-form-product-catalog-product-catalog-search input.form-text,
html body.path-taxonomy #wrapper #views-exposed-form-blog-search-blog-search input.form-text,
html body.path-taxonomy #wrapper #views-exposed-form-product-catalog-product-catalog-search input.form-text {
  width: 100% !important;
  max-width: 100% !important;
  min-height: 2.85rem !important;
  margin: 0 !important;
  padding: 0.75rem 0.95rem !important;
  background: #ffffff !important;
  background-color: #ffffff !important;
  background-image: none !important;
  border: 1px solid #e9d5ff !important;
  border-radius: 12px !important;
  color: #10231a !important;
  -webkit-text-fill-color: #10231a !important;
  font-size: 1rem !important;
  line-height: 1.4 !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
}

html body #wrapper #content-wide-top #views-exposed-form-blog-search-blog-search input.form-text:focus,
html body #wrapper #content-wide-top #views-exposed-form-product-catalog-product-catalog-search input.form-text:focus,
html body #wrapper #content-wide-top #block-martis-exposedformblog-searchblog-search input[type="text"]:focus,
html body #wrapper #content-wide-top #block-martis-exposedformproduct-catalogproduct-catalog-search input[type="text"]:focus {
  outline: none !important;
  border-color: #6716aa !important;
  box-shadow: 0 0 0 3px rgba(103, 22, 170, 0.18) !important;
}

html body #wrapper #content-wide-top #block-martis-exposedformblog-searchblog-search .form-actions,
html body #wrapper #content-wide-top #block-martis-exposedformproduct-catalogproduct-catalog-search .form-actions,
html body #wrapper #content-wide-top #views-exposed-form-blog-search-blog-search .form-actions,
html body #wrapper #content-wide-top #views-exposed-form-product-catalog-product-catalog-search .form-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  flex: 0 0 auto !important;
  flex-shrink: 0 !important;
  width: auto !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}

html body #wrapper #content-wide-top #block-martis-exposedformblog-searchblog-search .form-submit,
html body #wrapper #content-wide-top #block-martis-exposedformproduct-catalogproduct-catalog-search .form-submit,
html body #wrapper #content-wide-top #edit-submit-blog-search,
html body #wrapper #content-wide-top [id^="edit-submit-product-catalog"],
html body.page-node-type-blog #wrapper #content-wide-top #edit-submit-blog-search,
html body.path-product #wrapper #content-wide-top [id^="edit-submit-product-catalog"] {
  flex: 0 0 auto !important;
  flex-shrink: 0 !important;
  width: auto !important;
  min-width: 8.75rem !important;
  max-width: none !important;
  min-height: 2.85rem !important;
  height: auto !important;
  writing-mode: horizontal-tb !important;
  top: 0.3rem;
}

@media (max-width: 767.98px) {
  html body #wrapper #content-wide-top #block-martis-exposedformblog-searchblog-search,
  html body #wrapper #content-wide-top #block-martis-exposedformproduct-catalogproduct-catalog-search,
  html body.path-blog #wrapper #block-martis-exposedformblog-searchblog-search,
  html body.page-blog #wrapper #block-martis-exposedformblog-searchblog-search,
  html body.page-blog-term-index #wrapper #block-martis-exposedformblog-searchblog-search,
  html body.page-blog-category #wrapper #block-martis-exposedformblog-searchblog-search,
  html body.page-blog-tag #wrapper #block-martis-exposedformblog-searchblog-search,
  html body.page-node-type-blog #wrapper #block-martis-exposedformblog-searchblog-search,
  html body.path-products #wrapper #block-martis-exposedformproduct-catalogproduct-catalog-search,
  html body.path-product #wrapper #block-martis-exposedformproduct-catalogproduct-catalog-search,
  html body.path-store #wrapper #block-martis-exposedformproduct-catalogproduct-catalog-search,
  html body.path-taxonomy #wrapper #block-martis-exposedformblog-searchblog-search,
  html body.path-taxonomy #wrapper #block-martis-exposedformproduct-catalogproduct-catalog-search {
    width: auto !important;
    max-width: none !important;
    margin: 0.5rem 1.35rem 2rem !important;
    padding: 0.9rem 0.85rem 0.95rem !important;
    border-radius: 14px !important;
    box-sizing: border-box !important;
  }

  html body #wrapper #content-wide-top #views-exposed-form-blog-search-blog-search,
  html body #wrapper #content-wide-top #views-exposed-form-product-catalog-product-catalog-search {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 0.55rem !important;
  }

  html body #wrapper #content-wide-top #block-martis-exposedformblog-searchblog-search .form-item,
  html body #wrapper #content-wide-top #block-martis-exposedformproduct-catalogproduct-catalog-search .form-item,
  html body #wrapper #content-wide-top #block-martis-exposedformblog-searchblog-search .form-actions,
  html body #wrapper #content-wide-top #block-martis-exposedformproduct-catalogproduct-catalog-search .form-actions {
    width: 100% !important;
    flex: 1 1 auto !important;
  }

  html body #wrapper #content-wide-top #block-martis-exposedformblog-searchblog-search .form-actions,
  html body #wrapper #content-wide-top #block-martis-exposedformproduct-catalogproduct-catalog-search .form-actions {
    justify-content: stretch !important;
  }
}

/* Blog category + tags browse blocks — sit under search, always visible. */
html body.path-blog #wrapper #content-wide-top #block-views-block-blog-taxonomy-blog-category,
html body.path-blog #wrapper #content-wide-top #block-views-block-blog-taxonomy-tag,
html body.page-blog #wrapper #content-wide-top #block-views-block-blog-taxonomy-blog-category,
html body.page-blog #wrapper #content-wide-top #block-views-block-blog-taxonomy-tag,
html body.page-node-type-blog #wrapper #content-wide-top #block-views-block-blog-taxonomy-blog-category,
html body.page-node-type-blog #wrapper #content-wide-top #block-views-block-blog-taxonomy-tag,
html body.page-blog-category #wrapper #content-wide-top #block-views-block-blog-taxonomy-blog-category,
html body.page-blog-tag #wrapper #content-wide-top #block-views-block-blog-taxonomy-tag,
html body.page-blog-term-index #wrapper #content-wide-top #block-views-block-blog-taxonomy-blog-category,
html body.page-blog-term-index #wrapper #content-wide-top #block-views-block-blog-taxonomy-tag {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  width: auto !important;
  max-width: 52rem !important;
  margin: 0 auto 1rem !important;
  padding: 0.85rem 1.1rem 1rem !important;
  background: #ffffff !important;
  border: 1px solid #e9d5ff !important;
  border-left: 5px solid #6716aa !important;
  border-radius: 16px !important;
  box-shadow: 0 8px 22px rgba(26, 10, 36, 0.05) !important;
  box-sizing: border-box !important;
}

html body.path-blog #wrapper #content-wide-top #block-views-block-blog-taxonomy-blog-category .block-title,
html body.path-blog #wrapper #content-wide-top #block-views-block-blog-taxonomy-tag .block-title,
html body.page-node-type-blog #wrapper #content-wide-top #block-views-block-blog-taxonomy-blog-category .block-title,
html body.page-node-type-blog #wrapper #content-wide-top #block-views-block-blog-taxonomy-tag .block-title {
  display: block !important;
  margin: 0 0 0.55rem !important;
  padding: 0 !important;
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  font-size: 1.02rem !important;
  font-weight: 800 !important;
  background: none !important;
  border: 0 !important;
  box-shadow: none !important;
}

html body.path-blog #wrapper #content-wide-top #block-views-block-blog-taxonomy-blog-category ul,
html body.path-blog #wrapper #content-wide-top #block-views-block-blog-taxonomy-tag ul,
html body.path-blog #wrapper #content-wide-top #block-views-block-blog-taxonomy-tag .tag-cloud,
html body.page-node-type-blog #wrapper #content-wide-top #block-views-block-blog-taxonomy-blog-category ul,
html body.page-node-type-blog #wrapper #content-wide-top #block-views-block-blog-taxonomy-tag ul {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 0.4rem !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

html body.path-blog #wrapper #content-wide-top #block-views-block-blog-taxonomy-blog-category li,
html body.path-blog #wrapper #content-wide-top #block-views-block-blog-taxonomy-tag li,
html body.page-node-type-blog #wrapper #content-wide-top #block-views-block-blog-taxonomy-blog-category li,
html body.page-node-type-blog #wrapper #content-wide-top #block-views-block-blog-taxonomy-tag li {
  display: inline-flex !important;
  margin: 0 !important;
  padding: 0 !important;
}

html body.path-blog #wrapper #content-wide-top #block-views-block-blog-taxonomy-blog-category a,
html body.path-blog #wrapper #content-wide-top #block-views-block-blog-taxonomy-tag a,
html body.page-node-type-blog #wrapper #content-wide-top #block-views-block-blog-taxonomy-blog-category a,
html body.page-node-type-blog #wrapper #content-wide-top #block-views-block-blog-taxonomy-tag a {
  display: inline-block !important;
  padding: 0.28rem 0.7rem !important;
  background: #f3e8ff !important;
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  border: 1px solid #e9d5ff !important;
  border-radius: 999px !important;
  font-size: 0.88rem !important;
  font-weight: 700 !important;
  text-decoration: none !important;
}

html body.path-blog #wrapper #content-wide-top #block-views-block-blog-taxonomy-blog-category a:hover,
html body.path-blog #wrapper #content-wide-top #block-views-block-blog-taxonomy-tag a:hover {
  background: #6716aa !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border-color: #000 !important;
}

@media (max-width: 767.98px) {
  html body.path-blog #wrapper #content-wide-top #block-views-block-blog-taxonomy-blog-category,
  html body.path-blog #wrapper #content-wide-top #block-views-block-blog-taxonomy-tag,
  html body.page-node-type-blog #wrapper #content-wide-top #block-views-block-blog-taxonomy-blog-category,
  html body.page-node-type-blog #wrapper #content-wide-top #block-views-block-blog-taxonomy-tag {
    max-width: none !important;
    margin: 0 1.35rem 0.85rem !important;
  }
}

/* JD-style term cards inside category/tag blocks */
html body.path-blog #wrapper #content-wide-top #block-views-block-blog-taxonomy-blog-category,
html body.path-blog #wrapper #content-wide-top #block-views-block-blog-taxonomy-tag {
  max-width: 72rem !important;
}

html body.path-blog #wrapper #content-wide-top #block-views-block-blog-taxonomy-blog-category .view-content,
html body.path-blog #wrapper #content-wide-top #block-views-block-blog-taxonomy-tag .view-content,
html body.path-blog #wrapper #content-wide-top #block-views-block-blog-taxonomy-blog-category .blog-taxonomy-block-view,
html body.path-blog #wrapper #content-wide-top #block-views-block-blog-taxonomy-tag .blog-taxonomy-block-view {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 0.85rem !important;
}

html body.path-blog #wrapper #content-wide-top #block-views-block-blog-taxonomy-tag .view-content,
html body.path-blog #wrapper #content-wide-top #block-views-block-blog-taxonomy-tag .blog-taxonomy-block-view {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

html body.path-blog #wrapper #content-wide-top .blog-term-index-card,
html body.path-blog #wrapper #content-wide-top #block-views-block-blog-taxonomy-blog-category .views-row,
html body.path-blog #wrapper #content-wide-top #block-views-block-blog-taxonomy-tag .views-row {
  display: flex !important;
  flex-direction: column !important;
  margin: 0 !important;
  padding: 0.95rem 1rem 1rem !important;
  background:
    radial-gradient(90% 70% at 15% 0%, rgba(143, 208, 179, 0.28) 0%, transparent 50%),
    linear-gradient(160deg, #7b2cbf 0%, #6716aa 48%, #3b0a5c 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border: 2px solid #000 !important;
  border-radius: 14px !important;
  box-sizing: border-box !important;
}

html body.path-blog #wrapper #content-wide-top .blog-term-index-title,
html body.path-blog #wrapper #content-wide-top .blog-term-index-title a,
html body.path-blog #wrapper #content-wide-top .blog-term-index-card a {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-weight: 800 !important;
  font-size: 1.05rem !important;
  line-height: 1.3 !important;
  text-decoration: none !important;
  margin: 0 0 0.4rem !important;
}

html body.path-blog #wrapper #content-wide-top .blog-term-index-desc,
html body.path-blog #wrapper #content-wide-top .blog-term-index-desc * {
  color: #eafff3 !important;
  -webkit-text-fill-color: #eafff3 !important;
  font-size: 0.88rem !important;
  line-height: 1.45 !important;
  margin: 0 0 0.55rem !important;
  font-weight: 500 !important;
}

html body.path-blog #wrapper #content-wide-top .blog-term-index-cue-wrap {
  margin-top: auto !important;
}

html body.path-blog #wrapper #content-wide-top .blog-term-index-cue {
  display: inline-flex !important;
  align-items: center !important;
  font-size: 0.82rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.02em !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

html body.path-blog #wrapper #content-wide-top .blog-term-index-cue::after {
  content: " →" !important;
}

html body.path-blog.page-blog #wrapper .blog-listing-intro__actions,
html body.page-blog-term-index #wrapper .blog-term-index-back {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  gap: 0.55rem !important;
}

html body.path-blog #wrapper a.blog-term-index-back-btn,
html body.page-blog-term-index #wrapper a.blog-term-index-back-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 44px !important;
  padding: 0.55rem 1.25rem !important;
  background: linear-gradient(180deg, #9b4dd4 0%, #6716aa 55%, #3b0a5c 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border: 2px solid #000 !important;
  border-radius: 999px !important;
  font-weight: 800 !important;
  text-decoration: none !important;
  box-shadow: 0 3px 0 #000, 0 8px 18px rgba(123, 44, 191, 0.28) !important;
}

html body.path-blog #wrapper a.blog-term-index-back-btn:hover,
html body.page-blog-term-index #wrapper a.blog-term-index-back-btn:hover {
  filter: brightness(1.06) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

@media (max-width: 991.98px) {
  html body.path-blog #wrapper #content-wide-top #block-views-block-blog-taxonomy-blog-category .view-content,
  html body.path-blog #wrapper #content-wide-top #block-views-block-blog-taxonomy-tag .view-content,
  html body.path-blog #wrapper #content-wide-top #block-views-block-blog-taxonomy-blog-category .blog-taxonomy-block-view,
  html body.path-blog #wrapper #content-wide-top #block-views-block-blog-taxonomy-tag .blog-taxonomy-block-view {
    grid-template-columns: 1fr !important;
  }
}

/* assets/css/product-catalog-sort.css */
/* JD2: remapped Cyberlytics green → Johnny Detail purple. Do not paste leftover CY greens. */
/**
 * Product listing sort bar — catalog, category, brand, and /products/search.
 * Late-loaded after chrome + catalog-search-blocks, before high-intent-cta.css.
 */

/* Hide sort widgets inside the shared search block except on /products/search. */
html body:not(.page-products-search) #wrapper #views-exposed-form-product-catalog-product-catalog-search .form-item-sort-by,
html body:not(.page-products-search) #wrapper #block-martis-exposedformproduct-catalogproduct-catalog-search .form-item-sort-by,
html body:not(.page-products-search) #wrapper #views-exposed-form-product-catalog-product-catalog-search .js-form-item-sort-by {
  display: none !important;
}

html body.path-products #wrapper #views-exposed-form-product-catalog-product-catalog,
html body.page-products #wrapper #views-exposed-form-product-catalog-product-catalog,
html body.path-taxonomy #wrapper #views-exposed-form-product-category-listings-page-category,
html body.path-taxonomy #wrapper #views-exposed-form-brand-product-listings-page-brand,
html body.path-products #wrapper .product-catalog > form.views-exposed-form:not(#views-exposed-form-product-catalog-product-catalog-search),
html body.path-taxonomy #wrapper .product-catalog > form.views-exposed-form:not(#views-exposed-form-product-catalog-product-catalog-search) {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: flex-end !important;
  justify-content: flex-start !important;
  text-align: left !important;
  gap: 0.65rem 0.75rem !important;
  position: relative !important;
  z-index: 1 !important;
  width: 100% !important;
  max-width: 30% !important;
  float: none !important;
  clear: both !important;
  margin: 0.35rem 0 1rem !important;
  padding: 0.9rem 1.1rem 0.95rem !important;
  background: #ffffff !important;
  background-image: none !important;
  border: 1px solid #e9d5ff !important;
  border-left: 5px solid #6716aa !important;
  border-radius: 16px !important;
  box-shadow: 0 10px 28px rgba(26, 10, 36, 0.06) !important;
  box-sizing: border-box !important;
}

/* Search page: sort row stays inside the existing search card. */

html body.path-products #wrapper #views-exposed-form-product-catalog-product-catalog .form-item,
html body.path-products #wrapper #views-exposed-form-product-catalog-product-catalog .form-item-sort-by,
html body.path-taxonomy #wrapper #views-exposed-form-product-category-listings-page-category .form-item-sort-by,
html body.path-taxonomy #wrapper #views-exposed-form-brand-product-listings-page-brand .form-item-sort-by,
html body.path-taxonomy #wrapper .product-catalog > form.views-exposed-form .form-item-sort-by,
html body.page-products-search #wrapper #views-exposed-form-product-catalog-product-catalog-search .form-item-sort-by {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  flex: 0 1 22rem !important;
  width: 100% !important;
  max-width: 24rem !important;
  min-width: 12rem !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

html body.path-products #wrapper #views-exposed-form-product-catalog-product-catalog .control-label,
html body.path-products #wrapper #views-exposed-form-product-catalog-product-catalog label,
html body.path-taxonomy #wrapper #views-exposed-form-product-category-listings-page-category label,
html body.path-taxonomy #wrapper #views-exposed-form-brand-product-listings-page-brand label,
html body.path-taxonomy #wrapper .product-catalog > form.views-exposed-form .form-item-sort-by label,
html body.page-products-search #wrapper #views-exposed-form-product-catalog-product-catalog-search .form-item-sort-by label {
  display: block !important;
  margin: 0 0 0.3rem !important;
  padding: 0 !important;
  background: transparent !important;
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  font-size: 0.86rem !important;
  font-weight: 650 !important;
  line-height: 1.2 !important;
  text-align: left !important;
  text-shadow: none !important;
}

/* Martis Chosen / nice-select clones the native select — keep one control. */
html body.path-products #wrapper #views-exposed-form-product-catalog-product-catalog .chosen-container,
html body.path-products #wrapper #views-exposed-form-product-catalog-product-catalog .nice-select,
html body.path-taxonomy #wrapper #views-exposed-form-product-category-listings-page-category .chosen-container,
html body.path-taxonomy #wrapper #views-exposed-form-product-category-listings-page-category .nice-select,
html body.path-taxonomy #wrapper #views-exposed-form-brand-product-listings-page-brand .chosen-container,
html body.path-taxonomy #wrapper #views-exposed-form-brand-product-listings-page-brand .nice-select,
html body.page-products-search #wrapper #views-exposed-form-product-catalog-product-catalog-search .chosen-container,
html body.page-products-search #wrapper #views-exposed-form-product-catalog-product-catalog-search .nice-select {
  display: none !important;
}

html body.path-products #wrapper #views-exposed-form-product-catalog-product-catalog .select-wrapper,
html body.path-taxonomy #wrapper #views-exposed-form-product-category-listings-page-category .select-wrapper,
html body.path-taxonomy #wrapper #views-exposed-form-brand-product-listings-page-brand .select-wrapper,
html body.path-taxonomy #wrapper .product-catalog > form.views-exposed-form .form-item-sort-by .select-wrapper,
html body.page-products-search #wrapper #views-exposed-form-product-catalog-product-catalog-search .form-item-sort-by .select-wrapper {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

html body.path-products #wrapper #views-exposed-form-product-catalog-product-catalog .select-wrapper::after,
html body.path-taxonomy #wrapper #views-exposed-form-product-category-listings-page-category .select-wrapper::after,
html body.path-taxonomy #wrapper #views-exposed-form-brand-product-listings-page-brand .select-wrapper::after,
html body.path-taxonomy #wrapper .product-catalog > form.views-exposed-form .form-item-sort-by .select-wrapper::after,
html body.page-products-search #wrapper #views-exposed-form-product-catalog-product-catalog-search .form-item-sort-by .select-wrapper::after {
  content: "" !important;
  position: absolute !important;
  top: 50% !important;
  right: 0.95rem !important;
  width: 0.45rem !important;
  height: 0.45rem !important;
  margin-top: -0.32rem !important;
  border-right: 2px solid #3b0a5c !important;
  border-bottom: 2px solid #3b0a5c !important;
  transform: rotate(45deg) !important;
  pointer-events: none !important;
}

html body.path-products #wrapper #views-exposed-form-product-catalog-product-catalog select,
html body.path-products #wrapper #views-exposed-form-product-catalog-product-catalog #edit-sort-by,
html body.path-taxonomy #wrapper #views-exposed-form-product-category-listings-page-category select,
html body.path-taxonomy #wrapper #views-exposed-form-brand-product-listings-page-brand select,
html body.path-taxonomy #wrapper .product-catalog > form.views-exposed-form .form-item-sort-by select,
html body.page-products-search #wrapper #views-exposed-form-product-catalog-product-catalog-search .form-item-sort-by select {
  -webkit-appearance: none !important;
  appearance: none !important;
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  min-height: 2.85rem !important;
  margin: 0 !important;
  padding: 0.65rem 2.2rem 0.65rem 0.95rem !important;
  background: #ffffff !important;
  background-color: #ffffff !important;
  background-image: none !important;
  border: 1px solid #e9d5ff !important;
  border-radius: 12px !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  font-size: 1rem !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
  cursor: pointer !important;
}

html body.path-products #wrapper #views-exposed-form-product-catalog-product-catalog select:focus,
html body.path-taxonomy #wrapper #views-exposed-form-product-category-listings-page-category select:focus,
html body.path-taxonomy #wrapper #views-exposed-form-brand-product-listings-page-brand select:focus,
html body.page-products-search #wrapper #views-exposed-form-product-catalog-product-catalog-search .form-item-sort-by select:focus {
  outline: none !important;
  border-color: #6716aa !important;
  box-shadow: 0 0 0 3px rgba(103, 22, 170, 0.18) !important;
}

html body.path-products #wrapper #views-exposed-form-product-catalog-product-catalog .form-actions,
html body.path-taxonomy #wrapper #views-exposed-form-product-category-listings-page-category .form-actions,
html body.path-taxonomy #wrapper #views-exposed-form-brand-product-listings-page-brand .form-actions,
html body.path-taxonomy #wrapper .product-catalog > form.views-exposed-form .form-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  flex: 0 0 auto !important;
  width: auto !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

@media (max-width: 767.98px) {
  html body.path-products #wrapper #views-exposed-form-product-catalog-product-catalog,
  html body.path-taxonomy #wrapper #views-exposed-form-product-category-listings-page-category,
  html body.path-taxonomy #wrapper #views-exposed-form-brand-product-listings-page-brand,
  html body.path-taxonomy #wrapper .product-catalog > form.views-exposed-form:not(#views-exposed-form-product-catalog-product-catalog-search) {
    flex-direction: column !important;
    align-items: stretch !important;
    width: auto !important;
    max-width: none !important;
    margin: 0.35rem 1.35rem 1rem !important;
    padding: 0.9rem 0.85rem 0.95rem !important;
    border-radius: 14px !important;
  }

  html body.path-products #wrapper #views-exposed-form-product-catalog-product-catalog .form-item,
  html body.path-products #wrapper #views-exposed-form-product-catalog-product-catalog .form-item-sort-by,
  html body.path-taxonomy #wrapper #views-exposed-form-product-category-listings-page-category .form-item-sort-by,
  html body.path-taxonomy #wrapper #views-exposed-form-brand-product-listings-page-brand .form-item-sort-by,
  html body.path-taxonomy #wrapper .product-catalog > form.views-exposed-form .form-item-sort-by,
  html body.path-products #wrapper #views-exposed-form-product-catalog-product-catalog .form-actions,
  html body.path-taxonomy #wrapper .product-catalog > form.views-exposed-form .form-actions,
  html body.page-products-search #wrapper #views-exposed-form-product-catalog-product-catalog-search .form-item-sort-by {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    flex: 1 1 auto !important;
  }

  html body.path-products #wrapper #views-exposed-form-product-catalog-product-catalog .form-submit,
  html body.path-taxonomy #wrapper #views-exposed-form-product-category-listings-page-category .form-submit,
  html body.path-taxonomy #wrapper #views-exposed-form-brand-product-listings-page-brand .form-submit,
  html body.path-taxonomy #wrapper .product-catalog > form.views-exposed-form .form-submit {
    width: 100% !important;
  }
}

/* assets/css/search-results-pages.css */
/* JD2: remapped Cyberlytics green → Johnny Detail purple. Do not paste leftover CY greens. */
/**
 * /products/search and /blog/search — listing-like chrome.
 * Late-loaded after chrome-layout-fix, before high-intent-cta.css.
 * Do not change /products/ or /blog/ listings except via shared classes.
 */

/* -------------------------------------------------------------------------- */
/* Product search: drop the /products/ browse wall                            */
/* -------------------------------------------------------------------------- */



html body.page-products-search #wrapper .search-results-h1,
html body.page-products-search #wrapper h1.commerce-content-h1.search-results-h1 {
  display: block !important;
  width: 100% !important;
  max-width: 52rem !important;
  margin: 0.75rem auto 1rem !important;
  padding: 0.85rem 1.2rem !important;
  box-sizing: border-box !important;
  text-align: center !important;
  font-weight: 800 !important;
  font-size: clamp(1.25rem, 2.6vw, 1.75rem) !important;
  line-height: 1.3 !important;
  background: linear-gradient(135deg, #3b0a5c 0%, #6716aa 55%, #7b2cbf 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border: 2px solid #000 !important;
  border-radius: 10px !important;
  box-shadow: 0 3px 12px rgba(59, 10, 92, 0.22) !important;
}

html body.page-products-search #wrapper .search-results-intro {
  display: block !important;
  width: 100% !important;
  max-width: 52rem !important;
  margin: 0.35rem auto 1.25rem !important;
  padding: 1.1rem 1.25rem 1.2rem !important;
  background: #ffffff !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  border: 1px solid #e9d5ff !important;
  border-left: 5px solid #6716aa !important;
  border-radius: 16px !important;
  box-shadow: 0 4px 14px rgba(59, 10, 92, 0.08) !important;
  box-sizing: border-box !important;
  text-align: left !important;
}

html body.page-products-search #wrapper .search-results-intro p,
html body.page-products-search #wrapper .search-results-intro .hub-intro__deck,
html body.page-products-search #wrapper .search-results-intro .hub-intro__deck p {
  margin: 0 0 0.75rem !important;
  padding: 0 !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  font-size: 1.05rem !important;
  line-height: 1.6 !important;
}

html body.page-products-search #wrapper .product-search-page,
html body.page-products-search #wrapper .product-catalog.product-search-page {
  width: 100% !important;
  max-width: 1220px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* -------------------------------------------------------------------------- */
/* Blog search: H1 + intro + 3-up listing cards                               */
/* -------------------------------------------------------------------------- */

html body.page-blog-search #wrapper #main-content,
html body.page-blog-search #wrapper .region.region-content {
  background: #f5f0fa !important;
  color: #1a0a24 !important;
}

html body.page-blog-search #wrapper .search-results-h1 {
  display: block !important;
  width: 100% !important;
  max-width: 52rem !important;
  margin: 0.75rem auto 1rem !important;
  padding: 0.85rem 1.2rem !important;
  box-sizing: border-box !important;
  text-align: center !important;
  font-weight: 800 !important;
  font-size: clamp(1.25rem, 2.6vw, 1.75rem) !important;
  line-height: 1.3 !important;
  background: linear-gradient(135deg, #3b0a5c 0%, #6716aa 55%, #7b2cbf 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border: 2px solid #000 !important;
  border-radius: 10px !important;
  box-shadow: 0 3px 12px rgba(59, 10, 92, 0.22) !important;
}

html body.page-blog-search #wrapper .blog-listing-intro.search-results-intro,
html body.page-blog-search #wrapper .search-results-intro {
  display: block !important;
  width: 100% !important;
  max-width: 52rem !important;
  margin: 0.35rem auto 1.25rem !important;
  padding: 1.1rem 1.25rem 1.2rem !important;
  background: #ffffff !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  border: 1px solid #e9d5ff !important;
  border-left: 5px solid #6716aa !important;
  border-radius: 16px !important;
  box-shadow: 0 4px 14px rgba(59, 10, 92, 0.08) !important;
  box-sizing: border-box !important;
  text-align: left !important;
}

html body.page-blog-search #wrapper .search-results-intro p {
  margin: 0 0 0.7rem !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  background: transparent !important;
  border: 0 !important;
  font-size: 1.05rem !important;
  line-height: 1.6 !important;
}

html body.page-blog-search #wrapper .blog-listing-intro__actions {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 0.55rem 0.65rem !important;
  margin: 0.85rem 0 0 !important;
}

html body.page-blog-search #wrapper .blog-listing-intro a.blog-term-index-back-btn,
html body.page-products-search #wrapper .search-results-intro .hub-intro__btn--ghost {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 44px !important;
  padding: 0.45rem 1.15rem !important;
  background: #ffffff !important;
  color: #5b21b6 !important;
  -webkit-text-fill-color: #5b21b6 !important;
  border: 2px solid #000 !important;
  border-radius: 999px !important;
  font-weight: 800 !important;
  text-decoration: none !important;
  box-shadow: 0 2px 0 #000 !important;
}

html body.page-blog-search #wrapper .blog-search-page {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 1.35rem !important;
  width: 100% !important;
  max-width: 1220px !important;
  margin: 0 auto 1.5rem !important;
}

html body.page-blog-search #wrapper .blog-search-page > .view-header,
html body.page-blog-search #wrapper .blog-search-page > nav,
html body.page-blog-search #wrapper .blog-search-page > .pager,
html body.page-blog-search #wrapper .blog-search-page > .pagerer-container {
  grid-column: 1 / -1 !important;
}

@media (min-width: 768px) {
  html body.page-blog-search #wrapper .blog-search-page {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 1.25rem !important;
  }
}

@media (min-width: 992px) {
  html body.page-blog-search #wrapper .blog-search-page {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 1.65rem !important;
  }
}

html body.page-blog-search #wrapper .blog-search-page > .views-row {
  display: flex !important;
  flex-direction: column !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

html body.page-blog-search #wrapper article.blog-post-teaser.post-row,
html body.page-blog-search #wrapper article.blog-post-teaser,
html body.page-blog-search #wrapper .blog-post-teaser {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  width: 100% !important;
  max-width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 0 0.35rem !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 16px !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
}

html body.page-blog-search #wrapper .blog-post-teaser .post-content-wrap {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  flex: 1 1 auto !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  gap: 0 !important;
  overflow: visible !important;
}

html body.page-blog-search #wrapper .blog-post-teaser .post-thumb,
html body.page-blog-search #wrapper .blog-post-teaser .post-media {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 0.35rem !important;
  position: relative !important;
  z-index: 3 !important;
  overflow: visible !important;
}

html body.page-blog-search #wrapper .blog-post-teaser .post-image {
  width: 100% !important;
  max-width: 100% !important;
  aspect-ratio: 16 / 9 !important;
  height: auto !important;
  max-height: none !important;
  margin: 0.35rem 0 -1.15rem !important;
  padding: 0 !important;
  border: 3px solid #3b0a5c !important;
  border-radius: 14px !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
  background: #1a0a24 !important;
  position: relative !important;
  z-index: 3 !important;
  display: block !important;
  transform: none !important;
}

html body.page-blog-search #wrapper .blog-post-teaser .post-image img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
  border: 0 !important;
  margin: 0 !important;
  transform: none !important;
}

html body.page-blog-search #wrapper .blog-post-teaser .post-content {
  display: flex !important;
  flex-direction: column !important;
  flex: 1 1 auto !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 1.65rem 1.1rem 1.15rem !important;
  box-sizing: border-box !important;
  background: linear-gradient(160deg, #7b2cbf 0%, #6716aa 48%, #3b0a5c 100%) !important;
  color: #ffffff !important;
  border: 2px solid #000 !important;
  border-radius: 14px !important;
  box-shadow: 0 4px 16px rgba(59, 10, 92, 0.16) !important;
  position: relative !important;
  z-index: 1 !important;
}

html body.page-blog-search #wrapper .blog-post-teaser .field-label,
html body.page-blog-search #wrapper .blog-post-teaser .visually-hidden {
  display: none !important;
}

html body.page-blog-search #wrapper .blog-post-teaser .post-title,
html body.page-blog-search #wrapper .blog-post-teaser .post-title a {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-weight: 800 !important;
  font-size: clamp(1.05rem, 1.8vw, 1.22rem) !important;
  line-height: 1.28 !important;
  text-decoration: none !important;
  display: -webkit-box !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 2 !important;
  overflow: hidden !important;
}

html body.page-blog-search #wrapper .blog-post-teaser .post-excerpt,
html body.page-blog-search #wrapper .blog-post-teaser .post-excerpt .field-item {
  color: #f0fdf6 !important;
  -webkit-text-fill-color: #f0fdf6 !important;
  font-size: 0.92rem !important;
  line-height: 1.5 !important;
  display: -webkit-box !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 3 !important;
  overflow: hidden !important;
  margin: 0 0 0.65rem !important;
}

html body.page-blog-search #wrapper .blog-post-teaser .post-meta {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 0.4rem !important;
  margin: 0.15rem 0 0.55rem !important;
}

html body.page-blog-search #wrapper .blog-post-teaser .post-meta-item.post-comment,
html body.page-blog-search #wrapper .blog-post-teaser .post-meta-item.post-author {
  display: none !important;
}

html body.page-blog-search #wrapper .blog-post-teaser .post-meta-item {
  display: inline-flex !important;
  align-items: center !important;
  background: #ffffff !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  border: 1.5px solid #3b0a5c !important;
  border-radius: 999px !important;
  padding: 0.22rem 0.55rem !important;
  font-size: 0.72rem !important;
  font-weight: 700 !important;
}

html body.page-blog-search #wrapper .blog-post-teaser .post-link {
  display: flex !important;
  justify-content: center !important;
  margin-top: auto !important;
  padding-top: 0.65rem !important;
}

/* -------------------------------------------------------------------------- */
/* Mobile gutters                                                             */
/* -------------------------------------------------------------------------- */

@media (max-width: 767.98px) {
  html body.page-products-search #wrapper .search-results-h1,
  html body.page-products-search #wrapper .search-results-intro,
  html body.page-blog-search #wrapper .search-results-h1,
  html body.page-blog-search #wrapper .search-results-intro,
  html body.page-products-search #wrapper .product-search-page,
  html body.page-blog-search #wrapper .blog-search-page {
    width: auto !important;
    margin-left: 1.35rem !important;
    margin-right: 1.35rem !important;
  }

  html body.page-blog-search #wrapper .blog-listing-intro__actions {
    flex-direction: column !important;
    align-items: stretch !important;
  }

  html body.page-blog-search #wrapper .blog-listing-intro__actions a {
    width: 100% !important;
    text-align: center !important;
  }
}

/* assets/css/policy-pages.css */
/**
 * Privacy / Terms / Bookings — readable card pages.
 * Late-loaded after chrome-layout-fix so Custom CSS green slabs lose.
 */

html body.page-privacy,
html body.page-terms-and-conditions,
html body.page-bookings-refunds {
  --pol-forest: #3b0a5c;
  --pol-brand: #6716aa;
  --pol-mid: #7b2cbf;
  --pol-soft: #f3e8ff;
  --pol-mist: #f5f0fa;
  --pol-ink: #1a0a24;
  --pol-body: #334155;
  --pol-link: #5b21b6;
  --pol-border: #e9d5ff;
}

html body.page-privacy #wrapper,
html body.page-terms-and-conditions #wrapper,
html body.page-bookings-refunds #wrapper,
html body.page-privacy #page-wrapper,
html body.page-terms-and-conditions #page-wrapper,
html body.page-bookings-refunds #page-wrapper {
  background: #ffffff !important;
}

html body.page-privacy #wrapper .privacy-cards-wrapper,
html body.page-terms-and-conditions #wrapper .terms-cards-wrapper,
html body.page-bookings-refunds #wrapper .policy-cards-wrapper {
  width: auto !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  padding: 0 !important;
  background: transparent !important;
  background-image: none !important;
  color: #334155 !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  overflow: visible !important;
  box-sizing: border-box !important;
}

@media (min-width: 992px) {
  html body.page-privacy #wrapper .privacy-cards-wrapper,
  html body.page-terms-and-conditions #wrapper .terms-cards-wrapper,
  html body.page-bookings-refunds #wrapper .policy-cards-wrapper {
    width: 72rem !important;
    max-width: 72rem !important;
    margin-bottom: 3rem !important;
  }
}

html body.page-privacy #wrapper .privacy-cards-wrapper::before,
html body.page-privacy #wrapper .privacy-cards-wrapper::after,
html body.page-terms-and-conditions #wrapper .terms-cards-wrapper::before,
html body.page-terms-and-conditions #wrapper .terms-cards-wrapper::after,
html body.page-bookings-refunds #wrapper .policy-cards-wrapper::before,
html body.page-bookings-refunds #wrapper .policy-cards-wrapper::after,
html body.page-privacy #wrapper #main-content .privacy-cards-wrapper::before,
html body.page-privacy #wrapper #main-content .privacy-cards-wrapper::after,
html body.page-terms-and-conditions #wrapper #main-content .terms-cards-wrapper::before,
html body.page-terms-and-conditions #wrapper #main-content .terms-cards-wrapper::after,
html body.page-bookings-refunds #wrapper #main-content .policy-cards-wrapper::before,
html body.page-bookings-refunds #wrapper #main-content .policy-cards-wrapper::after,
html body.page-privacy #wrapper #main-content .privacy-cards-wrapper .card::before,
html body.page-privacy #wrapper #main-content .privacy-cards-wrapper .card::after,
html body.page-privacy #wrapper #main-content .privacy-cards-wrapper .main-grid > .card::before,
html body.page-privacy #wrapper #main-content .privacy-cards-wrapper .main-grid > .card::after,
html body.page-privacy #wrapper #main-content .privacy-cards-wrapper .summary-box::before,
html body.page-privacy #wrapper #main-content .privacy-cards-wrapper .summary-box::after,
html body.page-privacy #wrapper #main-content .privacy-cards-wrapper .faq-card::before,
html body.page-privacy #wrapper #main-content .privacy-cards-wrapper .faq-card::after,
html body.page-privacy #wrapper #main-content .privacy-cards-wrapper .faq-section::before,
html body.page-privacy #wrapper #main-content .privacy-cards-wrapper .faq-section::after,
html body.page-privacy #wrapper #main-content .privacy-cards-wrapper .faq-section details.faq-card::before,
html body.page-privacy #wrapper #main-content .privacy-cards-wrapper .faq-section details.faq-card::after,
html body.page-terms-and-conditions #wrapper #main-content .terms-cards-wrapper .card::before,
html body.page-terms-and-conditions #wrapper #main-content .terms-cards-wrapper .card::after,
html body.page-terms-and-conditions #wrapper #main-content .terms-cards-wrapper .main-grid > .card::before,
html body.page-terms-and-conditions #wrapper #main-content .terms-cards-wrapper .main-grid > .card::after,
html body.page-terms-and-conditions #wrapper #main-content .terms-cards-wrapper .summary-box::before,
html body.page-terms-and-conditions #wrapper #main-content .terms-cards-wrapper .summary-box::after,
html body.page-terms-and-conditions #wrapper #main-content .terms-cards-wrapper .faq-card::before,
html body.page-terms-and-conditions #wrapper #main-content .terms-cards-wrapper .faq-card::after,
html body.page-terms-and-conditions #wrapper #main-content .terms-cards-wrapper .faq-section::before,
html body.page-terms-and-conditions #wrapper #main-content .terms-cards-wrapper .faq-section::after,
html body.page-terms-and-conditions #wrapper #main-content .terms-cards-wrapper .faq-section details.faq-card::before,
html body.page-terms-and-conditions #wrapper #main-content .terms-cards-wrapper .faq-section details.faq-card::after,
html body.page-bookings-refunds #wrapper #main-content .policy-cards-wrapper .card::before,
html body.page-bookings-refunds #wrapper #main-content .policy-cards-wrapper .card::after,
html body.page-bookings-refunds #wrapper #main-content .policy-cards-wrapper .main-grid > .card::before,
html body.page-bookings-refunds #wrapper #main-content .policy-cards-wrapper .main-grid > .card::after,
html body.page-bookings-refunds #wrapper #main-content .policy-cards-wrapper .summary-box::before,
html body.page-bookings-refunds #wrapper #main-content .policy-cards-wrapper .summary-box::after,
html body.page-bookings-refunds #wrapper #main-content .policy-cards-wrapper .faq-card::before,
html body.page-bookings-refunds #wrapper #main-content .policy-cards-wrapper .faq-card::after,
html body.page-bookings-refunds #wrapper #main-content .policy-cards-wrapper .faq-section::before,
html body.page-bookings-refunds #wrapper #main-content .policy-cards-wrapper .faq-section::after,
html body.page-bookings-refunds #wrapper #main-content .policy-cards-wrapper .faq-section details.faq-card::before,
html body.page-bookings-refunds #wrapper #main-content .policy-cards-wrapper .faq-section details.faq-card::after,
html body.page-node-type-page.page-privacy #wrapper .privacy-cards-wrapper .card::before,
html body.page-node-type-page.page-privacy #wrapper .privacy-cards-wrapper .card::after,
html body.page-node-type-page.page-privacy #wrapper .privacy-cards-wrapper .summary-box::before,
html body.page-node-type-page.page-privacy #wrapper .privacy-cards-wrapper .summary-box::after,
html body.page-node-type-page.page-terms-and-conditions #wrapper .terms-cards-wrapper .card::before,
html body.page-node-type-page.page-terms-and-conditions #wrapper .terms-cards-wrapper .card::after,
html body.page-node-type-page.page-bookings-refunds #wrapper .policy-cards-wrapper .card::before,
html body.page-node-type-page.page-bookings-refunds #wrapper .policy-cards-wrapper .card::after {
  content: none !important;
  display: none !important;
  background: none !important;
  background-color: transparent !important;
  width: 0 !important;
  height: 0 !important;
  border: 0 !important;
  box-shadow: none !important;
}

html body.page-privacy #wrapper .privacy-cards-wrapper h1,
html body.page-terms-and-conditions #wrapper .terms-cards-wrapper h1,
html body.page-bookings-refunds #wrapper .policy-cards-wrapper h1 {
  display: block !important;
  width: 100% !important;
  margin: 0 0 0.85rem !important;
  padding: 0.8rem 1rem !important;
  background: linear-gradient(135deg, #3b0a5c 0%, #6716aa 55%, #7b2cbf 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border: 2px solid #000 !important;
  border-radius: 12px !important;
  font-size: clamp(1.2rem, 2.4vw, 1.65rem) !important;
  font-weight: 800 !important;
  line-height: 1.3 !important;
  text-align: center !important;
  text-shadow: none !important;
  box-shadow: 0 3px 10px rgba(59, 10, 92, 0.18) !important;
}

html body.page-privacy #wrapper .privacy-cards-wrapper > p,
html body.page-terms-and-conditions #wrapper .terms-cards-wrapper > p,
html body.page-bookings-refunds #wrapper .policy-cards-wrapper > p,
html body.page-privacy #wrapper .privacy-cards-wrapper p:is([style],.jd-db-match-73803bd455b9),
html body.page-terms-and-conditions #wrapper .terms-cards-wrapper p:is([style],.jd-db-match-73803bd455b9),
html body.page-bookings-refunds #wrapper .policy-cards-wrapper p:is([style],.jd-db-match-73803bd455b9) {
  background: #f3e8ff !important;
  background-color: #f3e8ff !important;
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  border: 1px solid #e9d5ff !important;
  border-left: 4px solid #6716aa !important;
  border-radius: 999px !important;
  text-align: center !important;
  font-weight: 700 !important;
  font-size: 0.92rem !important;
  padding: 0.4rem 1rem !important;
  margin: 0 auto 1.15rem !important;
  max-width: 22rem !important;
  box-shadow: none !important;
}

html body.page-privacy #wrapper .privacy-cards-wrapper > p em,
html body.page-terms-and-conditions #wrapper .terms-cards-wrapper > p em,
html body.page-bookings-refunds #wrapper .policy-cards-wrapper > p em {
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  font-style: normal !important;
}

html body.page-privacy #wrapper .privacy-cards-wrapper .summary-box,
html body.page-privacy #wrapper .privacy-cards-wrapper .card,
html body.page-privacy #wrapper .privacy-cards-wrapper .faq-card,
html body.page-terms-and-conditions #wrapper .terms-cards-wrapper .summary-box,
html body.page-terms-and-conditions #wrapper .terms-cards-wrapper .card,
html body.page-terms-and-conditions #wrapper .terms-cards-wrapper .faq-card,
html body.page-bookings-refunds #wrapper .policy-cards-wrapper .summary-box,
html body.page-bookings-refunds #wrapper .policy-cards-wrapper .card,
html body.page-bookings-refunds #wrapper .policy-cards-wrapper .faq-card {
  background: #ffffff !important;
  background-image: none !important;
  color: #334155 !important;
  -webkit-text-fill-color: #334155 !important;
  border: 1px solid #e9d5ff !important;
  border-left: 5px solid #6716aa !important;
  border-radius: 14px !important;
  box-shadow: 0 4px 14px rgba(26, 10, 36, 0.05) !important;
  padding: 1.05rem 1.15rem 1.1rem !important;
  margin: 0 0 0.95rem !important;
}

html body.page-privacy #wrapper .privacy-cards-wrapper h2,
html body.page-terms-and-conditions #wrapper .terms-cards-wrapper h2,
html body.page-bookings-refunds #wrapper .policy-cards-wrapper h2,
html body.page-privacy #wrapper .privacy-cards-wrapper .summary-box h2,
html body.page-privacy #wrapper .privacy-cards-wrapper .card h2,
html body.page-bookings-refunds #wrapper .policy-cards-wrapper .summary-box h2 {
  display: block !important;
  width: auto !important;
  max-width: 100% !important;
  margin: 0 0 0.65rem !important;
  padding: 0 !important;
  background: none !important;
  background-image: none !important;
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  text-shadow: none !important;
  font-size: 1.2rem !important;
  font-weight: 800 !important;
  line-height: 1.3 !important;
  text-align: left !important;
}

html body.page-privacy #wrapper .privacy-cards-wrapper h3,
html body.page-terms-and-conditions #wrapper .terms-cards-wrapper h3,
html body.page-bookings-refunds #wrapper .policy-cards-wrapper h3 {
  margin: 1rem 0 0.4rem !important;
  padding: 0 !important;
  background: none !important;
  color: #6716aa !important;
  -webkit-text-fill-color: #6716aa !important;
  border: 0 !important;
  box-shadow: none !important;
  font-size: 1.02rem !important;
  font-weight: 800 !important;
}

html body.page-privacy #wrapper .privacy-cards-wrapper p,
html body.page-privacy #wrapper .privacy-cards-wrapper li,
html body.page-privacy #wrapper .privacy-cards-wrapper .summary-box p,
html body.page-privacy #wrapper .privacy-cards-wrapper .card p,
html body.page-privacy #wrapper .privacy-cards-wrapper .faq-card p,
html body.page-privacy #wrapper .privacy-cards-wrapper .field-item p,
html body.page-terms-and-conditions #wrapper .terms-cards-wrapper p,
html body.page-terms-and-conditions #wrapper .terms-cards-wrapper li,
html body.page-terms-and-conditions #wrapper .terms-cards-wrapper .card p,
html body.page-bookings-refunds #wrapper .policy-cards-wrapper p,
html body.page-bookings-refunds #wrapper .policy-cards-wrapper li,
html body.page-bookings-refunds #wrapper .policy-cards-wrapper .card p,
html body.page-bookings-refunds #wrapper .policy-cards-wrapper .summary-box p {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  color: #334155 !important;
  -webkit-text-fill-color: #334155 !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  text-shadow: none !important;
  font-size: 1.02rem !important;
  line-height: 1.65 !important;
}

html body.page-privacy #wrapper #main-content .privacy-cards-wrapper .summary-box p,
html body.page-privacy #wrapper #main-content .privacy-cards-wrapper .card p,
html body.page-privacy #wrapper #main-content .privacy-cards-wrapper .faq-card p,
html body.page-privacy #wrapper #main-content .privacy-cards-wrapper .main-grid .card p,
html body.page-privacy #wrapper .region.region-content .privacy-cards-wrapper .summary-box p,
html body.page-privacy #wrapper .region.region-content .privacy-cards-wrapper .card p,
html body.page-privacy #wrapper .region.region-content .privacy-cards-wrapper .faq-card p,
html body.page-privacy #wrapper .region.region-content .privacy-cards-wrapper .main-grid .card p,
html body.page-terms-and-conditions #wrapper #main-content .terms-cards-wrapper .card p,
html body.page-terms-and-conditions #wrapper #main-content .terms-cards-wrapper .faq-card p,
html body.page-terms-and-conditions #wrapper .region.region-content .terms-cards-wrapper .card p,
html body.page-terms-and-conditions #wrapper .region.region-content .terms-cards-wrapper .faq-card p,
html body.page-bookings-refunds #wrapper #main-content .policy-cards-wrapper .summary-box p,
html body.page-bookings-refunds #wrapper #main-content .policy-cards-wrapper .card p,
html body.page-bookings-refunds #wrapper #main-content .policy-cards-wrapper .faq-card p,
html body.page-bookings-refunds #wrapper .region.region-content .policy-cards-wrapper .summary-box p,
html body.page-bookings-refunds #wrapper .region.region-content .policy-cards-wrapper .card p,
html body.page-bookings-refunds #wrapper .region.region-content .policy-cards-wrapper .faq-card p,
html body.page-bookings-refunds #wrapper .region.region-content .policy-cards-wrapper .card li {
  margin: 0 0 0.55rem !important;
  padding: 0.75rem 1rem !important;
  background: transparent !important;
  background-color: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

html body.page-privacy #wrapper .region.region-content .privacy-cards-wrapper .summary-box p:last-child,
html body.page-privacy #wrapper .region.region-content .privacy-cards-wrapper .card p:last-child,
html body.page-bookings-refunds #wrapper .region.region-content .policy-cards-wrapper .card p:last-child {
  margin-bottom: 0 !important;
}

html body.page-privacy #wrapper #main-content .privacy-cards-wrapper ul,
html body.page-privacy #wrapper .region.region-content .privacy-cards-wrapper ul,
html body.page-terms-and-conditions #wrapper #main-content .terms-cards-wrapper ul,
html body.page-terms-and-conditions #wrapper .region.region-content .terms-cards-wrapper ul,
html body.page-bookings-refunds #wrapper #main-content .policy-cards-wrapper ul,
html body.page-bookings-refunds #wrapper .region.region-content .policy-cards-wrapper ul {
  margin: 0.15rem 0 0.75rem 0.35rem !important;
  padding: 0.15rem 0.35rem 0.15rem 1.2rem !important;
  background: transparent !important;
}

html body.page-privacy #wrapper #main-content .privacy-cards-wrapper li,
html body.page-privacy #wrapper .region.region-content .privacy-cards-wrapper li,
html body.page-privacy #wrapper .region.region-content .privacy-cards-wrapper .card li,
html body.page-privacy #wrapper .region.region-content .privacy-cards-wrapper .main-grid li,
html body.page-terms-and-conditions #wrapper #main-content .terms-cards-wrapper li,
html body.page-terms-and-conditions #wrapper .region.region-content .terms-cards-wrapper li,
html body.page-bookings-refunds #wrapper #main-content .policy-cards-wrapper li,
html body.page-bookings-refunds #wrapper .region.region-content .policy-cards-wrapper li,
html body.page-bookings-refunds #wrapper .region.region-content .policy-cards-wrapper .card li,
html body.page-node-type-page.page-privacy #wrapper .region.region-content li,
html body.page-node-type-page.page-terms-and-conditions #wrapper .region.region-content li,
html body.page-node-type-page.page-bookings-refunds #wrapper .region.region-content li {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0.55rem 0.85rem 0.55rem 0.35rem !important;
  margin: 0 0 0.2rem !important;
  box-shadow: none !important;
  color: #334155 !important;
  -webkit-text-fill-color: #334155 !important;
  line-height: 1.6 !important;
}

html body.page-privacy #wrapper .privacy-cards-wrapper a,
html body.page-terms-and-conditions #wrapper .terms-cards-wrapper a,
html body.page-bookings-refunds #wrapper .policy-cards-wrapper a {
  color: #5b21b6 !important;
  -webkit-text-fill-color: #5b21b6 !important;
  font-weight: 700 !important;
  text-decoration: underline !important;
  text-underline-offset: 2px !important;
}

html body.page-privacy #wrapper .privacy-cards-wrapper a:hover,
html body.page-terms-and-conditions #wrapper .terms-cards-wrapper a:hover,
html body.page-bookings-refunds #wrapper .policy-cards-wrapper a:hover {
  color: #7b2cbf !important;
  -webkit-text-fill-color: #7b2cbf !important;
}

@media (max-width: 767.98px) {
  html body.page-privacy #wrapper .privacy-cards-wrapper,
  html body.page-terms-and-conditions #wrapper .terms-cards-wrapper,
  html body.page-bookings-refunds #wrapper .policy-cards-wrapper {
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    margin-bottom: 2rem !important;
  }

  html body.page-privacy #wrapper .privacy-cards-wrapper h1,
  html body.page-terms-and-conditions #wrapper .terms-cards-wrapper h1,
  html body.page-bookings-refunds #wrapper .policy-cards-wrapper h1 {
    font-size: 1.15rem !important;
    padding: 0.7rem 0.75rem !important;
  }

  html body.page-privacy #wrapper .privacy-cards-wrapper > p,
  html body.page-terms-and-conditions #wrapper .terms-cards-wrapper > p,
  html body.page-bookings-refunds #wrapper .policy-cards-wrapper > p {
    max-width: 100% !important;
    border-radius: 10px !important;
  }

  html body.page-privacy #wrapper .privacy-cards-wrapper .summary-box,
  html body.page-privacy #wrapper .privacy-cards-wrapper .card,
  html body.page-privacy #wrapper .privacy-cards-wrapper .faq-card,
  html body.page-terms-and-conditions #wrapper .terms-cards-wrapper .card,
  html body.page-bookings-refunds #wrapper .policy-cards-wrapper .card,
  html body.page-bookings-refunds #wrapper .policy-cards-wrapper .summary-box {
    padding: 0.9rem 0.85rem 0.95rem !important;
  }

  html body.page-privacy #wrapper #main-content .privacy-cards-wrapper .summary-box p,
  html body.page-privacy #wrapper #main-content .privacy-cards-wrapper .card p,
  html body.page-privacy #wrapper #main-content .privacy-cards-wrapper .faq-card p,
  html body.page-privacy #wrapper .region.region-content .privacy-cards-wrapper .summary-box p,
  html body.page-privacy #wrapper .region.region-content .privacy-cards-wrapper .card p,
  html body.page-privacy #wrapper .region.region-content .privacy-cards-wrapper .faq-card p,
  html body.page-terms-and-conditions #wrapper #main-content .terms-cards-wrapper .card p,
  html body.page-terms-and-conditions #wrapper .region.region-content .terms-cards-wrapper .card p,
  html body.page-bookings-refunds #wrapper #main-content .policy-cards-wrapper .card p,
  html body.page-bookings-refunds #wrapper .region.region-content .policy-cards-wrapper .card p,
  html body.page-privacy #wrapper #main-content .privacy-cards-wrapper li,
  html body.page-privacy #wrapper .region.region-content .privacy-cards-wrapper li,
  html body.page-terms-and-conditions #wrapper #main-content .terms-cards-wrapper li,
  html body.page-bookings-refunds #wrapper #main-content .policy-cards-wrapper li,
  html body.page-bookings-refunds #wrapper .region.region-content .policy-cards-wrapper li {
    padding: 0.65rem 0.8rem !important;
  }

  html body.page-privacy #wrapper #main-content .privacy-cards-wrapper ul,
  html body.page-terms-and-conditions #wrapper #main-content .terms-cards-wrapper ul,
  html body.page-bookings-refunds #wrapper #main-content .policy-cards-wrapper ul {
    margin-left: 0.15rem !important;
    padding: 0.1rem 0.2rem 0.1rem 1.05rem !important;
  }
}

/* assets/css/team-page.css */
/**
 * Individual team node — /team/johnathon-nguyen
 * Late-loaded after chrome-layout-fix. Do not restyle /team listing.
 * Use #wrapper #main-content so these beat chrome-layout-fix.
 */

html body.page-node-type-team #wrapper,
html body.page-node-type-team #wrapper #page-wrapper {
  background: #ffffff !important;
}

html body.page-node-type-team #wrapper #main-content .node-type-team,
html body.page-node-type-team #wrapper #main-content .team-content,
html body.page-node-type-team #wrapper #main-content .team-detail,
html body.page-node-type-team #wrapper #main-content .team-body,
html body.page-node-type-team #wrapper #main-content .team-body .field-body,
html body.page-node-type-team #wrapper #main-content .team-body .field-item {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  width: auto !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}

html body.page-node-type-team #wrapper #main-content .team-content {
  margin: 0.35rem auto 1.5rem !important;
  padding: 0 0.15rem !important;
}

/* ------------------------------------------------------------------ */
/* Profile hero                                                        */
/* ------------------------------------------------------------------ */
html body.page-node-type-team #wrapper #main-content .team-header,
html body.page-node-type-team #wrapper #main-content .team-header.flex-wrap {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto 1.1rem !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

html body.page-node-type-team #wrapper #main-content .team-header .col-sm-5.figure,
html body.page-node-type-team #wrapper #main-content .team-header .figure {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 1.5rem !important;
  width: 100% !important;
  max-width: 100% !important;
  flex: 0 0 100% !important;
  float: none !important;
  margin: 0 !important;
  padding: 1.35rem 1.45rem !important;
  box-sizing: border-box !important;
  background: #ffffff !important;
  background-image: none !important;
  border: 1px solid #e9d5ff !important;
  border-radius: 20px !important;
  box-shadow: 0 14px 34px rgba(26, 10, 36, 0.07) !important;
  overflow: visible !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  transform: none !important;
}

html body.page-node-type-team #wrapper #main-content .team-header .team-thumb,
html body.page-node-type-team #wrapper #main-content .team-thumb {
  position: relative !important;
  display: block !important;
  flex: 0 0 9.5rem !important;
  width: 9.5rem !important;
  height: 11.25rem !important;
  min-width: 9.5rem !important;
  min-height: 11.25rem !important;
  max-width: 9.5rem !important;
  margin: 0 !important;
  padding: 0 !important;
  background: #f3e8ff !important;
  border: 2px solid #000 !important;
  border-radius: 16px !important;
  box-shadow: 0 8px 20px rgba(26, 10, 36, 0.12) !important;
  overflow: hidden !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  transform: none !important;
  float: none !important;
}

html body.page-node-type-team #wrapper #main-content .team-header .team-thumb .field,
html body.page-node-type-team #wrapper #main-content .team-header .team-thumb .field-item,
html body.page-node-type-team #wrapper #main-content .team-header .team-thumb .field-item > a {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  overflow: hidden !important;
  background: transparent !important;
  box-shadow: none !important;
}

html body.page-node-type-team #wrapper #main-content .team-header .team-thumb img,
html body.page-node-type-team #wrapper #main-content .team-header .team-thumb img.image-style-none {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  object-fit: cover !important;
  object-position: center 18% !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
}

html body.page-node-type-team #wrapper #main-content .team-header .team-meta,
html body.page-node-type-team #wrapper #main-content .team-meta.text-left {
  position: static !important;
  flex: 1 1 auto !important;
  width: auto !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  text-align: left !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  left: auto !important;
  top: auto !important;
  transform: none !important;
  float: none !important;
}

html body.page-node-type-team #wrapper #main-content .team-header h1.team-name,
html body.page-node-type-team #wrapper #main-content .team-header .team-name,
html body.page-node-type-team #wrapper #main-content .team-header .team-name span {
  display: block !important;
  width: auto !important;
  max-width: 100% !important;
  margin: 0 0 0.55rem !important;
  padding: 0 !important;
  background: none !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  font-size: clamp(1.55rem, 3vw, 2.1rem) !important;
  font-weight: 800 !important;
  line-height: 1.15 !important;
  letter-spacing: -0.025em !important;
  text-shadow: none !important;
  animation: none !important;
  transform: none !important;
  white-space: normal !important;
}

html body.page-node-type-team #wrapper #main-content .team-header .team-position {
  display: inline-flex !important;
  align-items: center !important;
  margin: 0 0 0.85rem !important;
  padding: 0.32rem 0.8rem !important;
  background: #6716aa !important;
  background-image: none !important;
  border: 2px solid #000 !important;
  border-radius: 999px !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-size: 0.88rem !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  text-shadow: none !important;
}

html body.page-node-type-team #wrapper #main-content .team-header .team-social,
html body.page-node-type-team #wrapper #main-content .team-social {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 0.5rem !important;
  margin: 0 !important;
  padding: 0 !important;
  width: auto !important;
  opacity: 1 !important;
  background: transparent !important;
  border: 0 !important;
}

html body.page-node-type-team #wrapper #main-content .team-header .team-social a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 2.55rem !important;
  height: 2.55rem !important;
  margin: 0 !important;
  padding: 0 !important;
  background: #6716aa !important;
  background-image: none !important;
  border: 2px solid #000 !important;
  border-radius: 999px !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-size: 1.05rem !important;
  line-height: 1 !important;
  text-decoration: none !important;
  box-shadow: 0 1px 0 #000 !important;
}

.team-social .ti-twitter-alt::before {
  scale: 1.15;
}

html body.page-node-type-team #wrapper #main-content .team-header .team-social a:hover {
  background: #3b0a5c !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

html body.page-node-type-team #wrapper #main-content .col-sm-7.team-detail {
  flex: 0 0 100% !important;
  max-width: 100% !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
}

/* Native vCard link; keep it outside the fixed-size social controls. */
html body.page-node-type-team #wrapper #main-content .jd-team-contact {
  margin-top: 1rem;
}

html body.page-node-type-team #wrapper #main-content .jd-team-contact__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  min-width: 44px;
  min-height: 48px;
  max-width: 100%;
  padding: 0.65rem 1.1rem;
  border: 2px solid #6716aa;
  border-radius: 10px;
  background: #6716aa;
  color: #ffffff;
  -webkit-text-fill-color: #ffffff;
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.4;
  text-align: center;
  text-decoration: none;
  text-shadow: none;
}

html body.page-node-type-team #wrapper #main-content .jd-team-contact__button:hover {
  border-color: #3b0a5c;
  background: #3b0a5c;
  color: #ffffff;
  text-decoration: none;
}

html body.page-node-type-team #wrapper #main-content .jd-team-contact__fallback {
  display: inline-flex;
  align-items: center;
  box-sizing: border-box;
  min-height: 44px;
  max-width: 100%;
  margin-left: 0.6rem;
  padding: 0.6rem 0.2rem;
  color: #6716aa !important;
  -webkit-text-fill-color: #6716aa !important;
  font-size: 0.875rem;
  font-weight: 600;
  line-height: 1.5;
  text-decoration: underline;
  text-underline-offset: 0.15em;
  text-shadow: none;
}

html body.page-node-type-team #wrapper #main-content .jd-team-contact__fallback[hidden] {
  display: none !important;
}

html body.page-node-type-team #wrapper #main-content .jd-team-contact__fallback:hover {
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
}

html body.page-node-type-team #wrapper #main-content .jd-team-contact__button:focus-visible,
html body.page-node-type-team #wrapper #main-content .jd-team-contact__fallback:focus-visible {
  outline: 3px solid #6716aa;
  outline-offset: 4px;
}

html body.page-node-type-team #wrapper #main-content .jd-team-contact__help {
  max-width: 34rem;
  margin: 0.6rem 0 0;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: #475569 !important;
  -webkit-text-fill-color: #475569 !important;
  font-size: 0.875rem;
  line-height: 1.5;
}

/* ------------------------------------------------------------------ */
/* Bio cards                                                           */
/* ------------------------------------------------------------------ */
html body.page-node-type-team #wrapper #main-content .profile-cards-wrapper,
html body.page-node-type-team #wrapper #main-content .team-body .profile-cards-wrapper {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  color: #334155 !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  box-shadow: none !important;
}

html body.page-node-type-team #wrapper #main-content .profile-cards-wrapper > .card:not(:has(> h2)):not(:has(> h3)) {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

html body.page-node-type-team #wrapper #main-content .profile-cards-wrapper > .card,
html body.page-node-type-team #wrapper #main-content .profile-cards-wrapper .card,
html body.page-node-type-team #wrapper #main-content .profile-cards-wrapper .card .card,
html body.page-node-type-team #wrapper #main-content .profile-cards-wrapper .main-grid .card,
html body.page-node-type-team #wrapper #main-content .profile-cards-wrapper .faq-card,
html body.page-node-type-team #wrapper #main-content .profile-cards-wrapper .summary-box,
html body.page-node-type-team #wrapper #main-content .profile-cards-wrapper .faq-grid {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

html body.page-node-type-team #wrapper #main-content .profile-cards-wrapper .card,
html body.page-node-type-team #wrapper #main-content .profile-cards-wrapper .card .card,
html body.page-node-type-team #wrapper #main-content .profile-cards-wrapper .main-grid .card,
html body.page-node-type-team #wrapper #main-content .profile-cards-wrapper .faq-card,
html body.page-node-type-team #wrapper #main-content .profile-cards-wrapper .summary-box {
  position: relative !important;
  background: #ffffff !important;
  background-image: none !important;
  color: #334155 !important;
  -webkit-text-fill-color: #334155 !important;
  border: 1px solid #e9d5ff !important;
  border-left: 5px solid #6716aa !important;
  border-radius: 14px !important;
  box-shadow: 0 4px 14px rgba(26, 10, 36, 0.05) !important;
  padding: 1.15rem 1.2rem 1.2rem !important;
  margin: 0 0 0.95rem !important;
  overflow: hidden !important;
}

html body.page-node-type-team #wrapper #main-content .profile-cards-wrapper .card::before,
html body.page-node-type-team #wrapper #main-content .profile-cards-wrapper .card::after,
html body.page-node-type-team #wrapper #main-content .profile-cards-wrapper .faq-card::before,
html body.page-node-type-team #wrapper #main-content .profile-cards-wrapper .faq-card::after,
html body.page-node-type-team #wrapper #main-content .profile-cards-wrapper .main-grid > .card::before,
html body.page-node-type-team #wrapper #main-content .profile-cards-wrapper .main-grid > .card::after {
  content: none !important;
  display: none !important;
}

html body.page-node-type-team #wrapper #main-content .profile-cards-wrapper h2,
html body.page-node-type-team #wrapper #main-content .profile-cards-wrapper .card h2,
html body.page-node-type-team #wrapper #main-content .profile-cards-wrapper .card h3,
html body.page-node-type-team #wrapper #main-content .profile-cards-wrapper .faq-card h3,
html body.page-node-type-team #wrapper #main-content .team-body h2,
html body.page-node-type-team #wrapper #main-content .team-detail h2 {
  display: inline-block !important;
  width: auto !important;
  max-width: 100% !important;
  margin: 0 0 0.75rem !important;
  padding: 0.32rem 0.75rem !important;
  background: #6716aa !important;
  background-image: none !important;
  border: 2px solid #000 !important;
  border-radius: 999px !important;
  box-shadow: none !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-size: 1.05rem !important;
  font-weight: 800 !important;
  line-height: 1.3 !important;
  text-align: left !important;
  text-shadow: none !important;
}

html body.page-node-type-team #wrapper #main-content .profile-cards-wrapper > h2,
html body.page-node-type-team #wrapper #main-content .profile-cards-wrapper h2:is([style],.jd-db-match-73803bd455b9) {
  display: block !important;
  width: 100% !important;
  margin: 1.35rem 0 0.85rem !important;
  padding: 0.55rem 0.9rem !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  background: linear-gradient(135deg, #3b0a5c 0%, #6716aa 55%, #7b2cbf 100%) !important;
  border: 2px solid #000 !important;
  border-radius: 12px !important;
  box-shadow: 0 3px 12px rgba(59, 10, 92, 0.2) !important;
  text-align: center !important;
  font-size: 1.3rem !important;
}

html body.page-node-type-team #wrapper #main-content .profile-cards-wrapper .faq-card h3 {
  font-size: 1.02rem !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

html body.page-node-type-team #wrapper #main-content .team-body p,
html body.page-node-type-team #wrapper #main-content .team-detail p,
html body.page-node-type-team #wrapper #main-content .profile-cards-wrapper p,
html body.page-node-type-team #wrapper #main-content .profile-cards-wrapper .card p,
html body.page-node-type-team #wrapper #main-content .profile-cards-wrapper .faq-card p,
html body.page-node-type-team #wrapper #main-content .profile-cards-wrapper .summary-box p {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: #334155 !important;
  -webkit-text-fill-color: #334155 !important;
  font-size: 1.02rem !important;
  line-height: 1.65 !important;
  margin: 0 0 0.75rem !important;
  padding: 0 !important;
  font-weight: 500 !important;
}

html body.page-node-type-team #wrapper #main-content .profile-cards-wrapper .card p:last-child,
html body.page-node-type-team #wrapper #main-content .profile-cards-wrapper .faq-card p:last-child {
  margin-bottom: 0 !important;
}

html body.page-node-type-team #wrapper #main-content .profile-cards-wrapper p strong,
html body.page-node-type-team #wrapper #main-content .profile-cards-wrapper .card p strong {
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  font-weight: 750 !important;
}

html body.page-node-type-team #wrapper #main-content .profile-cards-wrapper a,
html body.page-node-type-team #wrapper #main-content .team-body a {
  color: #5b21b6 !important;
  -webkit-text-fill-color: #5b21b6 !important;
  font-weight: 700 !important;
}

html body.page-node-type-team #wrapper #main-content .team-body li,
html body.page-node-type-team #wrapper #main-content .profile-cards-wrapper li,
html body.page-node-type-team #wrapper #main-content .team-biography {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: #334155 !important;
  padding: 0.15rem 0 !important;
  margin: 0 0 0.35rem !important;
}

html body.page-node-type-team #wrapper #main-content .profile-cards-wrapper .faq-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 0.9rem !important;
}

@media (max-width: 767.98px) {
  html body.page-node-type-team #wrapper #main-content .node-type-team > .row {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  html body.page-node-type-team #wrapper #main-content .team-content {
    margin: 0.15rem 0.5rem 1rem 0rem !important;
    padding: 0 !important;
  }

  html body.page-node-type-team #wrapper #main-content .team-header .col-sm-5.figure,
  html body.page-node-type-team #wrapper #main-content .team-header .figure {
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    gap: 0.9rem !important;
    padding: 1rem 0.9rem 1.1rem !important;
    border-radius: 16px !important;
  }

  html body.page-node-type-team #wrapper #main-content .team-header .team-thumb,
  html body.page-node-type-team #wrapper #main-content .team-thumb {
    flex-basis: 8.25rem !important;
    width: 8.25rem !important;
    height: 9.75rem !important;
    min-width: 8.25rem !important;
    min-height: 9.75rem !important;
    max-width: 8.25rem !important;
    margin: 0 auto !important;
  }

  html body.page-node-type-team #wrapper #main-content .team-header .team-meta,
  html body.page-node-type-team #wrapper #main-content .team-meta.text-left {
    text-align: center !important;
    width: 100% !important;
  }

  html body.page-node-type-team #wrapper #main-content .team-header h1.team-name,
  html body.page-node-type-team #wrapper #main-content .team-header .team-name {
    font-size: 1.4rem !important;
    text-align: center !important;
  }

  html body.page-node-type-team #wrapper #main-content .team-header .team-position,
  html body.page-node-type-team #wrapper #main-content .team-header .team-social {
    justify-content: center !important;
  }

  html body.page-node-type-team #wrapper #main-content .profile-cards-wrapper .card,
  html body.page-node-type-team #wrapper #main-content .profile-cards-wrapper .faq-card {
    padding: 0.95rem 0.9rem 1rem !important;
    border-radius: 12px !important;
  }

  html body.page-node-type-team #wrapper #main-content .profile-cards-wrapper .faq-grid {
    grid-template-columns: 1fr !important;
  }
}

/* Lazy plan reader — contained within the individual team biography. */
html body.path-node.page-node-type-team #wrapper #main-content .team-body .jd-team-plan {
  width: 100%;
  max-width: 100%;
  margin: 1.25rem 0;
  padding: 0;
  border: 0;
  background: transparent;
  text-align: center;
  box-sizing: border-box;
}

html body.path-node.page-node-type-team #wrapper #main-content .team-body .jd-team-plan :is(.jd-team-plan__trigger, [data-jd-plan-close], .jd-team-plan__panel a) {
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  min-height: 44px;
  max-width: 100%;
  padding: 0.65rem 1.15rem;
  margin: 0;
  border: 1px solid #6716aa;
  border-radius: 999px;
  background: #6716aa;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  font: inherit;
  font-size: 1rem;
  font-weight: 750;
  line-height: 1.35;
  text-align: center;
  text-decoration: none;
  text-shadow: none;
  white-space: normal;
  overflow-wrap: anywhere;
  box-shadow: 0 4px 12px #2414381a;
  cursor: pointer;
  box-sizing: border-box;
}

html body.path-node.page-node-type-team #wrapper #main-content .team-body .jd-team-plan :is(.jd-team-plan__trigger, [data-jd-plan-close], .jd-team-plan__panel a):hover {
  background: #3b0a5c;
  border-color: #3b0a5c;
  text-decoration: none;
}

html body.path-node.page-node-type-team #wrapper #main-content .team-body .jd-team-plan :is(.jd-team-plan__trigger, [data-jd-plan-close], .jd-team-plan__panel a):focus-visible {
  outline: 3px solid #6716aa;
  outline-offset: 4px;
  box-shadow: 0 0 0 2px #fff;
}

html body.path-node.page-node-type-team #wrapper #main-content .team-body .jd-team-plan .jd-team-plan__panel {
  width: 100%;
  max-width: 100%;
  margin: 1rem 0 0;
  padding: 1rem;
  border: 1px solid #d9c5ed;
  border-radius: 16px;
  background: #faf5ff;
  color: #241438;
  text-align: left;
  box-sizing: border-box;
}

html body.path-node.page-node-type-team #wrapper #main-content .team-body .jd-team-plan .jd-team-plan__panel[hidden] {
  display: none !important;
}

html body.path-node.page-node-type-team #wrapper #main-content .team-body .jd-team-plan .jd-team-plan__toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 0.65rem;
  margin: 0;
  padding: 0;
}

html body.path-node.page-node-type-team #wrapper #main-content .team-body .jd-team-plan .jd-team-plan__panel :is([data-jd-plan-close], a) {
  background: #fff;
  color: #6716aa !important;
  -webkit-text-fill-color: #6716aa !important;
  box-shadow: none;
}

html body.path-node.page-node-type-team #wrapper #main-content .team-body .jd-team-plan .jd-team-plan__panel :is([data-jd-plan-close], a):hover {
  background: #f3e8ff;
}

html body.path-node.page-node-type-team #wrapper #main-content .team-body .jd-team-plan [data-jd-plan-status] {
  margin: 0.75rem 0 !important;
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  font-size: 0.95rem !important;
  line-height: 1.5 !important;
}

html body.path-node.page-node-type-team #wrapper #main-content .team-body .jd-team-plan [data-jd-plan-status]:empty {
  display: none;
}

html body.path-node.page-node-type-team #wrapper #main-content .team-body .jd-team-plan [data-jd-plan-mount] {
  width: 100%;
  max-width: 100%;
  margin: 0.85rem 0 0;
  padding: 0;
  border: 0;
  min-width: 0;
}

html body.path-node.page-node-type-team #wrapper #main-content .team-body .jd-team-plan .jd-team-plan__frame {
  display: block;
  width: 100%;
  max-width: 100%;
  height: clamp(360px, 70vh, 800px);
  height: clamp(360px, 70svh, 800px);
  margin: 0;
  padding: 0;
  border: 1px solid #d9c5ed;
  border-radius: 8px;
  background: #fff;
  box-sizing: border-box;
}

@media (max-width: 575.98px) {
  html body.path-node.page-node-type-team #wrapper #main-content .team-body .jd-team-plan .jd-team-plan__panel {
    padding: 0.65rem;
    border-radius: 12px;
  }

  html body.path-node.page-node-type-team #wrapper #main-content .team-body .jd-team-plan .jd-team-plan__toolbar {
    justify-content: center;
  }

  html body.path-node.page-node-type-team #wrapper #main-content .team-body .jd-team-plan .jd-team-plan__toolbar > * {
    flex: 1 1 auto;
  }
}

/* assets/css/slide-additional-content.css */
/**
 * Johnny Detail — Service Slide Supporting Content
 * TOTAL REDESIGN V3
 *
 * Full replacement for:
 * themes/martis/assets/css/slide-additional-content.css
 *
 * Geometry intentionally mirrors Bootstrap 4.5 `.container.py-5`
 * used by the Martis theme:
 * - width: 100%
 * - 15px horizontal gutters
 * - centered
 * - 3rem top/bottom padding
 * - 540 / 720 / 960 / 1140px responsive max-widths
 */

/* =========================================================
   0. DESIGN TOKENS
   ========================================================= */

html body .node--type-slide.jd-service-slide {
  --jd-violet-950: #200432;
  --jd-violet-900: #2d0645;
  --jd-violet-850: #390858;
  --jd-violet-800: #490b70;
  --jd-violet-700: #65109d;
  --jd-violet-600: #7f20bd;
  --jd-violet-500: #9635d2;
  --jd-violet-400: #b55ee8;
  --jd-violet-300: #d5a4f5;
  --jd-violet-200: #e8cff9;
  --jd-violet-100: #f4e8fc;
  --jd-violet-50: #fbf7fe;

  --jd-ink-950: #1f1723;
  --jd-ink-800: #33293a;
  --jd-ink-650: #514657;
  --jd-ink-500: #706477;

  --jd-white: #ffffff;
  --jd-surface: #fdfbfe;
  --jd-surface-soft: #f7f1fb;

  --jd-line: rgba(74, 11, 112, 0.13);
  --jd-line-strong: rgba(103, 16, 157, 0.25);

  --jd-radius-sm: 12px;
  --jd-radius-md: 18px;
  --jd-radius-lg: 24px;

  --jd-shadow-soft:
    0 10px 28px rgba(44, 5, 67, 0.08);

  --jd-shadow-card:
    0 20px 55px rgba(44, 5, 67, 0.13);

  --jd-shadow-deep:
    0 24px 60px rgba(36, 4, 55, 0.22);
}


/* =========================================================
   1. EXACT CYBERLYTICS / BOOTSTRAP CONTAINER GEOMETRY
   ========================================================= */

/*
 * Match `.container.py-5` instead of giving Johnny Detail its
 * own arbitrary 72rem width or clamp-based side padding.
 */

html body
.node--type-slide.jd-service-slide
.slide-additional-content,
html body
.node--type-slide.jd-service-slide
.slide-additional-content.container,
html body
.node--type-slide.jd-service-slide
.slide-additional-content.container.py-5 {
  width: 100% !important;
  max-width: none !important;

  margin-right: auto !important;
  margin-left: auto !important;

  padding-top: 3rem !important;
  padding-right: 15px !important;
  padding-bottom: 3rem !important;
  padding-left: 15px !important;

  background: transparent !important;

  border: 0 !important;
  border-radius: 0 !important;

  box-shadow: none !important;

  overflow: visible !important;
  overflow-wrap: anywhere;

  box-sizing: border-box !important;
}


@media (min-width: 576px) {
  html body
  .node--type-slide.jd-service-slide
  .slide-additional-content,
  html body
  .node--type-slide.jd-service-slide
  .slide-additional-content.container,
  html body
  .node--type-slide.jd-service-slide
  .slide-additional-content.container.py-5 {
    max-width: 540px !important;
  }
}


@media (min-width: 768px) {
  html body
  .node--type-slide.jd-service-slide
  .slide-additional-content,
  html body
  .node--type-slide.jd-service-slide
  .slide-additional-content.container,
  html body
  .node--type-slide.jd-service-slide
  .slide-additional-content.container.py-5 {
    max-width: 720px !important;
  }
}


@media (min-width: 992px) {
  html body
  .node--type-slide.jd-service-slide
  .slide-additional-content,
  html body
  .node--type-slide.jd-service-slide
  .slide-additional-content.container,
  html body
  .node--type-slide.jd-service-slide
  .slide-additional-content.container.py-5 {
    max-width: 960px !important;
  }
}


@media (min-width: 1200px) {
  html body
  .node--type-slide.jd-service-slide
  .slide-additional-content,
  html body
  .node--type-slide.jd-service-slide
  .slide-additional-content.container,
  html body
  .node--type-slide.jd-service-slide
  .slide-additional-content.container.py-5 {
    max-width: 81.5% !important;
  }
}


/*
 * No second set of horizontal gutters.
 * The outer `.container` owns the 15px gutters.
 */
html body
.node--type-slide.jd-service-slide
.slide-additional-content__inner {
  width: 100% !important;
  max-width: none !important;

  margin: 0 !important;
  padding: 0 !important;

  box-sizing: border-box !important;
}


/* =========================================================
   2. MAIN REDESIGNED EXPERIENCE SHELL
   ========================================================= */

html body
.node--type-slide.jd-service-slide
.slide-seo {
  position: relative !important;

  width: 100% !important;
  max-width: none !important;

  margin: 0 !important;
  padding: 0 !important;

  overflow: hidden !important;

  color: var(--jd-ink-950) !important;

  background:
    radial-gradient(
      circle at 7% -5%,
      rgba(181, 94, 232, 0.14),
      transparent 28%
    ),
    radial-gradient(
      circle at 100% 100%,
      rgba(101, 16, 157, 0.08),
      transparent 31%
    ),
    linear-gradient(
      180deg,
      #ffffff 0%,
      #fbf8fd 100%
    ) !important;

  border:
    1px solid rgba(72, 11, 108, 0.14) !important;

  border-radius:
    var(--jd-radius-lg) !important;

  isolation: isolate !important;
}


/* Fine accent along the top edge. */
html body
.node--type-slide.jd-service-slide
.slide-seo::before {
  content: "" !important;

  position: absolute !important;

  top: 0 !important;
  left: 0 !important;
  right: 0 !important;

  height: 4px !important;

  background:
    linear-gradient(
      90deg,
      #5e0d91 0%,
      #a53fe0 48%,
      #d084f5 100%
    ) !important;

  z-index: 5 !important;
}


/* Soft decorative bloom. */
html body
.node--type-slide.jd-service-slide
.slide-seo::after {
  content: "" !important;

  position: absolute !important;

  width: 260px !important;
  height: 260px !important;

  right: -120px !important;
  top: 82px !important;

  pointer-events: none !important;

  background:
    radial-gradient(
      circle,
      rgba(174, 77, 226, 0.12) 0%,
      rgba(174, 77, 226, 0) 70%
    ) !important;

  z-index: -1 !important;
}


/* =========================================================
   3. TITLE — COMPLETELY NEW EDITORIAL HEADER
   ========================================================= */

html body
.node--type-slide.jd-service-slide
.slide-additional-content
.slide-seo
.section-title {
  position: relative !important;

  display: flex !important;
  align-items: center !important;

  width: 100% !important;

  margin: 0 !important;

  padding:
    clamp(1.35rem, 3vw, 2rem)
    clamp(1.25rem, 4vw, 2.4rem) !important;

  overflow: hidden !important;

  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;

  background:
    radial-gradient(
      circle at 88% 10%,
      rgba(222, 163, 250, 0.20),
      transparent 29%
    ),
    linear-gradient(
      118deg,
      #2e0548 0%,
      #4c0875 42%,
      #7414ac 74%,
      #8d25c8 100%
    ) !important;

  border: 0 !important;
  border-bottom:
    1px solid rgba(224, 181, 245, 0.22) !important;

  border-radius: 0 !important;

  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.12) !important;

  font-size:
    clamp(1.7rem, 3vw, 2.6rem) !important;

  font-weight:
    800 !important;

  line-height:
    1.12 !important;

  letter-spacing:
    -0.025em !important;

  text-wrap:
    balance;

  z-index: 2 !important;
}


/* Decorative rail, not another box. */
html body
.node--type-slide.jd-service-slide
.slide-additional-content
.slide-seo
.section-title::before {
  content: "" !important;

  flex: 0 0 auto !important;

  width: 5px !important;
  height: clamp(2.2rem, 5vw, 3rem) !important;

  margin-right: 0.85rem !important;

  background:
    linear-gradient(
      180deg,
      #e4b9fa 0%,
      #b858ea 100%
    ) !important;

  border-radius:
    999px !important;

  box-shadow:
    0 0 18px rgba(205, 119, 244, 0.36) !important;
}


html body
.node--type-slide.jd-service-slide
.slide-additional-content
.slide-seo
.section-title::after {
  content: "" !important;

  position: absolute !important;

  left: clamp(1.25rem, 4vw, 2.4rem) !important;
  right: clamp(1.25rem, 4vw, 2.4rem) !important;
  bottom: 0 !important;

  height: 1px !important;

  background:
    linear-gradient(
      90deg,
      transparent,
      rgba(223, 173, 247, 0.42),
      transparent
    ) !important;
}


/* =========================================================
   4. CONTENT GRID
   ========================================================= */

html body
.node--type-slide.jd-service-slide
.slide-seo__grid {
  display: grid !important;

  grid-template-columns:
    minmax(0, 1.18fr)
    minmax(300px, 0.82fr) !important;

  gap:
    clamp(1.5rem, 3vw, 2.4rem) !important;

  align-items:
    stretch !important;

  padding:
    clamp(1.35rem, 3vw, 2.2rem) !important;
}


html body
.node--type-slide.jd-service-slide
.slide-seo__column {
  min-width: 0 !important;
}


html body
.node--type-slide.jd-service-slide
.slide-seo p {
  max-width: 70ch !important;

  margin:
    0 0 1rem !important;

  color:
    var(--jd-ink-800) !important;

  font-size:
    1rem !important;

  line-height:
    1.7 !important;
}


/* =========================================================
   5. LEFT COLUMN — SERVICE NARRATIVE
   ========================================================= */

/* Lead is now a clean editorial intro, not another random card. */
html body
.node--type-slide.jd-service-slide
.slide-seo-lead {
  position: relative !important;

  margin:
    0 0 1.45rem !important;

  padding:
    0 0 0 1.1rem !important;

  color:
    #35273c !important;

  background:
    transparent !important;

  border:
    0 !important;

  border-left:
    3px solid var(--jd-violet-500) !important;

  border-radius:
    0 !important;

  box-shadow:
    none !important;

  font-size:
    clamp(1.04rem, 1.5vw, 1.12rem) !important;

  line-height:
    1.72 !important;
}


/* Process heading = compact section marker. */
html body
.node--type-slide.jd-service-slide
.slide-seo-steps-title {
  display: flex !important;
  align-items: center !important;

  margin:
    1.65rem 0 0.85rem !important;

  padding:
    0 !important;

  color:
    var(--jd-violet-800) !important;
  -webkit-text-fill-color:
    var(--jd-violet-800) !important;

  background:
    transparent !important;

  border:
    0 !important;

  border-radius:
    0 !important;

  box-shadow:
    none !important;

  font-size:
    1.1rem !important;

  font-weight:
    800 !important;

  line-height:
    1.3 !important;

  letter-spacing:
    0.01em !important;
}


html body
.node--type-slide.jd-service-slide
.slide-seo-steps-title::after {
  content: "" !important;

  flex:
    1 1 auto !important;

  height:
    1px !important;

  margin-left:
    0.85rem !important;

  background:
    linear-gradient(
      90deg,
      rgba(127, 32, 189, 0.34),
      rgba(127, 32, 189, 0)
    ) !important;
}


/* =========================================================
   6. PROCESS — NUMBERED TIMELINE CARDS
   ========================================================= */

html body
.node--type-slide.jd-service-slide
.seo-benefits {
  counter-reset:
    jd-service-step;

  display:
    grid !important;

  gap:
    0.72rem !important;

  margin:
    0 !important;

  padding:
    0 !important;

  list-style:
    none !important;
}


html body
.node--type-slide.jd-service-slide
.seo-benefits li {
  counter-increment:
    jd-service-step;

  position:
    relative !important;

  display:
    flex !important;

  align-items:
    center !important;

  min-height:
    58px !important;

  margin:
    0 !important;

  padding:
    0.8rem 1rem 0.8rem 3.9rem !important;

  overflow:
    hidden !important;

  color:
    #34293a !important;

  background:
    linear-gradient(
      135deg,
      rgba(255, 255, 255, 0.96),
      rgba(248, 241, 252, 0.94)
    ) !important;

  border:
    1px solid rgba(95, 20, 139, 0.14) !important;

  border-radius:
    14px !important;

  box-shadow:
    0 7px 18px rgba(46, 5, 70, 0.055) !important;

  line-height:
    1.48 !important;

  transition:
    transform 160ms ease,
    border-color 160ms ease,
    box-shadow 160ms ease !important;
}


html body
.node--type-slide.jd-service-slide
.seo-benefits li::before {
  content:
    counter(jd-service-step, decimal-leading-zero) !important;

  position:
    absolute !important;

  left:
    0.85rem !important;

  top:
    50% !important;

  display:
    inline-flex !important;

  align-items:
    center !important;

  justify-content:
    center !important;

  width:
    2.25rem !important;

  height:
    2.25rem !important;

  color:
    #ffffff !important;
  -webkit-text-fill-color:
    #ffffff !important;

  background:
    linear-gradient(
      145deg,
      #8f2ccc 0%,
      #5b0d8c 100%
    ) !important;

  border:
    1px solid #3a0759 !important;

  border-radius:
    11px !important;

  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.20),
    0 4px 11px rgba(70, 8, 103, 0.17) !important;

  font-size:
    0.73rem !important;

  font-weight:
    800 !important;

  letter-spacing:
    0.04em !important;

  transform:
    translateY(-50%) !important;
}


html body
.node--type-slide.jd-service-slide
.seo-benefits li::after {
  content: "" !important;

  position:
    absolute !important;

  top:
    0 !important;

  left:
    0 !important;

  width:
    3px !important;

  height:
    100% !important;

  background:
    linear-gradient(
      180deg,
      var(--jd-violet-400),
      var(--jd-violet-700)
    ) !important;

  opacity:
    0 !important;

  transition:
    opacity 160ms ease !important;
}


html body
.node--type-slide.jd-service-slide
.seo-benefits li:hover {
  border-color:
    rgba(126, 32, 189, 0.30) !important;

  box-shadow:
    0 12px 26px rgba(46, 5, 70, 0.10) !important;

  transform:
    translateY(-2px) !important;
}


html body
.node--type-slide.jd-service-slide
.seo-benefits li:hover::after {
  opacity:
    1 !important;
}


/* =========================================================
   7. RIGHT COLUMN — PREMIUM DARK SERVICE CARD
   ========================================================= */

html body
.node--type-slide.jd-service-slide
.slide-seo__column--details {
  position:
    relative !important;

  display:
    flex !important;

  flex-direction:
    column !important;

  align-self:
    stretch !important;

  min-width:
    0 !important;

  padding:
    clamp(1.15rem, 2.5vw, 1.55rem) !important;

  overflow:
    hidden !important;

  color:
    #ffffff !important;

  background:
    radial-gradient(
      circle at 100% 0%,
      rgba(195, 104, 239, 0.19),
      transparent 34%
    ),
    linear-gradient(
      155deg,
      #2a0641 0%,
      #3a0759 42%,
      #4d0b73 100%
    ) !important;

  border:
    1px solid rgba(225, 181, 246, 0.20) !important;

  border-radius:
    20px !important;

  box-shadow:
    var(--jd-shadow-deep),
    inset 0 1px 0 rgba(255, 255, 255, 0.10) !important;
}


html body
.node--type-slide.jd-service-slide
.slide-seo__column--details::before {
  content: "" !important;

  position:
    absolute !important;

  top:
    0 !important;
  left:
    0 !important;
  right:
    0 !important;

  width:
    auto !important;

  height:
    4px !important;

  background:
    linear-gradient(
      90deg,
      #9f36da 0%,
      #d281f6 100%
    ) !important;
}


/* Paragraphs in the dark card become inset glass panels. */
html body
.node--type-slide.jd-service-slide
.slide-seo__column--details p,
html body
.node--type-slide.jd-service-slide
.slide-seo__column--details > p {
  max-width:
    none !important;

  margin:
    0 0 0.85rem !important;

  padding:
    0.9rem 0.95rem !important;

  color:
    #7929b8 !important;
  -webkit-text-fill-color:
    #7929b8 !important;

  background:
    rgb(242, 230, 250) !important;

  border:
    1px solid rgba(233, 202, 249, 0.14) !important;

  border-left:
    3px solid rgba(197, 108, 239, 0.78) !important;

  border-radius:
    12px !important;

  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;

  font-size:
    0.94rem !important;

  line-height:
    1.62 !important;
}


/* =========================================================
   8. TRUST BADGES — COMPACT SIGNAL CHIPS
   ========================================================= */

html body
.node--type-slide.jd-service-slide
.trust-badges {
  display:
    flex !important;

  flex-wrap:
    wrap !important;

  gap:
    0.46rem !important;

  margin:
    0.35rem 0 1rem !important;

  padding:
    0 !important;

  list-style:
    none !important;
}


html body
.node--type-slide.jd-service-slide
.trust-badges .badge {
  display:
    inline-flex !important;

  align-items:
    center !important;

  justify-content:
    center !important;

  min-height:
    31px !important;

  padding:
    0.35rem 0.68rem !important;

  color:
    #ffffff !important;
  -webkit-text-fill-color:
    #882dbd !important;

  background:
    rgb(242, 230, 250) !important;

  border:
    2px solid rgb(217, 160, 246) !important;

  border-radius:
    999px !important;

  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;

  font-size:
    0.76rem !important;

  font-weight:
    700 !important;

  line-height:
    1.15 !important;

  letter-spacing:
    0.01em !important;

  white-space:
    nowrap !important;
}


/* =========================================================
   9. FOCUS / SERVICE AREA CALLOUT
   ========================================================= */

html body
.node--type-slide.jd-service-slide
.slide-seo-focus {
  position:
    relative !important;

  margin:
    0.2rem 0 0 !important;

  padding:
    0.95rem 1rem !important;

  color:
    #ffffff !important;
  -webkit-text-fill-color:
    #ffffff !important;

  background:
    linear-gradient(
      135deg,
      rgba(180, 91, 229, 0.18),
      rgba(255, 255, 255, 0.06)
    ) !important;

  border:
    1px solid rgba(231, 197, 247, 0.16) !important;

  border-radius:
    13px !important;

  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.07) !important;
}


/* =========================================================
   10. CTA — FULL-WIDTH PREMIUM ACTION BAR
   ========================================================= */

html body
.node--type-slide.jd-service-slide
.slide-seo__action {
  display:
    flex !important;

  justify-content:
    center !important;

  width:
    100% !important;

  margin:
    0 !important;

  padding:
    0 clamp(1.35rem, 3vw, 2.2rem)
    clamp(1.4rem, 3vw, 2rem) !important;
}


html body
.node--type-slide.jd-service-slide
.slide-additional-content
a.slide-seo-cta,
html body
.node--type-slide.jd-service-slide
.slide-additional-content
.slide-seo-cta {
  position:
    relative !important;

  display:
    inline-flex !important;

  align-items:
    center !important;

  justify-content:
    center !important;

  width:
    min(100%, 440px) !important;

  max-width:
    440px !important;

  min-height:
    54px !important;

  margin:
    0 !important;

  padding:
    0.8rem 1.5rem !important;

  overflow:
    hidden !important;

  color:
    #ffffff !important;
  -webkit-text-fill-color:
    #ffffff !important;

  background:
    linear-gradient(
      105deg,
      #430866 0%,
      #7014a8 45%,
      #9d34d7 100%
    ) !important;

  border:
    1px solid #2d0645 !important;

  border-radius:
    14px !important;

  box-shadow:
    0 4px 0 #26043a,
    0 12px 27px rgba(74, 10, 109, 0.24),
    inset 0 1px 0 rgba(255, 255, 255, 0.18) !important;

  font-size:
    0.98rem !important;

  font-weight:
    800 !important;

  line-height:
    1.2 !important;

  letter-spacing:
    0.01em !important;

  white-space:
    normal !important;

  text-align:
    center !important;

  text-decoration:
    none !important;

  transition:
    transform 150ms ease,
    box-shadow 150ms ease,
    background 150ms ease !important;
}


html body
.node--type-slide.jd-service-slide
.slide-additional-content
a.slide-seo-cta::before,
html body
.node--type-slide.jd-service-slide
.slide-additional-content
.slide-seo-cta::before {
  content: "" !important;

  position:
    absolute !important;

  top:
    0 !important;

  left:
    -55% !important;

  width:
    45% !important;

  height:
    100% !important;

  background:
    linear-gradient(
      90deg,
      transparent,
      rgba(255, 255, 255, 0.18),
      transparent
    ) !important;

  transform:
    skewX(-18deg) !important;

  transition:
    left 320ms ease !important;
}


html body
.node--type-slide.jd-service-slide
.slide-additional-content
a.slide-seo-cta:hover,
html body
.node--type-slide.jd-service-slide
.slide-additional-content
.slide-seo-cta:hover {
  color:
    #ffffff !important;
  -webkit-text-fill-color:
    #ffffff !important;

  background:
    linear-gradient(
      105deg,
      #510a79 0%,
      #8620bd 48%,
      #ae48e2 100%
    ) !important;

  box-shadow:
    0 5px 0 #26043a,
    0 16px 34px rgba(74, 10, 109, 0.31),
    inset 0 1px 0 rgba(255, 255, 255, 0.21) !important;

  transform:
    translateY(-2px) !important;
}


html body
.node--type-slide.jd-service-slide
.slide-additional-content
a.slide-seo-cta:hover::before,
html body
.node--type-slide.jd-service-slide
.slide-additional-content
.slide-seo-cta:hover::before {
  left:
    120% !important;
}


html body
.node--type-slide.jd-service-slide
.slide-additional-content
a.slide-seo-cta:active,
html body
.node--type-slide.jd-service-slide
.slide-additional-content
.slide-seo-cta:active {
  box-shadow:
    0 2px 0 #26043a,
    0 8px 17px rgba(74, 10, 109, 0.22) !important;

  transform:
    translateY(1px) !important;
}


html body
.node--type-slide.jd-service-slide
.slide-additional-content
a.slide-seo-cta:focus-visible,
html body
.node--type-slide.jd-service-slide
.slide-additional-content
.slide-seo-cta:focus-visible {
  outline:
    3px solid #f2b84b !important;

  outline-offset:
    4px !important;
}


/* =========================================================
   11. TABLET
   ========================================================= */

@media (max-width: 991.98px) {
  html body
  .node--type-slide.jd-service-slide
  .slide-seo__grid {
    grid-template-columns:
      1fr !important;

    gap:
      1.15rem !important;
  }

  html body
  .node--type-slide.jd-service-slide
  .slide-seo__column--details {
    min-height:
      auto !important;
  }
}


/* =========================================================
   12. MOBILE
   Keep exact Bootstrap container padding: 15px horizontal,
   3rem vertical, while refining only the interior design.
   ========================================================= */

@media (max-width: 767.98px) {
  html body
  .node--type-slide.jd-service-slide
  .slide-seo {
    border-radius:
      18px !important;
  }

  html body
  .node--type-slide.jd-service-slide
  .slide-additional-content
  .slide-seo
  .section-title {
    padding:
      1.2rem 1.05rem !important;

    font-size:
      clamp(1.45rem, 7vw, 1.9rem) !important;
  }

  html body
  .node--type-slide.jd-service-slide
  .slide-additional-content
  .slide-seo
  .section-title::before {
    width:
      4px !important;

    height:
      2.2rem !important;

    margin-right:
      0.65rem !important;
  }

  html body
  .node--type-slide.jd-service-slide
  .slide-seo__grid {
    gap:
      1rem !important;

    padding:
      1rem !important;
  }

  html body
  .node--type-slide.jd-service-slide
  .slide-seo-lead {
    margin-bottom:
      1.2rem !important;

    padding-left:
      0.85rem !important;
  }

  html body
  .node--type-slide.jd-service-slide
  .seo-benefits {
    gap:
      0.58rem !important;
  }

  html body
  .node--type-slide.jd-service-slide
  .seo-benefits li {
    min-height:
      54px !important;

    padding:
      0.72rem 0.78rem 0.72rem 3.45rem !important;

    border-radius:
      12px !important;

    font-size:
      0.93rem !important;
  }

  html body
  .node--type-slide.jd-service-slide
  .seo-benefits li::before {
    left:
      0.7rem !important;

    width:
      2rem !important;

    height:
      2rem !important;

    border-radius:
      9px !important;

    font-size:
      0.68rem !important;
  }

  html body
  .node--type-slide.jd-service-slide
  .slide-seo__column--details {
    padding:
      1rem !important;

    border-radius:
      16px !important;
  }

  html body
  .node--type-slide.jd-service-slide
  .trust-badges {
    gap:
      0.38rem !important;
  }

  html body
  .node--type-slide.jd-service-slide
  .trust-badges .badge {
    min-height:
      29px !important;

    padding:
      0.32rem 0.58rem !important;

    font-size:
      0.71rem !important;
  }

  html body
  .node--type-slide.jd-service-slide
  .slide-seo__action {
    padding:
      0 1rem 1.1rem !important;
  }

  html body
  .node--type-slide.jd-service-slide
  .slide-additional-content
  a.slide-seo-cta,
  html body
  .node--type-slide.jd-service-slide
  .slide-additional-content
  .slide-seo-cta {
    width:
      100% !important;

    max-width:
      none !important;

    min-height:
      52px !important;

    border-radius:
      12px !important;
  }
}


/* =========================================================
   13. VERY SMALL PHONES
   ========================================================= */

@media (max-width: 359.98px) {
  html body
  .node--type-slide.jd-service-slide
  .slide-additional-content
  .slide-seo
  .section-title {
    padding:
      1rem 0.9rem !important;

    font-size:
      1.35rem !important;
  }

  html body
  .node--type-slide.jd-service-slide
  .slide-seo__grid {
    padding:
      0.8rem !important;
  }

  html body
  .node--type-slide.jd-service-slide
  .seo-benefits li {
    padding-right:
      0.6rem !important;

    font-size:
      0.88rem !important;
  }

  html body
  .node--type-slide.jd-service-slide
  .trust-badges .badge {
    white-space:
      normal !important;
  }
}


/* =========================================================
   14. REDUCED MOTION
   ========================================================= */

@media (prefers-reduced-motion: reduce) {
  html body
  .node--type-slide.jd-service-slide *,

  html body
  .node--type-slide.jd-service-slide *::before,

  html body
  .node--type-slide.jd-service-slide *::after {
    scroll-behavior:
      auto !important;

    transition-duration:
      0.01ms !important;

    animation-duration:
      0.01ms !important;
  }
}

/* assets/css/jd-header-service-menu-v1.css */
/*
 * jd-header-service-menu-v1.css
 * Johnny Detail — header info/contact, service-brag, main menu mobile,
 * product-categories taxonomy menus.
 * Source: Johnny Detail pack extracts, recolored purple for Johnny Detail.
 * Version: 2026-08-02.v1
 * Load late (after martis-custom / custom_css) so these rules win.
 */

/* ========== 01-header-info-and-contact.css (purple recolor) ========== */
/* ==========================================================================
   EXTRACT 01 — Header info + Contact Us strip (Johnny Detail source, purple)
   Append to late CSS on Johnny Detail, then recolor green → purple.
   Marker: jd-header-service-menu-v1 / 01-header-info-and-contact
   ========================================================================== */

/* --- from footer-blocks.css: header-info base --- */
/* Header info + CONTACT US layout (late so it wins over media.css + custom_css) */
.header-item.header-right,
.header-right {
  display: block !important;
  visibility: visible !important;
  text-align: center !important;
}
.header-info,
.header-info .header-info-container {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  gap: 0.35rem 1.25rem !important;
}
.header-info .header-info-item {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin-left: 0 !important;
}

@media (max-width: 767.98px) {
  /* Brand left (1rem inset via container padding); cart/hamburger absolute right */
  .navbar.header-center > .container {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: flex-start !important;
    align-items: center !important;
    position: relative !important;
    padding: 0.5rem 1rem !important;
    box-sizing: border-box !important;
  }
  .header-side.navbar-brand {
    width: auto !important;
    max-width: calc(100% - 5.75rem) !important;
    flex: 1 1 auto !important;
    order: 1 !important;
    text-align: left !important;
    justify-content: flex-start !important;
    margin: 0 !important;
    padding: 0 5.5rem 0 0 !important;
    min-height: 56px;
  }
  #block-martis-branding .container-wrap,
  .site-branding .container-wrap,
  .site-branding {
    justify-content: flex-start !important;
    text-align: left !important;
    width: 100% !important;
    margin: 0 !important;
  }
  .brand.logo {
    margin: 0 !important;
  }
  .brand.site-name {
    text-align: left !important;
    align-items: flex-start !important;
  }

  /* City/service info ABOVE Contact Us phone */
  .header-main-wrap,
  .header-item.header-main,
  .header-main {
    display: block !important;
    visibility: visible !important;
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
    order: 2 !important;
    margin: 0.15rem 0 0 !important;
    padding: 0.25rem 0 !important;
    text-align: left !important;
  }

  /* Contact Us / phone under info row; cart/hamburger stay absolute top-right */
  .header-right-wrap {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
    order: 3 !important;
    margin: 0.15rem 0 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
    position: static !important;
  }
  .header-item.header-right,
  .header-right {
    width: 100% !important;
    margin: 0 auto !important;
    text-align: center !important;
  }
  .header-element {
    position: absolute !important;
    top: 0.5rem !important;
    right: 1rem !important;
    z-index: 30 !important;
  }

  /* Hide "Call Us" phone column on mobile (phone is in Contact Us below) */
  .header-info .header-info-item--phone {
    display: none !important;
  }

  /* Location left, hours right */
  .header-info,
  .header-info .header-info-container {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: flex-start !important;
    justify-content: space-between !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    gap: 0.5rem 0.75rem !important;
  }
  .header-info .header-info-item {
    margin: 0 !important;
  }
  .header-info .header-info-item--location {
    flex: 1 1 auto !important;
    justify-content: flex-start !important;
    text-align: left !important;
    max-width: 58% !important;
  }
  .header-info .header-info-item--hours {
    flex: 0 1 auto !important;
    justify-content: flex-end !important;
    text-align: right !important;
    max-width: 42% !important;
  }
  .header-info .header-info-item--location .header-info-desc {
    text-align: left !important;
  }
  .header-info .header-info-item--hours .header-info-desc {
    text-align: right !important;
  }
  .header-info .header-info-desc {
    font-size: 0.72rem !important;
    line-height: 1.3 !important;
  }
  .header-info .header-info-desc span,
  .header-info .header-info-desc strong {
    display: block !important;
  }
  .header-info .header-info-item i {
    font-size: 1rem !important;
    margin-right: 0.35rem !important;
  }
}

/* --------------------------------------------------------------------------
 * City / front page H1 title blocks (content-wide-top).
 * Bare <h1> in custom blocks were white-on-white (global h1 { color:#fff }).
 * Match Johnny Detail badge style used by .row.layout.layout--onecol h1:
 * brand purple fill, white type, black border, centered, mobile-readable.
 * -------------------------------------------------------------------------- */
#content-wide-top .block-block-content .field-item > h1,
#content-wide-top .block-block-content .field-body > h1,
#content-wide-top [id*="frontpagetitle"] h1,
#content-wide-top [id*="pagetitle"] h1,
#block-martis-frontpagetitle h1,

/* --- from chrome-layout-fix.css: early mobile header + header-info --- */
/**
 * chrome-layout-fix.css
 * Loaded LAST (after theme Custom CSS) via martis_get_late_theme_css().
 * Fixes:
 *  - Header logo + site name + slogan alignment (desktop + mobile)
 *  - Header info visibility/alignment across pages
 *  - City-page carousel CTA staying inside the slide image on mobile
 *  - Promo modal skip/close actually hiding the dialog
 */

/* ==========================================================================
   1) Site branding: logo + name + slogan
   ========================================================================== */

#block-martis-branding.site-branding,
.site-branding#block-martis-branding,
.header-side.navbar-brand .site-branding,
.navbar-brand .site-branding {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  width: auto !important;
  max-width: 100% !important;
}

#block-martis-branding .container-wrap,
.site-branding .container-wrap {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 0.55rem 0.75rem !important;
  width: auto !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}

/* Kill fragile absolute/negative-margin brand layout */
#block-martis-branding .brand.logo,
.site-branding .brand.logo,
.brand.logo {
  display: block !important;
  position: relative !important;
  float: none !important;
  flex: 0 0 auto !important;
  max-width: 72px !important;
  width: auto !important;
  margin: 0 !important;
  margin-left: 0 !important;
  margin-top: 0 !important;
  line-height: 1 !important;
}

#block-martis-branding .brand.logo a,
.site-branding .brand.logo a,
.site-branding-logo {
  display: block !important;
  line-height: 0 !important;
}

#block-martis-branding .brand.logo img,
.site-branding .brand.logo img,
.site-branding-logo img {
  display: block !important;
  width: 100% !important;
  max-width: 72px !important;
  height: auto !important;
  scale: 1 !important;
  transform: none !important;
}

#block-martis-branding .brand.site-name,
.site-branding .brand.site-name,
.brand.site-name {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  align-items: flex-start !important;
  position: relative !important;
  float: none !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
  max-width: 100% !important;
  margin: 0 !important;
  margin-left: 0 !important;
  margin-top: 0 !important;
  padding: 0 !important;
  font-size: 1.05rem !important;
  line-height: 1.2 !important;
}

.site-branding-name,
.site-branding-name a,
.brand.site-name a {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  color: #ffffff !important;
  font-weight: 700 !important;
  font-size: 1.15rem !important;
  line-height: 1.15 !important;
  text-decoration: none !important;
  white-space: nowrap !important;
}

/* Slogan base — match JD appearance (light under name) */
.site-branding-slogan,
.brand.site-name .site-branding-slogan,
.header .brand.site-name .site-branding-slogan {
  display: block !important;
  visibility: visible !important;
  opacity: 0.9 !important;
  color: #ffffff !important;
  font-size: 0.8rem !important;
  font-weight: 400 !important;
  line-height: 1.25 !important;
  margin: 0.15rem 0 0 !important;
  margin-bottom: 0 !important;
  max-width: none !important;
  width: auto !important;
  white-space: nowrap !important;
  text-wrap: nowrap !important;
  text-shadow: -1px -1px 0 #000, 0 0 0 #000, 0 0 0 #000, 0 0 0 #000 !important;
}

/* Desktop brand row sits cleanly in the purple header bar */
@media (min-width: 768px) {
  .navbar.header-center > .container {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
  }

  .header-side.navbar-brand {
    display: flex !important;
    align-items: center !important;
    flex: 0 1 auto !important;
    max-width: 42% !important;
    min-width: 0 !important;
  }

  .header-main-wrap {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
  }

  .header-right-wrap {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    flex: 0 0 auto !important;
  }

  .header-info,
  .header-info .header-info-container {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    align-items: center !important;
    justify-content: center !important;
    flex-wrap: wrap !important;
  }
}

/* Mobile: brand left 1rem; location left + hours right; Contact Us phone below */
@media (max-width: 767.98px) {
  .navbar.header-center > .container {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: flex-start !important;
    align-items: center !important;
    position: relative !important;
    padding: 0.5rem 1rem !important;
    box-sizing: border-box !important;
  }

  .header-side.navbar-brand {
    width: auto !important;
    max-width: calc(100% - 5.75rem) !important;
    flex: 1 1 auto !important;
    order: 1 !important;
    display: flex !important;
    justify-content: flex-start !important;
    text-align: left !important;
    margin: 0 !important;
    padding: 0 5.5rem 0 0 !important;
    min-height: 56px;
  }

  #block-martis-branding .container-wrap,
  .site-branding .container-wrap {
    justify-content: flex-start !important;
    width: 100% !important;
    text-align: left !important;
  }

  #block-martis-branding .brand.site-name,
  .site-branding .brand.site-name,
  .brand.site-name {
    align-items: flex-start !important;
    text-align: left !important;
  }

  #block-martis-branding .brand.logo,
  .site-branding .brand.logo,
  .brand.logo {
    max-width: 58px !important;
    margin: 0 !important;
  }

  #block-martis-branding .brand.logo img,
  .site-branding-logo img {
    max-width: 58px !important;
  }

  .site-branding-name a {
    font-size: 1.05rem !important;
  }

  /* Mobile slogan: JD size/weight/nowrap so it stays one line under the name */
  .site-branding-slogan,
  .brand.site-name .site-branding-slogan,
  .header .brand.site-name .site-branding-slogan {
    font-size: 0.72rem !important;
    font-weight: 400 !important;
    line-height: 1.25 !important;
    margin-top: 0.1rem !important;
    margin-bottom: 0 !important;
    opacity: 0.9 !important;
    white-space: nowrap !important;
    text-wrap: nowrap !important;
    max-width: none !important;
    width: max-content !important;
  }

  #block-martis-branding .brand.site-name,
  .header .brand.site-name,
  .site-branding .brand.site-name {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    width: auto !important;
    max-width: none !important;
    overflow: visible !important;
  }

  .header-item.header-main,
  .header-main,
  .header-main-wrap {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
    order: 2 !important;
    justify-content: flex-start !important;
    text-align: left !important;
    margin: 0.15rem 0 0 !important;
    padding: 0.25rem 0 !important;
  }

  .header-info {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  .header-info .header-info-container {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 100% !important;
    max-width: 100% !important;
    justify-content: space-between !important;
    align-items: flex-start !important;
    gap: 0.5rem 0.75rem !important;
  }

  .header-info .header-info-item--phone {
    display: none !important;
  }

  .header-info .header-info-item--location {
    flex: 1 1 auto !important;
    max-width: 58% !important;
    justify-content: flex-start !important;
  }

  .header-info .header-info-item--hours {
    flex: 0 1 auto !important;
    max-width: 42% !important;
    justify-content: flex-end !important;
  }

  .header-info .header-info-item--location .header-info-desc {
    text-align: left !important;
  }

  .header-info .header-info-item--hours .header-info-desc {
    text-align: right !important;
  }

  .header-info .header-info-desc span,
  .header-info .header-info-desc strong {
    display: block !important;
  }

  .header-right-wrap {
    display: flex !important;
    flex-direction: column !important;
    visibility: visible !important;
    opacity: 1 !important;
    order: 3 !important;
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
    justify-content: center !important;
    align-items: center !important;
    text-align: center !important;
    margin: 0.15rem 0 0 !important;
    padding: 0 !important;
    position: static !important;
  }

  .header-item.header-right,
  .header-right {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 100% !important;
    justify-content: center !important;
    text-align: center !important;
  }

  .header-element {
    position: absolute !important;
    top: 0.5rem !important;
    right: 1rem !important;
    z-index: 30 !important;
  }
}


/* --- from chrome-layout-fix.css: mobile header chrome + header-info 50/50 + contact --- */
/* ==========================================================================
   Mobile: clearance + login spacing, cart/hamburger alignment
   Late override (beats theme custom_css margin-top: 2.5rem on account menu)
   ========================================================================== */
@media (max-width: 767.98px) {
  /* --- Header-top: clearance centered, login just below --- */
  .header-top.dark-header-top,
  .path-frontpage .header-top.dark-header-top,
  .page-node-243 .header-top.dark-header-top {
    text-align: center !important;
    padding: 0.45rem 0.75rem 0.55rem !important;
  }
  .header-top.dark-header-top .container > .row,
  .header-top.dark-header-top .col-md-6 {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    flex: none !important;
    margin: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  .header-top.dark-header-top .header-top-first {
    margin: 0 0 0.2rem !important;
    padding: 0 !important;
    text-align: center !important;
  }
  .header-top.dark-header-top .header-top-second {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: center !important;
    min-height: 0 !important;
  }
  .header-top.dark-header-top .region.region-header-top-first,
  .header-top.dark-header-top .region.region-header-top-second {
    display: block !important;
    width: 100% !important;
    text-align: center !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  /* Hide empty cookies shell so it does not add gap under clearance */
  .header-top #block-martis-cookiesui:empty,
  .header-top #block-martis-cookiesui:not(:has(.cookiesjsr-banner.active)),
  .header-top #cookiesjsr:empty {
    display: none !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  /*
   * Clearance / promo line — true horizontal center.
   * Beats custom_css: #block-clearance-sales p { margin-left: 1.5rem }
   * and div#block-clearance-sales { width: 150% }.
   */
  .header-top #block-clearance-sales,
  .header-top div#block-clearance-sales,
  .header-top #block-clearance-sales .container-wrap,
  .header-top #block-clearance-sales .block-content,
  .header-top #block-clearance-sales .field-item,
  .header-top #block-clearance-sales p,
  .header-top.dark-header-top #block-clearance-sales,
  .header-top.dark-header-top #block-clearance-sales p,
  .header-top.dark-header-top #block-clearance-sales .field-item {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-top: 0.35rem !important;
    margin-bottom: 0.35rem !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    text-align: center !important;
    float: none !important;
    box-sizing: border-box !important;
    position: static !important;
    left: auto !important;
    right: auto !important;
    transform: none !important;
  }
  .header-top .header-top-first,
  .header-top .region-header-top-first,
  .header-top #block-clearance-sales {
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: center !important;
  }
  /* Kill custom_css nav#block-martis-useraccountmenu { margin-top: 2.5rem } on mobile */
  .header-top nav#block-martis-useraccountmenu,
  .path-frontpage .header-top nav#block-martis-useraccountmenu,
  .page-node-243 .header-top nav#block-martis-useraccountmenu,
  body.path-frontpage nav#block-martis-useraccountmenu,
  body .header-top nav#block-martis-useraccountmenu {
    margin-top: 0.2rem !important;
    margin-bottom: -0.5rem !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding: 0 !important;
    width: auto !important;
    display: flex !important;
    justify-content: center !important;
  }
  .header-top.dark-header-top .header-top-second {
    padding-top: 0 !important;
  }
  .header-top a.dropdown-toggle.header-icon.account-icon,
  .header-top a.header-icon.account-icon,
  .path-frontpage .header-top a.dropdown-toggle.header-icon.account-icon,
  .page-node-243 .header-top a.dropdown-toggle.header-icon.account-icon {
    display: inline-block !important;
    margin: 0.15rem auto 0 !important;
    vertical-align: middle !important;
    position: relative !important;
    top: 0 !important;
  }
  .header-top button.jd-account-menu__trigger,
  .path-frontpage .header-top button.jd-account-menu__trigger,
  .page-node-243 .header-top button.jd-account-menu__trigger {
    margin: 0.15rem auto 0 !important;
    position: relative !important;
    top: 0 !important;
    vertical-align: middle !important;
  }
  /* Hide empty gtranslate shell on mobile if height 0 still reserves flow */
  .header-top #block-martis-gtranslate:empty,
  .header-top #block-martis-gtranslate .gtranslate_wrapper:empty {
    display: none !important;
    height: 0 !important;
    margin: 0 !important;
  }

  /* --- Cart + hamburger: same row height, icons centered --- */
  .header .header-element {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 0.45rem !important;
    height: 44px !important;
    min-height: 44px !important;
  }
  .header .header-element .header-cart,
  .header .header-element .header-element-item.header-cart,
  .header .header-element .navbar-toggler.nav-button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 40px !important;
    min-height: 40px !important;
    max-height: 40px !important;
    margin: 0 !important;
    vertical-align: middle !important;
    align-self: center !important;
  }
  .header .header-cart .cart-block--summary,
  .header .header-cart .cart-block--summary a,
  .header .header-element-item.header-cart .cart-block--summary a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 40px !important;
    min-height: 40px !important;
    min-width: 40px !important;
    padding: 0 10px !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    line-height: 1 !important;
  }
  .header .header-cart .cart-block--summary i,
  .header .header-cart .cart-block--summary i.ti-shopping-cart {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
    line-height: 1 !important;
    font-size: 1.15rem !important;
  }
  .header .header-element .navbar-toggler.nav-button {
    width: 40px !important;
    min-width: 40px !important;
    padding: 0 !important;
    line-height: 1 !important;
  }
  /* Icon glyph centered in hamburger button */
  .header .header-element .navbar-toggler.nav-button i,
  .header .header-element .navbar-toggler.nav-button .ti-menu,
  .header .header-element .navbar-toggler.nav-button [class*="ti-"] {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1 !important;
    font-size: 1.2rem !important;
    position: relative !important;
    top: 0 !important;
    left: 0 !important;
  }
  .header .header-element .navbar-toggler.nav-button i::before,
  .header .header-element .navbar-toggler.nav-button .ti-menu::before {
    display: block !important;
    margin: 0 auto !important;
    line-height: 1 !important;
    position: static !important;
  }
}

/* Final cart/hamburger mid-line lock on mobile */
@media (max-width: 767.98px) {
  .header .header-element > .header-cart,
  .header .header-element > .header-element-item,
  .header .header-element > .navbar-toggler.nav-button {
    align-self: center !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    position: relative !important;
    top: 0 !important;
  }
  .header .header-cart .container-wrap,
  .header .header-cart .block-content,
  .header .header-cart .cart--cart-block,
  .header .header-cart .cart-block--summary {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
    padding: 0 !important;
    height: 45px !important;
    min-height: 45px !important;
    line-height: 1 !important;
  }
  .header .header-cart .cart-block--summary a {
    height: 40px !important;
    min-height: 40px !important;
  }
}

/* ==========================================================================
   2026-07-25 playbook polish (late — beats theme custom_css)
   Purple brand chrome only: #3b0a5c / #2d0847
   ========================================================================== */

/* --- Kill Bootstrap SVG hamburger ::before (custom_css may re-add) --- */
button.navbar-toggler.nav-button::before,
button.navbar-toggler.nav-button::after,
.navbar-toggler.nav-button::before,
.navbar-toggler.nav-button::after,
.header .header-element .navbar-toggler.nav-button::before,
.header .header-element .navbar-toggler.nav-button::after {
  content: none !important;
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  background: none !important;
  border: 0 !important;
}

/* Smaller centered Themify hamburger glyph only */
@media (max-width: 767.98px) {
  .header .header-element .navbar-toggler.nav-button i.ti-menu,
  .header .header-element .navbar-toggler.nav-button .ti-menu,
  button.navbar-toggler.nav-button i.ti-menu {
    font-size: 1.05rem !important;
    line-height: 1 !important;
  }
  .header .header-element .navbar-toggler.nav-button i.ti-menu::before,
  button.navbar-toggler.nav-button i.ti-menu::before {
    content: "\e68e" !important;
    display: block !important;
    font-size: inherit !important;
  }
}

/* --- Log in caret: inside pill border (static, not absolute) --- */
.header-top a.account-icon,
.header-top a.dropdown-toggle.header-icon.account-icon,
.header-top.dark-header-top a.account-icon,
.path-frontpage .header-top a.account-icon,
body .header-top a.dropdown-toggle.header-icon.account-icon {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.3rem !important;
  position: relative !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
  padding: 0.12rem 0.55rem !important;
  vertical-align: middle !important;
  white-space: nowrap !important;
}
.header-top a.account-icon::after,
.header-top a.dropdown-toggle.header-icon.account-icon::after,
.header-top.dark-header-top a.account-icon::after,
body .header-top a.dropdown-toggle.header-icon.account-icon::after {
  position: static !important;
  display: inline-block !important;
  margin: -4px 0 0 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  top: auto !important;
  right: auto !important;
  left: auto !important;
  bottom: auto !important;
  transform: rotate(45deg) !important;
  -webkit-transform: rotate(45deg) !important;
  width: 0.38rem !important;
  height: 0.38rem !important;
  border-style: solid !important;
  border-width: 0 1.5px 1.5px 0 !important;
  border-color: currentColor !important;
  vertical-align: middle !important;
  content: "" !important;
  flex: 0 0 auto !important;
}

/* Clearance sales centered on mobile */
@media (max-width: 767.98px) {
  .header-top #block-clearance-sales,
  .header-top div#block-clearance-sales,
  .header-top #block-clearance-sales .field-item,
  .header-top #block-clearance-sales p,
  .header-top .header-top-first {
    text-align: center !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }
}

/* Always kill clearance left-shift from custom_css (mobile + desktop) */
.header-top #block-clearance-sales p,
.header-top.dark-header-top #block-clearance-sales p,
header.header #block-clearance-sales p,
div#block-clearance-sales p {
  margin-left: 0 !important;
  margin-right: 0 !important;
  margin-top: 1rem !important;
  text-align: center !important;
}
header.header div#block-clearance-sales,
.header-top div#block-clearance-sales {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* --- Cart + hamburger: 4rem band, vertically centered with brand --- */
@media (max-width: 767.98px) {
  .header .header-element {
    position: absolute !important;
    top: 0.5rem !important;
    right: 1rem !important;
    height: 4rem !important;
    min-height: 4rem !important;
    max-height: 4rem !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 0.45rem !important;
    z-index: 30 !important;
  }
  /* Do NOT set position:relative on .header-right-wrap */
  .header .header-right-wrap {
    position: static !important;
  }
}

/* Mobile header rows: full container width only (no calc+min-width flex explosion) */
@media (max-width: 767.98px) {
  body .header .navbar > .container > .header-main-wrap,
  body .header .header-main-wrap,
  body.path-products .header-main-wrap,
  body.path-taxonomy .header-main-wrap,
  body.path-product .header-main-wrap,
  body.path-frontpage .header-main-wrap {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    flex: 0 0 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    position: static !important;
    box-sizing: border-box !important;
  }

  body .header .navbar > .container > .header-right-wrap,
  body .header .header-right-wrap,
  body.path-products .header-side.header-right-wrap,
  body.path-taxonomy .header-side.header-right-wrap,
  body.path-product .header-side.header-right-wrap,
  body.path-frontpage .header .header-right-wrap {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    flex: 0 0 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding: 0.45rem 0 0.25rem !important;
    position: static !important;
    box-sizing: border-box !important;
  }
}

/* --- Header info 50/50 with new classes + divider --- */
@media (max-width: 767.98px) {
  .header-info .header-info-container,
  .header .header-info .header-info-container {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    justify-content: space-between !important;
    width: 100% !important;
    gap: 0 !important;
  }
  .header-info .header-info-item,
  .header-info .header-info-location,
  .header-info .header-info-hours,
  .header-info .header-info-item--location,
  .header-info .header-info-item--hours {
    flex: 1 1 50% !important;
    max-width: 50% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }
  .header-info .header-info-location,
  .header-info .header-info-item--location {
    padding-right: 0.65rem !important;
    border-right: 1px solid rgba(255, 255, 255, 0.28) !important;
  }
  .header-info .header-info-hours,
  .header-info .header-info-item--hours {
    padding-left: 0.65rem !important;
  }
  .header-info .header-info-item--phone {
    display: none !important;
  }
  .header-info .header-info-location .header-info-desc,
  .header-info .header-info-item--location .header-info-desc {
    text-align: left !important;
  }
  .header-info .header-info-hours .header-info-desc,
  .header-info .header-info-item--hours .header-info-desc {
    text-align: right !important;
  }
  .header-info .header-info-hours-label {
    display: block !important;
    text-transform: uppercase !important;
    font-size: 0.68rem !important;
    letter-spacing: 0.04em !important;
    font-weight: 700 !important;
    opacity: 0.9 !important;
    margin-bottom: 0.15rem !important;
  }
  /* Day + time in fixed columns so Mon-Thurs / Fri-Sat times align (JD) */
  .header-info .header-info-hours-row {
    display: grid !important;
    grid-template-columns: 5.75rem max-content !important;
    column-gap: 0.35rem !important;
    align-items: baseline !important;
    justify-content: end !important;
    width: max-content !important;
    max-width: 100% !important;
    margin-left: auto !important;
    line-height: 1.35 !important;
    white-space: nowrap !important;
  }
  .header-info .header-info-label,
  .header-info .header-info-city,
  .header-info .header-info-areas {
    display: block !important;
  }
  .header-info .header-info-hours-row .header-info-day,
  .header-info .header-info-hours-row .header-info-time {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1.35 !important;
  }
  .header-info .header-info-hours-row .header-info-day {
    text-align: right !important;
    white-space: nowrap !important;
  }
  .header-info .header-info-hours-row .header-info-time {
    text-align: left !important;
    font-weight: 600 !important;
    white-space: nowrap !important;
  }
  /* Hide legacy icons if any remain */
  .header-info > .header-info-container > .header-info-item > i[class*="ti-"] {
    display: none !important;
  }
}

/* Tablet+ header-info 50/50 grid (desktop refined further at min-width 992) */
@media (min-width: 768px) {
  .header-info .header-info-container {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    align-items: center !important;
    width: 100% !important;
    gap: 0 !important;
  }
  .header-info .header-info-item,
  .header-info .header-info-location,
  .header-info .header-info-item--location,
  .header-info .header-info-hours,
  .header-info .header-info-item--hours {
    margin: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  .header-info .header-info-location,
  .header-info .header-info-item--location,
  .header-info .header-info-hours,
  .header-info .header-info-item--hours {
    flex: unset !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    display: flex !important;
    align-items: center !important;
  }
  .header-info .header-info-location,
  .header-info .header-info-item--location {
    padding-right: 1.5rem !important;
    padding-left: 0.25rem !important;
    border-right: 1px solid rgba(255, 255, 255, 0.28) !important;
    justify-content: flex-end !important;
  }
  .header-info .header-info-hours,
  .header-info .header-info-item--hours {
    padding-left: 1.5rem !important;
    padding-right: 0.25rem !important;
    justify-content: flex-start !important;
  }
  .header-info .header-info-location .header-info-desc,
  .header-info .header-info-item--location .header-info-desc {
    text-align: right !important;
  }
  .header-info .header-info-hours .header-info-desc,
  .header-info .header-info-item--hours .header-info-desc {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
  }
  .header-info .header-info-hours-label {
    display: block !important;
    width: 100% !important;
    text-align: center !important;
    text-transform: uppercase !important;
    font-size: 0.72rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.04em !important;
  }
  /* Times grid centered under OUR HOURS */
  .header-info .header-info-hours-row {
    display: grid !important;
    grid-template-columns: max-content max-content !important;
    column-gap: 0.4rem !important;
    align-items: baseline !important;
    justify-content: center !important;
    width: max-content !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    line-height: 1.35 !important;
    white-space: nowrap !important;
  }
  .header-info .header-info-hours-row .header-info-day,
  .header-info .header-info-hours-row .header-info-time {
    display: block !important;
    margin: 0 !important;
  }
  .header-info .header-info-hours-row .header-info-day {
    text-align: right !important;
  }
  .header-info .header-info-hours-row .header-info-time {
    text-align: left !important;
    font-weight: 600 !important;
  }
  .header-info .header-info-item--phone {
    display: none !important;
  }
}

/* --- Contact Us strip: extra top pad, tight bottom, no empty min-height --- */
@media (max-width: 767.98px) {
  .header #block-call-to-order,
  .header #block-call-to-order .container-wrap,
  .header #block-call-to-order .block-content,
  .header .header-right .block-content {
    min-height: 0 !important;
    padding-top: 0 !important;
    margin-top: 0 !important;
  }
  .header #block-call-to-order .block-content,
  .header #block-call-to-order .field-item,
  .header .header-right .field-item {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 0 !important;
    padding-top: 0.75rem !important;
    padding-bottom: 0.15rem !important;
    text-align: center !important;
  }
  .header #block-call-to-order .text-sm,
  .header #block-call-to-order strong.text-sm,
  .header .header-right strong.text-sm {
    margin: 0 !important;
    display: block !important;
  }
  .header #block-call-to-order p,
  .header .header-right p {
    margin: 0 !important;
    line-height: 1.2 !important;
  }
  .header #block-call-to-order .call-phone,
  .header .call-phone {
    margin-top: 0.15rem !important;
  }
}


/* --- from chrome-layout-fix.css: header desktop / path-taxonomy header-info --- */
/* ==========================================================================
   Mobile header + carousel — match reference layout site (verified via CDP metrics)
   Do NOT use min-width: calc(100% + 2rem) on flex children — it collapses the
   .navbar > .container to ~32px and hides brand/info/contact on mobile.
   ========================================================================== */

/* Header-top borders */
.header-top.dark-header-top,
.header .header-top {
  border-top: 2px solid #000 !important;
  border-bottom: 2px solid #000 !important;
}

/* Kill custom_css purple pill backgrounds on CONTACT US */
.header #block-call-to-order,
.header #block-call-to-order *,
.header #block-call-to-order p,
.header #block-call-to-order strong,
.header #block-call-to-order a,
.header #block-call-to-order .text-sm,
.header #block-call-to-order .call-phone {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.header #block-call-to-order,
.header #block-call-to-order > .container-wrap,
.header #block-call-to-order > .container-wrap > .block-content {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  text-align: center !important;
  visibility: visible !important;
  opacity: 1 !important;
}

.header #block-call-to-order .field-item,
.header #block-call-to-order .field.field-body.field-item {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.15rem !important;
  width: 100% !important;
  margin: 0 auto !important;
  padding: 0 !important;
  text-align: center !important;
}

.header #block-call-to-order p,
.header #block-call-to-order .call-phone {
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
  text-align: center !important;
  color: #fff !important;
  line-height: 1.2 !important;
}

.header #block-call-to-order strong.text-sm,
.header #block-call-to-order .text-sm {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  font-size: 0.72rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  text-align: center !important;
  color: #fff !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.45) !important;
}

.header #block-call-to-order a.call-phone-link,
.header #block-call-to-order .call-phone a {
  display: block !important;
  width: auto !important;
  margin: 0 auto !important;
  padding: 0 !important;
  font-size: 1.15rem !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  text-align: center !important;
  color: #fff !important;
  text-decoration: none !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.45) !important;
}

.header #block-header-info2 .row,
.header #block-header-info2 .layout,
.header #block-header-info2 .layout__region,
.header #block-header-info2 .container-wrap,
.header #block-header-info2 .block-content,
.header #block-header-info2 .block-layout-builder {
  background: transparent !important;
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  min-height: 0 !important;
}

@media (max-width: 991.98px) {
  /*
   * CRITICAL: theme custom_css sets .navbar.header-center { padding-left/right: 25rem }
   * (400px each side). On mobile that collapses the content box to ~0–32px and hides
   * brand / city-hours / CONTACT US. Johnny Detail does not do this.
   */
  .header .navbar.header-center,
  .navbar.header-center,
  header.header .navbar.header-center {
    padding-left: 0 !important;
    padding-right: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    overflow: visible !important;
    box-sizing: border-box !important;
  }

  .header .navbar.header-center > .container,
  .navbar.header-center > .container,
  header.header .navbar.header-center > .container {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    position: relative !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding: 0.5rem 1rem 0.65rem !important;
    box-sizing: border-box !important;
    overflow: visible !important;
  }
}

@media (max-width: 767.98px) {
  /* Shell already zeroed above; keep layout rows full-width */

  /* Row 1: brand left, room for cart/hamburger on right */
  .header .header-side.navbar-brand,
  .navbar.header-center .header-side.navbar-brand {
    display: flex !important;
    order: 1 !important;
    flex: 1 1 auto !important;
    width: auto !important;
    max-width: calc(100% - 6rem) !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 5.5rem 0 0 !important;
    min-height: 56px !important;
    align-items: center !important;
    justify-content: flex-start !important;
    text-align: left !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  .header .site-branding,
  .header .site-branding .container-wrap,
  .header #block-martis-branding .container-wrap {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: 100% !important;
    max-width: 100% !important;
    gap: 0.55rem !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  .header .brand.logo,
  .header .brand.logo img,
  .header .site-branding-logo img {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    max-width: 56px !important;
    width: 56px !important;
    height: auto !important;
  }

  .header .site-branding-name a,
  .header .brand.site-name a {
    display: inline-block !important;
    visibility: visible !important;
    color: #fff !important;
    font-size: 1.05rem !important;
    font-weight: 700 !important;
    line-height: 1.15 !important;
    white-space: nowrap !important;
  }

  /* Mobile slogan = JD: 0.72rem, weight 400, opacity 0.9, single line */
  .header .site-branding-slogan,
  .header .brand.site-name .site-branding-slogan,
  .header #block-martis-branding .site-branding-slogan {
    display: block !important;
    visibility: visible !important;
    color: #ffffff !important;
    font-size: 0.72rem !important;
    font-weight: 400 !important;
    line-height: 1.25 !important;
    margin-top: 0.1rem !important;
    margin-bottom: 0 !important;
    opacity: 0.9 !important;
    white-space: nowrap !important;
    text-wrap: nowrap !important;
    width: max-content !important;
    max-width: none !important;
    text-shadow: -1px -1px 0 #000, 0 0 0 #000, 0 0 0 #000, 0 0 0 #000 !important;
  }

  .header .brand.site-name {
    overflow: visible !important;
    width: auto !important;
    max-width: none !important;
  }

  /* Cart + hamburger absolute top-right */
  .header .header-element {
    position: absolute !important;
    top: 0.5rem !important;
    right: 1rem !important;
    left: auto !important;
    display: flex !important;
    align-items: center !important;
    gap: 0.4rem !important;
    z-index: 40 !important;
    width: auto !important;
    height: 56px !important;
  }

  /* Row 2: city + hours — full width of container (like JD ~358px content) */
  .header .header-main-wrap,
  .header .navbar > .container > .header-main-wrap,
  body .header .header-main-wrap,
  body.path-frontpage .header .header-main-wrap,
  body.path-products .header .header-main-wrap,
  body.path-taxonomy .header .header-main-wrap,
  body.path-product .header .header-main-wrap {
    display: block !important;
    order: 2 !important;
    flex: 0 0 100% !important;
    flex-basis: 100% !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0.35rem 0 0 !important;
    padding: 0.35rem 0 0.15rem !important;
    box-sizing: border-box !important;
    position: static !important;
    visibility: visible !important;
    opacity: 1 !important;
    overflow: visible !important;
  }

  .header .header-main-wrap .header-item.header-main,
  .header .header-item.header-main,
  .header .header-main,
  .header .region-header,
  .header #block-header-info2 {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0;
    padding: 0 !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  .header .header-info {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0.35rem 0 !important;
    visibility: visible !important;
    opacity: 1 !important;
    color: #fff !important;
  }

  .header .header-info .header-info-container {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    justify-content: space-between !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    gap: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
  }

  .header .header-info .header-info-item--phone {
    display: none !important;
  }

  .header .header-info .header-info-location,
  .header .header-info .header-info-item--location,
  .header .header-info .header-info-hours,
  .header .header-info .header-info-item--hours {
    display: flex !important;
    flex: 1 1 50% !important;
    max-width: 50% !important;
    min-width: 0 !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  .header .header-info .header-info-location,
  .header .header-info .header-info-item--location {
    padding-right: 0.65rem !important;
    border-right: 1px solid rgba(255, 255, 255, 0.28) !important;
    justify-content: flex-start !important;
  }

  .header .header-info .header-info-hours,
  .header .header-info .header-info-item--hours {
    padding-left: 0.65rem !important;
    justify-content: flex-end !important;
  }

  .header .header-info .header-info-desc,
  .header .header-info .header-info-desc span,
  .header .header-info .header-info-desc strong,
  .header .header-info .header-info-label,
  .header .header-info .header-info-city,
  .header .header-info .header-info-areas,
  .header .header-info .header-info-hours-label {
    display: block !important;
    color: #fff !important;
    visibility: visible !important;
    opacity: 1 !important;
    font-size: 0.72rem !important;
    line-height: 1.3 !important;
  }

  .header .header-info .header-info-item--location .header-info-desc {
    text-align: left !important;
  }

  .header .header-info .header-info-item--hours .header-info-desc {
    text-align: right !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-end !important;
    width: 100% !important;
  }

  .header .header-info .header-info-hours-label {
    text-transform: uppercase !important;
    font-size: 0.68rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.04em !important;
    margin-bottom: 0.15rem !important;
    text-align: right !important;
    width: 100% !important;
  }

  /* Align Mon-Thurs / Fri-Sat times in one column (match JD) */
  .header .header-info .header-info-hours-row {
    display: grid !important;
    grid-template-columns: 5.75rem max-content !important;
    column-gap: 0.35rem !important;
    align-items: baseline !important;
    justify-content: end !important;
    width: max-content !important;
    max-width: 100% !important;
    margin: 0 0 0 auto !important;
    line-height: 1.35 !important;
    white-space: nowrap !important;
  }

  .header .header-info .header-info-hours-row .header-info-day,
  .header .header-info .header-info-hours-row .header-info-time {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1.35 !important;
    color: #fff !important;
    font-size: 0.72rem !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  .header .header-info .header-info-hours-row .header-info-day {
    text-align: right !important;
    white-space: nowrap !important;
  }

  .header .header-info .header-info-hours-row .header-info-time {
    text-align: left !important;
    font-weight: 600 !important;
    white-space: nowrap !important;
  }

  /* Row 3: CONTACT US + phone, full width centered (JD) */
  .header .header-right-wrap,
  .header .navbar > .container > .header-right-wrap,
  .header .header-side.header-right-wrap,
  body .header .header-right-wrap,
  body.path-frontpage .header .header-right-wrap,
  body.path-products .header .header-right-wrap {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    order: 3 !important;
    flex: 0 0 100% !important;
    flex-basis: 100% !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0.15rem 0 0 !important;
    padding: 0.45rem 0 0.25rem !important;
    box-sizing: border-box !important;
    position: static !important;
    visibility: visible !important;
    opacity: 1 !important;
    text-align: center !important;
    overflow: visible !important;
  }

  .header .header-right-wrap .header-item.header-right,
  .header .header-item.header-right,
  .header .header-right,
  .header .region-header-right {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    padding: 0 !important;
    text-align: center !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  .header #block-call-to-order,
  .header #block-call-to-order .field-item {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  .header #block-call-to-order a.call-phone-link {
    font-size: 1.15rem !important;
  }
}

/* Desktop: keep header info + contact visible */
@media (min-width: 768px) {
  .header .navbar.header-center > .container {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  .header .header-main-wrap,
  .header .header-right-wrap,
  .header .header-info,
  .header #block-call-to-order {
    visibility: visible !important;
    opacity: 1 !important;
    overflow: visible !important;
    max-height: none !important;
  }

  .header .header-main-wrap {
    display: flex !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
    width: auto !important;
    max-width: none !important;
    align-items: center !important;
  }

  .header .header-right-wrap {
    display: flex !important;
    flex: 0 0 auto !important;
    width: auto !important;
    max-width: none !important;
    align-items: center !important;
    justify-content: flex-end !important;
  }
}

/* --- Mobile carousel: true vertical center (JD mainCenterOffset ~ 0) --- */
@media screen and (max-width: 768px) {
  .slide-carousel .slide-carousel-hero,
  .hero.slide-carousel .slide-carousel-hero {
    position: relative !important;
    width: 100% !important;
    height: 0 !important;
    padding-bottom: 68% !important;
    min-height: 260px !important;
    overflow: hidden !important;
  }

  .slide-carousel .slide-carousel-hero .slide-image,
  .slide-carousel .slide-carousel-hero .slide-image img,
  .slide-carousel .slide-carousel-hero .slide-image picture,
  .slide-carousel .slide-carousel-hero .slide-image picture img {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
  }

  .slide-carousel .slide-carousel-hero .slide-content-wrap,
  .slide-carousel .slide-content-wrap,
  .hero.slide-carousel .slide-content-wrap {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0.55rem 0.75rem !important;
    box-sizing: border-box !important;
    transform: none !important;
    overflow: hidden !important;
    z-index: 2 !important;
    pointer-events: none !important;
  }

  .slide-carousel .container.slide-wrap,
  .slide-carousel .slide-carousel-hero .container.slide-wrap {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    padding: 0 !important;
    transform: none !important;
  }

  .slide-carousel .slide-content,
  .slide-carousel .slide-carousel-hero .slide-content,
  .slide-carousel .owl-item .slide-content,
  .slide-carousel .owl-item.active .slide-content,
  .hero.slide-carousel .slide-content {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: 100% !important;
    height: 100% !important;
    max-height: 100% !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
    text-align: center !important;
    pointer-events: auto !important;
    transform: none !important;
  }

  /* Higher specificity than margin-top:0 !important cancelers */
  .slide-carousel .slide-carousel-hero .slide-content .slide-content-main,
  .slide-carousel .slide-carousel-hero .slide-content .slide-content-main.float-center,
  .slide-carousel .slide-carousel-hero .slide-content .slide-content-main.float-center.text-left,
  .slide-carousel .slide-content .slide-content-main.float-center.text-left,
  .slide-carousel .owl-item .slide-content-main.float-center.text-left,
  .slide-carousel .slide-content-main,
  .slide-carousel .slide-content-main.float-center,
  .slide-carousel .slide-content-main.float-center.text-left,
  .slide-carousel .slide-content-main.text-left {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    margin-top: auto !important;
    margin-bottom: auto !important;
    margin-left: auto !important;
    margin-right: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: none !important;
    min-height: 0 !important;
    flex: 0 0 auto !important;
    float: none !important;
    transform: none !important;
    overflow: visible !important;
    text-align: center !important;
    padding: 0.25rem 0.35rem !important;
    box-sizing: border-box !important;
    pointer-events: auto !important;
    gap: 0.35rem !important;
  }

  .slide-carousel .pre-heading-text,
  .slide-carousel .heading-text,
  .slide-carousel .slide-content-body,
  .slide-carousel .heading-text .field-item,
  .slide-carousel .pre-heading-text .field-item,
  .slide-carousel .slide-button {
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
    width: 100% !important;
  }

  .slide-carousel .nav.menu.alt-button.mt-4.slide-button,
  .slide-carousel .slide-button {
    display: flex !important;
    justify-content: center !important;
    margin-top: 0.35rem !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
}

/* Nuclear: hours day/time column alignment (beats any leftover display:block/inline) */
@media (max-width: 991.98px) {
  header.header .header-info .header-info-desc .header-info-hours-row,
  header.header .header-info-hours .header-info-hours-row,
  header.header span.header-info-hours-row {
    display: grid !important;
    grid-template-columns: 5.75rem max-content !important;
    column-gap: 0.35rem !important;
    align-items: baseline !important;
    justify-content: end !important;
    width: max-content !important;
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: 0 !important;
    line-height: 1.35 !important;
    white-space: nowrap !important;
  }
  header.header .header-info-hours-row > .header-info-day,
  header.header .header-info-hours-row > .header-info-time,
  header.header .header-info-hours-row > span.header-info-day,
  header.header .header-info-hours-row > strong.header-info-time {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
  }
  header.header .header-info-hours-row > .header-info-day,
  header.header .header-info-hours-row > span.header-info-day {
    text-align: right !important;
    white-space: nowrap !important;
  }
  header.header .header-info-hours-row > .header-info-time,
  header.header .header-info-hours-row > strong.header-info-time {
    text-align: left !important;
    font-weight: 600 !important;
    white-space: nowrap !important;
  }
}


/* --- from chrome-layout-fix.css: desktop header-info all pages --- */
/* ==========================================================================
   DESKTOP header + main menu (city pages + homepage)
   Match reference layout site/cypress-tx layout, Johnny Detail purple theme.
   Root cause of crush: custom_css .navbar.header-center { padding: 0 25rem }
   ========================================================================== */
@media (min-width: 992px) {
  /* Kill 25rem side padding that collapses brand/info/contact into a pile */
  .header .navbar.header-center,
  .navbar.header-center,
  header.header .navbar.header-center {
    padding-left: 0 !important;
    padding-right: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    overflow: visible !important;
  }

  .header .navbar.header-center > .container,
  .navbar.header-center > .container {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
    max-width: 1140px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding: 0.65rem 1rem !important;
    box-sizing: border-box !important;
    gap: 0.75rem 1rem !important;
  }

  /* Brand — left */
  .header .header-side.navbar-brand,
  .navbar.header-center .header-side.navbar-brand {
    display: flex !important;
    flex: 0 0 auto !important;
    width: auto !important;
    max-width: 280px !important;
    min-width: 200px !important;
    margin: 0 !important;
    padding: 0 !important;
    align-items: center !important;
    order: 1 !important;
  }

  .header .site-branding .container-wrap,
  .header #block-martis-branding .container-wrap {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 0.55rem 0.75rem !important;
    width: auto !important;
  }

  .header .brand.logo,
  .header .brand.logo img {
    max-width: 64px !important;
    width: 64px !important;
    height: auto !important;
    flex: 0 0 auto !important;
  }

  .header .brand.site-name {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    width: auto !important;
    max-width: none !important;
    overflow: visible !important;
  }

  .header .site-branding-name a {
    font-size: 1.15rem !important;
    font-weight: 700 !important;
    white-space: nowrap !important;
    color: #fff !important;
  }

  .header .site-branding-slogan {
    font-size: 0.8rem !important;
    font-weight: 400 !important;
    opacity: 0.9 !important;
    white-space: nowrap !important;
    color: #fff !important;
    margin-top: 0.1rem !important;
  }

  /* City / hours — center flex grow (JD: location | hours) */
  .header .header-main-wrap,
  .header .navbar > .container > .header-main-wrap {
    display: flex !important;
    flex: 1 1 auto !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 0.5rem !important;
    order: 2 !important;
    overflow: visible !important;
  }

  .header .header-main-wrap .header-item.header-main,
  .header .header-main,
  .header .region-header,
  .header #block-header-info2,
  .header #block-header-info2 .container-wrap,
  .header #block-header-info2 .block-content,
  .header #block-header-info2 .layout,
  .header #block-header-info2 .layout__region,
  .header #block-header-info2 .row,
  .header #block-header-info2 .block-layout-builder {
    display: block !important;
    width: 100% !important;
    max-width: 520px !important;
    margin: 0 auto;
    padding: 0 !important;
    background: transparent !important;
  }

  /*
   * header-info — ALL desktop pages (home, city/taxonomy, service, etc.):
   * CSS grid 1fr|1fr so the divider is always dead-center between
   * location and hours. Equal padding either side of the border.
   * Do not rely on page-specific padding-left: 2rem hacks.
   */
  .header .header-info,
  .header .header-main-wrap .header-info,
  body.path-frontpage .header .header-info,
  body.path-taxonomy .header .header-info,
  body.path-node .header .header-info,
  body.page-node-type-service .header .header-info,
  body.path-products .header .header-info,
  body.path-product .header .header-info {
    display: block !important;
    width: 100% !important;
    max-width: 520px !important;
    min-width: 0 !important;
    margin: 0 auto !important;
    padding: 0 !important;
    color: #fff !important;
    box-sizing: border-box !important;
    flex: 1 1 auto !important;
  }

  /* Kill path-taxonomy / products negative margins that shrink the info slot */
  .path-taxonomy .header .header-main-wrap,
  .path-products .header .header-main-wrap,
  .path-product .header .header-main-wrap,
  .page-node-type-service .header .header-main-wrap {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  .header .header-info .header-info-container,
  .path-taxonomy .header .header-info .header-info-container,
  .page-node-type-service .header .header-info .header-info-container,
  .path-frontpage .header .header-info .header-info-container {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    grid-template-rows: auto !important;
    align-items: center !important;
    justify-content: stretch !important;
    justify-items: stretch !important;
    width: 100% !important;
    max-width: 100% !important;
    gap: 0 !important;
    column-gap: 0 !important;
    row-gap: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
  }

  .header .header-info .header-info-item--phone,
  .path-taxonomy .header .header-info .header-info-item--phone,
  .page-node-type-service .header .header-info .header-info-item--phone {
    display: none !important;
    width: 0 !important;
    max-width: 0 !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
  }

  /*
   * Kill theme + custom_css spacing that shove hours off mid:
   * custom_css: .header .header-info .header-info-item.header-info-location { margin-right: 3rem !important }
   * style.css:  .header-info .header-info-item { margin-left: 40px }
   * custom_css: flex 1 1 auto + justify center on items
   */
  .header .header-info .header-info-item,
  .header .header-info .header-info-location,
  .header .header-info .header-info-item--location,
  .header .header-info .header-info-hours,
  .header .header-info .header-info-item--hours,
  .header .header-info .header-info-item.header-info-location,
  .header .header-info .header-info-item.header-info-item--location,
  .header .header-info .header-info-item.header-info-hours,
  .header .header-info .header-info-item.header-info-item--hours,
  .header .header-info .header-info-item:first-child,
  .header .header-info .header-info-item:nth-child(2),
  .path-taxonomy .header .header-info .header-info-item,
  .path-taxonomy .header .header-info .header-info-item.header-info-location,
  .page-node-type-service .header .header-info .header-info-item,
  .page-node-type-service .header .header-info .header-info-item.header-info-location {
    margin: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    float: none !important;
  }

  /* Each grid cell = exactly half; content hugs the center divider */
  .header .header-info .header-info-location,
  .header .header-info .header-info-item--location,
  .header .header-info .header-info-hours,
  .header .header-info .header-info-item--hours,
  .path-taxonomy .header .header-info .header-info-location,
  .path-taxonomy .header .header-info .header-info-item--location,
  .path-taxonomy .header .header-info .header-info-hours,
  .path-taxonomy .header .header-info .header-info-item--hours,
  .page-node-type-service .header .header-info .header-info-location,
  .page-node-type-service .header .header-info .header-info-item--location,
  .page-node-type-service .header .header-info .header-info-hours,
  .page-node-type-service .header .header-info .header-info-item--hours {
    flex: unset !important;
    flex-grow: unset !important;
    flex-shrink: unset !important;
    flex-basis: unset !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    display: flex !important;
    align-items: center !important;
    box-sizing: border-box !important;
  }

  /* Location — right half of left cell, equal pad to divider */
  .header .header-info .header-info-location,
  .header .header-info .header-info-item--location,
  .path-taxonomy .header .header-info .header-info-location,
  .path-taxonomy .header .header-info .header-info-item--location,
  .page-node-type-service .header .header-info .header-info-location,
  .page-node-type-service .header .header-info .header-info-item--location {
    padding-right: 1.5rem !important;
    padding-left: 0.25rem !important;
    border-right: 1px solid rgba(255, 255, 255, 0.28) !important;
    justify-content: flex-end !important;
  }

  /*
   * Hours — left half of right cell, SAME pad as location so content
   * sits centered about the divider (replaces fragile page-only 2rem).
   */
  .header .header-info .header-info-hours,
  .header .header-info .header-info-item--hours,
  .path-taxonomy .header .header-info .header-info-hours,
  .path-taxonomy .header .header-info .header-info-item--hours,
  .page-node-type-service .header .header-info .header-info-hours,
  .page-node-type-service .header .header-info .header-info-item--hours {
    padding-left: 1.5rem !important;
    padding-right: 0.25rem !important;
    border-right: 0 !important;
    justify-content: flex-start !important;
  }

  .header .header-info .header-info-item--location .header-info-desc,
  .header .header-info .header-info-location .header-info-desc {
    text-align: right !important;
    width: auto !important;
    max-width: 100% !important;
  }

  /* Hours column: stack label + rows, center label over the hours block */
  .header .header-info .header-info-item--hours .header-info-desc,
  .header .header-info .header-info-hours .header-info-desc,
  .path-taxonomy .header .header-info .header-info-item--hours .header-info-desc,
  .page-node-type-service .header .header-info .header-info-item--hours .header-info-desc {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    width: auto !important;
    max-width: 100% !important;
    margin: 0 !important;
  }

  .header .header-info .header-info-desc,
  .header .header-info .header-info-desc span,
  .header .header-info .header-info-desc strong {
    color: #ffffff !important;
    font-size: 0.82rem !important;
    line-height: 1.3 !important;
  }

  .header .header-info .header-info-hours-label,
  .path-taxonomy .header .header-info .header-info-hours-label,
  .page-node-type-service .header .header-info .header-info-hours-label {
    display: block !important;
    width: 100% !important;
    text-align: center !important;
    text-transform: uppercase !important;
    font-size: 0.7rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.04em !important;
    margin: 0 0 0.2rem 0 !important;
    padding: 0 !important;
  }

  /* Desktop hours: day/time grid, centered under OUR HOURS */
  .header .header-info .header-info-hours-row,
  .path-taxonomy .header .header-info .header-info-hours-row,
  .page-node-type-service .header .header-info .header-info-hours-row {
    display: grid !important;
    grid-template-columns: max-content max-content !important;
    column-gap: 0.4rem !important;
    justify-content: center !important;
    justify-items: start !important;
    width: max-content !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    white-space: nowrap !important;
  }

  .header .header-info .header-info-hours-row .header-info-day {
    display: block !important;
    text-align: right !important;
  }

  .header .header-info .header-info-hours-row .header-info-time {
    display: block !important;
    text-align: left !important;
    font-weight: 600 !important;
  }

  /* Contact + cart — right */
  .header .header-right-wrap,
  .header .header-side.header-right-wrap,
  .header .navbar > .container > .header-right-wrap {
    display: flex !important;
    flex: 0 0 auto !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: flex-end !important;
    width: auto !important;
    max-width: none !important;
    min-width: 200px !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 0.75rem !important;
    order: 3 !important;
    position: static !important;
  }

  .header .header-item.header-right,
  .header .header-right,
  .header .region-header-right {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: center !important;
  }

  .header #block-call-to-order,
  .header #block-call-to-order > .container-wrap,
  .header #block-call-to-order > .container-wrap > .block-content,
  .header #block-call-to-order .field-item {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    min-width: 10rem !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    text-align: center !important;
  }

  .header #block-call-to-order *,
  .header #block-call-to-order p,
  .header #block-call-to-order strong,
  .header #block-call-to-order a {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
  }

  .header #block-call-to-order .text-sm,
  .header #block-call-to-order strong.text-sm {
    display: block !important;
    width: 100% !important;
    font-size: 0.7rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
    color: #fff !important;
    opacity: 0.9 !important;
    text-align: center !important;
    margin: 0 0 0.2rem !important;
    line-height: 1.2 !important;
  }

  .header #block-call-to-order a.call-phone-link,
  .header #block-call-to-order .call-phone a,
  .header #block-call-to-order .call-phone {
    display: block !important;
    font-size: 1.2rem !important;
    font-weight: 700 !important;
    color: #fff !important;

/* --- from martis-custom.css: header-info / contact mobile --- */
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  /* City info (order 2) above Contact Us phone (order 3) */
  .header .header-main,
  .header .header-right,
  .header .header-main-wrap,
  .header .region-header,
  .header .region-header-right,
  .header #block-header-info2,
  .header #block-call-to-order,
  .header [id^="block-martis-headerinfo"],
  .header [id*="headerinfo"] {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    max-height: none !important;
    overflow: visible !important;
  }
  .header .header-main-wrap,
  .header .header-main,
  .header .header-item.header-main {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
    order: 2 !important;
    padding: 0.25rem 0 0 !important;
    margin: 0.15rem 0 0 !important;
    text-align: left !important;
  }
  .header .header-right-wrap {
    display: flex !important;
    flex-wrap: wrap !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
    order: 3 !important;
    padding: 0.15rem 0 0 !important;
    position: static !important;
  }
  /* Hide Call Us phone column; number is under this row */
  .header .header-info .header-info-item--phone {
    display: none !important;
  }
  .header .header-info,
  .header .header-info-container {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: flex-start !important;
    justify-content: space-between !important;
    width: 100% !important;
    gap: 0.5rem 0.75rem !important;
    margin: 0 !important;
    text-align: left !important;
  }
  .header .header-info-item {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  .header .header-info-item--location,
  .header .header-info-location {
    flex: 1 1 50% !important;
    max-width: 50% !important;
    justify-content: flex-start !important;
    padding-right: 0.65rem !important;
    border-right: 1px solid rgba(255, 255, 255, 0.28) !important;
    box-sizing: border-box !important;
  }
  .header .header-info-item--hours,
  .header .header-info-hours {
    flex: 1 1 50% !important;
    max-width: 50% !important;
    justify-content: flex-end !important;
    padding-left: 0.65rem !important;
    box-sizing: border-box !important;
  }
  .header .header-info-item--location .header-info-desc,
  .header .header-info-location .header-info-desc {
    text-align: left !important;
  }
  .header .header-info-item--hours .header-info-desc,
  .header .header-info-hours .header-info-desc {
    text-align: right !important;
  }
  .header .header-info-desc span,
  .header .header-info-desc strong {
    display: block !important;
  }
  .header .header-info-hours-label {
    display: block !important;
    text-transform: uppercase !important;
    font-size: 0.68rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.04em !important;
    margin-bottom: 0.15rem !important;
  }
  /* Day + time columns align Mon-Thurs / Fri-Sat times (match JD) */
  .header .header-info-hours-row {
    display: grid !important;
    grid-template-columns: 5.75rem max-content !important;
    column-gap: 0.35rem !important;
    align-items: baseline !important;
    justify-content: end !important;
    width: max-content !important;
    max-width: 100% !important;
    margin-left: auto !important;
    line-height: 1.35 !important;
    white-space: nowrap !important;
  }
  .header .header-info-hours-row .header-info-day,
  .header .header-info-hours-row .header-info-time {
    display: block !important;
    margin: 0 !important;
  }
  .header .header-info-hours-row .header-info-day {
    text-align: right !important;
  }
  .header .header-info-hours-row .header-info-time {
    text-align: left !important;
    font-weight: 600 !important;
  }
  .header .header-right,
  .header .header-right .block,
  .header .header-right .block-content,
  .header #block-call-to-order,
  .header #block-call-to-order .container-wrap,
  .header #block-call-to-order .block-content {
    width: 100% !important;
    text-align: center !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  .header #block-call-to-order .block-content,
  .header #block-call-to-order .field-item,
  .header .header-right .field-item {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 0 !important;
    padding-top: 0.75rem !important;
    padding-bottom: 0.15rem !important;
  }
  .header #block-call-to-order strong.text-sm,
  .header .header-right strong.text-sm {
    margin: 0 !important;
  }
  .header .header-right p,
  .header #block-call-to-order p {
    margin: 0 !important;
    line-height: 1.2 !important;
  }
  .header .header-right h4 {
    font-size: 1.1rem !important;
    margin: 0 !important;
    line-height: 1.25 !important;
  }
  .header .header-right .text-sm,
  .header .header-right strong.text-sm {
    display: block !important;
    font-size: 0.72rem !important;
    margin: 0 0 2px !important;
  }

  /* Branding row: keep cyberlytics rail (1140px + 1rem pad) — do NOT force max-width 100% */
  .header .navbar.header-center {
    position: relative !important;
  }
  .header .navbar.header-center > .container {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
    max-width: 1140px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding: 0.65rem 1rem !important;
    box-sizing: border-box !important;
  }
} /* end @media (min-width: 992px) DESKTOP header — must close before EXTRACT 02 */

/* ========== 02-service-brag.css (purple recolor) ========== */
/* ==========================================================================
   EXTRACT 02 — Service pages + service-brag comparison (Johnny Detail, purple)
   body.page-node-type-service · .service-brag · desktop 2-col / mobile stack
   Marker: jd-header-service-menu-v1 / 02-service-brag
   ========================================================================== */

/* ==========================================================================
   SERVICE PAGES (node type: service) — JD layout, CY greens
   Shared content column aligned with pricing/blog gutters (~15px mobile).
   Overrides brittle custom_css rem hacks (23rem widths, -54.5rem mt, pb:22rem,
   overflow scroll on brag, stacked region/cards padding that narrows mobile).
   Applies to all published service nodes (city + generic).
   ========================================================================== */

body.page-node-type-service {
  /* Match blog/pricing container-wrap side pad (~15px) on mobile; 1rem desktop */
  --service-gutter: 0.95rem;
  --service-max: 1200px;
}

/* ---- Shared content column (twocol hero + body cards) ---- */
/* Outer node shell: full width of main column, NO side pad (children own gutter) */
body.page-node-type-service .node-type-service.node-content.service-node-content,
body.page-node-type-service .service-node-content {
  position: relative !important;
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  box-sizing: border-box !important;
}

/* Shared content column: single gutter on twocol + cards only */
body.page-node-type-service .layout.layout--twocol-section.layout--twocol-section--50-50.row,
body.page-node-type-service .layout.layout--twocol-section,
body.page-node-type-service .service-cards-wrapper,
body.page-node-type-service .service-page.service-cards-wrapper,
body.page-node-type-service .service-page,
body.page-node-type-service .block-field-blocknodeservicebody .service-cards-wrapper {
  position: relative !important;
  width: 100% !important;
  max-width: var(--service-max) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: var(--service-gutter) !important;
  padding-right: var(--service-gutter) !important;
  box-sizing: border-box !important;
}

/* Body field block: full width, no extra pad (cards wrapper owns gutter) */
body.page-node-type-service .block-field-blocknodeservicebody {
  position: relative !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0.5rem 0 1rem 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  box-sizing: border-box !important;
}

body.page-node-type-service .block-field-blocknodeservicebody > .container-wrap,
body.page-node-type-service .block-field-blocknodeservicebody .block-content {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Nested cards wrapper: only one horizontal gutter (on the wrapper itself) */
body.page-node-type-service .block-field-blocknodeservicebody .service-cards-wrapper,
body.page-node-type-service .service-cards-wrapper,
body.page-node-type-service .service-page.service-cards-wrapper,
body.page-node-type-service .service-page {
  margin-top: 0.75rem !important;
  margin-bottom: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  background: transparent !important;
}

/* Region shell: full width, NO nested side pad (children use --service-gutter) */
body.page-node-type-service .region-content,
body.page-node-type-service .region.region-content {
  max-width: 100% !important;
  width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  box-sizing: border-box !important;
}

/* Twocol layout specifics */
body.page-node-type-service .layout.layout--twocol-section.layout--twocol-section--50-50.row,
body.page-node-type-service .layout.layout--twocol-section {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: flex-start !important;
  margin-top: 0.5rem !important;
  margin-bottom: 1rem !important;
  gap: 0.75rem 1rem !important;
}

body.page-node-type-service .layout__region.layout__region--first,
body.page-node-type-service .layout__region.layout__region--second {
  position: relative !important;
  margin: 0 !important;
  padding: 0 !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

/* Kill custom_css block:last-child -50rem on service pages */
body.page-node-type-service .page-wrapper .main-content .block:last-child,
body.page-node-type-service .main-content .block:last-child,
body.page-node-type-service .region-content .block:last-child {
  margin-bottom: 0 !important;
}

/* ---- service-brag block shell (kill custom_css per-node hacks) ---- */
html body.page-node-type-service #block-martis-servicebragsheet,
html body.page-node-type-service .block.service-brag,
html body.page-node-type-service [id*="servicebragsheet"],
html body.page-node-type-service [id*="service-brag"] {
  margin: 0 0 0.75rem 0 !important;
  margin-top: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding: 0 !important;
  padding-top: 0 !important;
  padding-left: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  display: block !important;
  position: relative !important;
  z-index: 5 !important;
  float: none !important;
  box-sizing: border-box !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

html body.page-node-type-service #block-martis-servicebragsheet > .container-wrap,
html body.page-node-type-service #block-martis-servicebragsheet .block-content,
html body.page-node-type-service #block-martis-servicebragsheet .row.layout.layout--onecol,
html body.page-node-type-service #block-martis-servicebragsheet .layout__region,
html body.page-node-type-service #block-martis-servicebragsheet .layout__region.layout__region--content {
  margin: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding: 0 !important;
  padding-left: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  float: none !important;
  box-sizing: border-box !important;
}

/* Per-node custom_css often wraps card with black border — neutralize */
html body.page-node-type-service #block-martis-servicebragsheet .layout__region.layout__region--content,
html body.page-node-type-service #block-martis-servicebragsheet .field.field-body {
  border: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
}

/* ---- service-brag comparison table ---- */
body.page-node-type-service .service-brag,
body.page-node-type-service .layout__region.layout__region--second .service-brag,
body.page-node-type-service .layout__region--second .service-brag {
  display: block !important;
  position: relative !important;
  z-index: 5 !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 0 0.75rem 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
  float: none !important;
  overflow: visible !important;
}

/* Fit brag to content column; allow table container to scroll on narrow screens */
body.page-node-type-service .service-brag > .container-wrap,
body.page-node-type-service .service-brag .block-content,
body.page-node-type-service .node-type-service .service-brag .block-content,
body.page-node-type-service .node-content .service-brag .block-content {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow-x: visible !important;
  overflow-y: visible !important;
  box-sizing: border-box !important;
}

body.page-node-type-service .service-brag table,
body.page-node-type-service .service-brag .jd-comparison-table,
body.page-node-type-service .service-brag .cy-comparison-table {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  table-layout: fixed !important;
  box-sizing: border-box !important;
}

body.page-node-type-service .service-brag table th,
body.page-node-type-service .service-brag table td,
body.page-node-type-service .service-brag .jd-comparison-table th,
body.page-node-type-service .service-brag .jd-comparison-table td {
  word-wrap: break-word !important;
  overflow-wrap: anywhere !important;
  hyphens: auto !important;
}

/* ---- Cards / summary / H1: same width column (kill custom 23rem offsets) ---- */
body.page-node-type-service .service-cards-wrapper > h1,
body.page-node-type-service .service-page > h1 {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0.65rem 0 1rem 0 !important;
  /* Roomier title padding (user request) */
  padding: 0.65rem 0.75rem !important;
  line-height: 1.3 !important;
  box-sizing: border-box !important;
}

body.page-node-type-service .service-cards-wrapper .summary-box,
body.page-node-type-service .service-cards-wrapper .main-grid,
body.page-node-type-service .service-cards-wrapper .card,
body.page-node-type-service .layout__region.layout__region--content .card {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  box-sizing: border-box !important;
}

body.page-node-type-service .service-cards-wrapper .summary-box,
body.page-node-type-service .service-cards-wrapper .card {
  margin-top: 0.65rem !important;
  margin-bottom: 0.85rem !important;
}

body.page-node-type-service .service-cards-wrapper .main-grid {
  margin-top: 0.35rem !important;
  margin-bottom: 0.5rem !important;
}

/* main-grid cards share full column on single-column (mobile) */
body.page-node-type-service .service-cards-wrapper .main-grid .card {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* ---- Teaser icon (circular badge) ---- */
body.page-node-type-service .service-teaser.block-field-blocknodeservicefield-teaser-icon,
body.page-node-type-service .block.block-layout-builder.block-field-blocknodeservicefield-teaser-icon,
body.page-node-type-service .block-field-blocknodeservicefield-teaser-icon {
  position: relative !important;
  display: block !important;
  width: auto !important;
  max-width: none !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  z-index: 6 !important;
  background: transparent !important;
  overflow: visible !important;
}

body.page-node-type-service .block-field-blocknodeservicefield-teaser-icon .container-wrap,
body.page-node-type-service .block-field-blocknodeservicefield-teaser-icon .block-content,
body.page-node-type-service .block-field-blocknodeservicefield-teaser-icon .field,
body.page-node-type-service .block-field-blocknodeservicefield-teaser-icon .field-item {
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  width: auto !important;
  max-width: none !important;
}

body.page-node-type-service .block-field-blocknodeservicefield-teaser-icon .field-label,
body.page-node-type-service .block-field-blocknodeservicefield-teaser-icon .field-label.visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

body.page-node-type-service .block-field-blocknodeservicefield-teaser-icon .field-field-teaser-icon > .field-label {
  display: none !important;
}

body.page-node-type-service .block.block-layout-builder.block-field-blocknodeservicefield-teaser-icon img,
body.page-node-type-service .block-field-blocknodeservicefield-teaser-icon img,
body.page-node-type-service .service-teaser img,
body.page-node-type-service .field-field-teaser-icon img,
body.page-node-type-service .field-field-media-image img {
  display: block !important;
  width: 120px !important;
  max-width: 120px !important;
  height: 120px !important;
  object-fit: cover !important;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 50% !important;
  border: 5px solid #000 !important;
  background-image: linear-gradient(204deg, #c9a0e8, #7b2cbf) !important;
  background-color: #b781e3 !important;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.28) !important;
  position: relative !important;
  z-index: 6 !important;
  left: 0rem !important;
  top: -10.5rem !important;
}

/* ---- Hero image block ---- */
body.page-node-type-service .block-field-blocknodeservicefield-image {
  position: relative !important;
  margin: 0 0 0.5rem 0 !important;
  padding: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  overflow: hidden !important;
  border-radius: 8px !important;
}

body.page-node-type-service .block-field-blocknodeservicefield-image img,
body.page-node-type-service .block-field-blocknodeservicefield-image picture,
body.page-node-type-service .block-field-blocknodeservicefield-image picture img {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  margin: 0 !important;
}

/* ---- Text BG overlay (CREATE / EXPERIENCES etc.) ---- */
body.page-node-type-service .block.block-layout-builder.block-field-blocknodeservicefield-text-bg,
body.page-node-type-service .block-field-blocknodeservicefield-text-bg,
body.page-node-type-service ._none.block.block-layout-builder.block-field-blocknodeservicefield-text-bg {
  position: absolute !important;
  left: 0.75rem !important;
  right: auto !important;
  bottom: 16rem !important;
  top: auto !important;
  width: 100% !important;
  max-width: calc(100% - 1.5rem) !important;
  margin: 0 !important;
  padding: 0 !important;
  z-index: 4 !important;
  background: transparent !important;
  pointer-events: none !important;
}

body.page-node-type-service .block-field-blocknodeservicefield-text-bg .field-label {
  display: none !important;
}

body.page-node-type-service .block-field-blocknodeservicefield-text-bg .field-item {
  display: block !important;
  color: #fff !important;
  font-weight: 800 !important;
  font-size: clamp(1.35rem, 3.2vw, 2.15rem) !important;
  line-height: 1.1 !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.55) !important;
  margin: 0 !important;
  padding: 0.15rem 0.65rem !important;
  border-radius: 10px !important;
  width: max-content !important;
  max-width: 100% !important;
}

body.page-node-type-service .block-field-blocknodeservicefield-text-bg .field-item + .field-item {
  margin-top: 0.35rem !important;
}

body.page-node-type-service .layout__region.layout__region--first {
  overflow: visible !important;
}

body.page-node-type-service .layout__region--first > .block-field-blocknodeservicefield-image {
  position: relative !important;
}

/* ==========================================================================
   DESKTOP service layout (≥992px)
   Two-column hero: image left | brag right; icon badge at column join.
   Cards column matches twocol outer width (same gutter / max).
   ========================================================================== */
@media (min-width: 992px) {
  body.page-node-type-service {
    --service-gutter: 1rem;
  }

  body.page-node-type-service .layout.layout--twocol-section.layout--twocol-section--50-50.row,
  body.page-node-type-service .layout.layout--twocol-section {
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    gap: 1rem 1.25rem !important;
    margin-top: -2.25rem !important;
    margin-bottom: 1rem !important;
  }

  body.page-node-type-service .layout__region.layout__region--first {
    flex: 1 1 48% !important;
    width: 48% !important;
    max-width: 50% !important;
  }

  body.page-node-type-service .layout__region.layout__region--second {
    flex: 1 1 48% !important;
    width: 48% !important;
    max-width: 50% !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    align-items: stretch !important;
  }

  body.page-node-type-service .layout__region--second .service-brag,
  body.page-node-type-service .service-brag {
    margin: 0 !important;
    padding: 0 !important;
    max-width: 100% !important;
    width: 100% !important;
  }

  body.page-node-type-service .layout__region--first {
    position: relative !important;
  }

  body.page-node-type-service .layout__region--first > .service-teaser.block-field-blocknodeservicefield-teaser-icon,
  body.page-node-type-service .layout__region--first > .block-field-blocknodeservicefield-teaser-icon {
    position: absolute !important;
    right: -3.5rem !important;
    left: auto !important;
    top: 43.5% !important;
    bottom: auto !important;
    transform: translateY(-50%) !important;
    width: 120px !important;
    height: 120px !important;
    margin: 0 !important;
    z-index: 8 !important;
  }

  body.page-node-type-service .block-field-blocknodeservicefield-teaser-icon img {
    width: 120px !important;
    height: 120px !important;
    margin: 0 !important;
  }

  body.page-node-type-service .layout__region--first > .block-field-blocknodeservicefield-image {
    position: relative !important;
    margin-bottom: 0 !important;
  }

  body.page-node-type-service .layout__region--first > .block-field-blocknodeservicefield-text-bg,
  body.page-node-type-service .block-field-blocknodeservicefield-text-bg {
    position: absolute !important;
    left: 1rem !important;
    bottom: 1.35rem !important;
    top: auto !important;
    margin: 0 !important;
    z-index: 5 !important;
  }

  body.page-node-type-service .layout__region--first > .block-field-blocknodeservicefield-text-bg {
    top: auto !important;
    bottom: 8% !important;
  }

  body.page-node-type-service .service-cards-wrapper,
  body.page-node-type-service .service-page.service-cards-wrapper,
  body.page-node-type-service .service-page {
    margin-top: 0.5rem !important;
    margin-bottom: 0 !important;
  }

  /* Slightly roomier H1 on desktop */
  body.page-node-type-service .service-cards-wrapper > h1,
  body.page-node-type-service .service-page > h1 {
    padding: 0.75rem 1rem !important;
    margin-bottom: 1.1rem !important;
  }
}

/* ==========================================================================
   TABLET / MOBILE service layout (<992px)
   Stack: image → icon → brag → cards. Match pricing/blog width (~15px gutter).
   ========================================================================== */
@media (max-width: 991.98px) {
  body.page-node-type-service {
    /* Same as blog/pricing .container-wrap pad (~15px) */
    --service-gutter: 0.95rem;
  }
  body.page-node-type-service .block.block-layout-builder.block-field-blocknodeservicefield-text-bg,
  body.page-node-type-service .block-field-blocknodeservicefield-text-bg,
  body.page-node-type-service ._none.block.block-layout-builder.block-field-blocknodeservicefield-text-bg {
    bottom: 6rem !important;
  }
  body.page-node-type-service .block.block-layout-builder.block-field-blocknodeservicefield-teaser-icon img, body.page-node-type-service .block-field-blocknodeservicefield-teaser-icon img, body.page-node-type-service .service-teaser img, body.page-node-type-service .field-field-teaser-icon img, body.page-node-type-service .field-field-media-image img {
    left: 7.5rem !important;
    top: -21.5rem !important;
  }
  /* Full-bleed main column so service content matches pricing/blog width.
     Scope to page content only — do not strip header .container padding. */
  body.page-node-type-service #page-wrapper > .container,
  body.page-node-type-service .page-wrapper > .container,
  body.page-node-type-service #main-content .container,
  body.page-node-type-service main#main-content .container {
    padding-left: 0 !important;
    padding-right: 0 !important;
    max-width: 100% !important;
    width: 100% !important;
  }

  body.page-node-type-service .row.content-layout {
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  body.page-node-type-service .col-md-9.left-content.main-content,
  body.page-node-type-service .left-content.main-content,
  body.page-node-type-service .main-content {
    flex: 0 0 100% !important;
    max-width: 100% !important;
    width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin: 0 !important;
  }

  body.page-node-type-service .region-content,
  body.page-node-type-service .region.region-content,
  body.page-node-type-service #block-martis-content--3,
  body.page-node-type-service .lc-main-content {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin: 0 !important;
  }

  /* Onecol body layout: no extra region side pad from custom_css */
  body.page-node-type-service .row.layout.layout--onecol,
  body.page-node-type-service .layout.layout--onecol {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  body.page-node-type-service .row.layout.layout--onecol .layout__region,
  body.page-node-type-service .layout.layout--onecol .layout__region,
  body.page-node-type-service .layout__region.layout__region--content {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin: 0 !important;
  }

  body.page-node-type-service .layout.layout--twocol-section.layout--twocol-section--50-50.row,
  body.page-node-type-service .layout.layout--twocol-section {
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    gap: 0.65rem !important;
    margin-top: -8rem !important;
    margin-bottom: 0.75rem !important;
    max-width: 100% !important;
  }

  body.page-node-type-service .layout__region.layout__region--first,
  body.page-node-type-service .layout__region.layout__region--second {
    flex: 0 0 auto !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  body.page-node-type-service .block-field-blocknodeservicefield-image {
    margin: 0 0 0.35rem 0 !important;
    width: 100% !important;
  }

  body.page-node-type-service .layout__region--first {
    position: relative !important;
  }

  body.page-node-type-service .layout__region--first > .block-field-blocknodeservicefield-image {
    position: relative !important;
  }

  body.page-node-type-service .block-field-blocknodeservicefield-text-bg,
  body.page-node-type-service .layout__region--first > .block-field-blocknodeservicefield-text-bg {
    position: absolute !important;
    left: 0.65rem !important;
    bottom: 0.85rem !important;
    top: auto !important;
    margin: 0 !important;
    z-index: 5 !important;
  }

  body.page-node-type-service .block-field-blocknodeservicefield-text-bg .field-item {
    font-size: clamp(1.1rem, 5.5vw, 1.5rem) !important;
    padding: 0.2rem 0.55rem !important;
  }

  /* Icon: centered under image */
  body.page-node-type-service .layout__region--first > .service-teaser.block-field-blocknodeservicefield-teaser-icon,
  body.page-node-type-service .layout__region--first > .block-field-blocknodeservicefield-teaser-icon,
  body.page-node-type-service .block-field-blocknodeservicefield-teaser-icon {
    position: relative !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
    height: auto !important;
    margin: -2.5rem auto 0.35rem !important;
    transform: none !important;
    right: auto !important;
    left: auto !important;
    top: 11rem !important;
    bottom: auto !important;
    z-index: 8 !important;
  }

  body.page-node-type-service .block-field-blocknodeservicefield-teaser-icon img {
    width: 96px !important;
    height: 96px !important;
    max-width: 96px !important;
    margin: 0 auto !important;
  }

  /* Brag: full shared column width, no scroll */
  body.page-node-type-service .service-brag,
  body.page-node-type-service .layout__region--second .service-brag,
  body.page-node-type-service .layout__region.layout__region--second .service-brag {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0.25rem 0 0.5rem 0 !important;
    padding: 0 !important;
    overflow: visible !important;
  }

  body.page-node-type-service .service-brag > .container-wrap,
  body.page-node-type-service .service-brag .block-content {
    overflow-x: hidden !important;
    overflow-y: visible !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  body.page-node-type-service .service-brag table,
  body.page-node-type-service .service-brag .jd-comparison-table,
  body.page-node-type-service .service-brag .cy-comparison-table {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    table-layout: fixed !important;
  }

  /* Slightly tighter cell type so full table fits without scroll */
  body.page-node-type-service .service-brag table th,
  body.page-node-type-service .service-brag table td,
  body.page-node-type-service .service-brag p {
    font-size: clamp(0.62rem, 2.7vw, 0.78rem) !important;
    line-height: 1.25 !important;
  }

  body.page-node-type-service .layout__region.layout__region--second {
    margin: 0 0 0.5rem 0 !important;
    padding: 0 !important;
    display: block !important;
    width: 100% !important;
  }

  /* Cards / summary / h1 — full shared column, aligned */
  body.page-node-type-service .service-cards-wrapper,
  body.page-node-type-service .service-page.service-cards-wrapper,
  body.page-node-type-service .service-page,
  body.page-node-type-service .block-field-blocknodeservicebody {
    max-width: 100% !important;
    width: 100% !important;
    margin: 0.35rem auto 0 !important;
  }

  body.page-node-type-service .block-field-blocknodeservicebody {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  body.page-node-type-service .service-cards-wrapper,
  body.page-node-type-service .service-page.service-cards-wrapper,
  body.page-node-type-service .service-page {
    padding-left: var(--service-gutter) !important;
    padding-right: var(--service-gutter) !important;
  }

  body.page-node-type-service .service-cards-wrapper > h1,
  body.page-node-type-service .service-page > h1 {
    padding: 0.75rem 0.5rem !important;
    margin: 0.5rem 0 0.9rem 0 !important;
  }

  body.page-node-type-service .service-cards-wrapper .summary-box,
  body.page-node-type-service .service-cards-wrapper .card,
  body.page-node-type-service .service-cards-wrapper .main-grid,
  body.page-node-type-service .service-cards-wrapper .main-grid .card {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  /* Override per-node inline @media 640 padding that was too tight */
  body.page-node-type-service .service-cards-wrapper {
    padding-top: 0.35rem !important;
    padding-bottom: 0.35rem !important;
  }

  body.page-node-type-service .field.field-field-text-bg,
  body.page-node-type-service ._none.block.block-layout-builder.block-field-blocknodeservicefield-text-bg {
    margin-top: 0 !important;
    margin-bottom: -4rem !important;
  }
}

/* Extra-small: slightly smaller icon; keep full shared width */
@media (max-width: 575.98px) {
  body.page-node-type-service {
    --service-gutter: 0.85rem;
  }

  body.page-node-type-service .block-field-blocknodeservicefield-teaser-icon img {
    width: 84px !important;
    height: 84px !important;
    max-width: 84px !important;
    border-width: 4px !important;
  }

  body.page-node-type-service .layout__region--first > .block-field-blocknodeservicefield-teaser-icon {
    margin-top: -2rem !important;
  }

  body.page-node-type-service .service-cards-wrapper > h1,
  body.page-node-type-service .service-page > h1 {
    padding: 0.7rem 0.4rem !important;
  }
}

/* ---- First region stacking: image + text-bg share one cell; icon below ---- */
body.page-node-type-service .layout__region.layout__region--first {
  display: grid !important;
  grid-template-columns: 1fr !important;
  grid-template-rows: auto auto !important;
  grid-template-areas:
    "hero"
    "icon" !important;
  align-items: start !important;
  gap: 0 !important;
}

body.page-node-type-service .layout__region--first > .block-field-blocknodeservicefield-image {
  grid-area: hero !important;
  position: relative !important;
  z-index: 1 !important;
  margin: 0;
}

body.page-node-type-service .layout__region--first > .block-field-blocknodeservicefield-text-bg {
  grid-area: hero !important;
  position: relative !important;
  align-self: end !important;
  justify-self: start !important;
  z-index: 4 !important;
  margin: 0 0 1.1rem 0.85rem !important;
  bottom: auto !important;
  left: auto !important;
  top: auto !important;
  right: auto !important;
  transform: translateY(-0.25rem) !important;
  width: auto !important;
  max-width: calc(100% - 1.5rem) !important;
  pointer-events: none !important;
}

body.page-node-type-service .layout__region--first > .service-teaser.block-field-blocknodeservicefield-teaser-icon,
body.page-node-type-service .layout__region--first > .block-field-blocknodeservicefield-teaser-icon {
  grid-area: icon !important;
  position: relative !important;
  z-index: 6 !important;
}

@media (min-width: 992px) {
  body.page-node-type-service .layout__region--first > .service-teaser.block-field-blocknodeservicefield-teaser-icon,
  body.page-node-type-service .layout__region--first > .block-field-blocknodeservicefield-teaser-icon {
    grid-area: hero !important;
    position: absolute !important;
    right: -3.5rem !important;
    left: auto !important;
    top: 43.5% !important;
    bottom: auto !important;
    transform: translateY(-50%) !important;
    margin: 0 !important;
    width: 120px !important;
    height: 120px !important;
    display: block !important;
    justify-content: unset !important;
  }

  body.page-node-type-service .layout__region--first > .block-field-blocknodeservicefield-text-bg {
    margin: 0 0 1.25rem 1rem !important;
    transform: none !important;
  }

  body.page-node-type-service .layout__region--second .service-brag {
    height: 100% !important;
  }
}

@media (max-width: 991.98px) {
  body.page-node-type-service .layout__region--first > .service-teaser.block-field-blocknodeservicefield-teaser-icon,
  body.page-node-type-service .layout__region--first > .block-field-blocknodeservicefield-teaser-icon {
    grid-area: icon !important;
    position: relative !important;
    display: flex !important;
    justify-content: center !important;
    margin: -2.75rem 0 0.25rem 0 !important;
    transform: none !important;
    right: auto !important;
    top: 11rem !important;
    width: 100% !important;
    height: auto !important;
  }

  body.page-node-type-service .layout__region--first > .block-field-blocknodeservicefield-text-bg {
    margin: 0 0 0.85rem 0.65rem !important;
  }
}

/* ==========================================================================
   Service pages — center service-brag heading + "Want to customize a package?"
   (same treatment as team FAQ heading)
   ========================================================================== */

/* service-brag comparison card header / title / subtitle (jd + cy class aliases) */
html body.page-node-type-service .service-brag .jd-card-header,
html body.page-node-type-service .service-brag .cy-card-header,
html body.page-node-type-service .layout__region--second .service-brag .jd-card-header,
html body.page-node-type-service .layout__region--second .service-brag .cy-card-header,
html body.page-node-type-service .service-brag .jd-comparison-block .jd-card-header,
html body.page-node-type-service .service-brag .cy-comparison-block .cy-card-header {
  text-align: center !important;
  display: block !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

html body.page-node-type-service .service-brag .jd-heading,
html body.page-node-type-service .service-brag h2.jd-heading,
html body.page-node-type-service .service-brag .cy-heading,
html body.page-node-type-service .service-brag h2.cy-heading,
html body.page-node-type-service .service-brag .jd-card-header h2,
html body.page-node-type-service .service-brag .cy-card-header h2,
html body.page-node-type-service .service-brag .jd-comparison-block h2,
html body.page-node-type-service .service-brag .cy-comparison-block h2 {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
  float: none !important;
  box-sizing: border-box !important;
}

/* "Want to customize a package?" CTA block titles (all variants) */
html body.page-node-type-service #block-traditionaldetailingblock .block-title-wrap,
html body.page-node-type-service #block-rvdetailingblock .block-title-wrap,
html body.page-node-type-service #block-boatdetailingblock .block-title-wrap,
html body.page-node-type-service #block-ceramiccoatingblock .block-title-wrap,
html body.page-node-type-service #block-marineceramiccoatingblock .block-title-wrap,
html body.page-node-type-service #block-paintcorrectionblock .block-title-wrap,
html body.page-node-type-service [id$="detailingblock"] .block-title-wrap,
html body.page-node-type-service [id*="ceramiccoatingblock"] .block-title-wrap,
html body.page-node-type-service [id*="paintcorrectionblock"] .block-title-wrap {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  text-align: center !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

html body.page-node-type-service #block-traditionaldetailingblock .block-title-content,
html body.page-node-type-service #block-rvdetailingblock .block-title-content,
html body.page-node-type-service #block-boatdetailingblock .block-title-content,
html body.page-node-type-service #block-ceramiccoatingblock .block-title-content,
html body.page-node-type-service #block-marineceramiccoatingblock .block-title-content,
html body.page-node-type-service #block-paintcorrectionblock .block-title-content,
html body.page-node-type-service [id$="detailingblock"] .block-title-content,
html body.page-node-type-service [id*="ceramiccoatingblock"] .block-title-content,
html body.page-node-type-service [id*="paintcorrectionblock"] .block-title-content {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
  float: none !important;
}

html body.page-node-type-service #block-traditionaldetailingblock h2.block-title,
html body.page-node-type-service #block-rvdetailingblock h2.block-title,
html body.page-node-type-service #block-boatdetailingblock h2.block-title,
html body.page-node-type-service #block-ceramiccoatingblock h2.block-title,
html body.page-node-type-service #block-marineceramiccoatingblock h2.block-title,
html body.page-node-type-service #block-paintcorrectionblock h2.block-title,
html body.page-node-type-service [id$="detailingblock"] h2.block-title,
html body.page-node-type-service [id*="ceramiccoatingblock"] h2.block-title,
html body.page-node-type-service [id*="paintcorrectionblock"] h2.block-title {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  text-align: center !important;
  justify-content: center !important;
  align-items: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
  float: none !important;
}

/* Also center body intro text under that heading for a consistent CTA band */
html body.page-node-type-service #block-traditionaldetailingblock .block-content,
html body.page-node-type-service #block-rvdetailingblock .block-content,
html body.page-node-type-service #block-boatdetailingblock .block-content,
html body.page-node-type-service #block-ceramiccoatingblock .block-content,
html body.page-node-type-service #block-marineceramiccoatingblock .block-content,
html body.page-node-type-service #block-paintcorrectionblock .block-content,
html body.page-node-type-service [id$="detailingblock"] .block-content,
html body.page-node-type-service [id*="ceramiccoatingblock"] .block-content,
html body.page-node-type-service [id*="paintcorrectionblock"] .block-content {
  text-align: center !important;
}

html body.page-node-type-service #block-traditionaldetailingblock .block-content p,
html body.page-node-type-service #block-rvdetailingblock .block-content p,
html body.page-node-type-service #block-boatdetailingblock .block-content p,
html body.page-node-type-service #block-ceramiccoatingblock .block-content p,
html body.page-node-type-service #block-marineceramiccoatingblock .block-content p,
html body.page-node-type-service #block-paintcorrectionblock .block-content p,
html body.page-node-type-service [id$="detailingblock"] .block-content p,
html body.page-node-type-service [id*="ceramiccoatingblock"] .block-content p,
html body.page-node-type-service [id*="paintcorrectionblock"] .block-content p {
  text-align: center !important;
}

/* ==========================================================================
   Service pages — Cyberlytics-parity brag sheet polish (purple)
   Matches cyberlytics.dev /web-services/web-development service-brag look.
   Targets BOTH .jd-* (Johnny Detail live markup) and .cy-* (shared aliases).
   Palette: Deep #3b0a5c · Brand #6716aa · Mid #7b2cbf · Leaf #b781e3
            Soft #f3e8ff · Mist #f5f0fa · Border #e9d5ff · Ink #1a0a24
   Wins over theme Custom CSS black borders / font-weight 1000 hacks.
   ========================================================================== */

/* ---- comparison card shell ---- */
html body.page-node-type-service .service-brag .jd-material-card,
html body.page-node-type-service .service-brag .cy-material-card,
html body.page-node-type-service .service-brag .jd-comparison-block .jd-material-card,
html body.page-node-type-service .service-brag .cy-comparison-block .cy-material-card {
  background: #ffffff !important;
  border: 2px solid #3b0a5c !important;
  border-radius: 14px !important;
  box-shadow: 0 6px 18px -4px rgba(59, 10, 92, 0.18) !important;
  overflow: hidden !important;
  margin: 0 !important;
  max-width: 100% !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

/* Header band — purple gradient, white title */
html body.page-node-type-service .service-brag .jd-card-header,
html body.page-node-type-service .service-brag .cy-card-header,
html body.page-node-type-service .service-brag .jd-comparison-block .jd-card-header,
html body.page-node-type-service .service-brag .cy-comparison-block .cy-card-header {
  background: linear-gradient(135deg, #3b0a5c 0%, #6716aa 50%, #7b2cbf 100%) !important;
  background-color: #3b0a5c !important;
  padding: 1rem 1.1rem 0.9rem !important;
  text-align: center !important;
  border: 0 !important;
  border-bottom: 0 !important;
}

html body.page-node-type-service .service-brag .jd-heading,
html body.page-node-type-service .service-brag h2.jd-heading,
html body.page-node-type-service .service-brag .cy-heading,
html body.page-node-type-service .service-brag h2.cy-heading,
html body.page-node-type-service .service-brag .jd-card-header h2,
html body.page-node-type-service .service-brag .cy-card-header h2 {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-weight: 800 !important;
  font-size: clamp(1.15rem, 2.2vw, 1.4rem) !important;
  line-height: 1.25 !important;
  margin: 0 0 0.45rem 0 !important;
  padding: 0 !important;
  text-shadow: none !important;
  text-align: center !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* Subtitle as soft lavender chip on the purple header */
html body.page-node-type-service .service-brag .jd-subtitle,
html body.page-node-type-service .service-brag .cy-subtitle,
html body.page-node-type-service .service-brag .jd-card-header .jd-subtitle,
html body.page-node-type-service .service-brag .cy-card-header .cy-subtitle,
html body.page-node-type-service .service-brag .jd-card-header p,
html body.page-node-type-service .service-brag .cy-card-header p {
  display: inline-block !important;
  width: auto !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  padding: 0.35rem 0.85rem !important;
  background: #f3e8ff !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  border: 1px solid #e9d5ff !important;
  border-radius: 999px !important;
  font-size: 0.82rem !important;
  font-weight: 650 !important;
  line-height: 1.35 !important;
  text-align: center !important;
  box-shadow: 0 1px 4px rgba(59, 10, 92, 0.12) !important;
}

/* Table container */
html body.page-node-type-service .service-brag .jd-table-container,
html body.page-node-type-service .service-brag .cy-table-container {
  background: #f5f0fa !important;
  overflow-x: auto !important;
  -webkit-overflow-scrolling: touch !important;
  width: 100% !important;
  max-width: 100% !important;
}

/* Table shell — soft purple borders (kill custom_css black 2px borders) */
html body.page-node-type-service .service-brag .jd-comparison-table,
html body.page-node-type-service .service-brag .cy-comparison-table,
html body.page-node-type-service .service-brag table.jd-comparison-table,
html body.page-node-type-service .service-brag table.cy-comparison-table {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  border-collapse: collapse !important;
  border-top: 2px solid #3b0a5c !important;
  border-left: 0 !important;
  border-right: 0 !important;
  border-bottom: 0 !important;
  table-layout: fixed !important;
  font-size: 0.82rem !important;
  background: #ffffff !important;
}

/* Table headers — soft lavender band, brand ink */
html body.page-node-type-service .service-brag .jd-comparison-table thead th,
html body.page-node-type-service .service-brag .cy-comparison-table thead th,
html body.page-node-type-service .service-brag table thead th {
  background: #f3e8ff !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  border: 0 !important;
  border-bottom: 2px solid #3b0a5c !important;
  border-right: 1px solid #e9d5ff !important;
  font-weight: 750 !important;
  font-size: 0.7rem !important;
  letter-spacing: 0.02em !important;
  text-transform: uppercase !important;
  padding: 1.35rem 6px 10px 6px !important;
  text-align: center !important;
  white-space: normal !important;
  vertical-align: middle !important;
}

html body.page-node-type-service .service-brag .jd-comparison-table thead th:last-child,
html body.page-node-type-service .service-brag .cy-comparison-table thead th:last-child {
  border-right: 0 !important;
}

html body.page-node-type-service .service-brag .jd-comparison-table thead th:first-child,
html body.page-node-type-service .service-brag .cy-comparison-table thead th:first-child {
  text-align: left !important;
  padding-left: 12px !important;
  background: #f3e8ff !important;
}

html body.page-node-type-service .service-brag .jd-comparison-table thead th p,
html body.page-node-type-service .service-brag .cy-comparison-table thead th p,
html body.page-node-type-service .service-brag table thead th p {
  color: inherit !important;
  -webkit-text-fill-color: inherit !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  font-weight: inherit !important;
  font-size: inherit !important;
  text-transform: inherit !important;
}

/* Johnny Detail recommended column header — solid brand purple */
html body.page-node-type-service .service-brag .jd-comparison-table thead th.jd-johnny-col,
html body.page-node-type-service .service-brag .cy-comparison-table thead th.cy-cyberlytics-col,
html body.page-node-type-service .service-brag table thead th.jd-johnny-col {
  background: linear-gradient(180deg, #7b2cbf 0%, #3b0a5c 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border: 1px solid #3b0a5c !important;
  border-bottom: 2px solid #3b0a5c !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08) !important;
  position: relative !important;
  padding-top: 1.45rem !important;
}

html body.page-node-type-service .service-brag .jd-comparison-table thead th.jd-johnny-col p,
html body.page-node-type-service .service-brag .cy-comparison-table thead th.cy-cyberlytics-col p,
html body.page-node-type-service .service-brag table thead th.jd-johnny-col p {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

/* ★ RECOMMENDED label — desktop full word; mobile short ★ REC. (Cyberlytics parity) */
html body.page-node-type-service .service-brag .jd-comparison-table thead th.jd-johnny-col::after,
html body.page-node-type-service .service-brag .cy-comparison-table thead th.cy-cyberlytics-col::after,
html body.page-node-type-service #content-wide .service-brag .jd-comparison-table thead th.jd-johnny-col::after {
  content: "★ RECOMMENDED" !important;
  position: absolute !important;
  top: 4px !important;
  left: 50% !important;
  right: auto !important;
  transform: translateX(-50%) !important;
  width: max-content !important;
  max-width: 96% !important;
  font-size: 0.55rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.06em !important;
  opacity: 0.95 !important;
  color: #f3e8ff !important;
  -webkit-text-fill-color: #f3e8ff !important;
  white-space: nowrap !important;
  pointer-events: none !important;
}

/* Mobile / tablet: short label like cyberlytics.dev (★ REC.) */
@media (max-width: 991.98px) {
  html body.page-node-type-service .service-brag .jd-comparison-table thead th.jd-johnny-col::after,
  html body.page-node-type-service .service-brag .cy-comparison-table thead th.cy-cyberlytics-col::after,
  html body.page-node-type-service #content-wide .service-brag .jd-comparison-table thead th.jd-johnny-col::after {
    content: "★ REC." !important;
    font-size: 0.5rem !important;
    letter-spacing: 0.02em !important;
    white-space: nowrap !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    max-width: 100% !important;
  }
}

/* Desktop: keep full RECOMMENDED (explicit so embedded block CSS cannot shrink it) */
@media (min-width: 992px) {
  html body.page-node-type-service .service-brag .jd-comparison-table thead th.jd-johnny-col::after,
  html body.page-node-type-service .service-brag .cy-comparison-table thead th.cy-cyberlytics-col::after,
  html body.page-node-type-service #content-wide .service-brag .jd-comparison-table thead th.jd-johnny-col::after {
    content: "★ RECOMMENDED" !important;
    white-space: nowrap !important;
    font-size: 0.55rem !important;
  }
}

/* Feature labels as soft lavender pills */
html body.page-node-type-service .service-brag .jd-comparison-table tbody td:first-child,
html body.page-node-type-service .service-brag .cy-comparison-table tbody td:first-child,
html body.page-node-type-service .service-brag .jd-comparison-table tbody td.jd-feature,
html body.page-node-type-service .service-brag .cy-comparison-table tbody td.cy-feature {
  background: #f5f0fa !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  font-weight: 700 !important;
  text-align: left !important;
  padding: 10px 8px 10px 12px !important;
  border-bottom: 1px solid #e9d5ff !important;
  border-left: 0 !important;
  border-top: 0 !important;
  position: sticky !important;
  left: 0 !important;
  z-index: 3 !important;
  box-shadow: 2px 0 5px -3px rgba(59, 10, 92, 0.12) !important;
}

html body.page-node-type-service .service-brag .jd-comparison-table tbody td:first-child p,
html body.page-node-type-service .service-brag .cy-comparison-table tbody td:first-child p,
html body.page-node-type-service .service-brag .jd-feature p,
html body.page-node-type-service .service-brag .cy-feature p {
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  background: #f3e8ff !important;
  border: 1px solid #e9d5ff !important;
  border-radius: 10px !important;
  padding: 0.45rem 0.55rem !important;
  margin: 0 !important;
  display: inline-block !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  line-height: 1.3 !important;
  font-weight: 700 !important;
}

/* Johnny Detail column body cells — soft purple wash */
html body.page-node-type-service .service-brag .jd-comparison-table tbody td.jd-johnny-col,
html body.page-node-type-service .service-brag .cy-comparison-table tbody td.cy-cyberlytics-col,
html body.page-node-type-service .service-brag .jd-comparison-table .jd-johnny-col,
html body.page-node-type-service .service-brag .cy-comparison-table .cy-cyberlytics-col {
  background-color: #f3e8ff !important;
  background: #f3e8ff !important;
}

/* Body cells / borders — soft purple, NOT heavy black */
html body.page-node-type-service .service-brag .jd-comparison-table tbody td,
html body.page-node-type-service .service-brag .cy-comparison-table tbody td,
html body.page-node-type-service .service-brag table tbody td {
  border: 0 !important;
  border-bottom: 1px solid #e9d5ff !important;
  border-right: 1px solid #e9d5ff !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  background-color: #ffffff !important;
  padding: 10px 6px !important;
  text-align: center !important;
  vertical-align: middle !important;
  font-weight: 600 !important;
}

html body.page-node-type-service .service-brag .jd-comparison-table tbody td:last-child,
html body.page-node-type-service .service-brag .cy-comparison-table tbody td:last-child {
  border-right: 0 !important;
}

html body.page-node-type-service .service-brag .jd-comparison-table tbody tr:nth-child(even) td:not(.jd-johnny-col):not(.cy-cyberlytics-col):not(:first-child),
html body.page-node-type-service .service-brag .cy-comparison-table tbody tr:nth-child(even) td:not(.jd-johnny-col):not(.cy-cyberlytics-col):not(:first-child) {
  background-color: #f5f0fa !important;
}

/* Hover */
html body.page-node-type-service .service-brag .jd-comparison-table tbody tr:hover td,
html body.page-node-type-service .service-brag .cy-comparison-table tbody tr:hover td {
  background-color: #f3e8ff !important;
}
html body.page-node-type-service .service-brag .jd-comparison-table tbody tr:hover .jd-johnny-col,
html body.page-node-type-service .service-brag .cy-comparison-table tbody tr:hover .cy-cyberlytics-col {
  background-color: #e9d5ff !important;
}

/* Checkmarks — brand purple */
html body.page-node-type-service .service-brag .jd-icon-wrapper,
html body.page-node-type-service .service-brag .cy-icon-wrapper {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  width: 22px !important;
  height: 22px !important;
  margin: 0 auto !important;
}

html body.page-node-type-service .service-brag .jd-comparison-table .jd-icon-wrapper svg path,
html body.page-node-type-service .service-brag .cy-comparison-table .cy-icon-wrapper svg path,
html body.page-node-type-service .service-brag .jd-comparison-table svg path[fill],
html body.page-node-type-service .service-brag .jd-comparison-table svg [fill="#7c3aed"],
html body.page-node-type-service .service-brag .jd-comparison-table svg [fill="#6716aa"],
html body.page-node-type-service .service-brag .jd-comparison-table svg [fill="#138450"],
html body.page-node-type-service .service-brag .jd-comparison-table svg [fill="#0e6c3e"] {
  fill: #6716aa !important;
}

/* Keep red X icons red */
html body.page-node-type-service .service-brag .jd-comparison-table svg [fill="#ef4444"],
html body.page-node-type-service .service-brag .cy-comparison-table svg [fill="#ef4444"] {
  fill: #ef4444 !important;
}

/* Badges — readable, black border, pill-ish (Cyber parity) */
html body.page-node-type-service .service-brag .jd-badge,
html body.page-node-type-service .service-brag .cy-badge {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  min-width: 3.25rem !important;
  max-width: 100% !important;
  padding: 7px 10px !important;
  border-radius: 9999px !important;
  font-size: 0.65rem !important;
  font-weight: 750 !important;
  border: 2px solid #000 !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08) !important;
  line-height: 1.15 !important;
  white-space: nowrap !important;
}

html body.page-node-type-service .service-brag .jd-badge-amber,
html body.page-node-type-service .service-brag .cy-badge-amber {
  background: #fef3c7 !important;
  background-color: #fef3c7 !important;
  color: #92400e !important;
  -webkit-text-fill-color: #92400e !important;
}

html body.page-node-type-service .service-brag .jd-badge-red,
html body.page-node-type-service .service-brag .cy-badge-red {
  background: #fee2e2 !important;
  background-color: #fee2e2 !important;
  color: #991b1b !important;
  -webkit-text-fill-color: #991b1b !important;
}

/* Footer trust strip */
html body.page-node-type-service .service-brag .jd-card-footer,
html body.page-node-type-service .service-brag .cy-card-footer {
  background: linear-gradient(180deg, #f3e8ff 0%, #f5f0fa 100%) !important;
  border-top: 1px solid #e9d5ff !important;
  padding: 0.7rem 1rem !important;
  margin: 0 !important;
}

html body.page-node-type-service .service-brag .jd-trust-note,
html body.page-node-type-service .service-brag .cy-trust-note,
html body.page-node-type-service .service-brag .jd-card-footer span,
html body.page-node-type-service .service-brag .jd-card-footer p {
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  font-weight: 600 !important;
  font-size: 0.72rem !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  margin: 0 !important;
  text-align: center !important;
}

html body.page-node-type-service .service-brag .jd-trust-note svg,
html body.page-node-type-service .service-brag .cy-trust-note svg,
html body.page-node-type-service .service-brag .jd-card-footer svg {
  flex: 0 0 auto !important;
  fill: #7b2cbf !important;
}

html body.page-node-type-service .service-brag .jd-trust-note svg path,
html body.page-node-type-service .service-brag .jd-card-footer svg path {
  fill: #7b2cbf !important;
}

/* Undo heavy black-border overrides from Custom CSS on the brag table */
html body.page-node-type-service .service-brag .jd-comparison-table thead th,
html body.page-node-type-service .service-brag .jd-comparison-table tr td,
html body.page-node-type-service .service-brag .jd-comparison-table tbody td {
  /* restate after less-specific black-border rules */
  box-shadow: none !important;
}

/* Column width balance for 4-col comparison (mobile-friendly shrink) */
html body.page-node-type-service .service-brag .jd-comparison-table th:nth-child(1),
html body.page-node-type-service .service-brag .jd-comparison-table td:nth-child(1),
html body.page-node-type-service .service-brag .cy-comparison-table th:nth-child(1),
html body.page-node-type-service .service-brag .cy-comparison-table td:nth-child(1) { width: 36% !important; }
html body.page-node-type-service .service-brag .jd-comparison-table th:nth-child(2),
html body.page-node-type-service .service-brag .jd-comparison-table td:nth-child(2),
html body.page-node-type-service .service-brag .cy-comparison-table th:nth-child(2),
html body.page-node-type-service .service-brag .cy-comparison-table td:nth-child(2) { width: 22% !important; }
html body.page-node-type-service .service-brag .jd-comparison-table th:nth-child(3),
html body.page-node-type-service .service-brag .jd-comparison-table td:nth-child(3),
html body.page-node-type-service .service-brag .cy-comparison-table th:nth-child(3),
html body.page-node-type-service .service-brag .cy-comparison-table td:nth-child(3) { width: 21% !important; }
html body.page-node-type-service .service-brag .jd-comparison-table th:nth-child(4),
html body.page-node-type-service .service-brag .jd-comparison-table td:nth-child(4),
html body.page-node-type-service .service-brag .cy-comparison-table th:nth-child(4),
html body.page-node-type-service .service-brag .cy-comparison-table td:nth-child(4) { width: 21% !important; }

/* Mobile / tablet polish */
@media (max-width: 991.98px) {
  html body.page-node-type-service .service-brag .jd-table-container,
  html body.page-node-type-service .service-brag .cy-table-container {
    overflow-x: auto !important;
  }
  html body.page-node-type-service .service-brag .jd-comparison-table,
  html body.page-node-type-service .service-brag .cy-comparison-table {
    min-width: 380px !important;
    font-size: 0.76rem !important;
  }
  html body.page-node-type-service .service-brag .jd-card-header,
  html body.page-node-type-service .service-brag .cy-card-header {
    padding: 0.9rem 0.85rem 0.8rem !important;
  }
  html body.page-node-type-service .service-brag .jd-heading,
  html body.page-node-type-service .service-brag .cy-heading {
    font-size: 1.15rem !important;
  }
  html body.page-node-type-service .service-brag .jd-badge,
  html body.page-node-type-service .service-brag .cy-badge {
    padding: 6px 8px !important;
    font-size: 0.6rem !important;
  }
}

@media (max-width: 575.98px) {
  html body.page-node-type-service .service-brag .jd-material-card,
  html body.page-node-type-service .service-brag .cy-material-card {
    border-radius: 10px !important;
  }
  html body.page-node-type-service .service-brag .jd-comparison-table,
  html body.page-node-type-service .service-brag .cy-comparison-table {
    min-width: 360px !important;
  }
  html body.page-node-type-service .service-brag .jd-comparison-table thead th,
  html body.page-node-type-service .service-brag .cy-comparison-table thead th,
  html body.page-node-type-service .service-brag .jd-comparison-table tbody td,
  html body.page-node-type-service .service-brag .cy-comparison-table tbody td {
    padding: 8px 4px !important;
  }
  html body.page-node-type-service .service-brag .jd-comparison-table tbody td:first-child,
  html body.page-node-type-service .service-brag .cy-comparison-table tbody td:first-child {
    padding-left: 8px !important;
  }
}

/* ========== 03-main-menu-mobile.css (purple recolor) ========== */
/* ==========================================================================
   EXTRACT 03 — Mobile hamburger + main menu readability (Johnny Detail, purple)
   Marker: jd-header-service-menu-v1 / 03-main-menu-mobile
   ========================================================================== */

/* --- chrome-visibility-fix.css: force menu visible + solid bar --- */
/**
 * chrome-visibility-fix.css
 * Force header / main menu / footer visible on mobile + desktop.
 * Fixes bad custom_css overrides after D11 upgrade (transparent menu bar,
 * white-on-white links, broken Bootstrap .collapse overrides).
 */

/* ---- Header shell always visible ---- */
header.header,
.header,
.header-top,
.header-wrap,
.header-menu,
.header-center,
.navbar.header-center,
.layout-wrap > header {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  max-height: none !important;
  overflow: visible !important;
}

/* Branding / logo row */
.header-wrap .navbar.header-center,
.navbar-brand,
.region-branding,
.site-branding,
.brand.logo {
  display: block !important;
  visibility: visible !important;
}

.header-main-wrap {
  display: flex !important;
  align-items: center !important;
  visibility: visible !important;
}

/* Desktop header info + right (override max-width:768 hide) */
@media (min-width: 768px) {
  .header-main,
  .header-right {
    display: block !important;
    visibility: visible !important;
  }
  .header-right-wrap {
    display: flex !important;
    visibility: visible !important;
  }
  .nav-button.navbar-toggler {
    display: none !important;
  }
}

/* Mobile: keep toggler; still show branding */
@media (max-width: 767.98px) {
  /* Keep city header info (phone/hours) visible on mobile */
  .header-main,
  .header-item.header-main {
    display: block !important;
    visibility: visible !important;
    width: 100% !important;
  }
  .navbar-toggler.nav-button {
    display: inline-block !important;
    visibility: visible !important;
    z-index: 1001 !important;
  }
}

/* ---- Main navigation bar ---- */
.header-menu,
.header-menu .nav-menu,
.navbar.nav-menu,
#main-menu,
#main-menu.navbar-collapse,
.primary-menu,
.region-main-menu,
.main-menu-wrap,
.mega-menu {
  visibility: visible !important;
  opacity: 1 !important;
  max-height: none !important;
}

/* Undo transparent menu bar override — solid darker brand purple (readable white links) */
.header-menu .nav-menu,
.navbar.nav-menu,
.primary-menu,
#main-menu.primary-menu {
  background-color: #3b0a5c !important;
  background: #3b0a5c !important;
}

/* Force collapse open on md+ (Bootstrap expand) */
@media (min-width: 768px) {
  #main-menu.navbar-collapse,
  .navbar-expand-md .navbar-collapse,
  .navbar-expand-md #main-menu {
    display: flex !important;
    flex-basis: auto !important;
    height: auto !important;
  }
}

/* Mobile: closed until .show; open when toggled */
@media (max-width: 767.98px) {
  #main-menu.navbar-collapse.collapse:not(.show) {
    display: none !important;
  }
  #main-menu.navbar-collapse.collapse.show,
  #main-menu.navbar-collapse.show {
    display: block !important;
    background-color: #3b0a5c !important;
    background: #3b0a5c !important;
    padding: 0.5rem 0 !important;
    color: #ffffff !important;
  }
  #main-menu.navbar-collapse.show .menu-item,
  #main-menu.show .menu-item {
    background: transparent !important;
    background-color: transparent !important;
  }
  #main-menu.navbar-collapse.show a,
  #main-menu.show a {
    color: #ffffff !important;
  }
  /* Hamburger icon button — dark green, no jump */
  .navbar-toggler.nav-button,
  button.navbar-toggler.nav-button {
    background: #3b0a5c !important;
    background-color: #3b0a5c !important;
    border: 2px solid #000 !important;
    transform: none !important;
  }
  .navbar-toggler.nav-button i,
  .navbar-toggler.nav-button [class*="ti-"] {
    color: #ffffff !important;
  }
  button.navbar-toggler.nav-button[aria-expanded="true"],
  button.navbar-toggler.nav-button[aria-expanded="false"] {
    transform: none !important;
  }
}

/* Do NOT repurpose Bootstrap .collapse globally — only menu-scoped color */
.header-menu .collapse,
.primary-menu.collapse,
#main-menu {
  color: #ffffff !important;
}

/* Menu links: readable white on green */
.header-menu a,
.primary-menu a,
#main-menu a,
.mega-menu > ul > li > a,
.main-menu .menu-item a,
.region-main-menu .menu a {
  color: #ffffff !important;
  opacity: 1 !important;
  visibility: visible !important;
  display: block !important;
}

.header-menu .menu-item,
.primary-menu .menu-item,
#main-menu .menu-item {
  display: list-item !important;
  visibility: visible !important;
}

.mega-menu > ul {
  display: flex !important;
  flex-wrap: wrap !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0.35rem 0.75rem !important;
  width: 100% !important;
  max-width: 100% !important;
}

@media (max-width: 767.98px) {
  .mega-menu > ul {
    display: block !important;
  }
  .mega-menu > ul > li > a {
    color: #ffffff !important;
    padding: 0.65rem 1rem !important;
  }
}

/* Prevent 120% width overflow clipping menus */
.container-wrap.clearfix.mega-menu.main-menu-wrap,
.container-wrap.clearfix.menu-wrap {
  max-width: 100% !important;
  width: 100% !important;
}

/* layout-wrap must not clip sticky/header/footer */
.layout-wrap {
  overflow: visible !important;
}

/* ---- Footer ---- */
footer.footer,
#footer,
.footer,
.footer-bottom,
.region-footer-bottom-first,
.jd-site-footer,
.jd-footer__grid {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  max-height: none !important;
}

footer.footer,
#footer.footer {
  background-color: #19212c !important;
  color: #ffffff !important;
}

.footer .text-light,
.footer.text-light,
.footer.text-light *,
.jd-site-footer,
.jd-site-footer *,
.jd-footer__grid,
.jd-footer__grid *,
.footer-bottom,
.footer-bottom * {
  color: #ffffff !important;
}

.footer a,
.jd-site-footer a,
.footer-bottom a {
  color: #f3e8ff !important;
  text-decoration: underline;
}

/* Header top promo + login visible */
.header-top.dark-header-top {
  display: block !important;
  visibility: visible !important;
  background-color: #6716aa !important;
  color: #fff !important;
}
.header-top.dark-header-top * {
  color: #fff;
}

/* ==========================================================================
   Header Info blocks (city phone + hours) — always visible
   ========================================================================== */

/* Never hide the header info row (overrides media.css mobile hide) */
.header-item.header-main,
.header-main,
.region-header,
.header-main-wrap {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  max-height: none !important;
  overflow: visible !important;
}

/* Desktop: header-main can flex; mobile forces 100% width in chrome-layout-fix */
@media (min-width: 768px) {
  .header-main-wrap {
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    width: auto !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
  }
}
@media (max-width: 767.98px) {
  .header-main-wrap,
  .header-item.header-main,
  .header-main,
  .region-header {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
    min-width: 0 !important;
  }
}

/* Keep header-right (Call to Order / CONTACT US) visible on desktop + mobile */
.header-item.header-right,
.header-right,
.header-right-wrap {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

/* CONTACT US block: always centered (label + phone stack) — beat custom_css pills */
#block-call-to-order,
#block-call-to-order .container-wrap,
#block-call-to-order .block-content,
#block-call-to-order .field-item,
#block-call-to-order *,
#block-call-to-order p,
#block-call-to-order strong,
#block-call-to-order a {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
#block-call-to-order,
#block-call-to-order .container-wrap,
#block-call-to-order .block-content,
#block-call-to-order .field-item {
  text-align: center !important;
}
#block-call-to-order .field-item {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.15rem !important;
  margin: 0 auto !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  padding: 0 !important;
}
#block-call-to-order p,
#block-call-to-order p.call-phone {
  margin: 0 !important;
  padding: 0 !important;
  text-align: center !important;
  width: 100% !important;
  color: #ffffff !important;
}
#block-call-to-order strong.text-sm,
#block-call-to-order .text-sm {
  display: block !important;
  width: 100% !important;
  text-align: center !important;
  margin: 0 !important;
  padding: 0 !important;
  font-size: 0.72rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.06em !important;
  line-height: 1.2 !important;
  color: #ffffff !important;
  text-transform: uppercase !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.45) !important;
}
#block-call-to-order a.call-phone-link,
#block-call-to-order .call-phone a {
  display: block !important;
  text-align: center !important;
  margin: 0 auto !important;
  width: auto !important;
  font-size: 1.15rem !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  color: #ffffff !important;
  text-decoration: none !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.45) !important;
}

.header-item.header-right {
  text-align: center !important;
}

@media (min-width: 768px) {
  .header-right-wrap {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
  }
  .header-item.header-right {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }
  /* Header info: horizontal, items centered as a group */
  .header-info .header-info-container {
    justify-content: center !important;
    align-items: center !important;
  }
}

/* Header info layout */
.header-info,
.header-info .header-info-container {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: center !important;
  visibility: visible !important;
  opacity: 1 !important;
  max-width: 100% !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  gap: 0.35rem 1.25rem;
}

.header-info .header-info-item {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  visibility: visible !important;
  margin-left: 0 !important;
  max-width: 100%;
}

.header-info .header-info-item i {
  display: inline-block !important;
  font-size: 22px !important;
  margin-right: 10px !important;
  color: #fff !important;
  flex: 0 0 auto;
}

.header-info .header-info-desc {
  display: block !important;
  line-height: 1.25 !important;
  text-align: left !important;
}

.header-info .header-info-desc span,
.header-info .header-info-desc strong,
.header-info .header-info-desc a {
  display: block !important;
  color: #ffffff !important;
  opacity: 1 !important;
  visibility: visible !important;
  text-shadow: 0 1px 2px rgba(0,0,0,0.45) !important;
}

.header-info .header-info-desc a.header-info-phone {
  text-decoration: none !important;
  font-weight: 700 !important;
  font-size: 1.05rem !important;
}

.header-info .header-info-desc a.header-info-phone:hover {
  text-decoration: underline !important;
}

/* Ensure purple header bar has room for info (bar full-bleed; content rail separate) */
.navbar.header-center {
  overflow: visible !important;
}
.navbar.header-center > .container {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  /* Desktop max-width/padding set in min-width:992 rules + late rail safety */
  box-sizing: border-box !important;
}

/* Mobile: brand left 1rem; city info (left) + hours (right) above Contact Us phone */
@media (max-width: 767.98px) {
  .navbar.header-center > .container {
    justify-content: flex-start !important;
    align-items: center !important;
    position: relative !important;
    padding: 0.5rem 1rem !important;
    box-sizing: border-box !important;
  }

  .header-side.navbar-brand {
    width: auto !important;
    max-width: calc(100% - 5.75rem) !important;
    flex: 1 1 auto !important;
    order: 1 !important;
    text-align: left !important;
    justify-content: flex-start !important;
    margin: 0 !important;
    padding: 0 5.5rem 0 0 !important;
  }
  #block-martis-branding .container-wrap,
  .site-branding .container-wrap,
  .site-branding {
    justify-content: flex-start !important;
    text-align: left !important;
  }

  /* City/service + hours row ABOVE Contact Us */
  .header-item.header-main,
  .header-main,
  .header-main-wrap {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
    order: 2 !important;
    margin: 0.15rem 0 0 !important;
    padding: 0.25rem 0 !important;
    text-align: left !important;
  }

  /* Contact Us / phone under info row */
  .header-right-wrap {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
    order: 3 !important;
    margin: 0.15rem 0 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
    position: static !important;
  }
  .header-item.header-right,
  .header-right {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    text-align: center !important;
    margin: 0 auto !important;
  }
  .header-element {
    position: absolute !important;
    top: 0.5rem !important;
    right: 1rem !important;
    z-index: 30 !important;
  }
  #block-call-to-order {
    width: 100% !important;
    margin: 0 auto !important;
  }
  #block-call-to-order strong.text-sm,
  #block-call-to-order .text-sm {
    font-size: 0.7rem !important;
  }
  #block-call-to-order a.call-phone-link {
    font-size: 1.15rem !important;
  }

  /* Hide Call Us column; phone lives under this row */
  .header-info .header-info-item--phone {
    display: none !important;
  }

  .header-info {
    width: 100% !important;
    margin: 0 !important;
  }
  .header-info .header-info-container {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    justify-content: space-between !important;
    align-items: flex-start !important;
    gap: 0.5rem 0.75rem !important;
    width: 100% !important;
  }
  .header-info .header-info-item {
    margin: 0 !important;
  }
  .header-info .header-info-item--location {
    flex: 1 1 auto !important;
    max-width: 58% !important;
    justify-content: flex-start !important;
  }
  .header-info .header-info-item--hours {
    flex: 0 1 auto !important;
    max-width: 42% !important;
    justify-content: flex-end !important;
  }
  .header-info .header-info-item--location .header-info-desc {
    text-align: left !important;
  }
  .header-info .header-info-item--hours .header-info-desc {
    text-align: right !important;
  }
  .header-info .header-info-desc {
    font-size: 0.72rem !important;
    line-height: 1.3 !important;
  }
  .header-info .header-info-desc span,
  .header-info .header-info-desc strong {
    display: block !important;
  }
}

/* Override prior chrome-fix mobile hide of header-main */
@media (max-width: 767.98px) {
  .header-main,
  .header-item.header-main {
    display: block !important;
  }
}

/* --- chrome-layout-fix.css: hamburger + menu panel --- */
/* ==========================================================================
   Mobile hamburger + menu readability + carousel center (late override)
   Wins over theme custom_css cascade.
   ========================================================================== */
@media (max-width: 767.98px) {
  /* Hamburger 3-line button: dark green, white icon, no jump/rotate */
  .header .header-element .navbar-toggler.nav-button,
  button.navbar-toggler.nav-button,
  .navbar-toggler.nav-button.collapsed,
  .navbar-toggler.nav-button[aria-expanded="true"],
  .navbar-toggler.nav-button[aria-expanded="false"] {
    background: #3b0a5c !important;
    background-color: #3b0a5c !important;
    border: 2px solid #000 !important;
    color: #ffffff !important;
    transform: none !important;
    -webkit-transform: none !important;
    top: auto !important;
    margin-top: 0 !important;
  }
  .navbar-toggler.nav-button i,
  .navbar-toggler.nav-button .ti-menu,
  .navbar-toggler.nav-button [class*="ti-"],
  .header .header-element .navbar-toggler.nav-button i {
    color: #ffffff !important;
  }

  /*
   * Open main menu — match JD structure:
   * dark panel + light pill links (JD purple/#b781e3 → CY dark green/#b781e3)
   * active-trail = lighter green; links centered on mobile.
   */
  #main-menu.collapse.show,
  #main-menu.show,
  .header #main-menu.collapse.show,
  .header #main-menu.show,
  #main-menu.navbar-collapse.collapse.show {
    display: block !important;
    background: #3b0a5c !important;
    background-color: #3b0a5c !important;
    color: #ffffff !important;
    padding: 0.5rem 0.75rem 0.75rem !important;
  }
  #main-menu.show .primary-menu,
  #main-menu.show .mega-menu,
  #main-menu.show .mega-menu > ul,
  #main-menu.show ul.menu.menu-parent,
  #main-menu.show .nav.menu.menu-parent,
  #block-martis-main-menu ul.nav.menu.menu-parent {
    background: transparent !important;
    background-color: transparent !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  #main-menu.show .menu-item,
  #main-menu.collapse.show .menu-item,
  #main-menu.show li.menu-item,
  #main-menu .menu-item,
  #block-martis-main-menu .menu-item {
    background: transparent !important;
    background-color: transparent !important;
    border-bottom: 0 !important;
    list-style: none !important;
    margin: 0 0 0.4rem !important;
    padding: 0 !important;
    width: 100% !important;
  }
  /* Light-green link pills (JD light-purple equivalent) */
  #wrapper #main-menu.show a,
  #wrapper .header #main-menu.show .mega-menu > ul > li > a,
  #wrapper .header #main-menu.show .main-menu .nav > li > a,
  #wrapper .header #main-menu.show a,
  #main-menu.show .mega-menu > ul > li > a,
  #main-menu.show .main-menu .nav > li > a,
  #main-menu.show a,
  #main-menu.show .menu-item a,
  #block-martis-main-menu .menu-item a {
    color: #ffffff !important;
    background-color: #b781e3 !important;
    background: #b781e3 !important;
    border-radius: 10px !important;
    border: 2px solid #000 !important;
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    padding: 0.65rem 1rem !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    opacity: 1 !important;
    visibility: visible !important;
    text-decoration: none !important;
    font-weight: 600 !important;
  }
  /* Active trail / current page — lighter green (JD lighter purple) */
  #main-menu.show .menu-item--active-trail > a,
  #main-menu.show li.menu-item--active-trail > a,
  #main-menu.show .menu-item--active-trail a.is-active,
  #main-menu.show a.is-active,
  #block-martis-main-menu .menu-item--active-trail > a,
  #block-martis-main-menu a.is-active {
    background-color: #c9a0e8 !important;
    background: #c9a0e8 !important;
    color: white !important;
    -webkit-text-fill-color: white !important;
    border-color: #000 !important;
  }
  #main-menu.show a:hover,
  #main-menu.show a:focus,
  #block-martis-main-menu .menu-item a:hover,
  #block-martis-main-menu .menu-item a:focus {
    background-color: #c9a0e8 !important;
    background: #c9a0e8 !important;
    color: #ffffff !important;
    text-decoration: none !important;
  }

  /* Carousel overlay: true center in hero (X + Y) — match reference layout site */
  .slide-carousel .slide-content-wrap,
  .slide-carousel .slide-carousel-hero .slide-content-wrap,
  .slide-carousel .container.slide-wrap,
  .slide-carousel .slide-carousel-hero .container.slide-wrap {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
  }
  .slide-carousel .slide-content,
  .slide-carousel .slide-carousel-hero .slide-content {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;
    text-align: center !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }
  .slide-carousel .slide-content-main,
  .slide-carousel .slide-carousel-hero .slide-content-main,
  .slide-carousel .slide-content-main.float-center,
  .slide-carousel .slide-content-main.float-center.text-left,
  .slide-carousel .slide-content-main.text-left {
    margin-top: auto !important;
    margin-bottom: auto !important;
    margin-left: auto !important;
    margin-right: auto !important;
    height: auto !important;
    max-height: none !important;
    flex: 0 0 auto !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    overflow: visible !important;
  }
  .slide-carousel .slide-content-wrap .field-items,
  .slide-carousel .slide-content-wrap .field-item,
  .slide-carousel .heading-text .field-item,
  .slide-carousel .pre-heading-text .field-item {
    text-align: center !important;
  }
}


/* ==========================================================================
   2026-07-25 playbook polish (late — beats theme custom_css)
   Purple brand chrome only: #3b0a5c / #2d0847
   ========================================================================== */

/* --- Kill Bootstrap SVG hamburger ::before (custom_css may re-add) --- */
button.navbar-toggler.nav-button::before,
button.navbar-toggler.nav-button::after,
.navbar-toggler.nav-button::before,
.navbar-toggler.nav-button::after,
.header .header-element .navbar-toggler.nav-button::before,
.header .header-element .navbar-toggler.nav-button::after {
  content: none !important;
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  background: none !important;
  border: 0 !important;
}

/* Smaller centered Themify hamburger glyph only */
@media (max-width: 767.98px) {
  .header .header-element .navbar-toggler.nav-button i.ti-menu,
  .header .header-element .navbar-toggler.nav-button .ti-menu,
  button.navbar-toggler.nav-button i.ti-menu {
    font-size: 1.05rem !important;
    line-height: 1 !important;
  }
  .header .header-element .navbar-toggler.nav-button i.ti-menu::before,
  button.navbar-toggler.nav-button i.ti-menu::before {
    content: "\e68e" !important;
    display: block !important;
    font-size: inherit !important;
  }
}

/* --- Log in caret: inside pill border (static, not absolute) --- */
.header-top a.account-icon,
.header-top a.dropdown-toggle.header-icon.account-icon,
.header-top.dark-header-top a.account-icon,
.path-frontpage .header-top a.account-icon,
body .header-top a.dropdown-toggle.header-icon.account-icon {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.3rem !important;
  position: relative !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
  padding: 0.12rem 0.55rem !important;
  vertical-align: middle !important;
  white-space: nowrap !important;
}
.header-top a.account-icon::after,
.header-top a.dropdown-toggle.header-icon.account-icon::after,
.header-top.dark-header-top a.account-icon::after,
body .header-top a.dropdown-toggle.header-icon.account-icon::after {
  position: static !important;
  display: inline-block !important;
  margin: -4px 0 0 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  top: auto !important;
  right: auto !important;
  left: auto !important;
  bottom: auto !important;
  transform: rotate(45deg) !important;
  -webkit-transform: rotate(45deg) !important;
  width: 0.38rem !important;
  height: 0.38rem !important;
  border-style: solid !important;
  border-width: 0 1.5px 1.5px 0 !important;
  border-color: currentColor !important;
  vertical-align: middle !important;
  content: "" !important;
  flex: 0 0 auto !important;
}

/* Clearance sales centered on mobile */
@media (max-width: 767.98px) {
  .header-top #block-clearance-sales,
  .header-top div#block-clearance-sales,
  .header-top #block-clearance-sales .field-item,
  .header-top #block-clearance-sales p,
  .header-top .header-top-first {
    text-align: center !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }
}

/* Always kill clearance left-shift from custom_css (mobile + desktop) */
.header-top #block-clearance-sales p,
.header-top.dark-header-top #block-clearance-sales p,
header.header #block-clearance-sales p,
div#block-clearance-sales p {
  margin-left: 0 !important;
  margin-right: 0 !important;
  margin-top: 1rem !important;
  text-align: center !important;
}
header.header div#block-clearance-sales,
.header-top div#block-clearance-sales {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
}


/* --- martis-custom.css: mobile main-menu --- */
@media (max-width: 767.98px) {
    .header-menu {
        margin-left: 0;
        margin-right: 0;
    }
    .mega-menu > ul > li {
        width: 100%;
        display: block;
        margin-top: unset;
        margin-bottom: unset;
    }
    .navbar.navbar-expand-md.nav-menu {
        margin-right: 0;
        max-width: 100%;
    }
    .mega-menu {
        text-indent: 1px;
    }
    .mega-menu > ul > li a:hover {
        text-decoration: underline;
    }
    /* Stable hamburger — no rotate/jump on open/close */
    button.navbar-toggler.nav-button[aria-expanded="true"],
    button.navbar-toggler.nav-button[aria-expanded="false"],
    button.navbar-toggler.nav-button {
        transform: none !important;
        padding-top: 0 !important;
        transition: background-color 0.15s ease, border-color 0.15s ease;
    }

    div#user-account-block-wrap li.menu-item {
        border-bottom: 0;
    }
    footer.footer .row.justify-content-center {
        width: 100%;
        margin-bottom: -25px;
    }
    .col-5.text-center {
        padding-right: 10px;
        padding-left: 10px;
        margin-left: -10px;
    }
    .region.region-header-top-first .block-content.clearfix {
        margin-left: -6px;
        font-size: 14px;
        text-align: center;
        margin-right: -6px;
    }
    /* Mobile main menu: dark purple panel + white links (never light bg + white text) */
    #main-menu .menu-item,
    #main-menu li.menu-item,
    .header #main-menu .menu-item,
    .primary-menu .menu-item {
        background-color: transparent !important;
        background: transparent !important;
        border-bottom: 1px solid rgba(255, 255, 255, 0.18) !important;
    }
    .main-menu .nav > li > a,
    .mega-menu > ul > li > a,
    #main-menu a,
    #main-menu .menu-item a {
        color: #ffffff !important;
        line-height: 1.35;
        width: 100%;
        text-align: left;
    }
    .mega-menu > ul {
        margin-top: -unset;
        margin-bottom: unset;
    }
    .primary-menu .main-menu {
        padding: unset;
        padding-top: 15px;
    }
    footer.footer a,
    footer.footer p {
        font-size: x-small;
    }
    ul.social_footer_ul a {
        font-size: revert;
    }
    div#block-clearance-sales {
        width: 100%;
    }
    .region.region-header-top-first {
        width: unset;
        margin-top: unset;
    }
    .region.region-header-top-second {
        padding-bottom: unset;
        margin-top: unset;
    }
    .owl-next,
    .owl-prev {
        margin-top: 0 !important;
    }
    .page-node-type-team .row.content-layout {
        margin-top: -35px;
        margin-bottom: -17px;
    }
    #block-martis-main-menu .menu-item:last-child {
        border-bottom: 2px solid black !important;
    }
} /* end @media (max-width: 767.98px) mobile main-menu fragment */

.navbar-toggler.nav-button {
  border: 2px solid #000;
  background-color: #3b0a5c;
  color: #fff;
}
.navbar-toggler.nav-button i,
.navbar-toggler.nav-button .ti-menu {
  color: #fff;
}

#block-martis-branding {
  margin-top: 5px;
}
.logo-container {
  margin-top: 2.5rem;
}
.mega-menu > ul {
margin-top: -15px;
margin-bottom: unset;
border-bottom: 2px solid black;
}
 .col-5.text-center {
    padding-right: 10px;
    padding-left: 10px;
    justify-content: center;
    display: block;
  }
li.menu-item {
    border-bottom: 2px solid white !important;
  }
.menu-item:nth-child(1) {
  margin-top: -2px !important;
}
.menu-item:last-child {
  border-top: 0 !important;
}

    #block-martis-main-menu .menu.menu-parent .menu-item:first-child {
  border-top: 0 !important;
}
 
.nnc-pricing-tab {
  box-shadow: 1px 1px 0px rgba(0, 0, 0, 0.2);
}
.pricing-table {
  box-shadow: 1px 1px 0px rgba(0, 0, 0, 0.2);
}
#block-home09-slider {
  border-bottom: 0px solid black;
}
.logo-container {
  margin-top: 0rem;
}
a.button.slide-button-link {
  background-image: unset !important;
}
/* Carousel overlay may clip long copy; CTA kept inside via chrome-layout-fix. */

/* MOBILE ONLY — hide collapsed nav until hamburger adds .show.
   Never place this under min-width media (that hid desktop nav site-wide). */
@media (max-width: 767.98px) {
  .header .header-element .navbar-toggler.nav-button i,
  .header .header-element .navbar-toggler.nav-button .ti-menu,
  .header .header-element .navbar-toggler.nav-button [class*="ti-"] {
    pointer-events: none !important;
    font-size: 1.25rem !important;
    line-height: 1 !important;
    color: #ffffff !important;
  }

  /* Hamburger menu: dark purple panel + light-purple pills (JD purple pattern) */
  .header #main-menu.collapse.show,
  .header #main-menu.show,
  #main-menu.collapse.show,
  #main-menu.show {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    width: 100% !important;
    position: relative !important;
    z-index: 20 !important;
    background: #3b0a5c !important;
    background-color: #3b0a5c !important;
    color: #ffffff !important;
    padding: 0.5rem 0.75rem 0.75rem !important;
  }
  .header #main-menu.collapse:not(.show),
  #main-menu.collapse:not(.show) {
    display: none !important;
  }
  .header .header-menu,
  .header .navbar.nav-menu,
  .header .primary-menu {
    overflow: visible !important;
    max-height: none !important;
    background: transparent !important;
  }
  .header .primary-menu .main-menu,
  .header .mega-menu > ul,
  .header #main-menu .mega-menu > ul,
  .header #main-menu ul.menu,
  .header #main-menu ul.nav.menu.menu-parent,
  #block-martis-main-menu ul.nav.menu.menu-parent {
    display: block !important;
    width: 100% !important;
    background: transparent !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  .header #main-menu .menu-item,
  .header #main-menu li.menu-item,
  #block-martis-main-menu .menu-item {
    background: transparent !important;
    background-color: transparent !important;
    border-bottom: 0 !important;
    list-style: none !important;
    margin: 0 0 0.4rem !important;
    padding: 0 !important;
    width: 100% !important;
  }
  #wrapper .header #main-menu.show a,
  #wrapper .header #main-menu.show .menu-item a,
  #wrapper .header #main-menu.show .mega-menu > ul > li > a,
  #wrapper .header #main-menu.show .main-menu .nav > li > a,
  .header #main-menu.show a,
  .header #main-menu.show .menu-item a,
  .header #main-menu.show .mega-menu > ul > li > a,
  .header #main-menu.show .main-menu .nav > li > a,
  #block-martis-main-menu .menu-item a {
    color: #ffffff !important;
    background: #b781e3 !important;
    background-color: #b781e3 !important;
    border-radius: 10px !important;
    border: 2px solid #000 !important;
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    padding: 0.65rem 1rem !important;
    margin: 0 !important;
    opacity: 1 !important;
    visibility: visible !important;
    text-shadow: none !important;
    text-decoration: none !important;
    font-weight: 600 !important;
    box-sizing: border-box !important;
  }
  .header #main-menu.show .menu-item--active-trail > a,
  .header #main-menu.show li.menu-item--active-trail > a,
  .header #main-menu.show a.is-active,
  #block-martis-main-menu .menu-item--active-trail > a,
  #block-martis-main-menu a.is-active {
    background: #c9a0e8 !important;
    background-color: #c9a0e8 !important;
    color: white !important;
    -webkit-text-fill-color: white !important;
  }
  .header #main-menu.show a:hover,
  .header #main-menu.show a:focus {
    background: #c9a0e8 !important;
    background-color: #c9a0e8 !important;
    color: #ffffff !important;
  }

  /* ---- Slide carousel: swipe + full-bleed; do not clip additional content ---- */
  .slide-block .hero.slide-carousel,
  .slide-carousel.owl-carousel,
  .hero.slide-carousel {
    overflow-x: hidden !important;
    overflow-y: visible !important;
    width: 100% !important;
    max-width: 100% !important;
    max-height: none !important;
    display: block !important;
    touch-action: pan-y pinch-zoom;
  }
  .slide-carousel.owl-carousel .owl-stage-outer {
    width: 100% !important;
  }
  .slide-carousel.owl-carousel .owl-stage {
    touch-action: pan-y;
  }
  .slide-carousel.owl-carousel .owl-item {
    float: left;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
  }
}

/* ========== 04-taxonomy-category-menu.css (purple recolor) ========== */
/* ==========================================================================
   EXTRACT 04 — Taxonomy / product-categories hierarchical menu + store grids
   Mobile + desktop (Johnny Detail purple → recolor purple on JD)
   Marker: jd-header-service-menu-v1 / 04-taxonomy-category-menu
   ========================================================================== */

/* --- commerce-material.css: Product Categories Block premium hierarchy --- */
   Applied on /products, taxonomy term pages, and product pages
   ============================================ */
.commerce-content-header {
  margin: 0 0 clamp(1rem, 2.5vw, 1.5rem);
  padding: clamp(0.85rem, 2vw, 1.15rem) clamp(1rem, 2.5vw, 1.35rem);
  background: linear-gradient(135deg, #fdf8f0 0%, #faf7f2 100%);
  border-left: 4px solid #7b2cbf;
  border-radius: 10px;
  box-shadow: 0 4px 18px rgba(123, 44, 191, 0.08);
}

.commerce-content-h1,
h1.commerce-product-h1 {
  margin: 0;
  color: #6716aa;
  font-size: clamp(1.45rem, 3.8vw, 2.15rem);
  font-weight: 800;
  line-height: 1.25;
  letter-spacing: 0.01em;
}

.path-product h1.commerce-product-h1 {
  margin-bottom: 15px !important;
}

.views-element-container .view-product-categories-block,
.block-views-blockproduct-categories-block-block-product-categories .view-product-categories-block,
body .view-product-categories-block {
  --cat-purple: #7b2cbf;
  --cat-purple-dark: #6716aa;
  --cat-purple-light: #b781e3;
  --cat-gold: #C9A227;
  --cat-gold-light: #D4AF37;
  --cat-bg: #FAF7F2;
  --cat-bg-inner: #FDF8F0;
  --cat-shadow: 0 4px 18px rgba(123, 44, 191, 0.1);
  --cat-shadow-hover: 0 6px 22px rgba(123, 44, 191, 0.14);
  --cat-radius: 10px;
  --cat-accent-width: 4px;

  margin: clamp(0.65rem, 2vw, 1rem) 0;
  padding: clamp(0.85rem, 2.5vw, 1.15rem) clamp(0.85rem, 2.5vw, 1.25rem);
  background: linear-gradient(135deg, var(--cat-bg-inner) 0%, var(--cat-bg) 100%);
  border: 1px solid rgba(123, 44, 191, 0.1);
  border-left: var(--cat-accent-width) solid var(--cat-purple);
  border-radius: var(--cat-radius);
  box-shadow: var(--cat-shadow);
}

/* Title */
.view-product-categories-block .view-header {
  margin-bottom: clamp(0.55rem, 1.5vw, 0.75rem);
  padding-bottom: clamp(0.45rem, 1.2vw, 0.6rem);
  border-bottom: 2px solid transparent;
  border-image: linear-gradient(90deg, var(--cat-gold) 0%, var(--cat-gold-light) 45%, transparent 100%) 1;
}

.view-product-categories-block .product-categories-block__title {
  position: relative;
  margin: 0;
  padding-left: 1.65rem;
  font-size: clamp(1.05rem, 2.8vw, 1.3rem);
  font-weight: 700;
  line-height: 1.3;
  color: var(--cat-purple);
  letter-spacing: 0.01em;
}

.view-product-categories-block .product-categories-block__title::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: 1.15rem;
  height: 1.15rem;
  transform: translateY(-52%);
  background-color: var(--cat-purple);
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 19a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h5l2 3h9a2 2 0 0 1 2 2z'/%3E%3C/svg%3E");
  mask-size: contain;
  mask-repeat: no-repeat;
  mask-position: center;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 19a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h5l2 3h9a2 2 0 0 1 2 2z'/%3E%3C/svg%3E");
  -webkit-mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
}

/* List container — CSS Grid of parent sections */
.view-product-categories-block .product-categories-list {
  margin: 0;
}

.view-product-categories-block .product-categories-list__items {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(0.65rem, 1.8vw, 0.9rem);
  list-style: none;
  margin: 0;
  padding: 0;
}

.view-product-categories-block .product-categories-list__items > li {
  margin: 0;
  padding: 0;
}

/* Parent section cards */
.view-product-categories-block .product-category-parent {
  margin: 0;
  padding: clamp(0.65rem, 1.6vw, 0.85rem);
  background: rgba(255, 255, 255, 0.62);
  border: 1px solid rgba(92, 45, 145, 0.12);
  border-left: 3px solid var(--cat-purple);
  border-radius: 8px;
  box-shadow: 0 1px 4px rgba(92, 45, 145, 0.06);
  transition: box-shadow 0.22s ease, border-color 0.22s ease;
}

.view-product-categories-block .product-category-parent:hover {
  border-color: rgba(92, 45, 145, 0.2);
  box-shadow: 0 3px 10px rgba(92, 45, 145, 0.1);
}

.view-product-categories-block .product-category-parent__header {
  margin-bottom: 0.35rem;
}

.view-product-categories-block .product-category-parent__link a {
  display: block;
  padding: clamp(0.2rem, 0.6vw, 0.3rem) 0;
  min-height: 2.5rem;
  font-size: clamp(0.98rem, 2.4vw, 1.08rem);
  font-weight: 700;
  color: #ffffff !important;
  -webkit-text-fill-color: var(--jd-shop-deep, #3b0a5c) !important;
  text-decoration: none !important;
  line-height: 1.35;
  transition: color 0.22s ease, box-shadow 0.22s ease;
}

.view-product-categories-block .product-category-parent__description {
  margin: 0.1rem 0 0;
  padding: 0;
  font-size: clamp(0.72rem, 1.7vw, 0.8rem);
  line-height: 1.45;
  color: white;
}

/* Nested child list */
.view-product-categories-block .product-category-children {
  list-style: none;
  margin: 0;
  padding: 0.15rem 0 0;
  border-top: 1px solid rgba(233, 213, 255, 0.9);
  border-radius: 10px !important;
}

.view-product-categories-block .product-category-children .product-category-child {
  position: relative;
  margin: 0 0 0.45rem;
  padding-left: 0;
}

.view-product-categories-block .product-category-child__header {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}

.view-product-categories-block .product-category-child__description {
  margin: 0;
  padding: 0.35rem 0.5rem;
  font-size: clamp(0.68rem, 1.6vw, 0.76rem);
  line-height: 1.4;
  color: #1a0a24;
  background: #f3e8ff;
  border-radius: 8px;
}

.view-product-categories-block .product-category-children .product-category-child a {
  display: block;
  padding: clamp(0.4rem, 1.1vw, 0.48rem) clamp(0.3rem, 0.9vw, 0.45rem);
  margin-left: -0.25rem;
  min-height: 2.75rem;
  font-size: clamp(0.86rem, 2.1vw, 0.93rem);
  font-weight: 400;
  color: #5a5348 !important;
  text-decoration: none !important;
  line-height: 1.4;
  border-radius: 6px;
  /* Color/background only — no position shift on hover/active */
  transition: color 0.15s ease, background-color 0.15s ease, border-color 0.15s ease;
  transform: none;
}

/* Hover states — green only (no gold accents, no slide/lift) */
.view-product-categories-block .product-category-parent__link a:hover,
.view-product-categories-block .product-category-parent__link a:focus-visible {
  color: var(--cat-purple-dark) !important;
  box-shadow: inset 0 -2px 0 0 var(--cat-purple);
  outline: none;
  transform: none;
}

.view-product-categories-block .product-category-children .product-category-child a:hover,
.view-product-categories-block .product-category-children .product-category-child a:focus-visible {
  color: var(--cat-purple) !important;
  background-color: rgba(123, 44, 191, 0.08);
  /* Keep same padding as default — do not slide text right */
  padding-left: clamp(0.4rem, 1.1vw, 0.48rem);
  outline: none;
  transform: none;
}

/* Active states — green theme (match product-node active chips) */
.view-product-categories-block .product-category-parent.is-active .product-category-parent__link a {
  color: var(--cat-purple-dark) !important;
  box-shadow: inset 0 -2px 0 0 var(--cat-purple);
  transform: none;
}

.view-product-categories-block .product-category-parent.is-active-ancestor {
  border-left-color: var(--cat-purple);
  background: rgba(123, 44, 191, 0.06);
  transform: none;
}

.view-product-categories-block .product-category-parent.is-active-ancestor .product-category-parent__link a {
  color: var(--cat-purple) !important;
  font-weight: 700;
  transform: none;
}

.view-product-categories-block .product-category-children .product-category-child.is-active a {
  font-weight: 700;
  color: var(--cat-purple-dark) !important;
  background-color: #f3e8ff;
  border: 1px solid var(--cat-purple-dark);
  /* Keep border width even so text does not shift sideways */
  border-left: 1px solid var(--cat-purple-dark);
  box-shadow: inset 3px 0 0 0 var(--cat-purple-dark);
  padding-left: clamp(0.4rem, 1.1vw, 0.48rem);
  transform: none;
}

.view-product-categories-block .product-category-parent,
.view-product-categories-block .product-category-parent:hover,
.view-product-categories-block .product-category-parent__link a,
.view-product-categories-block .product-category-children .product-category-child a {
  transform: none;
}

/* Desktop grid + polish */
@media (min-width: 768px) {
  .view-product-categories-block {
    padding: 1.15rem 1.25rem 1.2rem;
  }

  .view-product-categories-block .product-categories-list__items {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.85rem;
  }

  .view-product-categories-block .product-category-children .product-category-child a {
    min-height: 2.5rem;
  }

  .region-sidebar-first .view-product-categories-block,
  .region-sidebar-second .view-product-categories-block,
  aside .view-product-categories-block {
    position: sticky;
    top: 5.5rem;
    max-height: calc(100vh - 6.5rem);
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: rgba(92, 45, 145, 0.25) transparent;
  }

  .region-sidebar-first .view-product-categories-block .product-categories-list__items,
  .region-sidebar-second .view-product-categories-block .product-categories-list__items,
  aside .view-product-categories-block .product-categories-list__items {
    grid-template-columns: 1fr;
  }

  .region-sidebar-first .view-product-categories-block::-webkit-scrollbar,
  .region-sidebar-second .view-product-categories-block::-webkit-scrollbar,
  aside .view-product-categories-block::-webkit-scrollbar {
    width: 5px;
  }

  .region-sidebar-first .view-product-categories-block::-webkit-scrollbar-thumb,
  .region-sidebar-second .view-product-categories-block::-webkit-scrollbar-thumb,
  aside .view-product-categories-block::-webkit-scrollbar-thumb {
    background: rgba(92, 45, 145, 0.25);
    border-radius: 4px;
  }
}

/* Large screens */
@media (min-width: 1024px) {
  .view-product-categories-block {
    padding: 1.2rem 1.35rem 1.25rem;
  }

  .view-product-categories-block .product-category-parent__link a {
    font-size: 1.08rem;
  }

  .view-product-categories-block .product-categories-list__items {
    gap: 1rem;
  }
}

/* Mobile tap targets */
@media (max-width: 767px) {
  .view-product-categories-block {
    padding: 0.85rem 0.9rem;
    border-left-width: 3px;
  }

  .view-product-categories-block .product-categories-block__title {
    padding-left: 1.5rem;
    font-size: 1.05rem;
  }

  .view-product-categories-block .product-category-children .product-category-child a {
    min-height: 2.75rem;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
  }

  .view-product-categories-block .product-category-parent__link a {
    min-height: 2.75rem;
    padding-top: 0.35rem;
    padding-bottom: 0.35rem;
  }
}

/* Product category term pages (TVI + product_category_listings view) */
.view-product-category-listings .view-header,
.view-brand-product-listings .view-header {
  margin-bottom: 1rem;
}

.view-product-category-listings .view-header .taxonomy-term,
.view-brand-product-listings .view-header .taxonomy-term {
  margin-bottom: 0.5rem;
}

.view-product-category-listings .view-header .field--name-description,
.view-brand-product-listings .view-header .field--name-description {
  font-size: 0.95rem;
  line-height: 1.5;
  color: #555;
  margin-bottom: 0.75rem;
}

.view-product-category-listings .view-header .field--name-field-image,
.view-product-category-listings .view-header .field--name-field-icon-image {
  display: none;
}

.view-brand-product-listings .view-header .field--name-field-brand-logo {
  max-width: 220px;
  margin-bottom: 0.75rem;
}

.view-brand-product-listings .view-header .field--name-field-brand-logo img {
  width: 100%;
  height: auto;
  object-fit: contain;
}

.view-brand-product-listings .brand-listing-h1,
.view-id-brand_product_listings .brand-listing-h1,
.view-product-category-listings .category-listing-h1,
.view-id-product_category_listings .category-listing-h1 {
  margin-bottom: 0.75rem;
}

.view-product-category-listings .product-category-empty,
.view-brand-product-listings .brand-product-empty {
  padding: 2rem 0;
  text-align: center;
  color: #666;
}

/* ==========================================================================
   Browse by Brand grid — material cards (green + 2px black)
   Targets product-categories brand block on /products
   ========================================================================== */

#block-martis-views-block-product-categories-block-block-1--2 .grid-wrapper > .grid-item,
#block-martis-views-block-product-categories-block-block-1 .grid-wrapper > .grid-item,
.path-products .view-product-categories-block .grid-wrapper > .grid-item,
.path-products [id*="product-categories-block"] .grid-wrapper > .grid-item {
  display: flex !important;
  flex-direction: column !important;
  margin-bottom: 1.25rem !important;
}

/* Card chrome on the direct child wrapper or the grid-item itself when fields are direct children */
#block-martis-views-block-product-categories-block-block-1--2 .grid-wrapper .grid-item,
#block-martis-views-block-product-categories-block-block-1 .grid-wrapper .grid-item,
.path-products [id*="product-categories-block"] .grid-wrapper .grid-item {
  background: linear-gradient(165deg, #4c1d95 0%, #3b0a5c 55%, #2d0847 100%) !important;
  border: 2px solid #000 !important;
  border-radius: 20px !important;
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.28), 0 2px 6px rgba(59, 10, 92, 0.2) !important;
  padding: 1.1rem 0.85rem 1.15rem !important;
  box-sizing: border-box !important;
  translate: 0 0;
  transition: translate 0.2s ease, box-shadow 0.2s ease;
  overflow: hidden !important;
}

#block-martis-views-block-product-categories-block-block-1--2 .grid-wrapper .grid-item:hover,
#block-martis-views-block-product-categories-block-block-1 .grid-wrapper .grid-item:hover,
.path-products [id*="product-categories-block"] .grid-wrapper .grid-item:hover {
  translate: 0 -4px;
  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.38), 0 6px 14px rgba(59, 10, 92, 0.3) !important;
}

/* Flex order: logo on top */
#block-martis-views-block-product-categories-block-block-1--2 .grid-item,
#block-martis-views-block-product-categories-block-block-1 .grid-item,
.path-products [id*="product-categories-block"] .grid-item {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  text-align: center !important;
}

#block-martis-views-block-product-categories-block-block-1--2 .views-field-field-brand-logo,
#block-martis-views-block-product-categories-block-block-1 .views-field-field-brand-logo,
.path-products [id*="product-categories-block"] .views-field-field-brand-logo,
.path-product [id*="product-categories-block"] .views-field-field-brand-logo,
.path-taxonomy [id*="product-categories-block"] .views-field-field-brand-logo,
.path-store [id*="product-categories-block"] .views-field-field-brand-logo {
  order: -1 !important;
  margin: 0 0 0.75rem !important;
  width: 100% !important;
  display: flex !important;
  justify-content: center !important;
  border: 0 !important;
}

/* White logo frame — no huge 3rem padding (all product surfaces) */
#block-martis-views-block-product-categories-block-block-1--2 .views-field-field-brand-logo .field-item,
#block-martis-views-block-product-categories-block-block-1 .views-field-field-brand-logo .field-item,
.path-products [id*="product-categories-block"] .views-field-field-brand-logo .field-item,
.path-product [id*="product-categories-block"] .views-field-field-brand-logo .field-item,
.path-taxonomy [id*="product-categories-block"] .views-field-field-brand-logo .field-item,
.path-store [id*="product-categories-block"] .views-field-field-brand-logo .field-item,
#block-martis-views-block-product-categories-block-block-1--2 .views-field-field-brand-logo .field-content,
#block-martis-views-block-product-categories-block-block-1 .views-field-field-brand-logo .field-content,
.path-products [id*="product-categories-block"] .views-field-field-brand-logo .field-content,
.path-product [id*="product-categories-block"] .views-field-field-brand-logo .field-content,
.path-taxonomy [id*="product-categories-block"] .views-field-field-brand-logo .field-content,
.path-store [id*="product-categories-block"] .views-field-field-brand-logo .field-content {
  width: 110px !important;
  height: 110px !important;
  max-width: 110px !important;
  max-height: 110px !important;
  margin: 0 auto !important;
  padding: 0.55rem !important;
  background: #ffffff !important;
  border: 2px solid #000 !important;
  border-radius: 16px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: hidden !important;
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.04) !important;
  box-sizing: border-box !important;
}

#block-martis-views-block-product-categories-block-block-1--2 .views-field-field-brand-logo img,
#block-martis-views-block-product-categories-block-block-1 .views-field-field-brand-logo img,
.path-products [id*="product-categories-block"] .views-field-field-brand-logo img,
.path-product [id*="product-categories-block"] .views-field-field-brand-logo img,
.path-taxonomy [id*="product-categories-block"] .views-field-field-brand-logo img,
.path-store [id*="product-categories-block"] .views-field-field-brand-logo img,
#wrapper #block-martis-views-block-product-categories-block-block-1--2 .views-field-field-brand-logo img,
#wrapper #block-martis-views-block-product-categories-block-block-1 .views-field-field-brand-logo img {
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: contain !important;
  object-position: center !important;
  padding: 0 !important;
  margin: 0 !important;
  display: block !important;
  border-radius: 0 !important;
}

/* Brand name + description — white/light on green */
#block-martis-views-block-product-categories-block-block-1--2 .views-field-name,
#block-martis-views-block-product-categories-block-block-1 .views-field-name,
.path-products [id*="product-categories-block"] .views-field-name {
  order: 0 !important;
  width: 100% !important;
  margin: 0 0 0.35rem !important;
}

#block-martis-views-block-product-categories-block-block-1--2 .views-field-name a,
#block-martis-views-block-product-categories-block-block-1 .views-field-name a,
.path-products [id*="product-categories-block"] .views-field-name a,
#block-martis-views-block-product-categories-block-block-1--2 .views-field-name .field-content,
.path-products [id*="product-categories-block"] .views-field-name .field-content {
  color: #ffffff !important;
  font-weight: 700 !important;
  font-size: 1.05rem !important;
  text-decoration: none !important;
  line-height: 1.25 !important;
}

#block-martis-views-block-product-categories-block-block-1--2 .views-field-description__value,
#block-martis-views-block-product-categories-block-block-1 .views-field-description__value,
.path-products [id*="product-categories-block"] .views-field-description__value {
  order: 1 !important;
  width: 100% !important;
  margin: 0 !important;
  color: rgba(255, 255, 255, 0.88) !important;
  font-size: 0.82rem !important;
  line-height: 1.4 !important;
}

#block-martis-views-block-product-categories-block-block-1--2 .views-field-description__value .field-content,
.path-products [id*="product-categories-block"] .views-field-description__value .field-content {
  color: rgba(255, 255, 255, 0.88) !important;
}

/* Kill custom_css circular logo + huge padding remnants on brand grid only */
#block-martis-views-block-product-categories-block-block-1--2 .views-field-field-brand-logo .field-item {
  border-radius: 16px !important;
  width: 110px !important;
  height: 110px !important;
}

/* Generic fallback: any products brand grid with logo+name+description fields */
.path-products .grid-wrapper > .grid-item:has(.views-field-field-brand-logo) {
  background: linear-gradient(165deg, #4c1d95 0%, #3b0a5c 55%, #2d0847 100%);
  border: 2px solid #000;
  border-radius: 20px;
  padding: 1.1rem 0.85rem 1.15rem;
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.28);
}

/* --- chrome-layout-fix.css: Browse by Brand/Category + path-taxonomy polish --- */
/* ==========================================================================
   Browse by Brand — full content width, multi-col grid
   Align L/R with content above; wider cards; mobile 2×N
   Block: #block-martis-views-block-product-categories-block-block-1 (+ --2)
   Appears on /products, brand/category taxonomy, product-related pages
   ========================================================================== */

/* Kill Bootstrap row gutters + justify-center that left empty side space
   and stacked mobile cards as a single centered column */
#block-martis-views-block-product-categories-block-block-1 .container-wrap,
#block-martis-views-block-product-categories-block-block-1--2 .container-wrap,
body.path-products [id*="product-categories-block-block-1"] .container-wrap,
body.path-product [id*="product-categories-block-block-1"] .container-wrap,
body.path-store [id*="product-categories-block-block-1"] .container-wrap,
body.path-taxonomy [id*="product-categories-block-block-1"] .container-wrap {
  width: 100% !important;
  max-width: 1220px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
}

#block-martis-views-block-product-categories-block-block-1 .grid-wrapper,
#block-martis-views-block-product-categories-block-block-1--2 .grid-wrapper,
body.path-products [id*="product-categories-block-block-1"] .grid-wrapper,
body.path-product [id*="product-categories-block-block-1"] .grid-wrapper,
body.path-store [id*="product-categories-block-block-1"] .grid-wrapper,
body.path-taxonomy [id*="product-categories-block-block-1"] .grid-wrapper,
#block-martis-views-block-product-categories-block-block-1 .row.grid-wrapper,
#block-martis-views-block-product-categories-block-block-1--2 .row.grid-wrapper {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 1rem !important;
  row-gap: 1rem !important;
  column-gap: 1rem !important;
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  margin-bottom: 1.5rem !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  justify-content: stretch !important;
  align-items: stretch !important;
  box-sizing: border-box !important;
}

#block-martis-views-block-product-categories-block-block-1 .grid-wrapper > .grid-item,
#block-martis-views-block-product-categories-block-block-1--2 .grid-wrapper > .grid-item,
body.path-products [id*="product-categories-block-block-1"] .grid-wrapper > .grid-item,
body.path-product [id*="product-categories-block-block-1"] .grid-wrapper > .grid-item,
body.path-store [id*="product-categories-block-block-1"] .grid-wrapper > .grid-item,
body.path-taxonomy [id*="product-categories-block-block-1"] .grid-wrapper > .grid-item {
  /* Override Bootstrap col-6 / col-lg-3 flex basis so grid cells fill */
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  flex: none !important;
  flex-basis: auto !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  margin-bottom: 0 !important;
  padding-left: 1rem !important;
  padding-right: 1rem !important;
  box-sizing: border-box !important;
}

/* Slightly larger logo frame on wider cards (desktop default) — all product surfaces */
#block-martis-views-block-product-categories-block-block-1 .views-field-field-brand-logo .field-item,
#block-martis-views-block-product-categories-block-block-1 .views-field-field-brand-logo .field-content,
#block-martis-views-block-product-categories-block-block-1--2 .views-field-field-brand-logo .field-item,
#block-martis-views-block-product-categories-block-block-1--2 .views-field-field-brand-logo .field-content,
body.path-products [id*="product-categories-block-block-1"] .views-field-field-brand-logo .field-item,
body.path-products [id*="product-categories-block-block-1"] .views-field-field-brand-logo .field-content,
body.path-product [id*="product-categories-block-block-1"] .views-field-field-brand-logo .field-item,
body.path-product [id*="product-categories-block-block-1"] .views-field-field-brand-logo .field-content,
body.path-taxonomy [id*="product-categories-block-block-1"] .views-field-field-brand-logo .field-item,
body.path-taxonomy [id*="product-categories-block-block-1"] .views-field-field-brand-logo .field-content,
body.path-store [id*="product-categories-block-block-1"] .views-field-field-brand-logo .field-item,
body.path-store [id*="product-categories-block-block-1"] .views-field-field-brand-logo .field-content {
  width: 130px !important;
  height: 130px !important;
  max-width: 130px !important;
  max-height: 130px !important;
}

/* Mobile / tablet: 2-column brand grid, full content width gutters */
@media (max-width: 991.98px) {
  #block-martis-views-block-product-categories-block-block-1 .container-wrap,
  #block-martis-views-block-product-categories-block-block-1--2 .container-wrap,
  body.path-products [id*="product-categories-block-block-1"] .container-wrap,
  body.path-product [id*="product-categories-block-block-1"] .container-wrap,
  body.path-store [id*="product-categories-block-block-1"] .container-wrap,
  body.path-taxonomy [id*="product-categories-block-block-1"] .container-wrap {
    max-width: 100% !important;
    width: 100% !important;
    padding-left: 0.85rem !important;
    padding-right: 0.85rem !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  #block-martis-views-block-product-categories-block-block-1 .grid-wrapper,
  #block-martis-views-block-product-categories-block-block-1--2 .grid-wrapper,
  body.path-products [id*="product-categories-block-block-1"] .grid-wrapper,
  body.path-product [id*="product-categories-block-block-1"] .grid-wrapper,
  body.path-store [id*="product-categories-block-block-1"] .grid-wrapper,
  body.path-taxonomy [id*="product-categories-block-block-1"] .grid-wrapper,
  #block-martis-views-block-product-categories-block-block-1 .row.grid-wrapper,
  #block-martis-views-block-product-categories-block-block-1--2 .row.grid-wrapper {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0.75rem !important;
    row-gap: 0.75rem !important;
    column-gap: 0.75rem !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  #block-martis-views-block-product-categories-block-block-1 .grid-wrapper > .grid-item,
  #block-martis-views-block-product-categories-block-block-1--2 .grid-wrapper > .grid-item,
  body.path-products [id*="product-categories-block-block-1"] .grid-wrapper > .grid-item,
  body.path-product [id*="product-categories-block-block-1"] .grid-wrapper > .grid-item,
  body.path-store [id*="product-categories-block-block-1"] .grid-wrapper > .grid-item,
  body.path-taxonomy [id*="product-categories-block-block-1"] .grid-wrapper > .grid-item {
    width: 100% !important;
    max-width: none !important;
    flex: none !important;
    padding: 0.85rem 0.65rem 0.9rem !important;
  }

  /* Logo scale for ~half-width mobile cards — all product surfaces */
  #block-martis-views-block-product-categories-block-block-1 .views-field-field-brand-logo .field-item,
  #block-martis-views-block-product-categories-block-block-1 .views-field-field-brand-logo .field-content,
  #block-martis-views-block-product-categories-block-block-1--2 .views-field-field-brand-logo .field-item,
  #block-martis-views-block-product-categories-block-block-1--2 .views-field-field-brand-logo .field-content,
  body.path-products [id*="product-categories-block-block-1"] .views-field-field-brand-logo .field-item,
  body.path-products [id*="product-categories-block-block-1"] .views-field-field-brand-logo .field-content,
  body.path-product [id*="product-categories-block-block-1"] .views-field-field-brand-logo .field-item,
  body.path-product [id*="product-categories-block-block-1"] .views-field-field-brand-logo .field-content,
  body.path-taxonomy [id*="product-categories-block-block-1"] .views-field-field-brand-logo .field-item,
  body.path-taxonomy [id*="product-categories-block-block-1"] .views-field-field-brand-logo .field-content,
  body.path-store [id*="product-categories-block-block-1"] .views-field-field-brand-logo .field-item,
  body.path-store [id*="product-categories-block-block-1"] .views-field-field-brand-logo .field-content {
    width: 96px !important;
    height: 96px !important;
    max-width: 96px !important;
    max-height: 96px !important;
    padding: 0.4rem !important;
  }

  #block-martis-views-block-product-categories-block-block-1 .views-field-name a,
  #block-martis-views-block-product-categories-block-block-1--2 .views-field-name a,
  body.path-products [id*="product-categories-block-block-1"] .views-field-name a {
    font-size: 0.95rem !important;
  }

  #block-martis-views-block-product-categories-block-block-1 .views-field-description__value,
  #block-martis-views-block-product-categories-block-block-1--2 .views-field-description__value,
  body.path-products [id*="product-categories-block-block-1"] .views-field-description__value {
    font-size: 0.75rem !important;
    line-height: 1.35 !important;
  }
}

/* Mid desktop: 3 cols when content is a bit tight */
@media (min-width: 992px) and (max-width: 1199.98px) {
  #block-martis-views-block-product-categories-block-block-1 .grid-wrapper,
  #block-martis-views-block-product-categories-block-block-1--2 .grid-wrapper,
  body.path-products [id*="product-categories-block-block-1"] .grid-wrapper,
  body.path-product [id*="product-categories-block-block-1"] .grid-wrapper,
  body.path-store [id*="product-categories-block-block-1"] .grid-wrapper,
  body.path-taxonomy [id*="product-categories-block-block-1"] .grid-wrapper {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

/* ==========================================================================
   Taxonomy page H1 titles — even top/bottom gaps (match front page)
   City pages use frontpagetitle* blocks + breadcrumbs; product brand/category
   use commerce-content-h1. Beat custom_css #wrapper … margin-bottom:-1rem.
   ========================================================================== */

/* Breadcrumbs: tight, symmetric padding so they don't inflate only the top */
html body.path-taxonomy #wrapper #block-breadcrumbs,
html body.path-taxonomy #block-breadcrumbs,
html body.path-taxonomy .block-system-breadcrumb-block {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding-top: 0rem !important;
  padding-bottom: 0.5rem !important;
}

html body.path-taxonomy #wrapper #block-breadcrumbs .breadcrumb,
html body.path-taxonomy #block-breadcrumbs .breadcrumb,
html body.path-taxonomy .breadcrumb {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding-top: 0rem !important;
  padding-bottom: 0.35rem !important;
}

html body.path-taxonomy .breadcrumb ul {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* City / service-area title blocks (frontpagetitle* / pagetitle*) */
html body.path-taxonomy #wrapper [id*="frontpagetitle"],
html body.path-taxonomy #wrapper [id*="pagetitle"],
html body.path-taxonomy #wrapper #content-wide-top [id*="frontpagetitle"],
html body.path-taxonomy #wrapper #content-wide-top [id*="pagetitle"] {
  margin-top: 0.75rem !important;
  margin-bottom: 0.75rem !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/*
 * H1 badge — equal air above and below.
 * Specificity must beat:
 *   #wrapper #content-wide-top .block-block-content .field-item > h1 { margin-bottom:-1rem }
 *   .path-taxonomy .row.layout.layout--onecol h1 { margin-bottom:-1rem }
 */
html body.path-taxonomy #wrapper #content-wide-top [id*="frontpagetitle"] h1,
html body.path-taxonomy #wrapper #content-wide-top [id*="pagetitle"] h1,
html body.path-taxonomy #wrapper #content-wide-top .block-block-content .field-item > h1,
html body.path-taxonomy #wrapper #content-wide-top .block-block-content .field-body > h1,
html body.path-taxonomy #wrapper [id*="frontpagetitle"] h1,
html body.path-taxonomy #wrapper [id*="pagetitle"] h1,
html body.path-taxonomy #wrapper .row.layout.layout--onecol h1,
html body.path-taxonomy .row.layout.layout--onecol h1 {
  margin-top: 0.75rem !important;
  margin-bottom: 0rem !important;
}

/* Next sibling after title (slider / content) — same air as top, no pull-up */
html body.path-taxonomy #wrapper [id*="frontpagetitle"] + .block,
html body.path-taxonomy #wrapper [id*="pagetitle"] + .block,
html body.path-taxonomy #wrapper [id*="frontpagetitle"] + .views-element-container,
html body.path-taxonomy #wrapper [id*="pagetitle"] + .views-element-container,
html body.path-taxonomy #wrapper #content-wide-top [id*="frontpagetitle"] + .block,
html body.path-taxonomy #wrapper #content-wide-top [id*="pagetitle"] + .block {
  margin-top: 0.75rem !important;
}

/* Product brand / category taxonomy listing H1s */
html body.path-taxonomy #wrapper .commerce-content-header.brand-listing-h1,
html body.path-taxonomy #wrapper .commerce-content-header.category-listing-h1,
html body.path-taxonomy #wrapper .commerce-content-header,
html body.path-taxonomy .commerce-content-header.brand-listing-h1,
html body.path-taxonomy .commerce-content-header.category-listing-h1,
html body.path-taxonomy .commerce-content-header {
  margin-top: 1rem !important;
  margin-bottom: 1rem !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

html body.path-taxonomy #wrapper .commerce-content-header .commerce-content-h1,
html body.path-taxonomy #wrapper h1.commerce-content-h1,
html body.path-taxonomy .commerce-content-header .commerce-content-h1,
html body.path-taxonomy h1.commerce-content-h1 {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* Mobile: keep even gaps, slightly tighter like front */
@media (max-width: 991.98px) {
  html body.path-taxonomy #wrapper #block-breadcrumbs,
  html body.path-taxonomy #block-breadcrumbs,
  html body.path-taxonomy .block-system-breadcrumb-block {
    padding-top: 0rem !important;
    padding-bottom: 0.4rem !important;
  }

  html body.path-taxonomy #wrapper [id*="frontpagetitle"],
  html body.path-taxonomy #wrapper [id*="pagetitle"],
  html body.path-taxonomy #wrapper #content-wide-top [id*="frontpagetitle"],
  html body.path-taxonomy #wrapper #content-wide-top [id*="pagetitle"] {
    margin-top: 0.6rem !important;
    margin-bottom: 0.6rem !important;
  }

  html body.path-taxonomy #wrapper #content-wide-top [id*="frontpagetitle"] h1,
  html body.path-taxonomy #wrapper #content-wide-top [id*="pagetitle"] h1,
  html body.path-taxonomy #wrapper #content-wide-top .block-block-content .field-item > h1,
  html body.path-taxonomy #wrapper #content-wide-top .block-block-content .field-body > h1,
  html body.path-taxonomy #wrapper [id*="frontpagetitle"] h1,
  html body.path-taxonomy #wrapper [id*="pagetitle"] h1,
  html body.path-taxonomy #wrapper .row.layout.layout--onecol h1,
  html body.path-taxonomy .row.layout.layout--onecol h1 {
    margin-top: 0.6rem !important;
    margin-bottom: 0.6rem !important;
  }

  html body.path-taxonomy #wrapper [id*="frontpagetitle"] + .block,
  html body.path-taxonomy #wrapper [id*="pagetitle"] + .block,
  html body.path-taxonomy #wrapper [id*="frontpagetitle"] + .views-element-container,
  html body.path-taxonomy #wrapper [id*="pagetitle"] + .views-element-container,
  html body.path-taxonomy #wrapper #content-wide-top [id*="frontpagetitle"] + .block,
  html body.path-taxonomy #wrapper #content-wide-top [id*="pagetitle"] + .block {
    margin-top: 0.6rem !important;
  }

  html body.path-taxonomy #wrapper .commerce-content-header.brand-listing-h1,
  html body.path-taxonomy #wrapper .commerce-content-header.category-listing-h1,
  html body.path-taxonomy #wrapper .commerce-content-header,
  html body.path-taxonomy .commerce-content-header {
    margin-top: 0.75rem !important;
    margin-bottom: 0.75rem !important;
  }
}

@media (max-width: 575.98px) {
  html body.path-taxonomy #wrapper #content-wide-top [id*="frontpagetitle"] h1,
  html body.path-taxonomy #wrapper #content-wide-top [id*="pagetitle"] h1,
  html body.path-taxonomy #wrapper #content-wide-top .block-block-content .field-item > h1,
  html body.path-taxonomy #wrapper #content-wide-top .block-block-content .field-body > h1,
  html body.path-taxonomy #wrapper [id*="frontpagetitle"] h1,
  html body.path-taxonomy #wrapper [id*="pagetitle"] h1,
  html body.path-taxonomy #wrapper .row.layout.layout--onecol h1 {
    margin-top: 0.5rem !important;
    margin-bottom: 0rem !important;
  }

  html body.path-taxonomy #wrapper [id*="frontpagetitle"],
  html body.path-taxonomy #wrapper [id*="pagetitle"] {
    margin-top: 0.5rem !important;
    margin-bottom: 0.5rem !important;
  }

  html body.path-taxonomy #wrapper [id*="frontpagetitle"] + .block,
  html body.path-taxonomy #wrapper [id*="pagetitle"] + .block,
  html body.path-taxonomy #wrapper #content-wide-top [id*="frontpagetitle"] + .block {
    margin-top: 0.5rem !important;
  }
}

/* ==========================================================================
   Store / product pages — search block, H1, catalog results
   Widen + align with brand grid content width; clear brand↔search overlap;
   tighten excessive margins (custom_css: search width 55%/92%, mt -2rem/-4rem,
   commerce-content-header mt -4rem/-6.5rem, catalog margin-left 2rem).
   ========================================================================== */

/* --- Brand block: clear bottom space before search --- */
html body.path-products #wrapper #block-martis-views-block-product-categories-block-block-1,
html body.path-taxonomy #wrapper #block-martis-views-block-product-categories-block-block-1,
html body.path-product #wrapper #block-martis-views-block-product-categories-block-block-1,
html body.path-store #wrapper #block-martis-views-block-product-categories-block-block-1,
html body.path-products #wrapper #block-martis-views-block-product-categories-block-block-1--2,
html body.path-taxonomy #wrapper #block-martis-views-block-product-categories-block-block-1--2 {
  margin-bottom: 1.25rem !important;
  padding-bottom: 0.25rem !important;
}

/* --- Product search exposed form block: full content width, no pull-up --- */
html body.path-products #wrapper #block-martis-exposedformproduct-catalogproduct-catalog-search,
html body.path-taxonomy #wrapper #block-martis-exposedformproduct-catalogproduct-catalog-search,
html body.path-product #wrapper #block-martis-exposedformproduct-catalogproduct-catalog-search,
html body.path-store #wrapper #block-martis-exposedformproduct-catalogproduct-catalog-search,
html body.path-products #block-martis-exposedformproduct-catalogproduct-catalog-search,
html body.path-taxonomy #block-martis-exposedformproduct-catalogproduct-catalog-search,
html body.path-product #block-martis-exposedformproduct-catalogproduct-catalog-search,
html body.path-store #block-martis-exposedformproduct-catalogproduct-catalog-search {
  display: block !important;
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 1220px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  margin-top: -0.5rem !important; /* was -2rem / -4rem — clear brand overlap */
  margin-bottom: -0.5rem !important; /* was 4rem / 6rem — tighten */
  padding-left: 0.85rem !important;
  padding-right: 0.85rem !important;
  padding-top: 0.5rem !important;
  padding-bottom: 0.5rem !important;
}

/* Inner form fills the block */
html body.path-products #wrapper #block-martis-exposedformproduct-catalogproduct-catalog-search .container-wrap,
html body.path-taxonomy #wrapper #block-martis-exposedformproduct-catalogproduct-catalog-search .container-wrap,
html body.path-product #wrapper #block-martis-exposedformproduct-catalogproduct-catalog-search .container-wrap,
html body.path-store #wrapper #block-martis-exposedformproduct-catalogproduct-catalog-search .container-wrap,
html body.path-products #wrapper #views-exposed-form-product-catalog-product-catalog-search,
html body.path-taxonomy #wrapper #views-exposed-form-product-catalog-product-catalog-search,
html body.path-product #wrapper #views-exposed-form-product-catalog-product-catalog-search,
html body.path-store #wrapper #views-exposed-form-product-catalog-product-catalog-search,
html body.path-products #wrapper #block-martis-exposedformproduct-catalogproduct-catalog-search .views-exposed-form,
html body.path-taxonomy #wrapper #block-martis-exposedformproduct-catalogproduct-catalog-search .views-exposed-form {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  box-sizing: border-box !important;
}

/* Also cover product_search_form block id variants */
html body.path-products #wrapper #block-martis-product-search-form,
html body.path-taxonomy #wrapper #block-martis-product-search-form,
html body.path-product #wrapper #block-martis-product-search-form,
html body.path-store #wrapper #block-martis-product-search-form {
  width: 100% !important;
  max-width: 1220px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  margin-top: 1.25rem !important;
  margin-bottom: 1rem !important;
  padding-left: 0.85rem !important;
  padding-right: 0.85rem !important;
  box-sizing: border-box !important;
}

/* --- H1 / listing title header: full width, no negative pull into search --- */
html body.path-products #wrapper .commerce-content-header,
html body.path-taxonomy #wrapper .commerce-content-header,
html body.path-product #wrapper .commerce-content-header,
html body.path-store #wrapper .commerce-content-header,
html body.path-products #wrapper .commerce-content-header.brand-listing-h1,
html body.path-taxonomy #wrapper .commerce-content-header.brand-listing-h1,
html body.path-products #wrapper .commerce-content-header.category-listing-h1,
html body.path-taxonomy #wrapper .commerce-content-header.category-listing-h1,
html body.path-products .commerce-content-header,
html body.path-taxonomy .commerce-content-header,
html body.path-product .commerce-content-header,
html body.path-store .commerce-content-header {
  width: 100% !important;
  max-width: 100% !important;
  margin-top: 1rem !important; /* kill -4rem / -6.5rem */
  margin-bottom: 1rem !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 1rem !important;
  padding-right: 1rem !important;
  box-sizing: border-box !important;
}

html body.path-products #wrapper .commerce-content-header .commerce-content-h1,
html body.path-taxonomy #wrapper .commerce-content-header .commerce-content-h1,
html body.path-products #wrapper h1.commerce-content-h1,
html body.path-taxonomy #wrapper h1.commerce-content-h1,
html body.path-product #wrapper h1.commerce-content-h1,
html body.path-store #wrapper h1.commerce-content-h1,
html body.path-products h1.commerce-content-h1,
html body.path-taxonomy h1.commerce-content-h1 {
  width: 100% !important;
  max-width: 100% !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  box-sizing: border-box !important;
}

/* --- Product catalog / filtered results: full content width, aligned ---
   Stack chrome vertically: switch-icon (top) → teaser grid (full width) → pager (bottom).
   Previous display:flex without flex-direction:column laid header/grid/pager in a ROW,
   which left switch-icon on the left and pager on the right, squeezing the grid. */
html body.path-products #wrapper .product-catalog,
html body.path-taxonomy #wrapper .product-catalog,
html body.path-product #wrapper .product-catalog,
html body.path-store #wrapper .product-catalog,
html body.path-products #wrapper .view-product-catalog,
html body.path-taxonomy #wrapper .view-product-catalog,
html body.path-products #wrapper .view-id-product_catalog,
html body.path-taxonomy #wrapper .view-id-product_catalog,
html body.path-products #wrapper .view-brand-product-listings,
html body.path-taxonomy #wrapper .view-brand-product-listings,
html body.path-products #wrapper .view-product-category-listings,
html body.path-taxonomy #wrapper .view-product-category-listings,
html body.path-products .product-catalog,
html body.path-taxonomy .product-catalog {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important; /* kill path-taxonomy margin-left: 2rem */
  margin-right: 0 !important;
  margin-top: 0.5rem !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  justify-content: flex-start !important;
}

/* Catalog children: full width stack (header / grid / pager / footer) */
html body.path-products #wrapper .product-catalog > .view-header,
html body.path-taxonomy #wrapper .product-catalog > .view-header,
html body.path-products #wrapper .view-product-catalog > .view-header,
html body.path-taxonomy #wrapper .view-product-catalog > .view-header,
html body.path-products #wrapper .view-brand-product-listings > .view-header,
html body.path-taxonomy #wrapper .view-brand-product-listings > .view-header,
html body.path-products #wrapper .view-product-category-listings > .view-header,
html body.path-taxonomy #wrapper .view-product-category-listings > .view-header,
html body.path-products #wrapper .product-catalog > .view-filters,
html body.path-taxonomy #wrapper .product-catalog > .view-filters,
html body.path-products #wrapper .product-catalog > .view-content,
html body.path-taxonomy #wrapper .product-catalog > .view-content,
html body.path-products #wrapper .product-catalog > .grid-wrapper,
html body.path-taxonomy #wrapper .product-catalog > .grid-wrapper,
html body.path-products #wrapper .product-catalog > .row.grid-wrapper,
html body.path-taxonomy #wrapper .product-catalog > .row.grid-wrapper,
html body.path-products #wrapper .product-catalog > nav.pager,
html body.path-taxonomy #wrapper .product-catalog > nav.pager,
html body.path-products #wrapper .product-catalog > .pager,
html body.path-taxonomy #wrapper .product-catalog > .pager,
html body.path-products #wrapper .product-catalog > .pagerer-container,
html body.path-taxonomy #wrapper .product-catalog > .pagerer-container,
html body.path-products #wrapper .product-catalog > .view-footer,
html body.path-taxonomy #wrapper .product-catalog > .view-footer {
  width: 100% !important;
  max-width: 100% !important;
  flex: 0 0 auto !important;
  float: none !important;
  box-sizing: border-box !important;
}

/* Switch-icon bar: above the grid, full width — never under sort form */
html body.path-products #wrapper .product-catalog > .view-header,
html body.path-taxonomy #wrapper .product-catalog > .view-header,
html body.path-products #wrapper .view-product-catalog > .view-header,
html body.path-taxonomy #wrapper .view-product-catalog > .view-header,
html body.path-products #wrapper .view-brand-product-listings > .view-header,
html body.path-taxonomy #wrapper .view-brand-product-listings > .view-header,
html body.path-products #wrapper .view-product-category-listings > .view-header,
html body.path-taxonomy #wrapper .view-product-category-listings > .view-header {
  display: block !important;
  position: relative !important;
  z-index: 2 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0.5rem !important;
  padding-bottom: 0.15rem !important;
  clear: both !important;
  overflow: visible !important;
  background: transparent !important;
}

html body.path-products #wrapper .product-catalog .switch-icon,
html body.path-taxonomy #wrapper .product-catalog .switch-icon,
html body.path-products #wrapper .view-product-catalog .switch-icon,
html body.path-taxonomy #wrapper .view-product-catalog .switch-icon {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 0.5rem !important;
  margin: 0 0 0.35rem 0 !important;
  position: relative !important;
  z-index: 3 !important;
  min-height: 42px !important;
}

/* Catalog sort form: own row BELOW switch-icon (was white overlay covering icons) */
html body.path-products #wrapper .product-catalog > form.views-exposed-form,
html body.path-taxonomy #wrapper .product-catalog > form.views-exposed-form,
html body.path-products #wrapper .product-catalog > .views-exposed-form,
html body.path-taxonomy #wrapper .product-catalog > .views-exposed-form,
html body.path-products #wrapper .view-product-catalog > form.views-exposed-form,
html body.path-taxonomy #wrapper .view-product-catalog > form.views-exposed-form {
  display: block !important;
  position: relative !important;
  z-index: 1 !important;
  width: 100% !important;
  max-width: 100% !important;
  flex: 0 0 auto !important;
  float: none !important;
  clear: both !important;
  margin-top: 0.35rem !important;
  margin-bottom: 0.85rem !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-top: 0.35rem !important;
  padding-bottom: 0.35rem !important;
  box-sizing: border-box !important;
  background: transparent !important; /* avoid white sheet over switch */
}

html body.path-products #wrapper .product-catalog .view-content.grid-wrapper,
html body.path-taxonomy #wrapper .product-catalog .view-content.grid-wrapper,
html body.path-products #wrapper .view-product-catalog .view-content.grid-wrapper,
html body.path-taxonomy #wrapper .view-product-catalog .view-content.grid-wrapper,
html body.path-products #wrapper .view-brand-product-listings .view-content.grid-wrapper,
html body.path-taxonomy #wrapper .view-brand-product-listings .view-content.grid-wrapper,
html body.path-products #wrapper .view-product-category-listings .view-content.grid-wrapper,
html body.path-taxonomy #wrapper .view-product-category-listings .view-content.grid-wrapper,
html body.path-products #wrapper .product-catalog > .row.grid-wrapper,
html body.path-taxonomy #wrapper .product-catalog > .row.grid-wrapper {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  box-sizing: border-box !important;
  flex: 0 0 auto !important;
}

/* Pager + result footer: below grid, full width, centered controls.
   Neutralizes custom_css negative margins that assumed side-by-side chrome. */
html body.path-products #wrapper .product-catalog > nav.pager,
html body.path-taxonomy #wrapper .product-catalog > nav.pager,
html body.path-products #wrapper .product-catalog > .pager,
html body.path-taxonomy #wrapper .product-catalog > .pager,
html body.path-products #wrapper .product-catalog .pagerer-container,
html body.path-taxonomy #wrapper .product-catalog .pagerer-container,
html body.path-products #wrapper .view-product-catalog > nav.pager,
html body.path-taxonomy #wrapper .view-product-catalog > nav.pager,
html body.path-products #wrapper .view-brand-product-listings > nav.pager,
html body.path-taxonomy #wrapper .view-brand-product-listings > nav.pager,
html body.path-products #wrapper .view-product-category-listings > nav.pager,
html body.path-taxonomy #wrapper .view-product-category-listings > nav.pager {
  width: 100% !important;
  max-width: 100% !important;
  margin-top: -1rem !important;
  margin-bottom: -0.25rem !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-top: 0.25rem !important;
  text-align: center !important;
  clear: both !important;
  float: none !important;
}

html body.path-products #wrapper .product-catalog .pager__items,
html body.path-taxonomy #wrapper .product-catalog .pager__items,
html body.path-products #wrapper .product-catalog ul.pager__items,
html body.path-taxonomy #wrapper .product-catalog ul.pager__items {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  align-items: center !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  margin-top: 0 !important;
}

body.path-products #wrapper .product-catalog > .view-footer,
html body.path-taxonomy #wrapper .product-catalog > .view-footer,
html body.path-products #wrapper .view-product-catalog > .view-footer,
html body.path-taxonomy #wrapper .view-product-catalog > .view-footer {
  width: 100% !important;
  max-width: 100% !important;
  margin-top: 0.5rem !important;
  margin-bottom: 1rem !important;
  text-align: center !important;
  clear: both !important;
  float: none !important;
}

/* Main content column on these pages — use full available width */
html body.path-products #wrapper .col-md-9.left-content.main-content,
html body.path-taxonomy #wrapper .col-md-9.left-content.main-content,
html body.path-product #wrapper .col-md-9.left-content.main-content,
html body.path-store #wrapper .col-md-9.left-content.main-content,
html body.path-products #wrapper .region-content,
html body.path-taxonomy #wrapper .region-content {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  box-sizing: border-box !important;
}

/* Page container alignment with brand grid */
html body.path-products #wrapper .page-wrapper > .container,
html body.path-taxonomy #wrapper .page-wrapper > .container,
html body.path-product #wrapper .page-wrapper > .container,
html body.path-store #wrapper .page-wrapper > .container {
  max-width: 1220px !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

/* Mobile: same widen + clear gaps, slightly tighter */
@media (max-width: 991.98px) {
  html body.path-products #wrapper #block-martis-views-block-product-categories-block-block-1,
  html body.path-taxonomy #wrapper #block-martis-views-block-product-categories-block-block-1,
  html body.path-product #wrapper #block-martis-views-block-product-categories-block-block-1,
  html body.path-store #wrapper #block-martis-views-block-product-categories-block-block-1 {
    margin-bottom: 1rem !important;
  }

  html body.path-products #wrapper #block-martis-exposedformproduct-catalogproduct-catalog-search,
  html body.path-taxonomy #wrapper #block-martis-exposedformproduct-catalogproduct-catalog-search,
  html body.path-product #wrapper #block-martis-exposedformproduct-catalogproduct-catalog-search,
  html body.path-store #wrapper #block-martis-exposedformproduct-catalogproduct-catalog-search,
  html body.path-products #block-martis-exposedformproduct-catalogproduct-catalog-search,
  html body.path-taxonomy #block-martis-exposedformproduct-catalogproduct-catalog-search {
    width: 92% !important;
    max-width: 100% !important;
    margin-top: 1rem !important;
    margin-bottom: 0.85rem;
    margin-left: 1rem !important;
    margin-right: 0 !important;
    padding-left: 0.75rem !important;
    padding-right: 0.75rem !important;
    padding-bottom: 0.5rem !important;
  }

  html body.path-products #wrapper .commerce-content-header,
  html body.path-taxonomy #wrapper .commerce-content-header,
  html body.path-product #wrapper .commerce-content-header,
  html body.path-store #wrapper .commerce-content-header,
  html body.path-products .commerce-content-header,
  html body.path-taxonomy .commerce-content-header {
    margin-top: 0.75rem !important;
    margin-bottom: 0.75rem !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0.75rem !important;
    padding-right: 0.75rem !important;
  }

  html body.path-products #wrapper .product-catalog,
  html body.path-taxonomy #wrapper .product-catalog,
  html body.path-products .product-catalog,
  html body.path-taxonomy .product-catalog {
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  html body.path-products #wrapper .page-wrapper > .container,
  html body.path-taxonomy #wrapper .page-wrapper > .container,
  html body.path-product #wrapper .page-wrapper > .container {
    padding-left: 0.75rem !important;
    padding-right: 0.75rem !important;
    max-width: 100% !important;
  }
}

/* Mobile polish: keep H1/catalog inside viewport (no -3px bleed) */
@media (max-width: 991.98px) {
  html body.path-products #wrapper .region-content,
  html body.path-taxonomy #wrapper .region-content,
  html body.path-product #wrapper .region-content,
  html body.path-store #wrapper .region-content,
  html body.path-products #wrapper .col-md-9.left-content.main-content,
  html body.path-taxonomy #wrapper .col-md-9.left-content.main-content {
    padding-left: 0.75rem !important;
    padding-right: 0.75rem !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
  }

  html body.path-products #wrapper .commerce-content-header,
  html body.path-taxonomy #wrapper .commerce-content-header,
  html body.path-products #wrapper .product-catalog,
  html body.path-taxonomy #wrapper .product-catalog {
    max-width: 100% !important;
    overflow-x: hidden !important;
  }

  /* Brand taxonomy: H1 is inside catalog view — keep header spacing tight */
  html body.path-taxonomy #wrapper .product-catalog .commerce-content-header,
  html body.path-taxonomy #wrapper .view-product-catalog .commerce-content-header,
  html body.path-taxonomy #wrapper .view-brand-product-listings .commerce-content-header,
  html body.path-taxonomy #wrapper .view-product-category-listings .commerce-content-header {
    margin-top: -1.5rem !important;
    margin-bottom: 1.75rem !important;
    margin-left: -1rem !important;
    width: 109% !important;
    max-width: 109% !important;
  }
}


/* ========== JD block/DOM aliases + overrides (2026-08-02) ========== */

/* Confirmed live on johnnydetail.com:
 *   #block-header-info2, #block-call-to-order
 *   .service-brag + .jd-comparison-table (and .cy-comparison-table)
 *   #block-martis-views-block-product-categories-block-block-1
 */

/* Alias common alternate block IDs if layouts shift */
#block-martis-calltoorder,
#block-contact-us,
#block-calltoorder,
#block-call-to-order {
  /* shared visibility baseline — detailed rules come from extract 01 */
}

/* Ensure contact strip not forced hidden by older media.css leftovers */
@media (max-width: 991.98px) {
  .header-right,
  .header-right-wrap,
  #block-call-to-order,
  .region-header-right {
    display: block !important;
    visibility: visible !important;
  }
}

/* Product categories: ensure both --1 and --2 (and bare product-categories) get purple active */
html body.path-taxonomy [id*="product-categories-block"] a.is-active,
html body.path-products [id*="product-categories-block"] a.is-active,
html body.path-product [id*="product-categories-block"] a.is-active,
html body.path-store [id*="product-categories-block"] a.is-active,
html body.path-taxonomy .product-category-parent.is-active > a,
html body.path-products .product-category-parent.is-active > a,
html body.path-taxonomy .product-category-child a.is-active,
html body.path-products .product-category-child a.is-active {
  color: #6716aa !important;
  border-color: #6716aa !important;
}

/* Kill hover slide on category menu (layout shift) */
html body.path-taxonomy [id*="product-categories-block"] a:hover,
html body.path-products [id*="product-categories-block"] a:hover,
html body.path-store [id*="product-categories-block"] a:hover {
  transform: none !important;
  translate: none !important;
}

/* Mobile main menu: never light gray panel with white text */
@media (max-width: 991.98px) {
  #main-menu.show,
  #main-menu.collapse.show,
  #main-menu.in {
    background-color: #3b0a5c !important;
    background: #3b0a5c !important;
  }
  #main-menu.show .menu-item,
  #main-menu.show .nav-item,
  #main-menu.show li,
  #main-menu.show a {
    background-color: transparent !important;
    background: transparent !important;
  }
  #main-menu.show a,
  #main-menu.show .menu-item a {
    color: #ffffff !important;
  }
  #main-menu.show a:hover,
  #main-menu.show a.is-active,
  #main-menu.show .menu-item--active-trail > a {
    color: #c9a0e8 !important;
  }
}

/* Hamburger: 40x40 dark purple, no rotate jump */
.nav-button,
button.navbar-toggle,
.navbar-toggler,
#header .nav-button {
  width: 40px !important;
  height: 40px !important;
  min-width: 40px !important;
  min-height: 40px !important;
  background-color: #3b0a5c !important;
  border: 2px solid #000 !important;
  border-radius: 6px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}
.nav-button i,
.nav-button .ti-menu,
.navbar-toggler i {
  transform: none !important;
  transition: opacity 0.15s ease !important;
  color: #fff !important;
}
.nav-button[aria-expanded="true"] i,
.nav-button.open i {
  transform: none !important;
}

/* Kill leftover Custom CSS white box on the cart summary wrapper. */
html body #wrapper .cart-block--summary,
html body #wrapper .header-cart .cart-block--summary,
html body #wrapper .header-element-item.header-cart .cart-block--summary,
html body #wrapper .cart--cart-block .cart-block--summary {
  border: 0 !important;
  border-color: transparent !important;
}

/* Cart + hamburger mid-line (~40px) */
@media (max-width: 991.98px) {
  .header-cart,
  .cart-block--summary,
  .header-element.header-cart {
    min-height: 40px !important;
    display: inline-flex !important;
    align-items: center !important;
  }
}

/* ==========================================================================
   Slide carousel visibility + full-bleed additional content
   (loads last via martis_get_late_theme_css — beats theme custom_css)
   Home + city taxonomy path-taxonomy service sliders
   ========================================================================== */

/* Do not force width on .owl-stage / .owl-item — Owl owns those. */

#content-wide-top .block.slide-block,
#content-wide-top .block.slide-block.fullwidth {
  width: 100% !important;
  max-width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

#content-wide-top .block.slide-block .container-wrap {
  width: 100% !important;
  max-width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* Carousel shell: allow height to grow with additional content */
.slide-block .hero.slide-carousel,
.slide-carousel.owl-carousel,
.hero.slide-carousel,
#content-wide-top .block.slide-block .hero.slide-carousel {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  width: 100% !important;
  max-width: 100% !important;
  max-height: none !important;
  overflow-x: hidden !important;
  overflow-y: visible !important;
  height: auto !important;
}

.slide-carousel.owl-carousel .owl-stage-outer,
.slide-block .hero.slide-carousel .owl-stage-outer {
  height: auto !important;
}

.slide-carousel.owl-carousel .owl-item.active,
.slide-carousel.owl-carousel .owl-item.active > .node--type-slide {
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

/*
 * Override custom_css:
 *   .node--type-slide .slide-additional-content { margin-top: -9.5rem !important; }
 * That pull-up hid the SEO panel under the hero when parents used overflow:hidden.
 */
.slide-carousel .slide-additional-content,
.slide-carousel .owl-item .slide-additional-content,
.hero.slide-carousel .slide-additional-content,
.slide-block .hero.slide-carousel .slide-additional-content,
.slide-carousel .slide-additional-content--bleed,
.slide-carousel .slide-additional-content.container,
.slide-carousel .owl-item .slide-additional-content.container,
.slide-carousel .slide-additional-content.container.py-5 {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  position: relative !important;
  box-sizing: border-box !important;
  z-index: 3 !important;
  clear: both !important;
  float: none !important;
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
}

.slide-carousel .slide-additional-content__inner {
  display: block !important;
  visibility: visible !important;
  width: 100% !important;
  max-width: none !important;
  box-sizing: border-box !important;
}

/* Hero image strip still full width */
.slide-carousel .slide-carousel-hero,
.slide-carousel .slide-carousel-hero .slide-image {
  width: 100% !important;
  max-width: 100% !important;
}

/* ==========================================================================
   DESKTOP nav visibility safety (loads last via late CSS)
   Bootstrap collapse is closed without .show on desktop; expand must win.
   Do not hide #main-menu.collapse:not(.show) outside max-width:767.98px.
   ========================================================================== */
@media (min-width: 768px) {
  .header #main-menu.navbar-collapse,
  .header #main-menu.collapse,
  .header #main-menu.collapse:not(.show),
  #main-menu.navbar-collapse,
  #main-menu.collapse,
  #main-menu.collapse:not(.show),
  .navbar-expand-md #main-menu,
  .navbar-expand-md .navbar-collapse {
    display: flex !important;
    flex-basis: auto !important;
    height: auto !important;
    max-height: none !important;
    visibility: visible !important;
    opacity: 1 !important;
    overflow: visible !important;
    position: relative !important;
  }

  .header .header-menu,
  .header .navbar.nav-menu,
  .header .primary-menu,
  .header .region-main-menu {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    max-height: none !important;
    overflow: visible !important;
  }

  /* Hide hamburger on desktop (menu is always open) */
  .header .navbar-toggler.nav-button {
    display: none !important;
  }
}

/* ==========================================================================
   Desktop menu: center pill row like cyberlytics.dev
   Late CSS so this wins over custom_css left-align leftovers.
   ========================================================================== */
@media (min-width: 768px) {
  .header #main-menu.navbar-collapse,
  .header #main-menu.collapse,
  .header #main-menu.collapse:not(.show),
  #main-menu.navbar-collapse,
  .navbar-expand-md #main-menu {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
  }

  .header .region-main-menu,
  .header .container-wrap.clearfix.mega-menu.main-menu-wrap,
  .header .container-wrap.clearfix.menu-wrap,
  .header .mega-menu.main-menu-wrap,
  .header .main-menu-wrap {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
  }

  .header #main-menu ul.menu.menu-parent,
  .header #main-menu ul.nav.menu.menu-parent,
  .header #block-martis-main-menu ul.menu.menu-parent,
  .header #block-martis-main-menu ul.nav.menu.menu-parent,
  .header .mega-menu > ul.menu.menu-parent,
  .header .mega-menu.main-menu-wrap > ul.menu.menu-parent,
  .header .container-wrap.menu-wrap > ul.nav.menu.menu-parent,
  .header .container-wrap.menu-wrap > ul.menu.menu-parent,
  .header [id^="block-martis-menu"] ul.nav.menu.menu-parent,
  .header [id^="block-martis-menu"] ul.menu.menu-parent,
  .header #block-martis-houston-menu ul.nav.menu.menu-parent,
  .header #block-martis-menukaty ul.nav.menu.menu-parent,
  .header #block-martis-spring-menu ul.nav.menu.menu-parent,
  .header #block-martis-tomball-menu ul.nav.menu.menu-parent,
  .header #block-martis-jerseyvillagemenu ul.nav.menu.menu-parent,
  .header #block-martis-menu-cypress ul.nav.menu.menu-parent {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    align-items: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: center !important;
    width: 100% !important;
  }

  .header #main-menu .menu-item,
  .header #main-menu li.menu-item,
  .header #block-martis-main-menu .menu-item,
  .header #block-martis-main-menu li.menu-item,
  .header [id^="block-martis-menu"] .menu-item,
  .header [id^="block-martis-menu"] li.menu-item,
  .header #block-martis-houston-menu .menu-item,
  .header #block-martis-menukaty .menu-item,
  .header .mega-menu > ul > li.menu-item {
    flex: 0 1 auto !important;
    width: auto !important;
    max-width: none !important;
    justify-content: center !important;
  }

  .header #main-menu .menu-item > a,
  .header #main-menu a,
  .header #block-martis-main-menu .menu-item > a,
  .header #block-martis-main-menu a,
  .header [id^="block-martis-menu"] .menu-item > a,
  .header [id^="block-martis-menu"] a,
  .header .mega-menu > ul > li > a {
    width: auto !important;
    display: inline-flex !important;
    justify-content: center !important;
    text-align: center !important;
    white-space: nowrap !important;
  }
}

/* ==========================================================================
   Header rail padding — match cyberlytics.dev (logo + call-to-order + right)
   Shared container inset; purple bar stays full-bleed.
   ========================================================================== */
:root {
  --jd-header-rail-max: 1140px;
  --jd-header-rail-pad-x: 1rem;
  --jd-header-rail-pad-y-desktop: 0.65rem;
  --jd-header-rail-pad-y-mobile: 0.5rem;
}

/* Kill custom_css / path negative margins that cancel rail padding */
.header .header-right-wrap,
.header .header-side.header-right-wrap,
.header .navbar > .container > .header-right-wrap,
.header .header-main-wrap,
.header .navbar > .container > .header-main-wrap,
.header .header-side.navbar-brand,
body.path-taxonomy .header .header-right-wrap,
body.path-products .header .header-right-wrap,
body.path-product .header .header-right-wrap,
body.path-frontpage .header .header-right-wrap,
body.path-taxonomy .header .header-main-wrap,
body.path-products .header .header-main-wrap {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

@media (min-width: 992px) {
  .header .navbar.header-center > .container,
  .navbar.header-center > .container,
  header.header .navbar.header-center > .container,
  html body.path-frontpage .header .navbar.header-center > .container,
  html body.path-taxonomy .header .navbar.header-center > .container,
  html body.path-node .header .navbar.header-center > .container,
  html body.path-product .header .navbar.header-center > .container,
  html body.path-products .header .navbar.header-center > .container,
  html body.path-store .header .navbar.header-center > .container {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
    max-width: var(--jd-header-rail-max) !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding: var(--jd-header-rail-pad-y-desktop) var(--jd-header-rail-pad-x) !important;
    box-sizing: border-box !important;
    gap: 0.75rem 1rem !important;
  }

  .header .header-side.navbar-brand,
  .header .header-right-wrap,
  .header #block-call-to-order,
  .header #block-martis-branding .container-wrap {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  .header .header-side.navbar-brand {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  .header .header-right-wrap,
  .header .header-side.header-right-wrap {
    padding-left: 0 !important;
    padding-right: 0 !important;
    justify-content: flex-end !important;
  }
}

@media (max-width: 767.98px) {
  .header .navbar.header-center > .container,
  .navbar.header-center > .container,
  header.header .navbar.header-center > .container {
    padding: var(--jd-header-rail-pad-y-mobile) var(--jd-header-rail-pad-x) !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .header .header-element {
    right: var(--jd-header-rail-pad-x) !important;
  }

  .header .header-main-wrap,
  .header .header-right-wrap {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}

/* Tablet: keep side pad even when row wraps */
@media (min-width: 768px) and (max-width: 991.98px) {
  .header .navbar.header-center > .container,
  .navbar.header-center > .container {
    padding-left: var(--jd-header-rail-pad-x) !important;
    padding-right: var(--jd-header-rail-pad-x) !important;
    max-width: var(--jd-header-rail-max) !important;
    margin-left: auto !important;
    margin-right: auto !important;
    box-sizing: border-box !important;
  }
}

/* ==========================================================================
   Slide carousel pre-heading watermark (jello) — fixed to the HERO image
   - NOT position:fixed (that scrolled with the page / drifted on mobile)
   - NOT margin-left:-7rem (that sat too far left on desktop)
   Centered in .slide-content-wrap (full hero). transform free for jello.
   ========================================================================== */

/* Hero is the positioning context for the watermark */
.slide-carousel .slide-carousel-hero {
  position: relative !important;
  overflow: hidden !important;
}

/* Keep chain static so absolute watermark uses .slide-content-wrap (full hero) */
.slide-carousel .pre-heading-text,
.slide-carousel .pre-heading-text--carousel,
.slide-carousel .pre-heading-text .field-items,
.slide-carousel .slide-content,
.slide-carousel .container.slide-wrap {
  position: static !important;
}

.slide-carousel .slide-carousel-hero .slide-content-wrap {
  position: absolute !important;
  inset: 0 !important;
  /* containing block for watermark */
}

/* Do not make content-main a containing block for the watermark */
.slide-carousel .slide-carousel-hero .slide-content-main {
  position: static !important;
  z-index: 4 !important;
}

/* Line 1 — normal centered label */
.slide-carousel .pre-heading-text,
.slide-carousel .pre-heading-text--carousel {
  width: 100% !important;
  text-align: center !important;
  z-index: 4 !important;
}

.slide-carousel .pre-heading-text .field-items {
  display: block !important;
  width: 100% !important;
  text-align: center !important;
}

.slide-carousel .pre-heading-text .field-items > .field-item:first-child,
.slide-carousel .pre-heading-text .field-items > div:first-child {
  position: relative !important;
  z-index: 5 !important;
  display: block !important;
  width: 100% !important;
  max-width: 36rem !important;
  margin: 0 auto !important;
  text-align: center !important;
  font-size: inherit !important;
  font-weight: inherit !important;
  opacity: 1 !important;
  letter-spacing: normal !important;
  -webkit-text-stroke: 0 !important;
  -webkit-text-fill-color: currentColor !important;
  text-shadow: 0 1px 0 black, 0 -1px 0 black, 1px 0 0 black, -1px 0 0 black, 0 0 6px black !important;
  color: inherit !important;
}

/*
 * Watermark — pinned to hero center (absolute), horizontally centered.
 * left/right 0 + margin auto centers without transform (jello safe).
 */
.slide-carousel .owl-item.active .field.field-field-pre-heading-text.field-type-string.field-label-hidden.field-items > div:nth-child(2),
.slide-carousel .owl-item.active .field.field-field-pre-heading-text .field-items > .field-item:nth-child(2),
.slide-carousel .owl-item.active .pre-heading-text .field-item.animate__animated,
.slide-carousel .owl-item.active .pre-heading-text .field-item.animate__jello,
.slide-carousel .owl-item.active .field-field-pre-heading-text .animate__jello,
.slide-carousel .owl-item.active .field-field-pre-heading-text .animate__animated.animate__jello.animate__delay-2s.animate__slow.animate__infinite,
.hero.slide-carousel:not(.owl-loaded) > .node--type-slide:first-child .field.field-field-pre-heading-text .field-items > .field-item:nth-child(2),
.hero.slide-carousel:not(.owl-loaded) > .node--type-slide:first-child .field.field-field-pre-heading-text .field-items > div:nth-child(2) {
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  top: 20%;
  bottom: auto !important;
  /* Vertical nudge without transform: half a line-height up via negative margin in rem */
  margin: -5rem auto 0 !important; /* ~half of 10rem line — keeps word centered in hero */
  padding: 0 !important;
  width: max-content !important;
  max-width: 100% !important;
  display: block !important;
  text-align: center !important;
  white-space: nowrap !important;
  font-size: 10rem;
  line-height: 1 !important;
  font-weight: 400 !important;
  letter-spacing: 0.5rem !important;
  opacity: 0.35 !important;
  z-index: 1 !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  -webkit-text-stroke: 2px #000 !important;
  paint-order: stroke fill !important;
  text-shadow:
    -5px 3px 3px black,
    0 1px 0 black,
    1px 0 0 black,
    -1px 0 0 black,
    0 0 1px black !important;
  pointer-events: none !important;
  float: none !important;
  visibility: visible !important;
  animation-play-state: running !important;
  /* no transform property — jello owns it */
}

/* Inactive slides: no watermark */
.slide-carousel .owl-item:not(.active) .field.field-field-pre-heading-text .field-items > .field-item:nth-child(2),
.slide-carousel .owl-item:not(.active) .field.field-field-pre-heading-text .field-items > div:nth-child(2),
.slide-carousel .owl-item:not(.active) .pre-heading-text .field-item.animate__jello {
  display: none !important;
  visibility: hidden !important;
  animation: none !important;
  pointer-events: none !important;
}

/* Readable copy above watermark */
.slide-carousel .pre-heading-text .field-items > .field-item:first-child,
.slide-carousel .heading-text,
.slide-carousel .slide-content-body,
.slide-carousel .slide-button {
  position: relative !important;
  z-index: 5 !important;
}

/* Tablet / mobile — same anchoring, cyber 3rem size */
@media (max-width: 1000px) {
  .slide-carousel .owl-item.active .field.field-field-pre-heading-text .field-items > .field-item:nth-child(2),
  .slide-carousel .owl-item.active .field.field-field-pre-heading-text .field-items > div:nth-child(2),
  .slide-carousel .owl-item.active .pre-heading-text .field-item.animate__jello,
  .slide-carousel .owl-item.active .field-field-pre-heading-text .animate__jello,
  .hero.slide-carousel:not(.owl-loaded) > .node--type-slide:first-child .field.field-field-pre-heading-text .field-items > .field-item:nth-child(2),
  .hero.slide-carousel:not(.owl-loaded) > .node--type-slide:first-child .field.field-field-pre-heading-text .field-items > div:nth-child(2) {
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    top: 50% !important;
    margin: -1.5rem auto 0 !important; /* half of 3rem */
    font-size: 3rem !important;
    letter-spacing: 0.35rem !important;
    opacity: 0.35 !important;
    -webkit-text-stroke: 2px #000 !important;
    font-weight: 400 !important;
    max-width: 100% !important;
    text-align: center !important;
  }
}

@media (max-width: 767.98px) {
  .slide-carousel .owl-item.active .field.field-field-pre-heading-text .field-items > .field-item:nth-child(2),
  .slide-carousel .owl-item.active .field.field-field-pre-heading-text .field-items > div:nth-child(2),
  .slide-carousel .owl-item.active .pre-heading-text .field-item.animate__jello,
  .slide-carousel .owl-item.active .field-field-pre-heading-text .animate__jello,
  .hero.slide-carousel:not(.owl-loaded) > .node--type-slide:first-child .field.field-field-pre-heading-text .field-items > .field-item:nth-child(2),
  .hero.slide-carousel:not(.owl-loaded) > .node--type-slide:first-child .field.field-field-pre-heading-text .field-items > div:nth-child(2) {
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    top: 50% !important;
    /* Was 3rem; 5× smaller → 0.6rem; half-height nudge for vertical center */
    margin: -0.3rem auto 0 !important;
    letter-spacing: 0.05rem !important;
    opacity: 0.35 !important;
    -webkit-text-stroke: 0.4px #000 !important;
    font-weight: 400 !important;
    max-width: 100% !important;
    text-align: center !important;
  }
}

/* Overlay fills hero image; content centered */
.slide-carousel .slide-carousel-hero .slide-content-wrap,
.hero.slide-carousel .slide-carousel-hero .slide-content-wrap,
#wrapper .slide-carousel .slide-content-wrap {
  position: absolute !important;
  inset: 0 !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  width: 100% !important;
  height: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  padding: 0.75rem 1rem !important;
  box-sizing: border-box !important;
  margin: 0 !important;
  transform: none !important;
  z-index: 3 !important;
}

/* Content rail inside overlay */
.slide-carousel .container.slide-wrap,
.slide-carousel .slide-carousel-hero .container.slide-wrap,
.hero.slide-carousel .container.slide-wrap,
#wrapper .slide-carousel .container.slide-wrap {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  max-width: 720px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  text-align: center !important;
  height: auto !important;
  max-height: 100% !important;
  top: 0 !important;
  left: auto !important;
  right: auto !important;
  position: relative !important;
  box-sizing: border-box !important;
}

/* Force center even when CMS left classes remain */
.slide-carousel .slide-content,
.slide-carousel .slide-content-main,
.slide-carousel .slide-content-main.float-center,
.slide-carousel .slide-content-main.text-left,
.slide-carousel .slide-content-main.text-center,
.slide-carousel .slide-content-main.float-center.text-left,
.slide-carousel .slide-content-main.float-center.text-center,
#wrapper .slide-carousel .slide-content-main {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  float: none !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  margin-top: 0 !important;
  box-sizing: border-box !important;
}

.slide-carousel .pre-heading-text,
.slide-carousel .pre-heading-text--carousel,
.slide-carousel .heading-text,
.slide-carousel .slide-content-body,
.slide-carousel .pre-heading-text .field-items,
.slide-carousel .heading-text .field-item,
.slide-carousel .heading-text .heading-text-content,
.slide-carousel .slide-content-body p,
.slide-carousel .slide-content-body .field-item,
#wrapper .slide-carousel .pre-heading-text,
#wrapper .slide-carousel .heading-text {
  text-align: center !important;
  width: 100% !important;
  max-width: 36rem !important;
  margin-left: auto !important;
  margin-right: auto !important;
  float: none !important;
  box-sizing: border-box !important;
}

/* First pre-heading line only — never the jello watermark line */
.slide-carousel .pre-heading-text .field-items > .field-item:first-child,
.slide-carousel .pre-heading-text .field-items > div:first-child {
  text-align: center !important;
  width: 100% !important;
  max-width: 36rem !important;
  margin-left: auto !important;
  margin-right: auto !important;
  float: none !important;
  box-sizing: border-box !important;
}

/* Pre-heading field list — static so fixed watermark is not constrained */
.slide-carousel .pre-heading-text .field-items,
.slide-carousel .pre-heading-text--carousel .field-items {
  display: block !important;
  position: static !important;
  width: 100% !important;
  margin: 0 auto !important;
  text-align: center !important;
  min-height: 1.2em !important;
}

/*
 * Do not set transform on the jello watermark (animate.css owns it).
 * Override any parent/cascade transform:none that targeted these nodes.
 */
.slide-carousel .pre-heading-text .field-items > .field-item:nth-child(2),
.slide-carousel .pre-heading-text .field-items > div:nth-child(2),
.slide-carousel .pre-heading-text .field-item.animate__animated,
.slide-carousel .pre-heading-text .field-item.animate__jello,
.slide-carousel .field-field-pre-heading-text .field-item:nth-child(2) {
  /* Explicitly allow animation transforms */
  -webkit-animation-name: jello !important;
  animation-name: jello !important;
  -webkit-animation-duration: 2s !important;
  animation-duration: 2s !important;
  -webkit-animation-delay: 2s !important;
  animation-delay: 2s !important;
  -webkit-animation-timing-function: ease-in-out !important;
  animation-timing-function: ease-in-out !important;
  -webkit-animation-iteration-count: infinite !important;
  animation-iteration-count: infinite !important;
  -webkit-animation-fill-mode: both !important;
  animation-fill-mode: both !important;
}

.slide-carousel .slide-button,
.slide-carousel .nav.menu.alt-button.mt-4.slide-button,
#wrapper .slide-carousel .slide-button {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
}

.slide-carousel a.button.slide-button-link {
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

@media (max-width: 767.98px) {
  .slide-carousel .slide-carousel-hero .slide-content-wrap,
  .hero.slide-carousel .slide-content-wrap {
    padding: 0.55rem 0.85rem !important;
    align-items: center !important;
    justify-content: center !important;
  }

  .slide-carousel .container.slide-wrap {
    max-width: 100% !important;
    height: 100% !important;
  }

  .slide-carousel .slide-content {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;
    text-align: center !important;
    width: 100% !important;
    height: 100% !important;
    max-height: 100% !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }

  .slide-carousel .slide-content-main,
  .slide-carousel .slide-content-main.float-center.text-left,
  .slide-carousel .slide-content-main.float-center.text-center {
    margin-top: auto !important;
    margin-bottom: auto !important;
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: center !important;
    align-items: center !important;
  }
}


/* ==========================================================================
   Watermark pin: force containing block = hero overlay (beats later rules)
   ========================================================================== */
.slide-carousel .owl-item.active .slide-carousel-hero .slide-content-wrap,
.hero.slide-carousel:not(.owl-loaded) > .node--type-slide:first-child .slide-carousel-hero .slide-content-wrap {
  position: absolute !important;
  inset: 0 !important;
  overflow: hidden !important;
}

.slide-carousel .owl-item.active .slide-carousel-hero .container.slide-wrap,
.slide-carousel .owl-item.active .slide-carousel-hero .slide-content,
.slide-carousel .owl-item.active .slide-carousel-hero .slide-content-main {
  position: static !important;
}

.slide-carousel .owl-item.active .field.field-field-pre-heading-text .field-items > .field-item:nth-child(2),
.slide-carousel .owl-item.active .field.field-field-pre-heading-text .field-items > div:nth-child(2) {
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  top: 50% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  /* no negative horizontal margin — was shifting left on desktop */
  text-align: center !important;
}

/* Mobile watermark: 5× smaller than previous 3rem (→ 0.6rem) */
@media (max-width: 767.98px) {
  .slide-carousel .owl-item.active .field.field-field-pre-heading-text .field-items > .field-item:nth-child(2),
  .slide-carousel .owl-item.active .field.field-field-pre-heading-text .field-items > div:nth-child(2),
  .slide-carousel .owl-item.active .pre-heading-text .field-item.animate__jello,
  .slide-carousel .owl-item.active .field-field-pre-heading-text .animate__jello,
  .hero.slide-carousel:not(.owl-loaded) > .node--type-slide:first-child .field.field-field-pre-heading-text .field-items > .field-item:nth-child(2),
  .hero.slide-carousel:not(.owl-loaded) > .node--type-slide:first-child .field.field-field-pre-heading-text .field-items > div:nth-child(2) {
    margin-top: -0.3rem !important;
    margin-left: auto !important;
    margin-right: auto !important;
    letter-spacing: 0.05rem !important;
    -webkit-text-stroke: 0.4px #000 !important;
  }
}

/* assets/css/jd-account-menu.css */
/**
 * @file
 * Johnny Detail account menu.
 *
 * Full replacement stylesheet for the account disclosure in the Martis header.
 * Purple Johnny Detail theme with a two-column menu grid.
 */

:where(#wrapper, .jd-header-account-panel-host) .jd-account-menu,
.jd-header-account-panel-host {
  --jd-account-deep: #3b0a5c;
  --jd-account-purple: #6817aa;
  --jd-account-bright: #8d3bd1;
  --jd-account-violet: #a855f7;
  --jd-account-lilac: #ead7ff;
  --jd-account-soft: #f7efff;
  --jd-account-ink: #1a0924;
  --jd-account-panel: #16071f;
  --jd-account-panel-2: #250b34;
  --jd-account-border: rgba(207, 146, 255, 0.42);
  --jd-account-menu-panel-top: 7.5rem;
  --jd-account-menu-inner-height: 2.8125rem;
  --jd-account-menu-desktop-container: 960px;
  --jd-account-menu-desktop-inset: calc(25px + 0.75rem);
  --jd-account-menu-desktop-lift: 0px;
  --jd-account-menu-panel-viewport-top:
    calc(22px + var(--jd-account-menu-inner-height) + 0.65rem - var(--jd-account-menu-desktop-lift) + var(--drupal-displace-offset-top, 0px));
}

:where(#wrapper) .jd-account-menu {
  display: inline-block;
  position: relative;
  width: auto;
  z-index: 90;
}

/* Hosts remain outside the header without creating another containing block. */
.jd-header-panel-host {
  display: contents;
}

/* iOS and the non-popover fallback keep scrolling inside a separate fixed layer. */
.jd-header-panel-host--fixed {
  --jd-header-panel-position: absolute;
  display: block !important;
  position: fixed !important;
  inset: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  overflow: visible !important;
  pointer-events: none;
  transform: translateZ(0);
  z-index: 1200;
}

.jd-header-panel-host--fixed > .jd-account-menu__panel,
.jd-header-panel-host--fixed > .cart-block--contents {
  pointer-events: auto;
}

/* Preserve page scrolling without bouncing the fixed layer at either edge. */
html:has(> body > .jd-header-panel-host--fixed),
body:has(> .jd-header-panel-host--fixed) {
  overscroll-behavior-y: none;
}

/* Opt-in layout readings at ?jd-panel-check=1; absent on ordinary visits. */
.jd-header-panel-check {
  position: fixed !important;
  inset: auto !important;
  left: 12px !important;
  bottom: calc(12px + env(safe-area-inset-bottom, 0px)) !important;
  margin: 0 !important;
  padding: 8px 10px !important;
  min-height: 44px;
  border: 2px solid #6716aa !important;
  border-radius: 6px !important;
  background: #f3f1f6 !important;
  color: #241438 !important;
  font: 12px/1.3 sans-serif !important;
  z-index: 1201 !important;
}

:where(#wrapper, .jd-header-account-panel-host) .jd-account-menu__inner {
  position: relative;
  width: auto;
}

/* Responsive header geometry; the shared panel top adds visible toolbar space. */
@media (min-width: 992px) and (max-width: 1000px) {
  :where(#wrapper, .jd-header-account-panel-host) .jd-account-menu,
  .jd-header-account-panel-host {
    --jd-account-menu-desktop-inset: calc(40px + 0.75rem);
  }
}

@media (min-width: 1200px) {
  :where(#wrapper, .jd-header-account-panel-host) .jd-account-menu,
  .jd-header-account-panel-host {
    --jd-account-menu-desktop-container: 1220px;
    --jd-account-menu-desktop-inset: calc(30px + 0.75rem);
    --jd-account-menu-desktop-lift: 0.35rem;
  }
}

/* Reviewed header trigger geometry must beat legacy route-specific margins. */
html body[class*="path-"] #wrapper header.header .header-top .jd-account-menu__trigger {
  font-size: 0.94rem !important;
  font-weight: 500 !important;
  letter-spacing: 0.01em !important;
  line-height: 1.2 !important;
  margin: 0 !important;
}

html body[class*="path-"] #wrapper header.header .header-top .jd-account-menu__label {
  letter-spacing: inherit !important;
}

@media (min-width: 768.01px) {
  html body[class*="path-"] #wrapper header.header .header-top nav#block-martis-useraccountmenu {
    margin: 0 15px 0 0 !important;
  }
}

@media (min-width: 1200px) {
  html body[class*="path-"] #wrapper header.header .header-top nav#block-martis-useraccountmenu {
    /* Trigger lift matches the independent desktop panel anchor above. */
    top: -0.35rem !important;
  }
}

@media (max-width: 768px) {
  html body[class*="path-"] #wrapper header.header .header-top nav#block-martis-useraccountmenu {
    align-items: center !important;
    margin: 0 !important;
  }
}


/* =========================================================
   Trigger
   ========================================================= */

:where(#wrapper, .jd-header-account-panel-host) .jd-account-menu__trigger {
  appearance: none;
  align-items: center;

  background: linear-gradient(
    135deg,
    #a45ae2 0%,
    var(--jd-account-bright) 35%,
    var(--jd-account-purple) 68%,
    var(--jd-account-deep) 100%
  ) !important;

  border: 2px solid #16031f !important;
  border-radius: 999px !important;

  box-shadow:
    0 2px 0 rgba(0, 0, 0, 0.9),
    0 8px 22px rgba(59, 10, 92, 0.3),
    inset 0 1px 0 rgba(255, 255, 255, 0.22) !important;

  color: #fff !important;
  cursor: pointer;

  display: inline-flex !important;

  font: inherit;
  font-size: 0.94rem;
  font-weight: 800;

  gap: 0.5rem;
  justify-content: center;

  line-height: 1.2;

  margin: 0 !important;

  min-height: 44px;
  min-width: 44px;

  padding: 0.38rem 0.82rem 0.42rem 0.48rem !important;

  position: relative;

  /* Keep the toggle usable when a displaced header overlaps its fixed panel. */
  z-index: 92;

  text-align: center;
  text-decoration: none;
  text-shadow: none !important;

  transform: translateY(0);

  transition:
    background 180ms ease,
    box-shadow 180ms ease,
    transform 180ms ease;

  white-space: nowrap;
}

:where(#wrapper, .jd-header-account-panel-host) .jd-account-menu__trigger:hover,
:where(#wrapper, .jd-header-account-panel-host) .jd-account-menu__trigger[aria-expanded="true"] {
  background: linear-gradient(
    135deg,
    #b868f1 0%,
    #9b4cdb 36%,
    #7420b8 68%,
    #4a0d76 100%
  ) !important;

  border-color: #16031f !important;

  box-shadow:
    0 2px 0 rgba(0, 0, 0, 0.9),
    0 11px 26px rgba(59, 10, 92, 0.38),
    0 0 0 3px rgba(168, 85, 247, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.26) !important;

  color: #fff !important;
  transform: translateY(-1px);
}

:where(#wrapper, .jd-header-account-panel-host) .jd-account-menu__trigger:active {
  box-shadow:
    0 1px 0 #000,
    0 5px 12px rgba(59, 10, 92, 0.25) !important;

  transform: translateY(1px);
}

:where(#wrapper, .jd-header-account-panel-host) .jd-account-menu__trigger:focus-visible {
  outline: 3px solid #fff !important;
  outline-offset: 2px;
}


/* Trigger icon */

:where(#wrapper, .jd-header-account-panel-host) .jd-account-menu__icon {
  background: rgba(255, 255, 255, 0.13) !important;

  border: 1px solid rgba(255, 255, 255, 0.68) !important;
  border-radius: 50% !important;

  box-sizing: content-box !important;

  fill: none !important;

  flex: 0 0 1.1rem !important;

  height: 1.1rem !important;
  width: 1.1rem !important;

  margin: 0 !important;
  padding: 0.27rem !important;

  scale: none !important;

  stroke: currentColor !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  stroke-width: 2.1 !important;

  transform: none !important;
}

:where(#wrapper, .jd-header-account-panel-host) .jd-account-menu__icon path {
  fill: none !important;
  scale: none !important;
  transform: none !important;
}

:where(#wrapper, .jd-header-account-panel-host) .jd-account-menu__label {
  margin: 0 !important;
}


/* Chevron */

:where(#wrapper, .jd-header-account-panel-host) .jd-account-menu__chevron {
  border-bottom: 2px solid currentColor;
  border-right: 2px solid currentColor;

  flex: 0 0 auto;

  height: 0.4rem;
  width: 0.4rem;

  margin: -0.15rem 0.05rem 0 0;

  transform: rotate(45deg);

  transition: transform 160ms ease;
}

:where(#wrapper, .jd-header-account-panel-host)
  .jd-account-menu__trigger[aria-expanded="true"]
  .jd-account-menu__chevron {
  margin-top: 0.15rem;
  transform: rotate(225deg);
}


/* =========================================================
   Dropdown panel
   ========================================================= */

:where(#wrapper, .jd-header-account-panel-host) .jd-account-menu__panel {
  /* Reset native popover centering; the reviewed viewport anchors own placement. */
  inset: auto;
  height: auto;
  background: linear-gradient(
    160deg,
    #260b36 0%,
    #1b0826 42%,
    #120619 100%
  ) !important;

  border: 2px solid #1b0325 !important;
  border-radius: 1.15rem !important;

  box-shadow:
    0 5px 0 rgba(18, 2, 26, 0.92),
    0 20px 50px rgba(45, 6, 71, 0.42),
    0 0 32px rgba(141, 59, 209, 0.14) !important;

  color: #fff !important;

  margin: 0 !important;

  max-height: min(30rem, var(--jd-header-panel-available-height, calc(100vh - var(--jd-account-menu-panel-viewport-top) - 0.75rem)));
  max-height: min(30rem, var(--jd-header-panel-available-height, calc(100dvh - var(--jd-account-menu-panel-viewport-top) - 0.75rem)));

  max-width: calc(100vw - 2rem);

  overflow: hidden auto !important;

  padding: 0 !important;

  position: var(--jd-header-panel-position, fixed) !important;

  right: calc(max(0px, (100% - var(--jd-account-menu-desktop-container)) / 2) + var(--jd-account-menu-desktop-inset));
  top: var(--jd-account-menu-panel-viewport-top);
  /* Legacy global transitions must not animate toolbar offset corrections. */
  transition: none !important;

  width: clamp(21rem, 27vw, 24rem) !important;

  z-index: 91;
}


.jd-header-account-panel-host .jd-account-menu__panel {
  z-index: 1200;
}

:where(#wrapper, .jd-header-account-panel-host) .jd-account-menu__panel[hidden] {
  display: none !important;
}


/* =========================================================
   Purple portal header
   ========================================================= */

:where(#wrapper, .jd-header-account-panel-host) .jd-account-menu__panel-header {
  align-items: center !important;

  background:
    radial-gradient(
      circle at 8% 0%,
      rgba(215, 157, 255, 0.26),
      transparent 42%
    ),
    radial-gradient(
      circle at 92% 110%,
      rgba(168, 85, 247, 0.18),
      transparent 48%
    ),
    linear-gradient(
      135deg,
      #5d1a84 0%,
      #43125f 47%,
      #2d0b40 100%
    ) !important;

  border-bottom:
    1px solid rgba(215, 157, 255, 0.28) !important;

  display: flex !important;

  gap: 0.9rem !important;

  min-height: 96px;

  overflow: hidden;

  padding: 1.25rem 1.35rem !important;

  position: relative;
}


/* Header glow line */

:where(#wrapper, .jd-header-account-panel-host) .jd-account-menu__panel-header::after {
  background: linear-gradient(
    90deg,
    transparent,
    rgba(213, 163, 255, 0.84),
    transparent
  );

  bottom: 0;

  content: "";

  height: 1px;

  left: 1.2rem;
  right: 1.2rem;

  position: absolute;
}


/* =========================================================
   IMPORTANT: Header icon sizing
   This prevents the giant black SVG from the screenshot
   ========================================================= */

:where(#wrapper, .jd-header-account-panel-host) .jd-account-menu__panel-icon {
  align-items: center !important;

  background: linear-gradient(
    145deg,
    rgba(190, 111, 255, 0.24),
    rgba(96, 28, 139, 0.3)
  ) !important;

  border: 1px solid rgba(218, 170, 255, 0.34) !important;
  border-radius: 0.9rem !important;

  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.14),
    0 7px 18px rgba(49, 6, 72, 0.26) !important;

  color: #fff !important;

  display: flex !important;

  flex: 0 0 3rem !important;

  height: 3rem !important;
  width: 3rem !important;

  max-height: 3rem !important;
  max-width: 3rem !important;

  min-height: 3rem !important;
  min-width: 3rem !important;

  justify-content: center !important;

  margin: 0 !important;
  padding: 0 !important;

  position: relative;

  z-index: 1;
}

:where(#wrapper, .jd-header-account-panel-host) .jd-account-menu__panel-icon svg {
  background: none !important;

  border: 0 !important;
  border-radius: 0 !important;

  box-shadow: none !important;

  display: block !important;

  fill: none !important;

  flex: 0 0 1.45rem !important;

  height: 1.45rem !important;
  width: 1.45rem !important;

  max-height: 1.45rem !important;
  max-width: 1.45rem !important;

  min-height: 0 !important;
  min-width: 0 !important;

  margin: 0 !important;
  padding: 0 !important;

  scale: none !important;

  stroke: currentColor !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  stroke-width: 1.9 !important;

  transform: none !important;
}

:where(#wrapper, .jd-header-account-panel-host) .jd-account-menu__panel-icon svg path {
  fill: none !important;
  scale: none !important;
  transform: none !important;
}


/* =========================================================
   Portal header text
   ========================================================= */

:where(#wrapper, .jd-header-account-panel-host) .jd-account-menu__panel-heading {
  display: flex !important;
  flex: 1 1 auto;

  flex-direction: column !important;
  justify-content: center;

  min-width: 0;

  position: relative;

  z-index: 1;
}

:where(#wrapper, .jd-header-account-panel-host) .jd-account-menu__eyebrow {
  color: #fff !important;

  display: block !important;

  font-size: 0.82rem !important;
  font-weight: 800 !important;

  letter-spacing: 0.065em !important;
  line-height: 1.3 !important;

  margin: 0 0 0.25rem !important;

  text-transform: uppercase !important;
}

:where(#wrapper, .jd-header-account-panel-host) .jd-account-menu__panel-description {
  color: #ead8f8 !important;

  display: block !important;

  font-size: 0.82rem !important;
  font-weight: 400 !important;

  line-height: 1.4 !important;

  margin: 0 !important;
}


/* =========================================================
   MENU GRID
   My account | Dashboard
          Log out
   ========================================================= */

:where(#wrapper, .jd-header-account-panel-host) .jd-account-menu__links {
  background: linear-gradient(
    180deg,
    rgba(136, 52, 190, 0.11),
    rgba(62, 16, 85, 0.04) 65%,
    transparent 100%
  ) !important;

  display: block !important;

  padding: 0.85rem !important;
}


/* Override Martis horizontal nav styling */

:where(#wrapper, .jd-header-account-panel-host)
  .header-top.dark-header-top
  .jd-account-menu__links ul,
:where(#wrapper, .jd-header-account-panel-host) .jd-account-menu__links ul,
:where(#wrapper, .jd-header-account-panel-host) .jd-account-menu__links ul.menu,
:where(#wrapper, .jd-header-account-panel-host) .jd-account-menu__links .menu,
:is(#wrapper .header, .jd-header-account-panel-host)
  .jd-account-menu__links
  > ul.nav.menu.menu-parent {

  align-items: stretch !important;

  background: transparent !important;

  display: grid !important;

  float: none !important;

  gap: 0.65rem !important;

  grid-template-columns:
    repeat(2, minmax(0, 1fr)) !important;

  list-style: none !important;

  margin: 0 !important;
  padding: 0 !important;

  width: 100% !important;
}


/* Reset inherited menu item styles */

:where(#wrapper, .jd-header-account-panel-host)
  .header-top.dark-header-top
  .jd-account-menu__links
  li.menu-item,
:where(#wrapper, .jd-header-account-panel-host) .jd-account-menu__links li,
:where(#wrapper, .jd-header-account-panel-host) .jd-account-menu__links li.menu-item,
:where(#wrapper, .jd-header-account-panel-host) .jd-account-menu__links .menu-item,
:is(#wrapper .header, .jd-header-account-panel-host)
  .jd-account-menu__links
  > ul.nav.menu.menu-parent
  > li.menu-item {

  background: transparent !important;

  border: 0 !important;
  border-radius: 0 !important;

  display: block !important;

  flex: none !important;
  float: none !important;

  list-style: none !important;

  margin: 0 !important;

  max-width: none !important;
  min-width: 0 !important;

  padding: 0 !important;

  width: 100% !important;
}


/*
 * If the final item sits alone on an odd-numbered row,
 * center it beneath the two columns.
 *
 *  My account | Dashboard
 *       Log out
 */

:where(#wrapper, .jd-header-account-panel-host)
  .jd-account-menu__links
  li:last-child:nth-child(odd),
:where(#wrapper, .jd-header-account-panel-host)
  .jd-account-menu__links
  .menu-item:last-child:nth-child(odd) {

  grid-column: 1 / -1 !important;

  justify-self: center !important;

  width: calc(50% - 0.325rem) !important;
}


/* =========================================================
   Menu buttons
   ========================================================= */

:where(#wrapper, .jd-header-account-panel-host)
  .header-top.dark-header-top
  .jd-account-menu__links a,
:where(#wrapper, .jd-header-account-panel-host) .jd-account-menu__links a,
:where(#wrapper, .jd-header-account-panel-host) .jd-account-menu__links li a,
:where(#wrapper, .jd-header-account-panel-host) .jd-account-menu__links .menu-item a {

  align-items: center !important;

  background: linear-gradient(
    145deg,
    rgba(120, 43, 172, 0.5),
    rgba(70, 20, 100, 0.48)
  ) !important;

  border: 1px solid rgba(197, 126, 247, 0.3) !important;
  border-radius: 0.82rem !important;

  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.08),
    0 5px 14px rgba(37, 4, 54, 0.16) !important;

  box-sizing: border-box !important;

  color: #f9efff !important;

  display: flex !important;

  font-size: 0.95rem !important;
  font-weight: 700 !important;

  gap: 0 !important;

  justify-content: center !important;

  line-height: 1.25 !important;

  margin: 0 !important;

  min-height: 54px !important;
  min-width: 0 !important;

  padding: 0.7rem 0.85rem !important;

  text-align: center !important;
  text-decoration: none !important;
  text-indent: 0 !important;
  text-shadow: none !important;

  transform: none;

  transition:
    background 160ms ease,
    border-color 160ms ease,
    box-shadow 160ms ease,
    color 160ms ease,
    transform 160ms ease;

  white-space: normal !important;

  width: 100% !important;
}


/* Kill old arrow/pill pseudo-elements */

:where(#wrapper, .jd-header-account-panel-host) .jd-account-menu__links a::before,
:where(#wrapper, .jd-header-account-panel-host) .jd-account-menu__links a::after {
  content: none !important;
  display: none !important;
}

/* Keep decorative link icons in the portal's existing button color. */
html body .jd-header-account-panel-host .jd-account-menu__links a.ext > svg.ext {
  color: inherit !important;
}


/* Hover */

:where(#wrapper, .jd-header-account-panel-host)
  .header-top.dark-header-top
  .jd-account-menu__links a:hover,
:where(#wrapper, .jd-header-account-panel-host)
  .header-top.dark-header-top
  .jd-account-menu__links a:focus-visible,
:where(#wrapper, .jd-header-account-panel-host) .jd-account-menu__links a:hover,
:where(#wrapper, .jd-header-account-panel-host) .jd-account-menu__links a:focus-visible {

  background: linear-gradient(
    135deg,
    #9147ce 0%,
    #6a2798 100%
  ) !important;

  border-color:
    rgba(220, 163, 255, 0.72) !important;

  box-shadow:
    0 8px 20px rgba(78, 14, 117, 0.3),
    inset 0 1px 0 rgba(255, 255, 255, 0.15) !important;

  color: #fff !important;

  outline: none !important;

  text-decoration: none !important;

  transform: translateY(-2px);
}


/* Keyboard focus */

:where(#wrapper, .jd-header-account-panel-host)
  .jd-account-menu__links a:focus-visible {

  outline: 2px solid #e0b6ff !important;
  outline-offset: 2px !important;
}


/* Current page */

:where(#wrapper, .jd-header-account-panel-host)
  .jd-account-menu__links a.is-active,
:where(#wrapper, .jd-header-account-panel-host)
  .jd-account-menu__links li.active > a,
:where(#wrapper, .jd-header-account-panel-host)
  .jd-account-menu__links
  .menu-item--active-trail > a {

  background: linear-gradient(
    135deg,
    #a050df 0%,
    #762cab 100%
  ) !important;

  border-color:
    rgba(225, 174, 255, 0.78) !important;

  box-shadow:
    0 7px 20px rgba(102, 30, 151, 0.32),
    inset 0 1px 0 rgba(255, 255, 255, 0.16) !important;

  color: #fff !important;
}


/* =========================================================
   Log out
   ========================================================= */

:where(#wrapper, .jd-header-account-panel-host)
  .jd-account-menu__links li:last-child a,
:where(#wrapper, .jd-header-account-panel-host)
  .jd-account-menu__links .menu-item:last-child a {

  background: linear-gradient(
    145deg,
    rgba(102, 31, 145, 0.4),
    rgba(59, 15, 84, 0.42)
  ) !important;

  border-color:
    rgba(190, 112, 247, 0.25) !important;

  color: #edd5ff !important;
}

:where(#wrapper, .jd-header-account-panel-host)
  .jd-account-menu__links li:last-child a:hover,
:where(#wrapper, .jd-header-account-panel-host)
  .jd-account-menu__links li:last-child a:focus-visible,
:where(#wrapper, .jd-header-account-panel-host)
  .jd-account-menu__links .menu-item:last-child a:hover,
:where(#wrapper, .jd-header-account-panel-host)
  .jd-account-menu__links .menu-item:last-child a:focus-visible {

  background: linear-gradient(
    135deg,
    #863ec0 0%,
    #5d2186 100%
  ) !important;

  border-color:
    rgba(216, 157, 255, 0.62) !important;

  color: #fff !important;
}


/* =========================================================
   Tablet/mobile
   ========================================================= */

@media (max-width: 991.98px) {

  :where(#wrapper, .jd-header-account-panel-host) .jd-account-menu__trigger {
    min-height: 44px;
  }

  :where(#wrapper, .jd-header-account-panel-host) .jd-account-menu__panel {
    --jd-account-menu-panel-viewport-top:
      calc(var(--jd-account-menu-panel-top) + var(--drupal-displace-offset-top, 0px));

    bottom: auto;

    left:
      max(0.75rem, env(safe-area-inset-left));

    max-height:
      var(--jd-header-panel-available-height, calc(
        100vh -
        var(--jd-account-menu-panel-viewport-top) -
        0.75rem
      ));

    max-height:
      var(--jd-header-panel-available-height, calc(
        100dvh -
        var(--jd-account-menu-panel-viewport-top) -
        0.75rem
      ));

    max-width: none;

    position: var(--jd-header-panel-position, fixed) !important;

    right:
      max(0.75rem, env(safe-area-inset-right));

    /* Keep the mobile anchor below the actual visible admin toolbar. */
    top: var(--jd-account-menu-panel-viewport-top) !important;

    width: auto !important;
  }

}


/* Smaller phones */

@media (max-width: 480px) {

  :where(#wrapper, .jd-header-account-panel-host)
    .jd-account-menu__panel-header {

    gap: 0.75rem !important;

    min-height: 88px;

    padding: 1rem !important;
  }

  :where(#wrapper, .jd-header-account-panel-host)
    .jd-account-menu__panel-icon {

    flex-basis: 2.75rem !important;

    height: 2.75rem !important;
    width: 2.75rem !important;

    max-height: 2.75rem !important;
    max-width: 2.75rem !important;

    min-height: 2.75rem !important;
    min-width: 2.75rem !important;
  }

  :where(#wrapper, .jd-header-account-panel-host)
    .jd-account-menu__eyebrow {

    font-size: 0.75rem !important;
  }

  :where(#wrapper, .jd-header-account-panel-host)
    .jd-account-menu__panel-description {

    font-size: 0.78rem !important;
  }

  :where(#wrapper, .jd-header-account-panel-host)
    .jd-account-menu__links {

    padding: 0.7rem !important;
  }

  :where(#wrapper, .jd-header-account-panel-host)
    .jd-account-menu__links ul,
  :where(#wrapper, .jd-header-account-panel-host)
    .jd-account-menu__links ul.menu,
  :where(#wrapper, .jd-header-account-panel-host)
    .jd-account-menu__links .menu,
  :is(#wrapper .header, .jd-header-account-panel-host)
    .jd-account-menu__links
    > ul.nav.menu.menu-parent {

    gap: 0.5rem !important;
  }

  :where(#wrapper, .jd-header-account-panel-host)
    .jd-account-menu__links a {

    font-size: 0.88rem !important;

    min-height: 50px !important;

    padding: 0.62rem 0.55rem !important;
  }

  :where(#wrapper, .jd-header-account-panel-host)
    .jd-account-menu__links
    li:last-child:nth-child(odd),
  :where(#wrapper, .jd-header-account-panel-host)
    .jd-account-menu__links
    .menu-item:last-child:nth-child(odd) {

    width: calc(50% - 0.25rem) !important;
  }
}


/* =========================================================
   Reduced motion
   ========================================================= */

@media (prefers-reduced-motion: reduce) {

  :where(#wrapper, .jd-header-account-panel-host) .jd-account-menu__trigger,
  :where(#wrapper, .jd-header-account-panel-host) .jd-account-menu__chevron,
  :where(#wrapper, .jd-header-account-panel-host) .jd-account-menu__links a {
    transition: none !important;
  }
}

/* assets/css/jd-menu-main.css */
/*
 * jd-menu-main.css
 * Late EXTRACT 03 — hamburger + #main-menu (Johnny Detail purple).
 * Source: jd-menu/main-menu/03-main-menu-mobile.css
 * Load after jd-header-service-menu-v1.css so this trimmed copy wins.
 */

/* ========== 03-main-menu-mobile.css (purple recolor) ========== */
/* ==========================================================================
   EXTRACT 03 — Mobile hamburger + main menu readability (Johnny Detail, purple)
   Marker: jd-header-service-menu-v1 / 03-main-menu-mobile
   ========================================================================== */

/* --- chrome-visibility-fix.css: force menu visible + solid bar --- */
/**
 * chrome-visibility-fix.css
 * Force header / main menu / footer visible on mobile + desktop.
 * Fixes bad custom_css overrides after D11 upgrade (transparent menu bar,
 * white-on-white links, broken Bootstrap .collapse overrides).
 */

/* ---- Header shell always visible ---- */
header.header,
.header,
.header-top,
.header-wrap,
.header-menu,
.header-center,
.navbar.header-center,
.layout-wrap > header {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  max-height: none !important;
  overflow: visible !important;
}

/* Branding / logo row */
.header-wrap .navbar.header-center,
.navbar-brand,
.region-branding,
.site-branding,
.brand.logo {
  display: block !important;
  visibility: visible !important;
}

.header-main-wrap {
  display: flex !important;
  align-items: center !important;
  visibility: visible !important;
}

/* Desktop header info + right (override max-width:768 hide) */
@media (min-width: 768px) {
  .header-main,
  .header-right {
    display: block !important;
    visibility: visible !important;
  }
  .header-right-wrap {
    display: flex !important;
    visibility: visible !important;
  }
  .nav-button.navbar-toggler {
    display: none !important;
  }
}

/* Mobile: keep toggler; still show branding */
@media (max-width: 767.98px) {
  /* Keep city header info (phone/hours) visible on mobile */
  .header-main,
  .header-item.header-main {
    display: block !important;
    visibility: visible !important;
    width: 100% !important;
  }
  .navbar-toggler.nav-button {
    display: inline-block !important;
    visibility: visible !important;
    z-index: 1001 !important;
  }
}

/* ---- Main navigation bar ---- */
.header-menu,
.header-menu .nav-menu,
.navbar.nav-menu,
#main-menu,
#main-menu.navbar-collapse,
.primary-menu,
.region-main-menu,
.main-menu-wrap,
.mega-menu {
  visibility: visible !important;
  opacity: 1 !important;
  max-height: none !important;
}

/* Undo transparent menu bar override — solid darker brand purple (readable white links) */
.header-menu .nav-menu,
.navbar.nav-menu,
.primary-menu,
#main-menu.primary-menu {
  background-color: #3b0a5c !important;
  background: #3b0a5c !important;
}

/* Force collapse open on md+ (Bootstrap expand) */
@media (min-width: 768px) {
  #main-menu.navbar-collapse,
  .navbar-expand-md .navbar-collapse,
  .navbar-expand-md #main-menu {
    display: flex !important;
    flex-basis: auto !important;
    height: auto !important;
  }
}

/* Mobile: closed until .show; open when toggled */
@media (max-width: 767.98px) {
  #main-menu.navbar-collapse.collapse:not(.show) {
    display: none !important;
  }
  #main-menu.navbar-collapse.collapse.show,
  #main-menu.navbar-collapse.show {
    display: block !important;
    background-color: #3b0a5c !important;
    background: #3b0a5c !important;
    padding: 0.5rem 0 !important;
    color: #ffffff !important;
  }
  #main-menu.navbar-collapse.show .menu-item,
  #main-menu.show .menu-item {
    background: transparent !important;
    background-color: transparent !important;
  }
  #main-menu.navbar-collapse.show a,
  #main-menu.show a {
    color: #ffffff !important;
  }
  /* Hamburger icon button — dark green, no jump */
  .navbar-toggler.nav-button,
  button.navbar-toggler.nav-button {
    background: #3b0a5c !important;
    background-color: #3b0a5c !important;
    border: 2px solid #000 !important;
    transform: none !important;
  }
  .navbar-toggler.nav-button i,
  .navbar-toggler.nav-button [class*="ti-"] {
    color: #ffffff !important;
  }
  button.navbar-toggler.nav-button[aria-expanded="true"],
  button.navbar-toggler.nav-button[aria-expanded="false"] {
    transform: none !important;
  }
}

/* Do NOT repurpose Bootstrap .collapse globally — only menu-scoped color */
.header-menu .collapse,
.primary-menu.collapse,
#main-menu {
  color: #ffffff !important;
}

/* Menu links: readable white on green */
.header-menu a,
.primary-menu a,
#main-menu a,
.mega-menu > ul > li > a,
.main-menu .menu-item a,
.region-main-menu .menu a {
  color: #ffffff !important;
  opacity: 1 !important;
  visibility: visible !important;
  display: block !important;
}

.header-menu .menu-item,
.primary-menu .menu-item,
#main-menu .menu-item {
  display: list-item !important;
  visibility: visible !important;
}

.mega-menu > ul {
  display: flex !important;
  flex-wrap: wrap !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0.35rem 0.75rem !important;
  width: 100% !important;
  max-width: 100% !important;
}

@media (max-width: 767.98px) {
  .mega-menu > ul {
    display: block !important;
  }
  .mega-menu > ul > li > a {
    color: #ffffff !important;
    padding: 0.65rem 1rem !important;
  }
}

/* Prevent 120% width overflow clipping menus */
.container-wrap.clearfix.mega-menu.main-menu-wrap,
.container-wrap.clearfix.menu-wrap {
  max-width: 100% !important;
  width: 100% !important;
}

/* layout-wrap must not clip sticky/header/footer */
.layout-wrap {
  overflow: visible !important;
}

/* ---- Footer ---- */
footer.footer,
#footer,
.footer,
.footer-bottom,
.region-footer-bottom-first,
.jd-site-footer,
.jd-footer__grid {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  max-height: none !important;
}

footer.footer,
#footer.footer {
  background-color: #19212c !important;
  color: #ffffff !important;
}

.footer .text-light,
.footer.text-light,
.footer.text-light *,
.jd-site-footer,
.jd-site-footer *,
.jd-footer__grid,
.jd-footer__grid *,
.footer-bottom,
.footer-bottom * {
  color: #ffffff !important;
}

.footer a,
.jd-site-footer a,
.footer-bottom a {
  color: #f3e8ff !important;
  text-decoration: underline;
}

/* Header top promo + login visible */
.header-top.dark-header-top {
  display: block !important;
  visibility: visible !important;
  background-color: #6716aa !important;
  color: #fff !important;
}
.header-top.dark-header-top * {
  color: #fff;
}

/* ==========================================================================
   Header Info blocks (city phone + hours) — always visible
   ========================================================================== */

/* Never hide the header info row (overrides media.css mobile hide) */
.header-item.header-main,
.header-main,
.region-header,
.header-main-wrap {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  max-height: none !important;
  overflow: visible !important;
}

/* Desktop: header-main can flex; mobile forces 100% width in chrome-layout-fix */
@media (min-width: 768px) {
  .header-main-wrap {
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    width: auto !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
  }
}
@media (max-width: 767.98px) {
  .header-main-wrap,
  .header-item.header-main,
  .header-main,
  .region-header {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
    min-width: 0 !important;
  }
}

/* Keep header-right (Call to Order / CONTACT US) visible on desktop + mobile */
.header-item.header-right,
.header-right,
.header-right-wrap {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

/* CONTACT US block: always centered (label + phone stack) — beat custom_css pills */
#block-call-to-order,
#block-call-to-order .container-wrap,
#block-call-to-order .block-content,
#block-call-to-order .field-item,
#block-call-to-order *,
#block-call-to-order p,
#block-call-to-order strong,
#block-call-to-order a {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
#block-call-to-order,
#block-call-to-order .container-wrap,
#block-call-to-order .block-content,
#block-call-to-order .field-item {
  text-align: center !important;
}
#block-call-to-order .field-item {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.15rem !important;
  margin: 0 auto !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  padding: 0 !important;
}
#block-call-to-order p,
#block-call-to-order p.call-phone {
  margin: 0 !important;
  padding: 0 !important;
  text-align: center !important;
  width: 100% !important;
  color: #ffffff !important;
}
#block-call-to-order strong.text-sm,
#block-call-to-order .text-sm {
  display: block !important;
  width: 100% !important;
  text-align: center !important;
  margin: 0 !important;
  padding: 0 !important;
  font-size: 0.72rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.06em !important;
  line-height: 1.2 !important;
  color: #ffffff !important;
  text-transform: uppercase !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.45) !important;
}
#block-call-to-order a.call-phone-link,
#block-call-to-order .call-phone a {
  display: block !important;
  text-align: center !important;
  margin: 0 auto !important;
  width: auto !important;
  font-size: 1.15rem !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  color: #ffffff !important;
  text-decoration: none !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.45) !important;
}

.header-item.header-right {
  text-align: center !important;
}

@media (min-width: 768px) {
  .header-right-wrap {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
  }
  .header-item.header-right {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }
  /* Header info: horizontal, items centered as a group */
  .header-info .header-info-container {
    justify-content: center !important;
    align-items: center !important;
  }
}

/* Header info layout */
.header-info,
.header-info .header-info-container {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: center !important;
  visibility: visible !important;
  opacity: 1 !important;
  max-width: 100% !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  gap: 0.35rem 1.25rem;
}

.header-info .header-info-item {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  visibility: visible !important;
  margin-left: 0 !important;
  max-width: 100%;
}

.header-info .header-info-item i {
  display: inline-block !important;
  font-size: 22px !important;
  margin-right: 10px !important;
  color: #fff !important;
  flex: 0 0 auto;
}

.header-info .header-info-desc {
  display: block !important;
  line-height: 1.25 !important;
  text-align: left !important;
}

.header-info .header-info-desc span,
.header-info .header-info-desc strong,
.header-info .header-info-desc a {
  display: block !important;
  color: #ffffff !important;
  opacity: 1 !important;
  visibility: visible !important;
  text-shadow: 0 1px 2px rgba(0,0,0,0.45) !important;
}

.header-info .header-info-desc a.header-info-phone {
  text-decoration: none !important;
  font-weight: 700 !important;
  font-size: 1.05rem !important;
}

.header-info .header-info-desc a.header-info-phone:hover {
  text-decoration: underline !important;
}

/* Ensure purple header bar has room for info (bar full-bleed; content rail separate) */
.navbar.header-center {
  overflow: visible !important;
}
.navbar.header-center > .container {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  /* Desktop max-width/padding set in min-width:992 rules + late rail safety */
  box-sizing: border-box !important;
}

/* Mobile: brand left 1rem; city info (left) + hours (right) above Contact Us phone */
@media (max-width: 767.98px) {
  .navbar.header-center > .container {
    justify-content: flex-start !important;
    align-items: center !important;
    position: relative !important;
    padding: 0.5rem 1rem !important;
    box-sizing: border-box !important;
  }

  .header-side.navbar-brand {
    width: auto !important;
    max-width: calc(100% - 5.75rem) !important;
    flex: 1 1 auto !important;
    order: 1 !important;
    text-align: left !important;
    justify-content: flex-start !important;
    margin: 0 !important;
    padding: 0 5.5rem 0 0 !important;
  }
  #block-martis-branding .container-wrap,
  .site-branding .container-wrap,
  .site-branding {
    justify-content: flex-start !important;
    text-align: left !important;
  }

  /* City/service + hours row ABOVE Contact Us */
  .header-item.header-main,
  .header-main,
  .header-main-wrap {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
    order: 2 !important;
    margin: 0.15rem 0 0 !important;
    padding: 0.25rem 0 !important;
    text-align: left !important;
  }

  /* Contact Us / phone under info row */
  .header-right-wrap {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
    order: 3 !important;
    margin: 0.15rem 0 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
    position: static !important;
  }
  .header-item.header-right,
  .header-right {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    text-align: center !important;
    margin: 0 auto !important;
  }
  .header-element {
    position: absolute !important;
    top: 0.5rem !important;
    right: 1rem !important;
    z-index: 30 !important;
  }
  #block-call-to-order {
    width: 100% !important;
    margin: 0 auto !important;
  }
  #block-call-to-order strong.text-sm,
  #block-call-to-order .text-sm {
    font-size: 0.7rem !important;
  }
  #block-call-to-order a.call-phone-link {
    font-size: 1.15rem !important;
  }

  /* Hide Call Us column; phone lives under this row */
  .header-info .header-info-item--phone {
    display: none !important;
  }

  .header-info {
    width: 100% !important;
    margin: 0 !important;
  }
  .header-info .header-info-container {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    justify-content: space-between !important;
    align-items: flex-start !important;
    gap: 0.5rem 0.75rem !important;
    width: 100% !important;
  }
  .header-info .header-info-item {
    margin: 0 !important;
  }
  .header-info .header-info-item--location {
    flex: 1 1 auto !important;
    max-width: 58% !important;
    justify-content: flex-start !important;
  }
  .header-info .header-info-item--hours {
    flex: 0 1 auto !important;
    max-width: 42% !important;
    justify-content: flex-end !important;
  }
  .header-info .header-info-item--location .header-info-desc {
    text-align: left !important;
  }
  .header-info .header-info-item--hours .header-info-desc {
    text-align: right !important;
  }
  .header-info .header-info-desc {
    font-size: 0.72rem !important;
    line-height: 1.3 !important;
  }
  .header-info .header-info-desc span,
  .header-info .header-info-desc strong {
    display: block !important;
  }
}

/* Override prior chrome-fix mobile hide of header-main */
@media (max-width: 767.98px) {
  .header-main,
  .header-item.header-main {
    display: block !important;
  }
}

/* --- chrome-layout-fix.css: hamburger + menu panel --- */
/* ==========================================================================
   Mobile hamburger + menu readability + carousel center (late override)
   Wins over theme custom_css cascade.
   ========================================================================== */
@media (max-width: 767.98px) {
  /* Hamburger 3-line button: dark green, white icon, no jump/rotate */
  .header .header-element .navbar-toggler.nav-button,
  button.navbar-toggler.nav-button,
  .navbar-toggler.nav-button.collapsed,
  .navbar-toggler.nav-button[aria-expanded="true"],
  .navbar-toggler.nav-button[aria-expanded="false"] {
    background: #3b0a5c !important;
    background-color: #3b0a5c !important;
    border: 2px solid #000 !important;
    color: #ffffff !important;
    transform: none !important;
    -webkit-transform: none !important;
    top: auto !important;
    margin-top: 0 !important;
  }
  .navbar-toggler.nav-button i,
  .navbar-toggler.nav-button .ti-menu,
  .navbar-toggler.nav-button [class*="ti-"],
  .header .header-element .navbar-toggler.nav-button i {
    color: #ffffff !important;
  }

  /*
   * Open main menu — match JD structure:
   * dark panel + light pill links (JD purple/#b781e3 → CY dark green/#b781e3)
   * active-trail = lighter green; links centered on mobile.
   */
  #main-menu.collapse.show,
  #main-menu.show,
  .header #main-menu.collapse.show,
  .header #main-menu.show,
  #main-menu.navbar-collapse.collapse.show {
    display: block !important;
    background: #3b0a5c !important;
    background-color: #3b0a5c !important;
    color: #ffffff !important;
    padding: 0.5rem 0.75rem 0.75rem !important;
  }
  #main-menu.show .primary-menu,
  #main-menu.show .mega-menu,
  #main-menu.show .mega-menu > ul,
  #main-menu.show ul.menu.menu-parent,
  #main-menu.show .nav.menu.menu-parent,
  #block-martis-main-menu ul.nav.menu.menu-parent {
    background: transparent !important;
    background-color: transparent !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  #main-menu.show .menu-item,
  #main-menu.collapse.show .menu-item,
  #main-menu.show li.menu-item,
  #main-menu .menu-item,
  #block-martis-main-menu .menu-item {
    background: transparent !important;
    background-color: transparent !important;
    border-bottom: 0 !important;
    list-style: none !important;
    margin: 0 0 0.4rem !important;
    padding: 0 !important;
    width: 100% !important;
  }
  /* Light-green link pills (JD light-purple equivalent) */
  #wrapper #main-menu.show a,
  #wrapper .header #main-menu.show .mega-menu > ul > li > a,
  #wrapper .header #main-menu.show .main-menu .nav > li > a,
  #wrapper .header #main-menu.show a,
  #main-menu.show .mega-menu > ul > li > a,
  #main-menu.show .main-menu .nav > li > a,
  #main-menu.show a,
  #main-menu.show .menu-item a,
  #block-martis-main-menu .menu-item a {
    color: #ffffff !important;
    background-color: #b781e3 !important;
    background: #b781e3 !important;
    border-radius: 10px !important;
    border: 2px solid #000 !important;
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    padding: 0.65rem 1rem !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    opacity: 1 !important;
    visibility: visible !important;
    text-decoration: none !important;
    font-weight: 600 !important;
  }
  /* Active trail / current page — lighter green (JD lighter purple) */
  #main-menu.show .menu-item--active-trail > a,
  #main-menu.show li.menu-item--active-trail > a,
  #main-menu.show .menu-item--active-trail a.is-active,
  #main-menu.show a.is-active,
  #block-martis-main-menu .menu-item--active-trail > a,
  #block-martis-main-menu a.is-active {
    background-color: #c9a0e8 !important;
    background: #c9a0e8 !important;
    color: white !important;
    -webkit-text-fill-color: white !important;
    border-color: #000 !important;
  }
  #main-menu.show a:hover,
  #main-menu.show a:focus,
  #block-martis-main-menu .menu-item a:hover,
  #block-martis-main-menu .menu-item a:focus {
    background-color: #c9a0e8 !important;
    background: #c9a0e8 !important;
    color: #ffffff !important;
    text-decoration: none !important;
  }

  /* Carousel overlay: true center in hero (X + Y) — match reference layout site */
  .slide-carousel .slide-content-wrap,
  .slide-carousel .slide-carousel-hero .slide-content-wrap,
  .slide-carousel .container.slide-wrap,
  .slide-carousel .slide-carousel-hero .container.slide-wrap {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
  }
  .slide-carousel .slide-content,
  .slide-carousel .slide-carousel-hero .slide-content {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;
    text-align: center !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }
  .slide-carousel .slide-content-main,
  .slide-carousel .slide-carousel-hero .slide-content-main,
  .slide-carousel .slide-content-main.float-center,
  .slide-carousel .slide-content-main.float-center.text-left,
  .slide-carousel .slide-content-main.text-left {
    margin-top: auto !important;
    margin-bottom: auto !important;
    margin-left: auto !important;
    margin-right: auto !important;
    height: auto !important;
    max-height: none !important;
    flex: 0 0 auto !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    overflow: visible !important;
  }
  .slide-carousel .slide-content-wrap .field-items,
  .slide-carousel .slide-content-wrap .field-item,
  .slide-carousel .heading-text .field-item,
  .slide-carousel .pre-heading-text .field-item {
    text-align: center !important;
  }
}


/* ==========================================================================
   2026-07-25 playbook polish (late — beats theme custom_css)
   Purple brand chrome only: #3b0a5c / #2d0847
   ========================================================================== */

/* --- Kill Bootstrap SVG hamburger ::before (custom_css may re-add) --- */
button.navbar-toggler.nav-button::before,
button.navbar-toggler.nav-button::after,
.navbar-toggler.nav-button::before,
.navbar-toggler.nav-button::after,
.header .header-element .navbar-toggler.nav-button::before,
.header .header-element .navbar-toggler.nav-button::after {
  content: none !important;
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  background: none !important;
  border: 0 !important;
}

/* Smaller centered Themify hamburger glyph only */
@media (max-width: 767.98px) {
  .header .header-element .navbar-toggler.nav-button i.ti-menu,
  .header .header-element .navbar-toggler.nav-button .ti-menu,
  button.navbar-toggler.nav-button i.ti-menu {
    font-size: 1.05rem !important;
    line-height: 1 !important;
  }
  .header .header-element .navbar-toggler.nav-button i.ti-menu::before,
  button.navbar-toggler.nav-button i.ti-menu::before {
    content: "\e68e" !important;
    display: block !important;
    font-size: inherit !important;
  }
}

/* --- Log in caret: inside pill border (static, not absolute) --- */
.header-top a.account-icon,
.header-top a.dropdown-toggle.header-icon.account-icon,
.header-top.dark-header-top a.account-icon,
.path-frontpage .header-top a.account-icon,
body .header-top a.dropdown-toggle.header-icon.account-icon {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.3rem !important;
  position: relative !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
  padding: 0.12rem 0.55rem !important;
  vertical-align: middle !important;
  white-space: nowrap !important;
}
.header-top a.account-icon::after,
.header-top a.dropdown-toggle.header-icon.account-icon::after,
.header-top.dark-header-top a.account-icon::after,
body .header-top a.dropdown-toggle.header-icon.account-icon::after {
  position: static !important;
  display: inline-block !important;
  margin: -4px 0 0 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  top: auto !important;
  right: auto !important;
  left: auto !important;
  bottom: auto !important;
  transform: rotate(45deg) !important;
  -webkit-transform: rotate(45deg) !important;
  width: 0.38rem !important;
  height: 0.38rem !important;
  border-style: solid !important;
  border-width: 0 1.5px 1.5px 0 !important;
  border-color: currentColor !important;
  vertical-align: middle !important;
  content: "" !important;
  flex: 0 0 auto !important;
}

/* Clearance sales centered on mobile */
@media (max-width: 767.98px) {
  .header-top #block-clearance-sales,
  .header-top div#block-clearance-sales,
  .header-top #block-clearance-sales .field-item,
  .header-top #block-clearance-sales p,
  .header-top .header-top-first {
    text-align: center !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }
}

/* Always kill clearance left-shift from custom_css (mobile + desktop) */
.header-top #block-clearance-sales p,
.header-top.dark-header-top #block-clearance-sales p,
header.header #block-clearance-sales p,
div#block-clearance-sales p {
  margin-left: 0 !important;
  margin-right: 0 !important;
  margin-top: 1rem !important;
  text-align: center !important;
}
header.header div#block-clearance-sales,
.header-top div#block-clearance-sales {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
}


/* --- martis-custom.css: mobile main-menu --- */
@media (max-width: 767.98px) {
    .header-menu {
        margin-left: 0;
        margin-right: 0;
    }
    .mega-menu > ul > li {
        width: 100%;
        display: block;
        margin-top: unset;
        margin-bottom: unset;
    }
    .navbar.navbar-expand-md.nav-menu {
        margin-right: 0;
        max-width: 100%;
    }
    .mega-menu {
        text-indent: 1px;
    }
    .mega-menu > ul > li a:hover {
        text-decoration: underline;
    }
    /* Stable hamburger — no rotate/jump on open/close */
    button.navbar-toggler.nav-button[aria-expanded="true"],
    button.navbar-toggler.nav-button[aria-expanded="false"],
    button.navbar-toggler.nav-button {
        transform: none !important;
        padding-top: 0 !important;
        transition: background-color 0.15s ease, border-color 0.15s ease;
    }

    div#user-account-block-wrap li.menu-item {
        border-bottom: 0;
    }
    footer.footer .row.justify-content-center {
        width: 100%;
        margin-bottom: -25px;
    }
    .col-5.text-center {
        padding-right: 10px;
        padding-left: 10px;
        margin-left: -10px;
    }
    .region.region-header-top-first .block-content.clearfix {
        margin-left: -6px;
        font-size: 14px;
        text-align: center;
        margin-right: -6px;
    }
    /* Mobile main menu: dark purple panel + white links (never light bg + white text) */
    #main-menu .menu-item,
    #main-menu li.menu-item,
    .header #main-menu .menu-item,
    .primary-menu .menu-item {
        background-color: transparent !important;
        background: transparent !important;
        border-bottom: 1px solid rgba(255, 255, 255, 0.18) !important;
    }
    .main-menu .nav > li > a,
    .mega-menu > ul > li > a,
    #main-menu a,
    #main-menu .menu-item a {
        color: #ffffff !important;
        line-height: 1.35;
        width: 100%;
        text-align: left;
    }
    .mega-menu > ul {
        margin-top: -unset;
        margin-bottom: unset;
    }
    .primary-menu .main-menu {
        padding: unset;
        padding-top: 15px;
    }
    footer.footer a,
    footer.footer p {
        font-size: x-small;
    }
    ul.social_footer_ul a {
        font-size: revert;
    }
    div#block-clearance-sales {
        width: 100%;
    }
    .region.region-header-top-first {
        width: unset;
        margin-top: unset;
    }
    .region.region-header-top-second {
        padding-bottom: unset;
        margin-top: unset;
    }
    .owl-next,
    .owl-prev {
        margin-top: 0 !important;
    }
    .page-node-type-team .row.content-layout {
        margin-top: -35px;
        margin-bottom: -17px;
    }
    #block-martis-main-menu .menu-item:last-child {
        border-bottom: 2px solid black !important;
    }
} /* end @media (max-width: 767.98px) mobile main-menu fragment */

.navbar-toggler.nav-button {
  border: 2px solid #000;
  background-color: #3b0a5c;
  color: #fff;
}
.navbar-toggler.nav-button i,
.navbar-toggler.nav-button .ti-menu {
  color: #fff;
}

#block-martis-branding {
  margin-top: 5px;
}
.logo-container {
  margin-top: 2.5rem;
}
.mega-menu > ul {
margin-top: -15px;
margin-bottom: unset;
border-bottom: 2px solid black;
}
 .col-5.text-center {
    padding-right: 10px;
    padding-left: 10px;
    justify-content: center;
    display: block;
  }
li.menu-item {
    border-bottom: 2px solid white !important;
  }
.menu-item:nth-child(1) {
  margin-top: -2px !important;
}
.menu-item:last-child {
  border-top: 0 !important;
}

    #block-martis-main-menu .menu.menu-parent .menu-item:first-child {
  border-top: 0 !important;
}
 
/* MOBILE ONLY — hide collapsed nav until hamburger adds .show.
   Never place this under min-width media (that hid desktop nav site-wide). */
@media (max-width: 767.98px) {
  .header .header-element .navbar-toggler.nav-button i,
  .header .header-element .navbar-toggler.nav-button .ti-menu,
  .header .header-element .navbar-toggler.nav-button [class*="ti-"] {
    pointer-events: none !important;
    font-size: 1.25rem !important;
    line-height: 1 !important;
    color: #ffffff !important;
  }

  /* Hamburger menu: dark purple panel + light-purple pills (JD purple pattern) */
  .header #main-menu.collapse.show,
  .header #main-menu.show,
  #main-menu.collapse.show,
  #main-menu.show {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    width: 100% !important;
    position: relative !important;
    z-index: 20 !important;
    background: #3b0a5c !important;
    background-color: #3b0a5c !important;
    color: #ffffff !important;
    padding: 0.5rem 0.75rem 0.75rem !important;
  }
  .header #main-menu.collapse:not(.show),
  #main-menu.collapse:not(.show) {
    display: none !important;
  }
  .header .header-menu,
  .header .navbar.nav-menu,
  .header .primary-menu {
    overflow: visible !important;
    max-height: none !important;
    background: transparent !important;
  }
  .header .primary-menu .main-menu,
  .header .mega-menu > ul,
  .header #main-menu .mega-menu > ul,
  .header #main-menu ul.menu,
  .header #main-menu ul.nav.menu.menu-parent,
  #block-martis-main-menu ul.nav.menu.menu-parent {
    display: block !important;
    width: 100% !important;
    background: transparent !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  .header #main-menu .menu-item,
  .header #main-menu li.menu-item,
  #block-martis-main-menu .menu-item {
    background: transparent !important;
    background-color: transparent !important;
    border-bottom: 0 !important;
    list-style: none !important;
    margin: 0 0 0.4rem !important;
    padding: 0 !important;
    width: 100% !important;
  }
  #wrapper .header #main-menu.show a,
  #wrapper .header #main-menu.show .menu-item a,
  #wrapper .header #main-menu.show .mega-menu > ul > li > a,
  #wrapper .header #main-menu.show .main-menu .nav > li > a,
  .header #main-menu.show a,
  .header #main-menu.show .menu-item a,
  .header #main-menu.show .mega-menu > ul > li > a,
  .header #main-menu.show .main-menu .nav > li > a,
  #block-martis-main-menu .menu-item a {
    color: #ffffff !important;
    background: #b781e3 !important;
    background-color: #b781e3 !important;
    border-radius: 10px !important;
    border: 2px solid #000 !important;
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    padding: 0.65rem 1rem !important;
    margin: 0 !important;
    opacity: 1 !important;
    visibility: visible !important;
    text-shadow: none !important;
    text-decoration: none !important;
    font-weight: 600 !important;
    box-sizing: border-box !important;
  }
  .header #main-menu.show .menu-item--active-trail > a,
  .header #main-menu.show li.menu-item--active-trail > a,
  .header #main-menu.show a.is-active,
  #block-martis-main-menu .menu-item--active-trail > a,
  #block-martis-main-menu a.is-active {
    background: #c9a0e8 !important;
    background-color: #c9a0e8 !important;
    color: white !important;
    -webkit-text-fill-color: white !important;
  }
  .header #main-menu.show a:hover,
  .header #main-menu.show a:focus {
    background: #c9a0e8 !important;
    background-color: #c9a0e8 !important;
    color: #ffffff !important;
  }


}


/* assets/css/service-nodes.css */
/* Service nodes — elegant purple restyle.
 * Late-loaded after jd-header-service-menu-v1.css; high-intent-cta.css stays last.
 * Scope: body.page-node-type-service only. Beats per-node <style> + chip rails.
 */

html body.page-node-type-service {
  --svc-deep: #3b0a5c;
  --svc-brand: #6716aa;
  --svc-mid: #7b2cbf;
  --svc-light: #b781e3;
  --svc-soft: #f3e8ff;
  --svc-mist: #f5f0fa;
  --svc-white: #ffffff;
  --svc-ink: #1a0a24;
  --svc-body: #334155;
  --svc-link: #5b21b6;
  --svc-border: #e9d5ff;
  --svc-radius: 16px;
}

/* -------------------------------------------------------------------------- */
/* Kill decorative glow circles from embedded node CSS                         */
/* -------------------------------------------------------------------------- */

html body.page-node-type-service .service-page::before,
html body.page-node-type-service .service-page::after,
html body.page-node-type-service .service-cards-wrapper::before,
html body.page-node-type-service .service-cards-wrapper::after,
html body.page-node-type-service .material-card::before,
html body.page-node-type-service .material-card::after,
html body.page-node-type-service .material-card-question::before,
html body.page-node-type-service .material-card-question::after,
html body.page-node-type-service .trust-card::before,
html body.page-node-type-service .trust-card::after,
html body.page-node-type-service .faq-section::before,
html body.page-node-type-service .faq-section::after,
html body.page-node-type-service .faq-card::before,
html body.page-node-type-service .faq-card::after,
html body.page-node-type-service .summary-box::before,
html body.page-node-type-service .summary-box::after,
html body.page-node-type-service .authority-box::before,
html body.page-node-type-service .authority-box::after,
html body.page-node-type-service .service-areas-callout::before,
html body.page-node-type-service .service-areas-callout::after {
  content: none !important;
  display: none !important;
  background: none !important;
  width: 0 !important;
  height: 0 !important;
}

/* -------------------------------------------------------------------------- */
/* Canvas + wrapper                                                            */
/* -------------------------------------------------------------------------- */

html body.page-node-type-service .service-page,
html body.page-node-type-service .service-cards-wrapper,
html body.page-node-type-service .service-page.service-cards-wrapper {
  position: relative !important;
  overflow: visible !important;
  background: transparent !important;
  color: var(--svc-body) !important;
  max-width: 1200px !important;
}

/* -------------------------------------------------------------------------- */
/* H1 — single title chip (do not chip inner headings)                         */
/* -------------------------------------------------------------------------- */

html body.page-node-type-service .service-cards-wrapper > h1,
html body.page-node-type-service .service-page > h1,
html body.page-node-type-service .hero-card > h1,
html body.page-node-type-service .summary-box > h1,
html body.page-node-type-service .material-card.hero-card > h1,
html body.page-node-type-service .row.layout.layout--onecol h1,
html body.page-node-type-service #wrapper .service-cards-wrapper h1 {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 0 1rem !important;
  padding: 0.8rem 1.1rem !important;
  background: linear-gradient(135deg, #3b0a5c 0%, #6716aa 55%, #7b2cbf 100%) !important;
  background-color: #3b0a5c !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-size: clamp(1.35rem, 2.6vw, 1.85rem) !important;
  font-weight: 800 !important;
  line-height: 1.3 !important;
  text-align: center !important;
  text-shadow: none !important;
  border: 2px solid #000 !important;
  border-radius: 12px !important;
  box-shadow: 0 3px 0 #000, 0 10px 22px rgba(59, 10, 92, 0.18) !important;
  box-sizing: border-box !important;
}

/* -------------------------------------------------------------------------- */
/* De-chip body type                                                           */
/* -------------------------------------------------------------------------- */

html body.page-node-type-service .service-cards-wrapper p,
html body.page-node-type-service .service-page p,
html body.page-node-type-service .service-cards-wrapper .card p,
html body.page-node-type-service .service-cards-wrapper .summary-box p,
html body.page-node-type-service .service-cards-wrapper .material-card p,
html body.page-node-type-service .trust-card p,
html body.page-node-type-service .authority-box p,
html body.page-node-type-service .service-areas-callout p,
html body.page-node-type-service .faq-description,
html body.page-node-type-service .faq-answer,
html body.page-node-type-service .section-description {
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: var(--svc-body) !important;
  -webkit-text-fill-color: var(--svc-body) !important;
  font-size: 1.04rem !important;
  font-weight: 500 !important;
  line-height: 1.7 !important;
  margin: 0 0 0.85rem !important;
  padding: 0 !important;
}

html body.page-node-type-service .service-cards-wrapper p:last-child,
html body.page-node-type-service .material-card p:last-child,
html body.page-node-type-service .trust-card p:last-child,
html body.page-node-type-service .authority-box p:last-child {
  margin-bottom: 0 !important;
}

html body.page-node-type-service .service-cards-wrapper li,
html body.page-node-type-service .authority-box li,
html body.page-node-type-service .service-page li {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: var(--svc-body) !important;
  -webkit-text-fill-color: var(--svc-body) !important;
  padding: 0.2rem 0 !important;
  margin: 0 0 0.4rem !important;
  line-height: 1.6 !important;
  list-style-position: outside !important;
}

html body.page-node-type-service .service-cards-wrapper ul,
html body.page-node-type-service .authority-box ul {
  margin: 0.35rem 0 0.25rem 1.15rem !important;
  padding: 0 !important;
}

html body.page-node-type-service .service-cards-wrapper strong,
html body.page-node-type-service .service-cards-wrapper p strong,
html body.page-node-type-service .faq-answer strong {
  color: var(--svc-deep) !important;
  -webkit-text-fill-color: var(--svc-deep) !important;
  font-weight: 800 !important;
}

html body.page-node-type-service .service-cards-wrapper a:not(.btn-primary),
html body.page-node-type-service .service-page a:not(.btn-primary) {
  color: var(--svc-link) !important;
  -webkit-text-fill-color: var(--svc-link) !important;
  font-weight: 700 !important;
  text-decoration: underline !important;
  text-decoration-color: var(--svc-light) !important;
  text-underline-offset: 2px !important;
}

/* Inner headings: type, not chips */
html body.page-node-type-service .service-cards-wrapper h2,
html body.page-node-type-service #wrapper .service-cards-wrapper h2,
html body.page-node-type-service #wrapper .summary-box h2,
html body.page-node-type-service #wrapper .material-card h2,
html body.page-node-type-service #wrapper .material-card h3,
html body.page-node-type-service .service-cards-wrapper .card h2,
html body.page-node-type-service .service-cards-wrapper .card h3,
html body.page-node-type-service .service-cards-wrapper .material-card h2,
html body.page-node-type-service .service-cards-wrapper .material-card h3,
html body.page-node-type-service .service-cards-wrapper .summary-box h2,
html body.page-node-type-service .trust-card h3,
html body.page-node-type-service #wrapper .trust-card h3,
html body.page-node-type-service .authority-box h3,
html body.page-node-type-service .service-areas-callout h3,
html body.page-node-type-service .material-card-question h2,
html body.page-node-type-service .card-title h2 {
  display: block !important;
  width: auto !important;
  max-width: 100% !important;
  margin: 0 0 0.55rem !important;
  padding: 0 !important;
  background: none !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: var(--svc-deep) !important;
  -webkit-text-fill-color: var(--svc-deep) !important;
  font-size: 1.2rem !important;
  font-weight: 800 !important;
  line-height: 1.3 !important;
  text-align: left !important;
  text-shadow: none !important;
}

html body.page-node-type-service .card-title,
html body.page-node-type-service #wrapper .card-title,
html body.page-node-type-service #wrapper .material-card .card-title {
  display: flex !important;
  align-items: center !important;
  gap: 0.65rem !important;
  margin: 0 0 0.45rem !important;
  padding: 0 !important;
  background: none !important;
  background-color: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: var(--svc-deep) !important;
}

html body.page-node-type-service .card-title h2,
html body.page-node-type-service #wrapper .card-title h2 {
  margin: 0 !important;
  padding: 0 !important;
  font-size: 1.12rem !important;
  color: var(--svc-deep) !important;
  -webkit-text-fill-color: var(--svc-deep) !important;
  background: none !important;
}

html body.page-node-type-service .card-title i {
  color: var(--svc-mid) !important;
  font-size: 1.2rem !important;
}

html body.page-node-type-service .summary-local,
html body.page-node-type-service .summary-local em {
  color: #5b4b6b !important;
  -webkit-text-fill-color: #5b4b6b !important;
  font-size: 0.98rem !important;
  line-height: 1.6 !important;
}

/* -------------------------------------------------------------------------- */
/* Cards                                                                       */
/* -------------------------------------------------------------------------- */

html body.page-node-type-service .service-cards-wrapper .card,
html body.page-node-type-service .service-page .card,
html body.page-node-type-service .material-card,
html body.page-node-type-service .summary-box,
html body.page-node-type-service .authority-box,
html body.page-node-type-service .service-areas-callout,
html body.page-node-type-service .material-card-question {
  position: relative !important;
  overflow: hidden !important;
  background: var(--svc-white) !important;
  background-image: none !important;
  color: var(--svc-body) !important;
  border: 1px solid var(--svc-border) !important;
  border-left: 5px solid var(--svc-brand) !important;
  border-radius: var(--svc-radius) !important;
  box-shadow: 0 8px 24px -10px rgba(26, 10, 36, 0.12) !important;
  padding: 1.25rem 1.3rem 1.3rem !important;
  margin: 0 0 1rem !important;
  translate: 0 0;
  transition: translate 180ms cubic-bezier(0.2, 0.8, 0.2, 1),
    box-shadow 180ms cubic-bezier(0.2, 0.8, 0.2, 1),
    border-color 180ms ease !important;
}

html body.page-node-type-service .material-card:hover,
html body.page-node-type-service .trust-card:hover,
html body.page-node-type-service .faq-card:hover {
  translate: 0 -3px;
}

html body.page-node-type-service .hero-card.summary-box,
html body.page-node-type-service .material-card.hero-card {
  padding: 1.4rem 1.4rem 1.35rem !important;
  margin-bottom: 1.25rem !important;
  background: linear-gradient(180deg, #ffffff 0%, #faf5ff 100%) !important;
}

/* -------------------------------------------------------------------------- */
/* Hero stats                                                                  */
/* -------------------------------------------------------------------------- */

html body.page-node-type-service .hero-stats {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 0.5rem !important;
  margin: 1rem 0 0 !important;
}

html body.page-node-type-service .hero-stat {
  display: inline-flex !important;
  align-items: center !important;
  background: var(--svc-soft) !important;
  color: var(--svc-deep) !important;
  -webkit-text-fill-color: var(--svc-deep) !important;
  border: 1px solid var(--svc-border) !important;
  border-radius: 999px !important;
  padding: 0.4rem 0.85rem !important;
  font-size: 0.88rem !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
}

/* -------------------------------------------------------------------------- */
/* Highlight / trust grids                                                     */
/* -------------------------------------------------------------------------- */

html body.page-node-type-service .highlight-grid,
html body.page-node-type-service .highlight-grid.main-grid,
html body.page-node-type-service .main-grid {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 0.85rem !important;
  margin: 0 0 1.15rem !important;
}

html body.page-node-type-service .highlight-grid > .material-card,
html body.page-node-type-service .main-grid > .card,
html body.page-node-type-service .main-grid > .material-card {
  margin: 0 !important;
  height: 100% !important;
}

html body.page-node-type-service .trust-section {
  margin: 1.25rem 0 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}

html body.page-node-type-service .section-header,
html body.page-node-type-service #wrapper .section-header,
html body.page-node-type-service .trust-section > .section-header,
html body.page-node-type-service .faq-section > .section-header {
  text-align: center !important;
  margin: 0 0 1rem !important;
  padding: 0.25rem 0 0.15rem !important;
  background: transparent !important;
  background-color: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

html body.page-node-type-service .section-badge,
html body.page-node-type-service .faq-subheader {
  display: inline-block !important;
  background: linear-gradient(135deg, #3b0a5c 0%, #6716aa 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  padding: 0.55rem 1.05rem !important;
  border: 2px solid #000 !important;
  border-radius: 999px !important;
  font-size: 0.92rem !important;
  font-weight: 800 !important;
  box-shadow: 0 2px 0 #000 !important;
  margin: 0 auto 0.75rem !important;
}

html body.page-node-type-service .trust-grid {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 0.85rem !important;
  margin: 0 0 1rem !important;
}

html body.page-node-type-service .trust-grid:has(> .process-step) {
  grid-template-columns: 1fr !important;
}

html body.page-node-type-service .trust-card {
  position: relative !important;
  overflow: hidden !important;
  background: var(--svc-white) !important;
  background-image: none !important;
  border: 1px solid var(--svc-border) !important;
  border-radius: var(--svc-radius) !important;
  box-shadow: 0 6px 18px -8px rgba(26, 10, 36, 0.1) !important;
  padding: 1.15rem 1.2rem !important;
  margin: 0 !important;
}

html body.page-node-type-service .trust-card h3 {
  font-size: 1.05rem !important;
  margin: 0 0 0.4rem !important;
}

/* Process steps: number + copy in a row */
html body.page-node-type-service .trust-card.process-step,
html body.page-node-type-service .process-step {
  display: grid !important;
  grid-template-columns: 2.15rem 1fr !important;
  grid-template-areas:
    "num title"
    "num body" !important;
  column-gap: 0.85rem !important;
  row-gap: 0.2rem !important;
  align-items: start !important;
  background: var(--svc-white) !important;
  border: 1px solid var(--svc-border) !important;
  border-left: 5px solid var(--svc-mid) !important;
  border-radius: 14px !important;
  padding: 0.95rem 1.05rem !important;
  margin: 0 0 0.7rem !important;
}

html body.page-node-type-service .process-step .num,
html body.page-node-type-service .trust-card.process-step .num {
  grid-area: num !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 2.05rem !important;
  height: 2.05rem !important;
  min-width: 2.05rem !important;
  min-height: 2.05rem !important;
  margin: 0.1rem 0 0 !important;
  padding: 0 !important;
  border: 2px solid #000 !important;
  border-radius: 50% !important;
  background: linear-gradient(180deg, #9b4dd4 0%, #6716aa 60%, #3b0a5c 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-size: 0.95rem !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  box-shadow: 0 2px 0 #000 !important;
}

html body.page-node-type-service .process-step h3,
html body.page-node-type-service .trust-card.process-step h3 {
  grid-area: title !important;
  margin: 0.15rem 0 0 !important;
  font-size: 1.05rem !important;
}

html body.page-node-type-service .process-step p,
html body.page-node-type-service .trust-card.process-step p {
  grid-area: body !important;
  margin: 0 !important;
}

/* -------------------------------------------------------------------------- */
/* CTA card                                                                    */
/* -------------------------------------------------------------------------- */

html body.page-node-type-service .material-card-question {
  text-align: center !important;
  padding: 1.6rem 1.4rem 1.7rem !important;
  margin: 1.25rem 0 1.35rem !important;
  background: linear-gradient(180deg, #ffffff 0%, #f3e8ff 100%) !important;
}

html body.page-node-type-service #wrapper .material-card-question p,
html body.page-node-type-service .material-card-question p,
html body.page-node-type-service #wrapper .region.region-content .material-card-question p {
  background: transparent !important;
  background-color: transparent !important;
  border: 0 !important;
  padding: 0 !important;
  margin: 0.35rem 0 0 !important;
  text-align: center !important;
}

html body.page-node-type-service .material-card-question h2 {
  text-align: center !important;
  font-size: 1.45rem !important;
  margin-bottom: 0.65rem !important;
}

html body.page-node-type-service .question-subheader {
  display: block !important;
  max-width: 36rem !important;
  margin: 0 auto 0.85rem !important;
  padding: 0 !important;
  background: none !important;
  color: var(--svc-body) !important;
  -webkit-text-fill-color: var(--svc-body) !important;
  border: 0 !important;
  border-radius: 0 !important;
  font-weight: 600 !important;
  line-height: 1.55 !important;
}

html body.page-node-type-service .question-spacer {
  display: none !important;
}

html body.page-node-type-service .material-card-question a.btn-primary,
html body.page-node-type-service .service-cards-wrapper a.btn-primary,
html body.page-node-type-service a.btn-primary {
  -webkit-appearance: none !important;
  appearance: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 2.85rem !important;
  margin: 0.35rem auto 0 !important;
  padding: 0.75rem 1.4rem !important;
  border: 2px solid #000 !important;
  border-radius: 999px !important;
  background: linear-gradient(180deg, #9b4dd4 0%, #6716aa 55%, #3b0a5c 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-size: 1.05rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.02em !important;
  text-decoration: none !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.35) !important;
  box-shadow: 0 3px 0 #000, 0 8px 18px rgba(123, 44, 191, 0.35) !important;
}

html body.page-node-type-service a.btn-primary:hover,
html body.page-node-type-service a.btn-primary:focus-visible {
  filter: brightness(1.06) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  text-decoration: none !important;
}

/* -------------------------------------------------------------------------- */
/* FAQ                                                                         */
/* -------------------------------------------------------------------------- */

html body.page-node-type-service .faq-section {
  position: relative !important;
  margin: 1.5rem 0 0.5rem !important;
  padding: 1.25rem 0 0.25rem !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
}

html body.page-node-type-service .faq-grid {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 16px !important;
  margin: 0.85rem 0 0 !important;
}

html body.page-node-type-service .faq-card,
html body.page-node-type-service details.faq-card {
  background: var(--svc-white) !important;
  border: 1px solid var(--svc-border) !important;
  border-left: 4px solid #cca4f8 !important;
  border-radius: 14px !important;
  box-shadow: 0 4px 14px -8px rgba(26, 10, 36, 0.1) !important;
  overflow: hidden !important;
  margin: 0 !important;
  translate: 0 0;
  transition: translate 180ms cubic-bezier(0.2, 0.8, 0.2, 1),
    box-shadow 180ms cubic-bezier(0.2, 0.8, 0.2, 1),
    border-color 180ms ease !important;
}

/* Stored service FAQs can be direct siblings rather than grid children. */
html body.path-node.page-node-type-service #wrapper .faq-section > .faq-card + .faq-card {
  margin-top: 16px !important;
}

html body.path-node.page-node-type-service #wrapper .faq-section .jd-city-faq-grid {
  gap: 16px !important;
}

@media (max-width: 767.98px) {
  html body.path-node.page-node-type-service #wrapper .faq-section > .faq-card + .faq-card {
    margin-top: 12px !important;
  }

  html body.path-node.page-node-type-service #wrapper .faq-section :is(.faq-grid, .jd-city-faq-grid) {
    gap: 12px !important;
  }
}

html body.page-node-type-service .service-cards-wrapper .card:focus-within,
html body.page-node-type-service .material-card:focus-within,
html body.page-node-type-service details.faq-card:focus-within {
  translate: 0 -3px;
}

@media (hover: hover) and (pointer: fine) {
  html body.page-node-type-service .service-cards-wrapper .card:hover,
  html body.page-node-type-service .material-card:hover,
  html body.page-node-type-service details.faq-card:hover {
    translate: 0 -3px;
  }
}

html body.path-node.page-node-type-service #wrapper .faq-section .faq-card summary {
  position: relative !important;
  cursor: pointer !important;
  list-style: none !important;
  padding: 1rem 3.25rem 1rem 1.15rem !important;
  background: #faf5ff !important;
  color: var(--svc-deep) !important;
  -webkit-text-fill-color: var(--svc-deep) !important;
  font-weight: 800 !important;
  font-size: 1rem !important;
  line-height: 1.4 !important;
  border: 0 !important;
}

html body.page-node-type-service .faq-card summary::-webkit-details-marker {
  display: none !important;
}

html body.path-node.page-node-type-service #wrapper .faq-section .faq-card summary::after {
  content: "+" !important;
  position: absolute !important;
  right: 1rem !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  width: 1.45rem !important;
  height: 1.45rem !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: var(--svc-brand) !important;
  color: var(--svc-white) !important;
  -webkit-text-fill-color: var(--svc-white) !important;
  font-size: 1.05rem !important;
  font-weight: 800 !important;
  line-height: 1 !important;
}

html body.path-node.page-node-type-service #wrapper .faq-section .faq-card[open] summary::after {
  content: "−" !important;
  background: var(--svc-deep) !important;
}

html body.path-node.page-node-type-service #wrapper .faq-section .faq-card[open] summary {
  background: var(--svc-soft) !important;
  border-bottom: 1px solid var(--svc-border) !important;
}

html body.path-node.page-node-type-service #wrapper .faq-section .faq-card summary:focus-visible {
  outline: 3px solid var(--svc-brand) !important;
  outline-offset: -3px !important;
}

html body.path-node.page-node-type-service #wrapper .faq-section .faq-answer strong {
  color: var(--svc-brand) !important;
  -webkit-text-fill-color: var(--svc-brand) !important;
}

html body.page-node-type-service .faq-answer {
  padding: 0.95rem 1.15rem 1.15rem !important;
  margin: 0 !important;
  background: var(--svc-white) !important;
  color: var(--svc-body) !important;
}

/* -------------------------------------------------------------------------- */
/* Hero image + teaser icon (kill rem-hack offsets)                            */
/* -------------------------------------------------------------------------- */

html body.page-node-type-service .block-field-blocknodeservicefield-image,
html body.page-node-type-service .layout__region--first > .block-field-blocknodeservicefield-image {
  overflow: hidden !important;
  border-radius: 16px !important;
  border: 2px solid #000 !important;
  box-shadow: 0 10px 26px -12px rgba(26, 10, 36, 0.28) !important;
}

html body.page-node-type-service .block-field-blocknodeservicefield-image img,
html body.page-node-type-service .block-field-blocknodeservicefield-image picture img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  border-radius: 0 !important;
}

html body.page-node-type-service .block.block-layout-builder.block-field-blocknodeservicefield-teaser-icon img,
html body.page-node-type-service .block-field-blocknodeservicefield-teaser-icon img,
html body.page-node-type-service .layout__region--first .block-field-blocknodeservicefield-teaser-icon img,
html body.page-node-type-service .service-teaser img,
html body.page-node-type-service .field-field-teaser-icon img,
html body.page-node-type-service .field-field-media-image img {
  position: relative !important;
  left: auto !important;
  top: -10.5rem !important;
  right: auto !important;
  bottom: auto !important;
  transform: none !important;
  margin: 0 auto !important;
  margin-top: 0 !important;
  margin-left: auto !important;
  margin-right: auto !important;
  margin-bottom: 0 !important;
  float: none !important;
}

html body.page-node-type-service .block.block-layout-builder.block-field-blocknodeservicefield-teaser-icon,
html body.page-node-type-service .layout__region--first > .block-field-blocknodeservicefield-teaser-icon,
html body.page-node-type-service .layout__region--first > .service-teaser.block-field-blocknodeservicefield-teaser-icon,
html body.page-node-type-service .block-field-blocknodeservicefield-teaser-icon {
  top: auto !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  margin-top: 0 !important;
  margin-left: 0 !important;
  float: none !important;
}

@media (max-width: 991.98px) {
  html body.page-node-type-service .block.block-layout-builder.block-field-blocknodeservicefield-teaser-icon,
  html body.page-node-type-service .layout__region--first > .block-field-blocknodeservicefield-teaser-icon,
  html body.page-node-type-service .layout__region--first > .service-teaser.block-field-blocknodeservicefield-teaser-icon,
  html body.page-node-type-service .block-field-blocknodeservicefield-teaser-icon {
    position: relative !important;
    display: flex !important;
    justify-content: center !important;
    width: 100% !important;
    margin: -2.5rem auto 0.85rem !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    transform: none !important;
  }

  html body.page-node-type-service .block.block-layout-builder.block-field-blocknodeservicefield-teaser-icon img,
  html body.page-node-type-service .block-field-blocknodeservicefield-teaser-icon img,
  html body.page-node-type-service .layout__region--first .block-field-blocknodeservicefield-teaser-icon img {
    position: relative !important;
    left: 9rem !important;
    top: 4rem !important;
    margin: 0 auto !important;
    margin-top: 0 !important;
    margin-left: auto !important;
    width: 96px !important;
    height: 96px !important;
    max-width: 96px !important;
  }
}

@media (min-width: 992px) {
  html body.page-node-type-service .layout__region--first > .block-field-blocknodeservicefield-teaser-icon,
  html body.page-node-type-service .layout__region--first > .service-teaser.block-field-blocknodeservicefield-teaser-icon {
    position: absolute !important;
    right: -3.5rem !important;
    left: auto !important;
    top: 43.5% !important;
    transform: translateY(-50%) !important;
    width: 120px !important;
    height: 120px !important;
    margin: 0 !important;
  }

  html body.page-node-type-service .layout__region--first .block-field-blocknodeservicefield-teaser-icon img {
    width: 120px !important;
    height: 120px !important;
  }
}

/* -------------------------------------------------------------------------- */
/* Desktop grids                                                               */
/* -------------------------------------------------------------------------- */

@media (min-width: 768px) {
  html body.page-node-type-service .highlight-grid,
  html body.page-node-type-service .highlight-grid.main-grid {
    grid-template-columns: 1fr 1fr !important;
    gap: 1rem !important;
  }

  html body.page-node-type-service .trust-grid {
    grid-template-columns: 1fr 1fr !important;
    gap: 1rem !important;
  }

  html body.page-node-type-service .trust-grid:has(> .process-step) {
    grid-template-columns: 1fr !important;
  }

  html body.page-node-type-service .faq-grid {
    grid-template-columns: 1fr 1fr !important;
    gap: 16px !important;
  }
}

/* -------------------------------------------------------------------------- */
/* Mobile type + padding                                                       */
/* -------------------------------------------------------------------------- */

@media (max-width: 767.98px) {
  html body.page-node-type-service .service-cards-wrapper .card,
  html body.page-node-type-service .material-card,
  html body.page-node-type-service .summary-box,
  html body.page-node-type-service .trust-card,
  html body.page-node-type-service .authority-box,
  html body.page-node-type-service .service-areas-callout,
  html body.page-node-type-service .material-card-question {
    padding: 1.05rem 1rem 1.1rem !important;
    border-radius: 14px !important;
  }

  html body.page-node-type-service .service-cards-wrapper h2,
  html body.page-node-type-service .card-title h2,
  html body.page-node-type-service .material-card h2 {
    font-size: 1.06rem !important;
  }

  html body.page-node-type-service .service-cards-wrapper p,
  html body.page-node-type-service .material-card p,
  html body.page-node-type-service .faq-answer {
    font-size: 0.98rem !important;
  }

  html body.page-node-type-service .hero-stat {
    font-size: 0.82rem !important;
    padding: 0.35rem 0.7rem !important;
  }

  html body.path-node.page-node-type-service #wrapper .faq-section .faq-card summary {
    padding: 0.9rem 3rem 0.9rem 1rem !important;
    font-size: 0.96rem !important;
  }
}

@media (max-width: 575.98px) {
  html body.page-node-type-service .service-cards-wrapper h1,
  html body.page-node-type-service .hero-card > h1,
  html body.page-node-type-service .summary-box > h1 {
    font-size: 1.28rem !important;
    padding: 0.7rem 0.8rem !important;
  }

  html body.page-node-type-service .block-field-blocknodeservicefield-teaser-icon img {
    width: 84px !important;
    height: 84px !important;
    max-width: 84px !important;
  }

  html body.page-node-type-service .layout__region--first > .block-field-blocknodeservicefield-teaser-icon {
    margin-top: -2.1rem !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  html body.page-node-type-service .service-cards-wrapper .card,
  html body.page-node-type-service .material-card,
  html body.page-node-type-service .summary-box,
  html body.page-node-type-service .authority-box,
  html body.page-node-type-service .service-areas-callout,
  html body.page-node-type-service .material-card-question,
  html body.page-node-type-service details.faq-card,
  html body.page-node-type-service [data-cyb-animate],
  html body.page-node-type-service .animate__animated {
    animation: none !important;
    transition: none !important;
    translate: none !important;
    scale: none !important;
    opacity: 1 !important;
    visibility: visible !important;
  }
}

/* Service note callout and modal-close cleanup. */
html body.page-node-type-service #wrapper .material-card-question h2 {
  margin-inline: auto !important;
  text-align: center !important;
  width: 100% !important;
}

html body.page-node-type-service #wrapper .service-notes {
  background:
    radial-gradient(circle at 92% 8%, rgba(157, 78, 221, 0.15), transparent 34%),
    linear-gradient(145deg, #ffffff 0%, var(--svc-soft) 100%) !important;
  border: 1px solid var(--svc-border) !important;
  border-top: 4px solid var(--svc-brand) !important;
  border-radius: 18px !important;
  box-shadow: 0 16px 34px -28px rgba(59, 10, 92, 0.6) !important;
  margin: 1.25rem 0 !important;
  overflow: hidden !important;
  padding: clamp(1.15rem, 3vw, 1.75rem) !important;
  position: relative !important;
  text-align: center !important;
}

html body.page-node-type-service #wrapper .service-notes h2 {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: var(--svc-deep) !important;
  -webkit-text-fill-color: var(--svc-deep) !important;
  font-size: clamp(1.2rem, 2.4vw, 1.55rem) !important;
  margin: 0 auto 0.65rem !important;
  max-width: 42rem !important;
  padding: 0 !important;
  text-align: center !important;
}

html body.page-node-type-service #wrapper .service-notes p {
  color: var(--svc-body) !important;
  -webkit-text-fill-color: var(--svc-body) !important;
  line-height: 1.65 !important;
  margin: 0 auto !important;
  max-width: 50rem !important;
  text-align: center !important;
}

/* Modal Page renders outside #wrapper; scope this exception to the service offer. */
html body.path-node.page-node-type-service #js-modal-page-show-modal[aria-labelledby="vehicle_ai_modal_label"] .modal-header-right {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  flex-shrink: 0;
}

html body.path-node.page-node-type-service #js-modal-page-show-modal[aria-labelledby="vehicle_ai_modal_label"] .modal-title {
  min-width: 0;
}

html body.path-node.page-node-type-service #js-modal-page-show-modal[aria-labelledby="vehicle_ai_modal_label"] .modal-header-right .close {
  align-items: center !important;
  background: #f3e8ff !important;
  border: 0 !important;
  border-radius: 50% !important;
  box-sizing: border-box !important;
  box-shadow: none !important;
  color: #6716aa !important;
  -webkit-text-fill-color: #6716aa !important;
  display: inline-flex !important;
  flex-shrink: 0;
  font-size: 24px !important;
  font-weight: 400 !important;
  height: 44px !important;
  justify-content: center !important;
  line-height: 1 !important;
  margin: 0 !important;
  min-height: 44px !important;
  min-width: 44px !important;
  opacity: 1 !important;
  padding: 0 !important;
  text-shadow: none !important;
  top: 0 !important;
  transform: none !important;
  width: 44px !important;
}

html body.path-node.page-node-type-service #js-modal-page-show-modal[aria-labelledby="vehicle_ai_modal_label"] .modal-header-right .close .jd-service-offer-close-icon {
  display: block !important;
  fill: none !important;
  flex: 0 0 18px !important;
  height: 18px !important;
  margin: 0 !important;
  padding: 0 !important;
  stroke: currentColor !important;
  transform: none !important;
  width: 18px !important;
}

@media (hover: hover) and (pointer: fine) {
  html body.path-node.page-node-type-service #js-modal-page-show-modal[aria-labelledby="vehicle_ai_modal_label"] .modal-header-right .close:hover {
    background: #9d4edd !important;
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
  }
}

html body.path-node.page-node-type-service #js-modal-page-show-modal[aria-labelledby="vehicle_ai_modal_label"] .modal-header-right .close:focus-visible {
  box-shadow: 0 0 0 3px rgba(243, 232, 255, 0.9) !important;
  outline: 2px solid #6716aa !important;
  outline-offset: 2px !important;
}

@media (max-width: 767.98px) {
  html body.page-node-type-service #wrapper .service-notes {
    border-radius: 14px !important;
    padding: 1rem !important;
  }

  html body.page-node-type-service #wrapper .service-notes p {
    font-size: 0.95rem !important;
    line-height: 1.6 !important;
  }
}

/* assets/css/service-videos.css */
/* Shared family film, directly beneath the full service page H1. */
html body.path-node.page-node-type-service #wrapper .jd-service-video {
  display: block;
  width: 100%;
  max-width: 1220px;
  margin: 0 auto 2rem;
  padding: 0;
  overflow: hidden;
  border: 1px solid #d7c7e8;
  border-radius: 18px;
  background: #f3f1f6;
  color: #241438;
  box-shadow: 0 14px 35px #24143812;
}

html body.path-node.page-node-type-service #wrapper .jd-service-video__frame {
  width: 100%;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: #241438;
}

html body.path-node.page-node-type-service #wrapper .jd-service-video__media {
  display: block;
  width: 100%;
  height: 100%;
  margin: 0;
  object-fit: contain;
  border: 0;
  background: #241438;
}

html body.path-node.page-node-type-service #wrapper .jd-service-video__caption {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px 20px;
  padding: 20px 24px;
  font-size: 15px;
  line-height: 1.5;
}

html body.path-node.page-node-type-service #wrapper .jd-service-video__description {
  display: grid;
  gap: 2px;
}

html body.path-node.page-node-type-service #wrapper .jd-service-video__description strong {
  color: #241438;
  font-size: 17px;
  font-weight: 700;
}

html body.path-node.page-node-type-service #wrapper .jd-service-video__description span {
  color: #604a71;
  font-size: 14px;
}

html body.path-node.page-node-type-service #wrapper .jd-service-video__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

html body.path-node.page-node-type-service #wrapper .jd-service-video__actions button {
  min-width: 44px;
  min-height: 44px;
  margin: 0;
  padding: 10px 16px;
  border: 1px solid #6716aa;
  border-radius: 999px;
  background: #6716aa;
  color: #fff;
  font: inherit;
  font-weight: 600;
  line-height: 1.4;
  cursor: pointer;
  text-shadow: none;
}

html body.path-node.page-node-type-service #wrapper .jd-service-video__actions .jd-service-video__sound {
  background: #f3e8ff;
  color: #3b0a5c;
}

html body.path-node.page-node-type-service #wrapper .jd-service-video__actions button:hover {
  background: #3b0a5c;
  color: #fff;
}

html body.path-node.page-node-type-service #wrapper .jd-service-video__guide {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  color: #6716aa;
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 3px;
}

html body.path-node.page-node-type-service #wrapper .jd-service-video__status {
  flex-basis: 100%;
  margin: 0;
  color: #604a71;
  font-size: 14px;
}

html body.path-node.page-node-type-service #wrapper #main-content .jd-service-video__chapters {
  padding: 20px 24px;
  border-top: 1px solid #d7c7e8;
  color: #241438;
  font-size: 14px;
  line-height: 1.5;
}

html body.path-node.page-node-type-service #wrapper #main-content .jd-service-video__chapters > strong {
  display: block;
  margin-bottom: 10px;
  color: #241438;
}

html body.path-node.page-node-type-service #wrapper #main-content .jd-service-video__chapters ol {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none;
}

html body.path-node.page-node-type-service #wrapper #main-content .jd-service-video__chapters li {
  min-width: 0;
  margin: 0;
  padding: 0;
}

html body.path-node.page-node-type-service #wrapper #main-content .jd-service-video__chapters button {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-height: 44px;
  margin: 0 !important;
  padding: 8px;
  border: 1px solid #d7c7e8;
  border-radius: 8px;
  background: #faf5ff;
  color: #6716aa;
  -webkit-text-fill-color: #6716aa;
  font: inherit;
  line-height: 1.5;
  text-align: left;
  overflow-wrap: anywhere;
  cursor: pointer;
  text-shadow: none;
}

html body.path-node.page-node-type-service #wrapper #main-content .jd-service-video__chapters button:is(:hover, [aria-current]) {
  border-color: #6716aa;
  background: #f3e8ff;
}

html body.path-node.page-node-type-service #wrapper #main-content .jd-service-video__chapters button:focus-visible {
  outline: 3px solid #9d4edd !important;
  outline-offset: 3px;
}

html body.path-node.page-node-type-service #wrapper #main-content .jd-service-video__chapter-time {
  flex: 0 0 auto;
  font-variant-numeric: tabular-nums;
  font-weight: 750;
}

html body.path-node.page-node-type-service #wrapper .jd-service-video__transcript {
  margin: 0;
  padding: 0 24px 14px;
  border: 0;
  border-top: 1px solid #d7c7e8;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

html body.path-node.page-node-type-service #wrapper .jd-service-video__transcript summary {
  min-height: 44px;
  padding: 12px 0 2px;
  color: #6716aa;
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
}

html body.path-node.page-node-type-service #wrapper .jd-service-video__transcript p {
  margin: 12px 0;
  color: #241438;
  font-size: 15px;
  line-height: 1.65;
}

html body.path-node.page-node-type-service #wrapper .jd-service-video :is(button, a, summary, video):focus-visible {
  outline: 3px solid #9d4edd;
  outline-offset: 3px;
}

html body.path-node.page-node-type-service #wrapper .jd-service-video__media:focus-visible {
  outline-offset: -4px;
}

html body.path-node.page-node-type-service #wrapper .jd-service-video [hidden] {
  display: none !important;
}

@media (max-width: 767px) {
  html body.path-node.page-node-type-service #wrapper .jd-service-video {
    margin-bottom: 1.5rem;
    border-radius: 12px;
  }

  html body.path-node.page-node-type-service #wrapper .jd-service-video__caption {
    gap: 10px;
    padding: 16px;
  }

  html body.path-node.page-node-type-service #wrapper .jd-service-video__description,
  html body.path-node.page-node-type-service #wrapper .jd-service-video__actions {
    width: 100%;
  }

  html body.path-node.page-node-type-service #wrapper .jd-service-video__actions button {
    flex: 1;
    padding-inline: 10px;
  }

  html body.path-node.page-node-type-service #wrapper .jd-service-video__transcript {
    padding-inline: 16px;
  }

  html body.path-node.page-node-type-service #wrapper #main-content .jd-service-video__chapters {
    padding: 16px;
  }

  html body.path-node.page-node-type-service #wrapper #main-content .jd-service-video__chapters ol {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* assets/css/service-related-articles.css */
/**
 * Service-page related article cards and legacy FlexSliders.
 * Loaded late to replace historical high-specificity teaser overrides.
 */

html body.page-node-type-service #wrapper #content-wide [id*='views-block-blog'].block {
  --jd-related-deep: #3b0a5c;
  --jd-related-purple: #6716aa;
  --jd-related-violet: #9d4edd;
  --jd-related-lilac: #f3e8ff;
  --jd-related-mist: #faf5ff;
  --jd-related-line: #e9d5ff;
  background:
    radial-gradient(circle at 0 0, rgba(157, 78, 221, 0.13), transparent 32%),
    linear-gradient(145deg, #ffffff 0%, #faf5ff 100%) !important;
  border: 2px solid #b781e3 !important;
  border-radius: 24px !important;
  box-shadow: 0 22px 50px -40px rgba(59, 10, 92, 0.62) !important;
  box-sizing: border-box !important;
  clear: both !important;
  margin-bottom: 2.5rem !important;
  max-width: 75rem !important;
  overflow: hidden !important;
  padding: clamp(1rem, 2.8vw, 2rem) !important;
  position: relative !important;
  width: calc(100% - 30px) !important;
}

html body.page-node-type-service #wrapper #content-wide [id*='views-block-blog'].block > .container-wrap,
html body.page-node-type-service #wrapper #content-wide [id*='views-block-blog'].block .block-content,
html body.page-node-type-service #wrapper #content-wide [id*='views-block-blog'].block .views-element-container,
html body.page-node-type-service #wrapper #content-wide [id*='views-block-blog'].block .view-item {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
  display: block !important;
  margin: 0 !important;
  max-width: 100% !important;
  overflow: visible !important;
  padding: 0 !important;
  width: 100% !important;
}

html body.page-node-type-service #wrapper #content-wide [id*='views-block-blog'].block .block-title-wrap,
html body.page-node-type-service #wrapper #content-wide [id*='views-block-blog'].block .block-title-content {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  display: block !important;
  margin: 0 auto clamp(1.1rem, 2.5vw, 1.6rem) !important;
  max-width: 48rem !important;
  padding: 0 !important;
  text-align: center !important;
  width: 100% !important;
}

html body.page-node-type-service #wrapper #content-wide [id*='views-block-blog'].block h2.block-title {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: var(--jd-related-deep) !important;
  -webkit-text-fill-color: var(--jd-related-deep) !important;
  font-size: clamp(1.35rem, 3vw, 2rem) !important;
  font-weight: 850 !important;
  letter-spacing: -0.025em !important;
  line-height: 1.2 !important;
  margin: 0 !important;
  padding: 0 !important;
  text-align: center !important;
  text-wrap: balance;
}

html body.page-node-type-service #wrapper #content-wide [id*='views-block-blog'].block .flexslider {
  background: transparent !important;
  border: 0 !important;
  border-radius: 18px !important;
  box-shadow: none !important;
  margin: 0 !important;
  overflow: hidden !important;
  padding: 0 !important;
  position: relative !important;
  width: 100% !important;
}

html body.page-node-type-service #wrapper #content-wide [id*='views-block-blog'].block .flex-viewport,
html body.page-node-type-service #wrapper #content-wide [id*='views-block-blog'].block .slides,
html body.page-node-type-service #wrapper #content-wide [id*='views-block-blog'].block .slides > li {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
}

/* Fade-mode slides must overlap instead of contributing three card heights. */
html body.page-node-type-service #wrapper #content-wide [id*='views-block-blog'].block .slides {
  height: auto !important;
  position: relative !important;
}

html body.page-node-type-service #wrapper #content-wide [id*='views-block-blog'].block .slides > li {
  float: none !important;
  inset: 0 !important;
  position: absolute !important;
}

html body.page-node-type-service #wrapper #content-wide [id*='views-block-blog'].block .slides > li.flex-active-slide {
  position: relative !important;
}

html body.page-node-type-service #wrapper #content-wide [id*='views-block-blog'].block .blog-post-teaser,
html body.page-node-type-service #wrapper #content-wide [id*='views-block-blog'].block .blog-post-teaser.post-row {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  display: block !important;
  margin: 0 !important;
  max-width: 100% !important;
  padding: 0 !important;
  transform: none !important;
  width: 100% !important;
}

html body.page-node-type-service #wrapper #content-wide [id*='views-block-blog'].block .post-content-wrap {
  align-items: stretch !important;
  background: #ffffff !important;
  border: 1px solid var(--jd-related-line) !important;
  border-radius: 18px !important;
  box-shadow:
    0 18px 38px -30px rgba(59, 10, 92, 0.58),
    0 7px 18px -16px rgba(103, 22, 170, 0.34) !important;
  display: grid !important;
  grid-template-columns: minmax(17rem, 0.9fr) minmax(0, 1.1fr) !important;
  margin: 0 !important;
  min-height: 24rem !important;
  overflow: hidden !important;
  padding: 0 !important;
  width: 100% !important;
}

html body.page-node-type-service #wrapper #content-wide [id*='views-block-blog'].block :is(.post-thumb, .post-media, .post-image) {
  background: linear-gradient(145deg, var(--jd-related-deep), var(--jd-related-purple)) !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  height: 100% !important;
  margin: 0 !important;
  max-height: none !important;
  max-width: none !important;
  min-height: 24rem !important;
  overflow: hidden !important;
  padding: 0 !important;
  position: relative !important;
  transform: none !important;
  width: 100% !important;
}

html body.page-node-type-service #wrapper #content-wide [id*='views-block-blog'].block .post-image img {
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  display: block !important;
  height: 100% !important;
  margin: 0 !important;
  max-height: none !important;
  max-width: none !important;
  object-fit: cover !important;
  object-position: center !important;
  padding: 0 !important;
  scale: 1 !important;
  transform: none !important;
  width: 100% !important;
}

html body.page-node-type-service #wrapper #content-wide [id*='views-block-blog'].block :is(.content-wrap, .post-content) {
  background: #ffffff !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: #33263d !important;
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
  margin: 0 !important;
  min-width: 0 !important;
  overflow: visible !important;
  width: 100% !important;
}

html body.page-node-type-service #wrapper #content-wide [id*='views-block-blog'].block .post-content {
  padding: clamp(1rem, 2.6vw, 1.6rem) !important;
}

html body.page-node-type-service #wrapper #content-wide [id*='views-block-blog'].block :is(.post-title-wrap, .post-title) {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  margin: 0 0 0.7rem !important;
  padding: 0 !important;
}

html body.page-node-type-service #wrapper #content-wide [id*='views-block-blog'].block .post-title a,
html body.page-node-type-service #wrapper #content-wide [id*='views-block-blog'].block .post-title a span {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: var(--jd-related-deep) !important;
  -webkit-text-fill-color: var(--jd-related-deep) !important;
  display: inline !important;
  font-size: clamp(1.08rem, 2.2vw, 1.35rem) !important;
  font-weight: 850 !important;
  letter-spacing: -0.015em !important;
  line-height: 1.3 !important;
  margin: 0 !important;
  padding: 0 !important;
  text-decoration: none !important;
}

html body.page-node-type-service #wrapper #content-wide [id*='views-block-blog'].block .post-title a:is(:hover, :focus-visible) {
  color: var(--jd-related-purple) !important;
  -webkit-text-fill-color: var(--jd-related-purple) !important;
  text-decoration: underline !important;
  text-decoration-thickness: 2px !important;
  text-underline-offset: 3px !important;
}

html body.page-node-type-service #wrapper #content-wide [id*='views-block-blog'].block .post-excerpt {
  align-self: center !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
  color: #594b63 !important;
  -webkit-text-fill-color: #594b63 !important;
  font-size: 0.94rem !important;
  line-height: 1.6 !important;
  margin: 0 auto !important;
  max-width: 100% !important;
  padding: 0 !important;
  text-align: center !important;
  width: 100% !important;
}

html body.page-node-type-service #wrapper #content-wide [id*='views-block-blog'].block .post-excerpt * {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: #594b63 !important;
  -webkit-text-fill-color: #594b63 !important;
  font-size: 0.94rem !important;
  line-height: 1.6 !important;
  margin: 0 auto !important;
  padding: 0 !important;
  text-align: center !important;
  width: 100% !important;
}

html body.page-node-type-service #wrapper #content-wide [id*='views-block-blog'].block .post-excerpt .field-item {
  display: block !important;
  margin: 0 auto !important;
  max-width: 100% !important;
  text-align: center !important;
  width: 100% !important;
}

html body.page-node-type-service #wrapper #content-wide [id*='views-block-blog'].block :is(.field-label, .post-comment, .tags-label, .post-tags > i) {
  display: none !important;
}

html body.page-node-type-service #wrapper #content-wide [id*='views-block-blog'].block .post-meta {
  align-items: center !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 0.4rem !important;
  margin: 0.9rem 0 0 !important;
  padding: 0 !important;
}

html body.page-node-type-service #wrapper #content-wide [id*='views-block-blog'].block .post-meta-item {
  align-items: center !important;
  background: var(--jd-related-mist) !important;
  border: 1px solid var(--jd-related-line) !important;
  border-radius: 999px !important;
  box-shadow: none !important;
  color: #4d4056 !important;
  display: inline-flex !important;
  font-size: 0.72rem !important;
  gap: 0.25rem !important;
  line-height: 1.3 !important;
  margin: 0 !important;
  padding: 0.28rem 0.58rem !important;
  width: auto !important;
}

html body.page-node-type-service #wrapper #content-wide [id*='views-block-blog'].block .post-meta-item *,
html body.page-node-type-service #wrapper #content-wide [id*='views-block-blog'].block .post-meta-item a {
  background: transparent !important;
  border: 0 !important;
  color: inherit !important;
  display: inline !important;
  margin: 0 !important;
  padding: 0 !important;
  width: auto !important;
}

html body.page-node-type-service #wrapper #content-wide [id*='views-block-blog'].block .post-tags {
  align-items: center !important;
  background: transparent !important;
  border: 0 !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 0.32rem !important;
  margin: 0.65rem 0 0 !important;
  padding: 0 !important;
}

html body.page-node-type-service #wrapper #content-wide [id*='views-block-blog'].block :is(.tags-list, .post-tags .field-items) {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 0.32rem !important;
  margin: 0 !important;
  padding: 0 !important;
  justify-content: center !important;
}

html body.page-node-type-service #wrapper #content-wide [id*='views-block-blog'].block .post-tags .field-item {
  background: var(--jd-related-lilac) !important;
  border: 1px solid var(--jd-related-line) !important;
  border-radius: 999px !important;
  color: var(--jd-related-purple) !important;
  display: inline-flex !important;
  font-size: 0.7rem !important;
  font-weight: 750 !important;
  margin: 0 !important;
  overflow: hidden !important;
  padding: 0 !important;
  text-decoration: none !important;
  width: auto !important;
}

/* Drupal renders each tag as .field-item > a. Keep the pill chrome only on
 * the outer field item so nested borders/backgrounds do not create a double
 * ring around the tag label. */
html body.page-node-type-service #wrapper #content-wide [id*='views-block-blog'].block .post-tags .field-item > a {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: inherit !important;
  -webkit-text-fill-color: currentColor !important;
  display: inline-flex !important;
  margin: 0 !important;
  padding: 0.24rem 0.52rem !important;
}

html body.page-node-type-service #wrapper #content-wide [id*='views-block-blog'].block .post-link {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  margin: auto 0 0 !important;
  padding: 1rem 0 0 !important;
  position: static !important;
  transform: none !important;
  width: 100% !important;
}

html body.page-node-type-service #wrapper #content-wide [id*='views-block-blog'].block a.read-more {
  align-items: center !important;
  background: linear-gradient(135deg, var(--jd-related-deep), var(--jd-related-purple)) !important;
  border: 1px solid var(--jd-related-deep) !important;
  border-radius: 10px !important;
  box-shadow: 0 8px 18px -12px rgba(59, 10, 92, 0.72) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  display: inline-flex !important;
  font-size: 0.9rem !important;
  font-weight: 800 !important;
  justify-content: center !important;
  margin: 0 !important;
  min-height: 44px !important;
  padding: 0.62rem 0.9rem !important;
  position: static !important;
  text-decoration: none !important;
  transform: none !important;
  width: 100% !important;
}

html body.page-node-type-service #wrapper #content-wide [id*='views-block-blog'].block .flex-direction-nav {
  display: contents !important;
}

html body.page-node-type-service #wrapper #content-wide [id*='views-block-blog'].block .flex-direction-nav a {
  align-items: center !important;
  background: rgba(255, 255, 255, 0.96) !important;
  border: 1px solid rgba(103, 22, 170, 0.28) !important;
  border-radius: 50% !important;
  box-shadow: 0 5px 16px rgba(59, 10, 92, 0.2) !important;
  color: var(--jd-related-deep) !important;
  display: flex !important;
  height: 42px !important;
  justify-content: center !important;
  margin: -21px 0 0 !important;
  opacity: 1 !important;
  overflow: hidden !important;
  position: absolute !important;
  text-indent: -9999px !important;
  top: 50% !important;
  width: 42px !important;
  z-index: 20 !important;
}

html body.page-node-type-service #wrapper #content-wide [id*='views-block-blog'].block .flex-direction-nav a::before {
  color: var(--jd-related-deep) !important;
  font-size: 17px !important;
  line-height: 42px !important;
}

html body.page-node-type-service #wrapper #content-wide [id*='views-block-blog'].block .flex-direction-nav .flex-prev {
  left: 0.7rem !important;
}

html body.page-node-type-service #wrapper #content-wide [id*='views-block-blog'].block .flex-direction-nav .flex-next {
  left: auto !important;
  right: 0.7rem !important;
}

html body.page-node-type-service #wrapper #content-wide [id*='views-block-blog'].block .flex-control-nav {
  align-items: center !important;
  bottom: 0.75rem !important;
  display: flex !important;
  gap: 0.42rem !important;
  justify-content: center !important;
  left: 50% !important;
  margin: 0 !important;
  padding: 0 !important;
  position: absolute !important;
  transform: translateX(-50%) !important;
  width: auto !important;
  z-index: 21 !important;
}

html body.page-node-type-service #wrapper #content-wide [id*='views-block-blog'].block .flex-control-nav li {
  margin: 0 !important;
}

html body.page-node-type-service #wrapper #content-wide [id*='views-block-blog'].block .flex-control-nav a {
  background: #ffffff !important;
  border: 1px solid var(--jd-related-purple) !important;
  box-shadow: none !important;
  height: 10px !important;
  width: 10px !important;
}

html body.page-node-type-service #wrapper #content-wide [id*='views-block-blog'].block .flex-control-nav a.flex-active {
  background: var(--jd-related-purple) !important;
}

@media (max-width: 767.98px) {
  html body.page-node-type-service #wrapper #content-wide [id*='views-block-blog'].block {
    border-radius: 18px !important;
    padding: 0.85rem !important;
    width: calc(100% - 20px) !important;
    margin-bottom: 1.5rem !important;
  }

  /* Center the long related-articles title between its two accent rules. */
  html body.page-node-type-service #wrapper #content-wide [id*='views-block-blog'].block .block-title-wrap {
    margin-top: 1.25rem !important;
  }

  html body.page-node-type-service #wrapper #content-wide [id*='views-block-blog'].block .post-content-wrap {
    display: flex !important;
    flex-direction: column !important;
    min-height: 0 !important;
  }

  html body.page-node-type-service #wrapper #content-wide [id*='views-block-blog'].block :is(.post-thumb, .post-media, .post-image) {
    aspect-ratio: 16 / 9 !important;
    height: auto !important;
    min-height: 0 !important;
  }

  html body.page-node-type-service #wrapper #content-wide [id*='views-block-blog'].block .post-content {
    padding: 1rem 0.9rem 2.15rem !important;
  }

  html body.page-node-type-service #wrapper #content-wide [id*='views-block-blog'].block .flexslider {
    container-type: inline-size;
  }

  html body.page-node-type-service #wrapper #content-wide [id*='views-block-blog'].block .flex-direction-nav a {
    height: 38px !important;
    margin-top: -19px !important;
    top: 28.125cqw !important;
    width: 38px !important;
  }

  html body.page-node-type-service #wrapper #content-wide [id*='views-block-blog'].block .flex-direction-nav a::before {
    line-height: 38px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  html body.page-node-type-service #wrapper #content-wide [id*='views-block-blog'].block *,
  html body.page-node-type-service #wrapper #content-wide [id*='views-block-blog'].block *::before,
  html body.page-node-type-service #wrapper #content-wide [id*='views-block-blog'].block *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
  }
}

/* Shared city service pages use full-width image-and-copy article cards. */
html body.path-node.page-node-type-service #wrapper.jd-city-redesign .jd-city-page--service .jd-city-related > .jd-city-grid {
  grid-template-columns: minmax(0, 1fr);
  gap: 24px;
}

html body.path-node.page-node-type-service #wrapper.jd-city-redesign .jd-city-page--service .jd-city-related .jd-city-article {
  display: grid;
  grid-template-columns: minmax(0, 0.36fr) minmax(0, 0.64fr);
  min-height: 240px;
  padding: 0;
}

html body.path-node.page-node-type-service #wrapper.jd-city-redesign .jd-city-page--service .jd-city-related .jd-city-article--text {
  grid-template-columns: minmax(0, 1fr);
  min-height: 0;
}

html body.path-node.page-node-type-service #wrapper.jd-city-redesign .jd-city-page--service .jd-city-article-media {
  position: relative;
  aspect-ratio: 3 / 2;
  min-width: 0;
  overflow: hidden;
  background: #faf5ff;
  border-right: 1px solid #dfcbea;
}

html body.path-node.page-node-type-service #wrapper.jd-city-redesign .jd-city-page--service .jd-city-article-media img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  margin: 0;
}

html body.path-node.page-node-type-service #wrapper.jd-city-redesign .jd-city-page--service .jd-city-article-copy {
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-width: 0;
  padding: 24px;
}

html body.path-node.page-node-type-service #wrapper.jd-city-redesign .jd-city-page--service .jd-city-article-copy h3,
html body.path-node.page-node-type-service #wrapper.jd-city-redesign .jd-city-page--service .jd-city-article-copy p {
  margin: 0;
}

/* Blog metadata follows the site's lavender badge treatment. */
html body.path-node.page-node-type-service #wrapper.jd-city-redesign .jd-city-page--service .jd-city-article-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

html body.path-node.page-node-type-service #wrapper.jd-city-redesign .jd-city-page--service .jd-city-article-meta-item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  max-width: 100%;
  min-height: 44px;
  padding: 8px 10px;
  border: 1px solid #e9d5ff;
  border-radius: 999px;
  background: #faf5ff;
  color: #4d4056;
  font-size: 13px;
  line-height: 1.4;
  overflow-wrap: anywhere;
}

html body.path-node.page-node-type-service #wrapper.jd-city-redesign .jd-city-page--service .jd-city-article-meta-item .read-time-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

html body.path-node.page-node-type-service #wrapper.jd-city-redesign .jd-city-page--service .jd-city-article-meta-item i {
  flex: 0 0 auto;
  color: #6716aa;
}

html body.path-node.page-node-type-service #wrapper.jd-city-redesign .jd-city-page--service .jd-city-article-meta-item > :is(span, a, time) {
  min-width: 0;
}

html body.path-node.page-node-type-service #wrapper.jd-city-redesign .jd-city-page--service .jd-city-article-meta-item a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  color: #6716aa;
  font-size: inherit;
  line-height: inherit;
  overflow-wrap: anywhere;
}

html body.path-node.page-node-type-service #wrapper.jd-city-redesign .jd-city-page--service .jd-city-article-meta-item:has(a) {
  padding-top: 0;
  padding-bottom: 0;
}

html body.path-node.page-node-type-service #wrapper.jd-city-redesign .jd-city-page--service .jd-city-article-copy .jd-city-text-link {
  display: inline-flex;
  align-items: center;
  align-self: flex-start;
  gap: 4px;
  min-height: 44px;
  padding-top: 12px;
  margin-top: auto;
}

html body.path-node.page-node-type-service #wrapper.jd-city-redesign .jd-city-page--service .jd-city-article-copy a:hover {
  color: #6716aa;
  text-decoration: underline !important;
  text-underline-offset: 3px;
}

@media (max-width: 767.98px) {
  html body.path-node.page-node-type-service #wrapper.jd-city-redesign .jd-city-page--service .jd-city-related > .jd-city-grid {
    gap: 22px;
  }

  html body.path-node.page-node-type-service #wrapper.jd-city-redesign .jd-city-page--service .jd-city-related .jd-city-article {
    grid-template-columns: minmax(0, 1fr);
    min-height: 0;
  }

  html body.path-node.page-node-type-service #wrapper.jd-city-redesign .jd-city-page--service .jd-city-article-media {
    border-right: 0;
    border-bottom: 1px solid #dfcbea;
  }

  html body.path-node.page-node-type-service #wrapper.jd-city-redesign .jd-city-page--service .jd-city-article-copy {
    padding: 20px;
  }
}

/* assets/css/form-index.css */
/**
 * Johnny Detail public form chooser (/form).
 * Individual Webforms are styled by webform-modern.css.
 */

html body.path-form:not(.path-webform),
html body.page-form-index {
  --jd-fi-deep: #3b0a5c;
  --jd-fi-purple: #6716aa;
  --jd-fi-violet: #9d4edd;
  --jd-fi-accent: #9d4edd;
  --jd-fi-accent-deep: #7b2cbf;
  --jd-fi-lilac: #f3e8ff;
  --jd-fi-ink: #211029;
  --jd-fi-body: #475569;
  --jd-fi-border: #e7d4fa;
  --jd-fi-shadow: 0 22px 55px rgba(59, 10, 92, 0.11);
  --jd-fi-shadow-soft: 0 12px 30px rgba(59, 10, 92, 0.075);
  --jd-fi-font: var(--jd-font-text);
}

html body.path-form:not(.path-webform) #wrapper,
html body.page-form-index #wrapper {
  background:
    radial-gradient(circle at 8% 9%, rgba(157, 78, 221, 0.12), transparent 27rem),
    radial-gradient(circle at 92% 3%, rgba(157, 78, 221, 0.12), transparent 30rem),
    linear-gradient(180deg, #fff 0%, #fcf9ff 45%, #f8f2ff 100%) !important;
}

html body.path-form:not(.path-webform) #wrapper .col-md-9.left-content.main-content,
html body.path-form:not(.path-webform) #wrapper .col-md-9,
html body.page-form-index #wrapper .col-md-9.left-content.main-content,
html body.page-form-index #wrapper .col-md-9 {
  float: none !important;
  flex: 0 0 100% !important;
  width: 100% !important;
  max-width: 100% !important;
  margin-right: auto !important;
  margin-left: auto !important;
  padding-right: 0 !important;
  padding-left: 0 !important;
}

html body.path-form:not(.path-webform) #wrapper .col-md-3.sidebar,
html body.page-form-index #wrapper .col-md-3.sidebar {
  display: none !important;
}

html body.path-form:not(.path-webform) #wrapper .jd-form-index,
html body.page-form-index #wrapper .jd-form-index {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 76rem !important;
  margin: 1rem auto 3.25rem !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: var(--jd-fi-body) !important;
  font-family: var(--jd-fi-font) !important;
  margin-bottom: -2rem !important;
}

html body.path-form:not(.path-webform) #wrapper .jd-form-index__hero,
html body.page-form-index #wrapper .jd-form-index__hero {
  position: relative !important;
  isolation: isolate;
  overflow: hidden !important;
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 76rem !important;
  margin: 0 auto 1.35rem !important;
  padding: clamp(1.5rem, 4vw, 2.75rem) !important;
  background:
    radial-gradient(circle at 92% 15%, rgba(157, 78, 221, 0.19), transparent 21rem),
    linear-gradient(135deg, #fff 0%, #fbf5ff 100%) !important;
  border: 1px solid var(--jd-fi-border) !important;
  border-radius: 24px !important;
  box-shadow: var(--jd-fi-shadow) !important;
  text-align: center !important;
  margin-top: -0.5rem !important;
}

html body.path-form:not(.path-webform) #wrapper .jd-form-index__hero > *,
html body.page-form-index #wrapper .jd-form-index__hero > * {
  position: relative !important;
  z-index: 2 !important;
}

html body.path-form:not(.path-webform) #wrapper .jd-form-index__eyebrow,
html body.page-form-index #wrapper .jd-form-index__eyebrow {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  max-width: 100% !important;
  margin: 0 0 0.85rem !important;
  padding: 0.38rem 0.82rem !important;
  background: linear-gradient(135deg, var(--jd-fi-lilac), #f3e8ff) !important;
  border: 1px solid #e6c8fa !important;
  border-radius: 999px !important;
  box-shadow: none !important;
  color: var(--jd-fi-deep) !important;
  -webkit-text-fill-color: var(--jd-fi-deep) !important;
  font-size: 0.72rem !important;
  font-weight: 850 !important;
  letter-spacing: 0.075em !important;
  line-height: 1.2 !important;
  text-align: center !important;
  text-transform: uppercase !important;
}

html body.path-form:not(.path-webform) #wrapper .jd-form-index h1,
html body.page-form-index #wrapper .jd-form-index h1 {
  display: block !important;
  width: 100% !important;
  max-width: 51rem !important;
  margin: 0 auto 0.85rem !important;
  padding: 0 !important;
  background: none !important;
  border: 0 !important;
  box-shadow: none !important;
  color: var(--jd-fi-ink) !important;
  -webkit-text-fill-color: var(--jd-fi-ink) !important;
  font-size: clamp(1.9rem, 4.5vw, 3rem) !important;
  font-weight: 850 !important;
  letter-spacing: -0.04em !important;
  line-height: 1.08 !important;
  text-align: center !important;
  text-shadow: none !important;
}

html body.path-form:not(.path-webform) #wrapper .jd-form-index__deck,
html body.path-form:not(.path-webform) #wrapper .jd-form-index__phone,
html body.page-form-index #wrapper .jd-form-index__deck,
html body.page-form-index #wrapper .jd-form-index__phone {
  width: 100% !important;
  max-width: 44rem !important;
  margin: 0 auto 0.65rem !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: var(--jd-fi-body) !important;
  -webkit-text-fill-color: var(--jd-fi-body) !important;
  font-size: 1rem !important;
  line-height: 1.62 !important;
  text-align: center !important;
}

html body.path-form:not(.path-webform) #wrapper .jd-form-index__phone,
html body.page-form-index #wrapper .jd-form-index__phone {
  margin-bottom: 0 !important;
  font-weight: 650 !important;
}

html body.path-form:not(.path-webform) #wrapper .jd-form-index__phone a,
html body.page-form-index #wrapper .jd-form-index__phone a {
  color: var(--jd-fi-purple) !important;
  -webkit-text-fill-color: var(--jd-fi-purple) !important;
  font-weight: 850 !important;
  text-decoration-thickness: 1.5px !important;
  text-underline-offset: 3px !important;
}

html body.path-form:not(.path-webform) #wrapper .jd-form-index__grid,
html body.page-form-index #wrapper .jd-form-index__grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  align-items: stretch !important;
  gap: 1.15rem !important;
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 76rem !important;
  margin: 0 auto !important;
  padding: 0 !important;
}

html body.path-form:not(.path-webform) #wrapper .jd-form-index__card,
html body.page-form-index #wrapper .jd-form-index__card {
  position: relative !important;
  isolation: isolate;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  min-width: 0 !important;
  min-height: 100% !important;
  margin: 0 !important;
  padding: 1.55rem 1.4rem 1.35rem !important;
  background: linear-gradient(155deg, #fff 0%, #faf5ff 100%) !important;
  border: 1px solid var(--jd-fi-border) !important;
  border-radius: 19px !important;
  box-shadow: var(--jd-fi-shadow-soft) !important;
  color: var(--jd-fi-body) !important;
  text-align: left !important;
  text-decoration: none !important;
  translate: 0 0 !important;
  transition: translate 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease !important;
}

html body.path-form:not(.path-webform) #wrapper .jd-form-index__card h2,
html body.page-form-index #wrapper .jd-form-index__card h2 {
  display: block !important;
  width: 100% !important;
  margin: 0 0 0.65rem !important;
  padding: 0 !important;
  background: none !important;
  border: 0 !important;
  box-shadow: none !important;
  color: var(--jd-fi-deep) !important;
  -webkit-text-fill-color: var(--jd-fi-deep) !important;
  font-size: 1.22rem !important;
  font-weight: 830 !important;
  letter-spacing: -0.02em !important;
  line-height: 1.25 !important;
  text-align: left !important;
  text-shadow: none !important;
}

html body.path-form:not(.path-webform) #wrapper .jd-form-index__card p,
html body.page-form-index #wrapper .jd-form-index__card p {
  margin: 0 0 1rem !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: var(--jd-fi-body) !important;
  -webkit-text-fill-color: var(--jd-fi-body) !important;
  font-size: 0.94rem !important;
  line-height: 1.58 !important;
  text-align: left !important;
}

html body.path-form:not(.path-webform) #wrapper .jd-form-index__cta,
html body.page-form-index #wrapper .jd-form-index__cta {
  -webkit-appearance: none !important;
  appearance: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  max-width: 100% !important;
  min-height: 3rem !important;
  margin: auto 0 0 !important;
  padding: 0.65rem 1.1rem !important;
  background: linear-gradient(135deg, var(--jd-fi-deep) 0%, var(--jd-fi-purple) 58%, #ad3acb 100%) !important;
  background-image: linear-gradient(135deg, var(--jd-fi-deep) 0%, var(--jd-fi-purple) 58%, #ad3acb 100%) !important;
  border: 2px solid #1c0829 !important;
  border-radius: 999px !important;
  box-shadow: 0 3px 0 #1c0829, 0 9px 20px rgba(103, 22, 170, 0.24) !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  font-size: 0.9rem !important;
  font-weight: 850 !important;
  line-height: 1.2 !important;
  text-align: center !important;
  text-decoration: none !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.28) !important;
  translate: 0 0 !important;
  transition: translate 0.16s ease, scale 0.16s ease, box-shadow 0.16s ease, filter 0.16s ease !important;
}

@media (hover: hover) and (pointer: fine) {
  html body.path-form:not(.path-webform) #wrapper .jd-form-index__card:hover,
  html body.page-form-index #wrapper .jd-form-index__card:hover {
    border-color: #d5a8f3 !important;
    box-shadow: 0 20px 42px rgba(59, 10, 92, 0.13) !important;
    translate: 0 -4px !important;
  }

  html body.path-form:not(.path-webform) #wrapper .jd-form-index__card:hover .jd-form-index__cta,
  html body.page-form-index #wrapper .jd-form-index__card:hover .jd-form-index__cta {
    filter: brightness(1.08) !important;
    box-shadow: 0 4px 0 #1c0829, 0 13px 24px rgba(103, 22, 170, 0.33) !important;
    translate: 0 -1px !important;
  }
}

html body.path-form:not(.path-webform) #wrapper .jd-form-index__card:focus-within,
html body.page-form-index #wrapper .jd-form-index__card:focus-within {
  border-color: var(--jd-fi-purple) !important;
  box-shadow: 0 0 0 4px rgba(157, 78, 221, 0.2), 0 18px 40px rgba(59, 10, 92, 0.12) !important;
  translate: 0 -4px !important;
}

html body.path-form:not(.path-webform) #wrapper .jd-form-index__cta:focus-visible,
html body.page-form-index #wrapper .jd-form-index__cta:focus-visible {
  outline: 4px solid rgba(157, 78, 221, 0.52) !important;
  outline-offset: 4px !important;
}

/* Header clearance link remains readable without changing the banner layout. */
html body .header-top #block-clearance-sales a,
html body #block-clearance-sales a {
  color: inherit !important;
  -webkit-text-fill-color: inherit !important;
  font-weight: 850 !important;
  text-decoration: underline !important;
  text-decoration-thickness: 1.5px !important;
  text-underline-offset: 2px !important;
}

@media (max-width: 1023.98px) {
  html body.path-form:not(.path-webform) #wrapper .jd-form-index__grid,
  html body.page-form-index #wrapper .jd-form-index__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  html body.path-form:not(.path-webform) #wrapper .jd-form-index__card:last-child:nth-child(odd),
  html body.page-form-index #wrapper .jd-form-index__card:last-child:nth-child(odd) {
    grid-column: 1 / -1 !important;
  }
}

@media (max-width: 639.98px) {
  html body.path-form:not(.path-webform) #wrapper #page-wrapper > .container,
  html body.page-form-index #wrapper #page-wrapper > .container {
    width: 100% !important;
    max-width: 100% !important;
    padding-right: 0.7rem !important;
    padding-left: 0.7rem !important;
  }

  html body.path-form:not(.path-webform) #wrapper .jd-form-index,
  html body.page-form-index #wrapper .jd-form-index {
    margin-top: -1rem !important;
    margin-bottom: 3.5rem !important;
    margin-left: 1.35rem !important;
    margin-right: auto !important;
    width: 93% !important;
  }

  html body.path-form:not(.path-webform) #wrapper .jd-form-index__hero,
  html body.page-form-index #wrapper .jd-form-index__hero {
    margin-bottom: 0.9rem !important;
    padding: 1.35rem 1.05rem !important;
    border-radius: 18px !important;
    box-shadow: 0 14px 32px rgba(59, 10, 92, 0.1) !important;
  }

  html body.path-form:not(.path-webform) #wrapper .jd-form-index h1,
  html body.page-form-index #wrapper .jd-form-index h1 {
    font-size: 1.72rem !important;
  }

  html body.path-form:not(.path-webform) #wrapper .jd-form-index__deck,
  html body.path-form:not(.path-webform) #wrapper .jd-form-index__phone,
  html body.page-form-index #wrapper .jd-form-index__deck,
  html body.page-form-index #wrapper .jd-form-index__phone {
    font-size: 0.94rem !important;
    line-height: 1.55 !important;
  }

  html body.path-form:not(.path-webform) #wrapper .jd-form-index__grid,
  html body.page-form-index #wrapper .jd-form-index__grid {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 0.8rem !important;
  }

  html body.path-form:not(.path-webform) #wrapper .jd-form-index__card:last-child:nth-child(odd),
  html body.page-form-index #wrapper .jd-form-index__card:last-child:nth-child(odd) {
    grid-column: auto !important;
  }

  html body.path-form:not(.path-webform) #wrapper .jd-form-index__card,
  html body.page-form-index #wrapper .jd-form-index__card {
    padding: 1.2rem 1.05rem 1.1rem !important;
    border-radius: 16px !important;
  }

  html body.path-form:not(.path-webform) #wrapper .jd-form-index__card h2,
  html body.page-form-index #wrapper .jd-form-index__card h2 {
    font-size: 1.08rem !important;
  }

  html body.path-form:not(.path-webform) #wrapper .jd-form-index__card p,
  html body.page-form-index #wrapper .jd-form-index__card p {
    font-size: 0.9rem !important;
  }

  html body.path-form:not(.path-webform) #wrapper .jd-form-index__cta,
  html body.page-form-index #wrapper .jd-form-index__cta {
    min-height: 3.1rem !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  html body.path-form:not(.path-webform) .jd-form-index *,
  html body.page-form-index .jd-form-index * {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
    translate: none !important;
    scale: none !important;
  }
}

/* assets/css/team-hub.css */
/**
 * Johnny Detail — /team hub intro visibility + purple brand.
 * Scope: body.path-team listing only.
 *
 * Loads last via martis_get_late_theme_css() so it beats custom_css and
 * chrome-layout-fix white/gradient H1 rules that leak contrast issues.
 */

body.path-team,
html body.path-team.page-team {
  --jd-hub-purple: #7b2cbf;
  --jd-hub-purple-deep: #5a1f8f;
  --jd-hub-purple-dark: #3b0a5c;
  --jd-hub-leaf: #b781e3;
  --jd-hub-soft: #f3e8ff;
  --jd-hub-mist: #ffffff;
  --jd-hub-ink: #1a0a24;
  --jd-hub-body: #1f1230;
  --jd-hub-muted: #2a1a3a;
}

/* Kill negative pull-up that tucks intro under the next section */
html body.path-team.page-team #block-martis-teamh1title,
html body.path-team #block-martis-teamh1title {
  margin-bottom: 0.75rem !important;
  position: relative !important;
  z-index: 2 !important;
}

/* H1 badge: keep white-on-purple (intentional) */
html body.path-team.page-team #block-martis-teamh1title h1,
html body.path-team.page-team .region.region-content-wide-top h1,
html body.path-team.page-team #wrapper #content-wide-top h1,
html body.path-team #wrapper .region-content-wide-top h1 {
  display: block !important;
  width: 100%;
  max-width: 100% !important;
  margin: 0.5rem auto 0.85rem !important;
  padding: 0.8rem 1.1rem !important;
  box-sizing: border-box !important;
  text-align: center !important;
  font-weight: 800 !important;
  line-height: 1.25 !important;
  background: linear-gradient(135deg, #3b0a5c 0%, #6716aa 55%, #7b2cbf 100%) !important;
  background-color: #3b0a5c !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  text-shadow: none !important;
  border: 2px solid #000 !important;
  border-radius: 12px !important;
  box-shadow: 0 3px 12px rgba(59, 10, 92, 0.2) !important;
}

/* Intro card — solid white surface, dark body type */
html body.path-team.page-team #block-martis-teamh1title .jd-hub-intro,
html body.path-team.page-team .region.region-content-wide-top .jd-hub-intro,
html body.path-team.page-team #content-wide-top .jd-hub-intro,
html body.path-team #wrapper .jd-hub-intro,
html body.path-team .jd-hub-intro {
  display: block !important;
  max-width: 52rem !important;
  margin: 0.25rem auto -1rem;
  padding: 1.35rem 1.45rem 1.4rem !important;
  box-sizing: border-box !important;
  background: #ffffff !important;
  background-color: #ffffff !important;
  background-image: none !important;
  border: 2px solid #000 !important;
  border-radius: 12px !important;
  box-shadow: 0 6px 18px rgba(59, 10, 92, 0.12) !important;
  text-align: left !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  text-shadow: none !important;
  opacity: 1 !important;
  filter: none !important;
  mix-blend-mode: normal !important;
  position: relative !important;
  z-index: 3 !important;
}

/* Force readable ink on all intro text nodes (beats fill/color leaks) */
html body.path-team.page-team #block-martis-teamh1title .jd-hub-intro,
html body.path-team.page-team #block-martis-teamh1title .jd-hub-intro p,
html body.path-team.page-team #block-martis-teamh1title .jd-hub-intro li,
html body.path-team.page-team #block-martis-teamh1title .jd-hub-intro span,
html body.path-team.page-team #block-martis-teamh1title .jd-hub-intro ul,
html body.path-team.page-team .jd-hub-intro,
html body.path-team.page-team .jd-hub-intro p,
html body.path-team.page-team .jd-hub-intro li,
html body.path-team.page-team .jd-hub-intro span,
html body.path-team .jd-hub-intro,
html body.path-team .jd-hub-intro p,
html body.path-team .jd-hub-intro li,
html body.path-team .jd-hub-intro span,
html body.path-team .jd-hub-intro__deck,
html body.path-team .jd-hub-intro__list,
html body.path-team .jd-hub-intro__list li {
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  text-shadow: none !important;
  opacity: 1 !important;
}

html body.path-team .jd-hub-intro__deck {
  margin: 0 0 0.9rem !important;
  font-size: 1.08rem !important;
  line-height: 1.6 !important;
  font-weight: 500 !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
}

html body.path-team .jd-hub-intro__deck + .jd-hub-intro__deck {
  margin-top: 0 !important;
}

/* Links: dark purple on white (high contrast) */
html body.path-team .jd-hub-intro a:not(.jd-hub-intro__btn),
html body.path-team.page-team #block-martis-teamh1title .jd-hub-intro a:not(.jd-hub-intro__btn) {
  color: #5a1f8f !important;
  -webkit-text-fill-color: #5a1f8f !important;
  font-weight: 700 !important;
  text-decoration: underline !important;
  text-underline-offset: 2px !important;
  text-shadow: none !important;
  background: transparent !important;
}

html body.path-team .jd-hub-intro a:not(.jd-hub-intro__btn):hover,
html body.path-team .jd-hub-intro a:not(.jd-hub-intro__btn):focus-visible {
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
}

/* Strong labels: deep purple, not pastel */
html body.path-team .jd-hub-intro strong,
html body.path-team.page-team #block-martis-teamh1title .jd-hub-intro strong {
  color: #5a1f8f !important;
  -webkit-text-fill-color: #5a1f8f !important;
  font-weight: 800 !important;
  text-shadow: none !important;
}

html body.path-team .jd-hub-intro__list {
  margin: 0 0 1.1rem !important;
  padding-left: 1.35rem !important;
  list-style: disc !important;
}

html body.path-team .jd-hub-intro__list li {
  margin: 0 0 0.5rem !important;
  font-size: 1.02rem !important;
  line-height: 1.5 !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
}

html body.path-team .jd-hub-intro__list li::marker {
  color: #7b2cbf !important;
}

html body.path-team .jd-hub-intro__cta {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 0.6rem 0.7rem !important;
  margin: 0 !important;
  align-items: center !important;
}

/* Primary CTA: white on solid purple */
html body.path-team .jd-hub-intro__btn,
html body.path-team.page-team #block-martis-teamh1title .jd-hub-intro__btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 46px !important;
  padding: 0.55rem 1.15rem !important;
  border: 2px solid #000 !important;
  border-radius: 6px !important;
  background: #7b2cbf !important;
  background-image: none !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-weight: 700 !important;
  font-size: 0.95rem !important;
  text-decoration: none !important;
  text-shadow: none !important;
  line-height: 1.2 !important;
  box-sizing: border-box !important;
  box-shadow: none !important;
  opacity: 1 !important;
}

html body.path-team .jd-hub-intro__btn:hover,
html body.path-team .jd-hub-intro__btn:focus-visible {
  background: #5a1f8f !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  outline: 2px solid #b781e3 !important;
  outline-offset: 2px !important;
}

/* Ghost: dark purple text on white — not pale purple */
html body.path-team .jd-hub-intro__btn--ghost,
html body.path-team.page-team #block-martis-teamh1title .jd-hub-intro__btn--ghost {
  background: #ffffff !important;
  background-image: none !important;
  color: #5a1f8f !important;
  -webkit-text-fill-color: #5a1f8f !important;
  border: 2px solid #000 !important;
}

html body.path-team .jd-hub-intro__btn--ghost:hover,
html body.path-team .jd-hub-intro__btn--ghost:focus-visible {
  background: #f3e8ff !important;
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
}

html body.path-team.page-team #wrapper #main-content .team-teaser .team-position,
html body.path-team.page-team #wrapper .team-teaser .team-position {
  display: inline-flex !important;
  align-items: center !important;
  padding: 0.28rem 0.75rem !important;
  background: #6716aa !important;
  background-image: none !important;
  border: 2px solid #000 !important;
  border-radius: 999px !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-weight: 800 !important;
  text-shadow: none !important;
}

html body.path-team.page-team #wrapper #main-content .team-teaser .team-social a,
html body.path-team.page-team #wrapper #main-content .team-teaser .team-thumb .team-social a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 2.35rem !important;
  height: 2.35rem !important;
  background: #6716aa !important;
  background-image: none !important;
  border: 2px solid #000 !important;
  border-radius: 999px !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  box-shadow: 0 1px 0 #000 !important;
}

.team-social .ti-twitter-alt::before {
  scale: 1;
}

html body.path-team.page-team #wrapper #main-content .team-teaser .team-social a:hover {
  background: #3b0a5c !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

/* Team cards remain readable on listing */
html body.path-team.page-team .team-teaser {
  background: #ffffff !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  border: 2px solid #000 !important;
  border-radius: 12px !important;
  box-shadow: 0 6px 16px rgba(91, 31, 143, 0.12) !important;
}

@media (max-width: 991.98px) {
  html body.path-team.page-team #block-martis-teamh1title h1,
  html body.path-team.page-team .region.region-content-wide-top h1 {
    font-size: 1.2rem !important;
    padding: 0.7rem 0.85rem !important;
    margin: 0.5rem 0 1rem !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  html body.path-team.page-team #block-martis-teamh1title .jd-hub-intro,
  html body.path-team .jd-hub-intro {
    margin: 0.15rem auto 1.25rem;
    padding: 1.15rem 1.05rem 1.2rem !important;
    max-width: 52rem !important;
    width: 100% !important;
  }

  html body.path-team .jd-hub-intro__deck {
    font-size: 1.05rem !important;
    line-height: 1.58 !important;
  }

  html body.path-team .jd-hub-intro__list li {
    font-size: 1.02rem !important;
    line-height: 1.5 !important;
  }

  html body.path-team .jd-hub-intro__cta {
    flex-direction: column !important;
    align-items: stretch !important;
  }

  html body.path-team .jd-hub-intro__btn {
    width: 100% !important;
    min-height: 48px !important;
    font-size: 1rem !important;
  }
}

@media (max-width: 575.98px) {
  html body.path-team.page-team #block-martis-teamh1title h1 {
    font-size: 1.08rem !important;
    padding: 0.65rem 0.7rem !important;
  }

  html body.path-team .jd-hub-intro__deck {
    font-size: 1.02rem !important;
  }
}

/* assets/css/partners-slideshow.css */
/**
 * Johnny Detail — Partners Views Slideshow (blocks 1–7).
 * Loaded after theme Custom CSS. Uses high-specificity resets + grid layout.
 */

/* ========== Block shell ========== */
[id^="block-martis-views-block-partners-block-"] {
  border: 2px solid #000 !important;
  border-left: 0 !important;
  border-right: 0 !important;
  padding: 1rem 0 1.5rem !important;
  margin-bottom: 0.75rem !important;
  max-width: 100%;
  overflow-x: clip;
  box-sizing: border-box;
}

[id^="block-martis-views-block-partners-block-"] .block-title-wrap.clearfix {
  padding-left: 15px !important;
  padding-right: 15px !important;
}

[id^="block-martis-views-block-partners-block-"] .block-subtitle {
  margin-bottom: 1.25rem !important;
}

[id^="block-martis-views-block-partners-block-"] .block-content.clearfix {
  padding-left: 15px;
  padding-right: 15px;
  max-width: 100%;
}

[id^="block-martis-views-block-partners-block-"] [id^="views_slideshow_cycle_main_partners-block_"],
[id^="block-martis-views-block-partners-block-"] [id^="views_slideshow_cycle_teaser_section_partners-block_"] {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  display: block !important;
}

[id^="block-martis-views-block-partners-block-"] [id^="views_slideshow_cycle_div_partners-block_"] {
  height: auto !important;
  min-height: 0 !important;
}

[id^="block-martis-views-block-partners-block-"] .views_slideshow_cycle_slide {
  position: relative !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  background: #fff !important;
  border-radius: 16px !important;
}

/* ========== Slide grid (replaces margin-hack layout) ========== */
[id^="block-martis-views-block-partners-block-"] .views_slideshow_cycle_slide .views-row,
[id^="block-martis-views-block-partners-block-"] .views_slideshow_cycle_slide .views-row.views-row-0,
[id^="block-martis-views-block-partners-block-"] .views_slideshow_cycle_slide .views-row.views-row-1 {
  display: grid !important;
  width: 100% !important;
  max-width: 1140px !important;
  margin: 0 auto !important;
  box-sizing: border-box !important;
  flex-direction: unset !important;
  flex-wrap: unset !important;
}

/* Single-column Cyber-style stack (desktop + base; mobile reaffirms) */
[id^="block-martis-views-block-partners-block-"] .views_slideshow_cycle_slide .views-row,
[id^="block-martis-views-block-partners-block-"] .views_slideshow_cycle_slide .views-row.views-row-0,
[id^="block-martis-views-block-partners-block-"] .views_slideshow_cycle_slide .views-row.views-row-1 {
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-rows: auto !important;
  grid-template-areas:
    "title"
    "logo"
    "link"
    "body" !important;
  column-gap: 0 !important;
  row-gap: 0.75rem !important;
  align-items: stretch !important;
  justify-items: center !important;
  max-width: 960px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding: 1.15rem 1.25rem 1.35rem !important;
}

@media (min-width: 992px) {
  [id^="block-martis-views-block-partners-block-"] .views_slideshow_cycle_slide .views-row,
  [id^="block-martis-views-block-partners-block-"] .views_slideshow_cycle_slide .views-row.views-row-0,
  [id^="block-martis-views-block-partners-block-"] .views_slideshow_cycle_slide .views-row.views-row-1 {
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-areas:
      "title"
      "logo"
      "link"
      "body" !important;
    max-width: 960px !important;
    padding: 1.35rem 1.5rem 1.5rem !important;
    row-gap: 0.85rem !important;
  }
}

/* Nuclear margin reset — beats ~983 Custom CSS partner rules.
   Body keeps position:relative so quote ::before/::after have a containing block. */
[id^="block-martis-views-block-partners-block-"] [id^="views_slideshow_cycle_div_partners-block_"] .views-field:not(.views-field-body),
[id^="block-martis-views-block-partners-block-"] .views_slideshow_cycle_slide .views-field:not(.views-field-body) {
  margin: 0 !important;
  width: auto !important;
  max-width: 100% !important;
  order: unset !important;
  position: static !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  float: none !important;
}

[id^="block-martis-views-block-partners-block-"] [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-body,
[id^="block-martis-views-block-partners-block-"] .views_slideshow_cycle_slide .views-field.views-field-body {
  margin: 0 !important;
  width: auto !important;
  max-width: 100% !important;
  order: unset !important;
  position: relative !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  float: none !important;
}

[id^="block-martis-views-block-partners-block-"] [id^="views_slideshow_cycle_div_partners-block_"] .views-field .field-content,
[id^="block-martis-views-block-partners-block-"] [id^="views_slideshow_cycle_div_partners-block_"] .views-field .views-label {
  margin: 0 !important;
  margin-left: 0 !important;
  margin-top: 0 !important;
  padding-left: 0 !important;
}

/* ========== Field placement ========== */
[id^="block-martis-views-block-partners-block-"] .views-field.views-field-title {
  grid-area: title !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  font-size: 1rem !important;
  line-height: 1.35 !important;
  color: #1a1a1a !important;
  text-align: center !important;
}

[id^="block-martis-views-block-partners-block-"] .views-field.views-field-title .views-label-title,
[id^="block-martis-views-block-partners-block-"] .views-field.views-field-title .field-content {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

[id^="block-martis-views-block-partners-block-"] .views-field.views-field-field-image {
  grid-area: logo !important;
  display: block !important;
  text-align: center !important;
}

[id^="block-martis-views-block-partners-block-"] .views-field.views-field-field-link {
  grid-area: link !important;
  display: block !important;
  order: unset !important;
  text-align: center !important;
}

[id^="block-martis-views-block-partners-block-"] .views-field.views-field-body {
  grid-area: body !important;
  align-self: start !important;
  height: auto !important;
  min-height: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  border: 2px solid #000 !important;
  border-radius: 12px !important;
  /* More horizontal padding so body text clears quote marks. */
  padding: 1.75rem 1.5rem 2rem !important;
  background: rgba(123, 44, 191, 0.18) !important;
  box-sizing: border-box !important;
  position: relative !important;
}

/* body no longer spans 2-col rows — single column stack */


/* Body quote marks on .field-content (position:relative). Final cascade at file end wins. */
[id^="block-martis-views-block-partners-block-"] .views-field.views-field-body .field-content::before {
  content: '\201C';
  font-size: 2rem;
  line-height: 1;
  color: #7b2cbf;
  position: absolute;
  top: 0.2rem;
  left: 0.15rem;
  margin: 0;
  transform: none;
  pointer-events: none;
}

[id^="block-martis-views-block-partners-block-"] .views-field.views-field-body .field-content::after {
  content: '\201D';
  font-size: 2rem;
  line-height: 1;
  color: #7b2cbf;
  position: absolute;
  bottom: 0.1rem;
  right: 0.15rem;
  pointer-events: none;
}

/* ========== Labels & typography ========== */
[id^="block-martis-views-block-partners-block-"] .views-label {
  display: block !important;
  font-size: 0.85rem !important;
  font-weight: 700 !important;
  color: #7b2cbf !important;
  margin: 0 0 0.35rem !important;
}

[id^="block-martis-views-block-partners-block-"] .views-field.views-field-title .views-label-title {
  text-align: center !important;
  width: 100% !important;
  max-width: 100% !important;
}

[id^="block-martis-views-block-partners-block-"] .views-label.views-label-title {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

[id^="block-martis-views-block-partners-block-"] .views-field.views-field-title .field-content {
  display: block !important;
  font-size: 1.05rem !important;
  font-weight: 600 !important;
  color: #1a1a1a !important;
  text-align: center !important;
}

[id^="block-martis-views-block-partners-block-"] h2.views-label.views-label-field-image.partner,
[id^="block-martis-views-block-partners-block-"] div.views-label.views-label-field-image.partner,
[id^="block-martis-views-block-partners-block-"] .views-label.views-label-field-image.partner {
  font-size: clamp(2.25rem, 3.5vw, 3.25rem) !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  margin: 0.15rem 0 0.5rem !important;
  padding: 0 0.25rem !important;
  text-align: center !important;
  color: #7b2cbf !important;
  -webkit-text-stroke: 1.5px rgba(0, 0, 0, 0.28);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  overflow: visible !important;
  white-space: nowrap;
}

[id^="block-martis-views-block-partners-block-"] .views-field.views-field-body .views-label-body {
  font-size: 0.95rem !important;
  margin-bottom: 0.5rem !important;
}

[id^="block-martis-views-block-partners-block-"] .views-field.views-field-body .field-content {
  display: block !important;
  text-align: center !important;
  color: #222 !important;
  position: relative !important;
  /* Inner L/R padding so text sits between quote marks, not under them. */
  padding: 0.85rem 1.35rem 1.15rem !important;
  margin: 0 !important;
  box-sizing: border-box !important;
}

[id^="block-martis-views-block-partners-block-"] .views-field.views-field-body .field-content p {
  display: block !important;
  margin: 0 0 0.75rem !important;
  padding: 0 !important;
  font-size: 0.95rem !important;
  line-height: 1.55 !important;
  text-align: center !important;
}

[id^="block-martis-views-block-partners-block-"] .views-field.views-field-body .field-content p:last-child {
  margin-bottom: 0 !important;
}

[id^="block-martis-views-block-partners-block-"] .views-field.views-field-body .field-content h2 {
  font-size: 1.05rem !important;
  font-weight: 700 !important;
  margin: 0.5rem 0 0.65rem !important;
  line-height: 1.35 !important;
  color: #1a1a1a !important;
}

[id^="block-martis-views-block-partners-block-"] .views-field.views-field-body .field-content p a {
  display: inline !important;
  font-weight: 600 !important;
  color: #7b2cbf !important;
  text-decoration: underline !important;
  text-underline-offset: 2px;
}

[id^="block-martis-views-block-partners-block-"] .views-label.views-label-field-link {
  display: block !important;
  white-space: normal !important;
  text-align: center !important;
  padding: 0 !important;
  margin: 0 0 0.35rem !important;
}

[id^="block-martis-views-block-partners-block-"] .views-field.views-field-field-link .field-content {
  display: block !important;
  font-size: 0.85rem !important;
  width: 100% !important;
  max-width: 100% !important;
  word-break: normal !important;
  overflow-wrap: normal !important;
  white-space: normal !important;
  text-align: center !important;
  padding: 0 !important;
  margin: 0 !important;
}

[id^="block-martis-views-block-partners-block-"] .views-field.views-field-field-link .field-content a {
  display: inline !important;
  color: #7b2cbf !important;
  font-weight: 600 !important;
  white-space: normal !important;
  word-break: normal !important;
  overflow-wrap: normal !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* ========== Partner logo ========== */
/* Circle is the WELL only — never width:100% + border-radius:50% (that makes ovals). */
[id^="block-martis-views-block-partners-block-"] .views-field-field-image .field-content,
[id^="block-martis-views-block-partners-block-"] .views-field-field-image .media {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 140px !important;
  height: 140px !important;
  min-width: 140px !important;
  min-height: 140px !important;
  max-width: 140px !important;
  max-height: 140px !important;
  margin: 0.25rem auto !important;
  padding: 0.55rem !important;
  background: #ffffff !important;
  border: 2px solid #000 !important;
  border-radius: 50% !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
  aspect-ratio: 1 / 1 !important;
  box-shadow: 0 3px 10px rgba(59, 10, 92, 0.12) !important;
}

[id^="block-martis-views-block-partners-block-"] .views-field-field-image .field-content img,
[id^="block-martis-views-block-partners-block-"] .views-field-field-image .media__element {
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: contain !important;
  border-radius: 0 !important;
  border: 0 !important;
  background: transparent !important;
  padding: 0 !important;
  box-shadow: none !important;
  margin: 0 !important;
  display: block !important;
}

/* ========== Controls (counter centered above buttons) ========== */
[id^="block-martis-views-block-partners-block-"] .views-slideshow-controls-top.clearfix {
  display: grid !important;
  grid-template-columns: 1fr !important;
  grid-template-rows: auto auto !important;
  justify-items: center !important;
  align-items: center !important;
  gap: 0.5rem !important;
  border-bottom: 2px solid #f3e8ff !important;
  padding: 0 0 0.85rem !important;
  margin: 0 0 0.65rem !important;
  width: 100% !important;
}

[id^="block-martis-views-block-partners-block-"] [id^="views_slideshow_slide_counter_partners-block_"],
[id^="block-martis-views-block-partners-block-"] .views_slideshow_slide_counter {
  margin: 0 !important;
  padding: 0 !important;
  font-size: 0.95rem !important;
  font-weight: 600 !important;
  min-width: 0 !important;
  text-align: center !important;
  justify-self: center !important;
  grid-row: 1 !important;
  order: unset !important;
  flex: unset !important;
}

[id^="block-martis-views-block-partners-block-"] [id^="views_slideshow_controls_text_partners-block_"],
[id^="block-martis-views-block-partners-block-"] .views_slideshow_controls_text {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.5rem !important;
  grid-row: 2 !important;
  justify-self: center !important;
}

[id^="block-martis-views-block-partners-block-"] .views-slideshow-controls-top.clearfix a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 44px !important;
  min-width: 44px !important;
  padding: 0.45rem 0.9rem !important;
  background-color: #7b2cbf !important;
  border: 2px solid #000 !important;
  border-radius: 5px !important;
  color: #fff !important;
  font-size: 0.875rem !important;
  font-weight: 600 !important;
  text-decoration: none !important;
}

[id^="block-martis-views-block-partners-block-"] .views-slideshow-controls-top.clearfix a:hover,
[id^="block-martis-views-block-partners-block-"] .views-slideshow-controls-top.clearfix a:focus-visible {
  outline: 2px solid #fff !important;
  outline-offset: 2px !important;
}

/* ========== Mobile ========== */
@media (max-width: 991.98px) {
  [id^="block-martis-views-block-partners-block-"] .views_slideshow_cycle_slide .views-row,
  [id^="block-martis-views-block-partners-block-"] .views_slideshow_cycle_slide .views-row.views-row-0,
  [id^="block-martis-views-block-partners-block-"] .views_slideshow_cycle_slide .views-row.views-row-1 {
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: auto !important;
    grid-template-areas:
      "title"
      "logo"
      "link"
      "body" !important;
    column-gap: 0 !important;
    row-gap: 0.55rem !important;
    align-items: stretch !important;
    padding: 0.5rem 0.5rem !important;
    max-width: 100% !important;
    overflow-x: clip !important;
  }

  [id^="block-martis-views-block-partners-block-"] .views_slideshow_cycle_slide .views-field:not(.views-field-body) {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    grid-column: 1 / -1 !important;
    justify-self: stretch !important;
  }

  [id^="block-martis-views-block-partners-block-"] .views_slideshow_cycle_slide .views-field.views-field-body {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    grid-column: 1 / -1 !important;
    justify-self: stretch !important;
  }

  [id^="block-martis-views-block-partners-block-"] .views-field.views-field-title {
    grid-area: title !important;
    grid-row: auto !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
  }

  [id^="block-martis-views-block-partners-block-"] .views-field.views-field-title .views-label-title,
  [id^="block-martis-views-block-partners-block-"] .views-field.views-field-title .field-content {
    display: block !important;
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  [id^="block-martis-views-block-partners-block-"] .views-field.views-field-field-image {
    grid-area: logo !important;
    grid-row: auto !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    display: block !important;
    text-align: center !important;
  }

  [id^="block-martis-views-block-partners-block-"] .views-label.views-label-field-image {
    display: block !important;
    text-align: center !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-top: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  [id^="block-martis-views-block-partners-block-"] .views-field.views-field-field-image .field-content {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  [id^="block-martis-views-block-partners-block-"] .views-field.views-field-field-image .media,
  [id^="block-martis-views-block-partners-block-"] .views-field.views-field-field-image .media.media--blazy {
    margin-left: auto !important;
    margin-right: auto !important;
    margin-bottom: 0 !important;
  }

  [id^="block-martis-views-block-partners-block-"] .views-field.views-field-field-link {
    grid-area: link !important;
    grid-row: auto !important;
    text-align: center !important;
  }

  [id^="block-martis-views-block-partners-block-"] .views-field.views-field-body {
    grid-area: body !important;
    grid-row: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 1.5rem 1.25rem 1.75rem !important;
    overflow-wrap: break-word !important;
    word-break: break-word !important;
  }

  [id^="block-martis-views-block-partners-block-"] .views-field.views-field-body .field-content {
    padding: 0.75rem 1.1rem 1rem !important;
  }

  [id^="block-martis-views-block-partners-block-"] .views-field.views-field-body .field-content::before {
    top: 0.65rem !important;
    left: 0.15rem !important;
  }

  [id^="block-martis-views-block-partners-block-"] .views-slideshow-controls-top.clearfix {
    gap: 0.4rem !important;
    padding-bottom: 0.65rem !important;
    margin-bottom: 0.5rem !important;
  }

  [id^="block-martis-views-block-partners-block-"] [id^="views_slideshow_slide_counter_partners-block_"] {
    flex: unset !important;
    order: unset !important;
  }

  [id^="block-martis-views-block-partners-block-"] .views-field.views-field-body .field-content,
  [id^="block-martis-views-block-partners-block-"] .views-field.views-field-body .field-content p {
    max-width: 100% !important;
    overflow-wrap: break-word !important;
  }

  [id^="block-martis-views-block-partners-block-"] .views-field-field-image .field-content img {
    display: block !important;
    margin-left: auto !important;
    margin-right: auto !important;
    max-width: 120px !important;
    /* height:auto removed — keeps circle */
  }

  [id^="block-martis-views-block-partners-block-"] .views-field.views-field-title .field-content,
  [id^="block-martis-views-block-partners-block-"] .views-label.views-label-title,
  [id^="block-martis-views-block-partners-block-"] .views-label.views-label-field-image,
  [id^="block-martis-views-block-partners-block-"] .views-label.views-label-field-link {
    display: block !important;
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  [id^="block-martis-views-block-partners-block-"] .views-field.views-field-field-link .field-content,
  [id^="block-martis-views-block-partners-block-"] .views-field.views-field-field-link .field-content a {
    text-align: center !important;
  }

  [id^="block-martis-views-block-partners-block-"] .views-field.views-field-body .field-content,
  [id^="block-martis-views-block-partners-block-"] .views-field.views-field-body .field-content p,
  [id^="block-martis-views-block-partners-block-"] .views-field.views-field-body .field-content h2 {
    text-align: center !important;
  }

  [id^="block-martis-views-block-partners-block-"] [id^="views_slideshow_slide_counter_partners-block_"] {
    flex: unset !important;
    order: unset !important;
  }
}

/* ========== Desktop polish ========== */
@media (min-width: 992px) {
  [id^="block-martis-views-block-partners-block-"] .views_slideshow_cycle_slide .views-row {
    padding: 1.25rem 1rem !important;
    column-gap: 2rem !important;
  }

  [id^="block-martis-views-block-partners-block-"] .views-field.views-field-field-image {
    text-align: center !important;
  }

  [id^="block-martis-views-block-partners-block-"] .views-field.views-field-title,
  [id^="block-martis-views-block-partners-block-"] .views-field.views-field-title .views-label-title,
  [id^="block-martis-views-block-partners-block-"] .views-field.views-field-title .field-content {
    text-align: center !important;
  }

  [id^="block-martis-views-block-partners-block-"] .views-field.views-field-field-link,
  [id^="block-martis-views-block-partners-block-"] .views-field.views-field-field-link .views-label-field-link,
  [id^="block-martis-views-block-partners-block-"] .views-field.views-field-field-link .field-content,
  [id^="block-martis-views-block-partners-block-"] .views-field.views-field-field-link .field-content a {
    text-align: center !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  [id^="block-martis-views-block-partners-block-"] .views_slideshow_cycle_slide {
    transition: none !important;
  }
}

/* ========== ID-level cascade wins (beats Custom CSS #id rules) ========== */
#block-martis-views-block-partners-block-1,
#block-martis-views-block-partners-block-2,
#block-martis-views-block-partners-block-3,
#block-martis-views-block-partners-block-4,
#block-martis-views-block-partners-block-5,
#block-martis-views-block-partners-block-6,
#block-martis-views-block-partners-block-7 {
  overflow-x: clip;
}

#block-martis-views-block-partners-block-1 .views_slideshow_cycle_slide .views-row,
#block-martis-views-block-partners-block-2 .views_slideshow_cycle_slide .views-row,
#block-martis-views-block-partners-block-3 .views_slideshow_cycle_slide .views-row,
#block-martis-views-block-partners-block-4 .views_slideshow_cycle_slide .views-row,
#block-martis-views-block-partners-block-5 .views_slideshow_cycle_slide .views-row,
#block-martis-views-block-partners-block-6 .views_slideshow_cycle_slide .views-row,
#block-martis-views-block-partners-block-7 .views_slideshow_cycle_slide .views-row {
  display: grid !important;
}

#block-martis-views-block-partners-block-1 [id^="views_slideshow_cycle_div_partners-block_"] .views-field:not(.views-field-body),
#block-martis-views-block-partners-block-2 [id^="views_slideshow_cycle_div_partners-block_"] .views-field:not(.views-field-body),
#block-martis-views-block-partners-block-3 [id^="views_slideshow_cycle_div_partners-block_"] .views-field:not(.views-field-body),
#block-martis-views-block-partners-block-4 [id^="views_slideshow_cycle_div_partners-block_"] .views-field:not(.views-field-body),
#block-martis-views-block-partners-block-5 [id^="views_slideshow_cycle_div_partners-block_"] .views-field:not(.views-field-body),
#block-martis-views-block-partners-block-6 [id^="views_slideshow_cycle_div_partners-block_"] .views-field:not(.views-field-body),
#block-martis-views-block-partners-block-7 [id^="views_slideshow_cycle_div_partners-block_"] .views-field:not(.views-field-body),
#block-martis-views-block-partners-block-1 [id^="views_slideshow_cycle_teaser_section_partners-block_"] .views-field:not(.views-field-body),
#block-martis-views-block-partners-block-2 [id^="views_slideshow_cycle_teaser_section_partners-block_"] .views-field:not(.views-field-body),
#block-martis-views-block-partners-block-3 [id^="views_slideshow_cycle_teaser_section_partners-block_"] .views-field:not(.views-field-body),
#block-martis-views-block-partners-block-4 [id^="views_slideshow_cycle_teaser_section_partners-block_"] .views-field:not(.views-field-body),
#block-martis-views-block-partners-block-5 [id^="views_slideshow_cycle_teaser_section_partners-block_"] .views-field:not(.views-field-body),
#block-martis-views-block-partners-block-6 [id^="views_slideshow_cycle_teaser_section_partners-block_"] .views-field:not(.views-field-body),
#block-martis-views-block-partners-block-7 [id^="views_slideshow_cycle_teaser_section_partners-block_"] .views-field:not(.views-field-body) {
  margin: 0 !important;
  width: auto !important;
  max-width: 100% !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  position: static !important;
}

#block-martis-views-block-partners-block-1 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-body,
#block-martis-views-block-partners-block-2 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-body,
#block-martis-views-block-partners-block-3 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-body,
#block-martis-views-block-partners-block-4 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-body,
#block-martis-views-block-partners-block-5 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-body,
#block-martis-views-block-partners-block-6 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-body,
#block-martis-views-block-partners-block-7 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-body,
#block-martis-views-block-partners-block-1 [id^="views_slideshow_cycle_teaser_section_partners-block_"] .views-field.views-field-body,
#block-martis-views-block-partners-block-2 [id^="views_slideshow_cycle_teaser_section_partners-block_"] .views-field.views-field-body,
#block-martis-views-block-partners-block-3 [id^="views_slideshow_cycle_teaser_section_partners-block_"] .views-field.views-field-body,
#block-martis-views-block-partners-block-4 [id^="views_slideshow_cycle_teaser_section_partners-block_"] .views-field.views-field-body,
#block-martis-views-block-partners-block-5 [id^="views_slideshow_cycle_teaser_section_partners-block_"] .views-field.views-field-body,
#block-martis-views-block-partners-block-6 [id^="views_slideshow_cycle_teaser_section_partners-block_"] .views-field.views-field-body,
#block-martis-views-block-partners-block-7 [id^="views_slideshow_cycle_teaser_section_partners-block_"] .views-field.views-field-body {
  margin: 0 !important;
  width: auto !important;
  max-width: 100% !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  position: relative !important;
}

#block-martis-views-block-partners-block-1 .views-field.views-field-body,
#block-martis-views-block-partners-block-2 .views-field.views-field-body,
#block-martis-views-block-partners-block-3 .views-field.views-field-body,
#block-martis-views-block-partners-block-4 .views-field.views-field-body,
#block-martis-views-block-partners-block-5 .views-field.views-field-body,
#block-martis-views-block-partners-block-6 .views-field.views-field-body,
#block-martis-views-block-partners-block-7 .views-field.views-field-body {
  width: 100% !important;
  margin: 0 !important;
  margin-top: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  margin-bottom: 0 !important;
}

#block-martis-views-block-partners-block-1 [id^="views_slideshow_cycle_div_partners-block_"] .views-field .field-content,
#block-martis-views-block-partners-block-2 [id^="views_slideshow_cycle_div_partners-block_"] .views-field .field-content,
#block-martis-views-block-partners-block-3 [id^="views_slideshow_cycle_div_partners-block_"] .views-field .field-content,
#block-martis-views-block-partners-block-4 [id^="views_slideshow_cycle_div_partners-block_"] .views-field .field-content,
#block-martis-views-block-partners-block-5 [id^="views_slideshow_cycle_div_partners-block_"] .views-field .field-content,
#block-martis-views-block-partners-block-6 [id^="views_slideshow_cycle_div_partners-block_"] .views-field .field-content,
#block-martis-views-block-partners-block-7 [id^="views_slideshow_cycle_div_partners-block_"] .views-field .field-content,
#block-martis-views-block-partners-block-1 [id^="views_slideshow_cycle_div_partners-block_"] .views-field .views-label,
#block-martis-views-block-partners-block-2 [id^="views_slideshow_cycle_div_partners-block_"] .views-field .views-label,
#block-martis-views-block-partners-block-3 [id^="views_slideshow_cycle_div_partners-block_"] .views-field .views-label,
#block-martis-views-block-partners-block-4 [id^="views_slideshow_cycle_div_partners-block_"] .views-field .views-label,
#block-martis-views-block-partners-block-5 [id^="views_slideshow_cycle_div_partners-block_"] .views-field .views-label,
#block-martis-views-block-partners-block-6 [id^="views_slideshow_cycle_div_partners-block_"] .views-field .views-label,
#block-martis-views-block-partners-block-7 [id^="views_slideshow_cycle_div_partners-block_"] .views-field .views-label {
  margin: 0 !important;
  margin-left: 0 !important;
  margin-top: 0 !important;
  padding-left: 0 !important;
}

#block-martis-views-block-partners-block-1 [id^="views_slideshow_slide_counter_partners-block_"],
#block-martis-views-block-partners-block-2 [id^="views_slideshow_slide_counter_partners-block_"],
#block-martis-views-block-partners-block-3 [id^="views_slideshow_slide_counter_partners-block_"],
#block-martis-views-block-partners-block-4 [id^="views_slideshow_slide_counter_partners-block_"],
#block-martis-views-block-partners-block-5 [id^="views_slideshow_slide_counter_partners-block_"],
#block-martis-views-block-partners-block-6 [id^="views_slideshow_slide_counter_partners-block_"],
#block-martis-views-block-partners-block-7 [id^="views_slideshow_slide_counter_partners-block_"] {
  text-align: center !important;
  justify-self: center !important;
  order: unset !important;
  margin-top: 0 !important;
}

@media (min-width: 992px) {
  #block-martis-views-block-partners-block-1 .views_slideshow_cycle_slide .views-row,
  #block-martis-views-block-partners-block-2 .views_slideshow_cycle_slide .views-row,
  #block-martis-views-block-partners-block-3 .views_slideshow_cycle_slide .views-row,
  #block-martis-views-block-partners-block-4 .views_slideshow_cycle_slide .views-row,
  #block-martis-views-block-partners-block-5 .views_slideshow_cycle_slide .views-row,
  #block-martis-views-block-partners-block-6 .views_slideshow_cycle_slide .views-row,
  #block-martis-views-block-partners-block-7 .views_slideshow_cycle_slide .views-row {
    grid-template-columns: minmax(0, 1fr) !important; /* was 2-col; force 1-col */
    min-height: 280px;
  }

  #block-martis-views-block-partners-block-1 .views-field.views-field-field-image,
  #block-martis-views-block-partners-block-2 .views-field.views-field-field-image,
  #block-martis-views-block-partners-block-3 .views-field.views-field-field-image,
  #block-martis-views-block-partners-block-4 .views-field.views-field-field-image,
  #block-martis-views-block-partners-block-5 .views-field.views-field-field-image,
  #block-martis-views-block-partners-block-6 .views-field.views-field-field-image,
  #block-martis-views-block-partners-block-7 .views-field.views-field-field-image {
    min-height: 140px;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }
}

/* Final cascade: block + teaser section + slide (beats Custom CSS partner rules) */
#block-martis-views-block-partners-block-1 #views_slideshow_cycle_teaser_section_partners-block_1 .views-field.views-field-body,
#block-martis-views-block-partners-block-2 #views_slideshow_cycle_teaser_section_partners-block_2 .views-field.views-field-body,
#block-martis-views-block-partners-block-3 #views_slideshow_cycle_teaser_section_partners-block_3 .views-field.views-field-body,
#block-martis-views-block-partners-block-4 #views_slideshow_cycle_teaser_section_partners-block_4 .views-field.views-field-body,
#block-martis-views-block-partners-block-5 #views_slideshow_cycle_teaser_section_partners-block_5 .views-field.views-field-body,
#block-martis-views-block-partners-block-6 #views_slideshow_cycle_teaser_section_partners-block_6 .views-field.views-field-body,
#block-martis-views-block-partners-block-7 #views_slideshow_cycle_teaser_section_partners-block_7 .views-field.views-field-body,
#block-martis-views-block-partners-block-1 #views_slideshow_cycle_teaser_section_partners-block_1 [id^="views_slideshow_cycle_div_partners-block_"] .views-field,
#block-martis-views-block-partners-block-2 #views_slideshow_cycle_teaser_section_partners-block_2 [id^="views_slideshow_cycle_div_partners-block_"] .views-field,
#block-martis-views-block-partners-block-3 #views_slideshow_cycle_teaser_section_partners-block_3 [id^="views_slideshow_cycle_div_partners-block_"] .views-field,
#block-martis-views-block-partners-block-4 #views_slideshow_cycle_teaser_section_partners-block_4 [id^="views_slideshow_cycle_div_partners-block_"] .views-field,
#block-martis-views-block-partners-block-5 #views_slideshow_cycle_teaser_section_partners-block_5 [id^="views_slideshow_cycle_div_partners-block_"] .views-field,
#block-martis-views-block-partners-block-6 #views_slideshow_cycle_teaser_section_partners-block_6 [id^="views_slideshow_cycle_div_partners-block_"] .views-field,
#block-martis-views-block-partners-block-7 #views_slideshow_cycle_teaser_section_partners-block_7 [id^="views_slideshow_cycle_div_partners-block_"] .views-field {
  margin: 0 !important;
}

#block-martis-views-block-partners-block-1 #views_slideshow_cycle_teaser_section_partners-block_1 .views-field.views-field-body,
#block-martis-views-block-partners-block-2 #views_slideshow_cycle_teaser_section_partners-block_2 .views-field.views-field-body,
#block-martis-views-block-partners-block-3 #views_slideshow_cycle_teaser_section_partners-block_3 .views-field.views-field-body,
#block-martis-views-block-partners-block-4 #views_slideshow_cycle_teaser_section_partners-block_4 .views-field.views-field-body,
#block-martis-views-block-partners-block-5 #views_slideshow_cycle_teaser_section_partners-block_5 .views-field.views-field-body,
#block-martis-views-block-partners-block-6 #views_slideshow_cycle_teaser_section_partners-block_6 .views-field.views-field-body,
#block-martis-views-block-partners-block-7 #views_slideshow_cycle_teaser_section_partners-block_7 .views-field.views-field-body {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

#block-martis-views-block-partners-block-1 .views-field.views-field-body .field-content,
#block-martis-views-block-partners-block-2 .views-field.views-field-body .field-content,
#block-martis-views-block-partners-block-3 .views-field.views-field-body .field-content,
#block-martis-views-block-partners-block-4 .views-field.views-field-body .field-content,
#block-martis-views-block-partners-block-5 .views-field.views-field-body .field-content,
#block-martis-views-block-partners-block-6 .views-field.views-field-body .field-content,
#block-martis-views-block-partners-block-7 .views-field.views-field-body .field-content,
#block-martis-views-block-partners-block-1 .views-field.views-field-body .field-content p,
#block-martis-views-block-partners-block-2 .views-field.views-field-body .field-content p,
#block-martis-views-block-partners-block-3 .views-field.views-field-body .field-content p,
#block-martis-views-block-partners-block-4 .views-field.views-field-body .field-content p,
#block-martis-views-block-partners-block-5 .views-field.views-field-body .field-content p,
#block-martis-views-block-partners-block-6 .views-field.views-field-body .field-content p,
#block-martis-views-block-partners-block-7 .views-field.views-field-body .field-content p,
#block-martis-views-block-partners-block-1 .views-field.views-field-body .field-content h2,
#block-martis-views-block-partners-block-2 .views-field.views-field-body .field-content h2,
#block-martis-views-block-partners-block-3 .views-field.views-field-body .field-content h2,
#block-martis-views-block-partners-block-4 .views-field.views-field-body .field-content h2,
#block-martis-views-block-partners-block-5 .views-field.views-field-body .field-content h2,
#block-martis-views-block-partners-block-6 .views-field.views-field-body .field-content h2,
#block-martis-views-block-partners-block-7 .views-field.views-field-body .field-content h2 {
  text-align: center !important;
}

#block-martis-views-block-partners-block-1 .views-field.views-field-field-image,
#block-martis-views-block-partners-block-2 .views-field.views-field-field-image,
#block-martis-views-block-partners-block-3 .views-field.views-field-field-image,
#block-martis-views-block-partners-block-4 .views-field.views-field-field-image,
#block-martis-views-block-partners-block-5 .views-field.views-field-field-image,
#block-martis-views-block-partners-block-6 .views-field.views-field-field-image,
#block-martis-views-block-partners-block-7 .views-field.views-field-field-image {
  padding-left: 0.5rem !important;
  padding-right: 0.5rem !important;
  overflow: visible !important;
}

#block-martis-views-block-partners-block-1 .views-slideshow-controls-top.clearfix,
#block-martis-views-block-partners-block-2 .views-slideshow-controls-top.clearfix,
#block-martis-views-block-partners-block-3 .views-slideshow-controls-top.clearfix,
#block-martis-views-block-partners-block-4 .views-slideshow-controls-top.clearfix,
#block-martis-views-block-partners-block-5 .views-slideshow-controls-top.clearfix,
#block-martis-views-block-partners-block-6 .views-slideshow-controls-top.clearfix,
#block-martis-views-block-partners-block-7 .views-slideshow-controls-top.clearfix {
  display: grid !important;
  grid-template-columns: 1fr !important;
  justify-items: center !important;
  gap: 0.5rem !important;
  display: inline-grid !important;
}

/* Final cascade: field-link + label resets (beats Custom CSS margin-left: 22rem hacks) */
#block-martis-views-block-partners-block-1 #views_slideshow_cycle_teaser_section_partners-block_1 .views-field.views-field-field-link,
#block-martis-views-block-partners-block-2 #views_slideshow_cycle_teaser_section_partners-block_2 .views-field.views-field-field-link,
#block-martis-views-block-partners-block-3 #views_slideshow_cycle_teaser_section_partners-block_3 .views-field.views-field-field-link,
#block-martis-views-block-partners-block-4 #views_slideshow_cycle_teaser_section_partners-block_4 .views-field.views-field-field-link,
#block-martis-views-block-partners-block-5 #views_slideshow_cycle_teaser_section_partners-block_5 .views-field.views-field-field-link,
#block-martis-views-block-partners-block-6 #views_slideshow_cycle_teaser_section_partners-block_6 .views-field.views-field-field-link,
#block-martis-views-block-partners-block-7 #views_slideshow_cycle_teaser_section_partners-block_7 .views-field.views-field-field-link,
#block-martis-views-block-partners-block-1 #views_slideshow_cycle_teaser_section_partners-block_1 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-field-link,
#block-martis-views-block-partners-block-2 #views_slideshow_cycle_teaser_section_partners-block_2 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-field-link,
#block-martis-views-block-partners-block-3 #views_slideshow_cycle_teaser_section_partners-block_3 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-field-link,
#block-martis-views-block-partners-block-4 #views_slideshow_cycle_teaser_section_partners-block_4 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-field-link,
#block-martis-views-block-partners-block-5 #views_slideshow_cycle_teaser_section_partners-block_5 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-field-link,
#block-martis-views-block-partners-block-6 #views_slideshow_cycle_teaser_section_partners-block_6 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-field-link,
#block-martis-views-block-partners-block-7 #views_slideshow_cycle_teaser_section_partners-block_7 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-field-link {
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
}

#block-martis-views-block-partners-block-1 #views_slideshow_cycle_teaser_section_partners-block_1 .views-label.views-label-field-link,
#block-martis-views-block-partners-block-2 #views_slideshow_cycle_teaser_section_partners-block_2 .views-label.views-label-field-link,
#block-martis-views-block-partners-block-3 #views_slideshow_cycle_teaser_section_partners-block_3 .views-label.views-label-field-link,
#block-martis-views-block-partners-block-4 #views_slideshow_cycle_teaser_section_partners-block_4 .views-label.views-label-field-link,
#block-martis-views-block-partners-block-5 #views_slideshow_cycle_teaser_section_partners-block_5 .views-label.views-label-field-link,
#block-martis-views-block-partners-block-6 #views_slideshow_cycle_teaser_section_partners-block_6 .views-label.views-label-field-link,
#block-martis-views-block-partners-block-7 #views_slideshow_cycle_teaser_section_partners-block_7 .views-label.views-label-field-link,
#block-martis-views-block-partners-block-1 #views_slideshow_cycle_teaser_section_partners-block_1 [id^="views_slideshow_cycle_div_partners-block_"] .views-label.views-label-field-link,
#block-martis-views-block-partners-block-2 #views_slideshow_cycle_teaser_section_partners-block_2 [id^="views_slideshow_cycle_div_partners-block_"] .views-label.views-label-field-link,
#block-martis-views-block-partners-block-3 #views_slideshow_cycle_teaser_section_partners-block_3 [id^="views_slideshow_cycle_div_partners-block_"] .views-label.views-label-field-link,
#block-martis-views-block-partners-block-4 #views_slideshow_cycle_teaser_section_partners-block_4 [id^="views_slideshow_cycle_div_partners-block_"] .views-label.views-label-field-link,
#block-martis-views-block-partners-block-5 #views_slideshow_cycle_teaser_section_partners-block_5 [id^="views_slideshow_cycle_div_partners-block_"] .views-label.views-label-field-link,
#block-martis-views-block-partners-block-6 #views_slideshow_cycle_teaser_section_partners-block_6 [id^="views_slideshow_cycle_div_partners-block_"] .views-label.views-label-field-link,
#block-martis-views-block-partners-block-7 #views_slideshow_cycle_teaser_section_partners-block_7 [id^="views_slideshow_cycle_div_partners-block_"] .views-label.views-label-field-link {
  display: block !important;
  justify-content: unset !important;
  white-space: normal !important;
  padding: 0 !important;
  margin: 0 0 0.35rem !important;
}

#block-martis-views-block-partners-block-1 #views_slideshow_cycle_teaser_section_partners-block_1 .views-field.views-field-field-link .field-content,
#block-martis-views-block-partners-block-2 #views_slideshow_cycle_teaser_section_partners-block_2 .views-field.views-field-field-link .field-content,
#block-martis-views-block-partners-block-3 #views_slideshow_cycle_teaser_section_partners-block_3 .views-field.views-field-field-link .field-content,
#block-martis-views-block-partners-block-4 #views_slideshow_cycle_teaser_section_partners-block_4 .views-field.views-field-field-link .field-content,
#block-martis-views-block-partners-block-5 #views_slideshow_cycle_teaser_section_partners-block_5 .views-field.views-field-field-link .field-content,
#block-martis-views-block-partners-block-6 #views_slideshow_cycle_teaser_section_partners-block_6 .views-field.views-field-field-link .field-content,
#block-martis-views-block-partners-block-7 #views_slideshow_cycle_teaser_section_partners-block_7 .views-field.views-field-field-link .field-content,
#block-martis-views-block-partners-block-1 #views_slideshow_cycle_teaser_section_partners-block_1 .views-field.views-field-field-link .field-content a,
#block-martis-views-block-partners-block-2 #views_slideshow_cycle_teaser_section_partners-block_2 .views-field.views-field-field-link .field-content a,
#block-martis-views-block-partners-block-3 #views_slideshow_cycle_teaser_section_partners-block_3 .views-field.views-field-field-link .field-content a,
#block-martis-views-block-partners-block-4 #views_slideshow_cycle_teaser_section_partners-block_4 .views-field.views-field-field-link .field-content a,
#block-martis-views-block-partners-block-5 #views_slideshow_cycle_teaser_section_partners-block_5 .views-field.views-field-field-link .field-content a,
#block-martis-views-block-partners-block-6 #views_slideshow_cycle_teaser_section_partners-block_6 .views-field.views-field-field-link .field-content a,
#block-martis-views-block-partners-block-7 #views_slideshow_cycle_teaser_section_partners-block_7 .views-field.views-field-field-link .field-content a,
#block-martis-views-block-partners-block-1 #views_slideshow_cycle_teaser_section_partners-block_1 [id^="views_slideshow_cycle_main_partners-block_"] .views-field.views-field-field-link .field-content a,
#block-martis-views-block-partners-block-2 #views_slideshow_cycle_teaser_section_partners-block_2 [id^="views_slideshow_cycle_main_partners-block_"] .views-field.views-field-field-link .field-content a,
#block-martis-views-block-partners-block-3 #views_slideshow_cycle_teaser_section_partners-block_3 [id^="views_slideshow_cycle_main_partners-block_"] .views-field.views-field-field-link .field-content a,
#block-martis-views-block-partners-block-4 #views_slideshow_cycle_teaser_section_partners-block_4 [id^="views_slideshow_cycle_main_partners-block_"] .views-field.views-field-field-link .field-content a,
#block-martis-views-block-partners-block-5 #views_slideshow_cycle_teaser_section_partners-block_5 [id^="views_slideshow_cycle_main_partners-block_"] .views-field.views-field-field-link .field-content a,
#block-martis-views-block-partners-block-6 #views_slideshow_cycle_teaser_section_partners-block_6 [id^="views_slideshow_cycle_main_partners-block_"] .views-field.views-field-field-link .field-content a,
#block-martis-views-block-partners-block-7 #views_slideshow_cycle_teaser_section_partners-block_7 [id^="views_slideshow_cycle_main_partners-block_"] .views-field.views-field-field-link .field-content a {
  display: inline !important;
  white-space: normal !important;
  word-break: normal !important;
  overflow-wrap: normal !important;
  padding: 0 !important;
  margin: 0 !important;
}

#block-martis-views-block-partners-block-1 #views_slideshow_cycle_teaser_section_partners-block_1 .views-field.views-field-body,
#block-martis-views-block-partners-block-2 #views_slideshow_cycle_teaser_section_partners-block_2 .views-field.views-field-body,
#block-martis-views-block-partners-block-3 #views_slideshow_cycle_teaser_section_partners-block_3 .views-field.views-field-body,
#block-martis-views-block-partners-block-4 #views_slideshow_cycle_teaser_section_partners-block_4 .views-field.views-field-body,
#block-martis-views-block-partners-block-5 #views_slideshow_cycle_teaser_section_partners-block_5 .views-field.views-field-body,
#block-martis-views-block-partners-block-6 #views_slideshow_cycle_teaser_section_partners-block_6 .views-field.views-field-body,
#block-martis-views-block-partners-block-7 #views_slideshow_cycle_teaser_section_partners-block_7 .views-field.views-field-body {
  align-self: start !important;
  height: auto !important;
  min-height: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

#block-martis-views-block-partners-block-1 #views_slideshow_cycle_teaser_section_partners-block_1 .views-field.views-field-body .field-content,
#block-martis-views-block-partners-block-2 #views_slideshow_cycle_teaser_section_partners-block_2 .views-field.views-field-body .field-content,
#block-martis-views-block-partners-block-3 #views_slideshow_cycle_teaser_section_partners-block_3 .views-field.views-field-body .field-content,
#block-martis-views-block-partners-block-4 #views_slideshow_cycle_teaser_section_partners-block_4 .views-field.views-field-body .field-content,
#block-martis-views-block-partners-block-5 #views_slideshow_cycle_teaser_section_partners-block_5 .views-field.views-field-body .field-content,
#block-martis-views-block-partners-block-6 #views_slideshow_cycle_teaser_section_partners-block_6 .views-field.views-field-body .field-content,
#block-martis-views-block-partners-block-7 #views_slideshow_cycle_teaser_section_partners-block_7 .views-field.views-field-body .field-content,
#block-martis-views-block-partners-block-1 #views_slideshow_cycle_teaser_section_partners-block_1 .views-field.views-field-body .field-content p,
#block-martis-views-block-partners-block-2 #views_slideshow_cycle_teaser_section_partners-block_2 .views-field.views-field-body .field-content p,
#block-martis-views-block-partners-block-3 #views_slideshow_cycle_teaser_section_partners-block_3 .views-field.views-field-body .field-content p,
#block-martis-views-block-partners-block-4 #views_slideshow_cycle_teaser_section_partners-block_4 .views-field.views-field-body .field-content p,
#block-martis-views-block-partners-block-5 #views_slideshow_cycle_teaser_section_partners-block_5 .views-field.views-field-body .field-content p,
#block-martis-views-block-partners-block-6 #views_slideshow_cycle_teaser_section_partners-block_6 .views-field.views-field-body .field-content p,
#block-martis-views-block-partners-block-7 #views_slideshow_cycle_teaser_section_partners-block_7 .views-field.views-field-body .field-content p {
  display: block !important;
  justify-content: unset !important;
  height: auto !important;
  min-height: 0 !important;
}

#block-martis-views-block-partners-block-1 #views_slideshow_cycle_teaser_section_partners-block_1 .views-field.views-field-title,
#block-martis-views-block-partners-block-2 #views_slideshow_cycle_teaser_section_partners-block_2 .views-field.views-field-title,
#block-martis-views-block-partners-block-3 #views_slideshow_cycle_teaser_section_partners-block_3 .views-field.views-field-title,
#block-martis-views-block-partners-block-4 #views_slideshow_cycle_teaser_section_partners-block_4 .views-field.views-field-title,
#block-martis-views-block-partners-block-5 #views_slideshow_cycle_teaser_section_partners-block_5 .views-field.views-field-title,
#block-martis-views-block-partners-block-6 #views_slideshow_cycle_teaser_section_partners-block_6 .views-field.views-field-title,
#block-martis-views-block-partners-block-7 #views_slideshow_cycle_teaser_section_partners-block_7 .views-field.views-field-title,
#block-martis-views-block-partners-block-1 #views_slideshow_cycle_teaser_section_partners-block_1 .views-field.views-field-title .field-content,
#block-martis-views-block-partners-block-2 #views_slideshow_cycle_teaser_section_partners-block_2 .views-field.views-field-title .field-content,
#block-martis-views-block-partners-block-3 #views_slideshow_cycle_teaser_section_partners-block_3 .views-field.views-field-title .field-content,
#block-martis-views-block-partners-block-4 #views_slideshow_cycle_teaser_section_partners-block_4 .views-field.views-field-title .field-content,
#block-martis-views-block-partners-block-5 #views_slideshow_cycle_teaser_section_partners-block_5 .views-field.views-field-title .field-content,
#block-martis-views-block-partners-block-6 #views_slideshow_cycle_teaser_section_partners-block_6 .views-field.views-field-title .field-content,
#block-martis-views-block-partners-block-7 #views_slideshow_cycle_teaser_section_partners-block_7 .views-field.views-field-title .field-content {
  margin: 0 !important;
  padding: 0 !important;
}

/* Final mobile cascade (beats duplicate late CSS + Custom CSS margin hacks) */
@media (max-width: 991.98px) {
  #block-martis-views-block-partners-block-1 .views_slideshow_cycle_slide .views-row,
  #block-martis-views-block-partners-block-2 .views_slideshow_cycle_slide .views-row,
  #block-martis-views-block-partners-block-3 .views_slideshow_cycle_slide .views-row,
  #block-martis-views-block-partners-block-4 .views_slideshow_cycle_slide .views-row,
  #block-martis-views-block-partners-block-5 .views_slideshow_cycle_slide .views-row,
  #block-martis-views-block-partners-block-6 .views_slideshow_cycle_slide .views-row,
  #block-martis-views-block-partners-block-7 .views_slideshow_cycle_slide .views-row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-areas:
      "title"
      "logo"
      "link"
      "body" !important;
    column-gap: 0 !important;
    row-gap: 0.55rem !important;
    padding: 0.5rem !important;
    max-width: 100% !important;
    width: 100% !important;
    overflow-x: clip !important;
  }

  #block-martis-views-block-partners-block-1 #views_slideshow_cycle_teaser_section_partners-block_1 .views-field:not(.views-field-body),
  #block-martis-views-block-partners-block-2 #views_slideshow_cycle_teaser_section_partners-block_2 .views-field:not(.views-field-body),
  #block-martis-views-block-partners-block-3 #views_slideshow_cycle_teaser_section_partners-block_3 .views-field:not(.views-field-body),
  #block-martis-views-block-partners-block-4 #views_slideshow_cycle_teaser_section_partners-block_4 .views-field:not(.views-field-body),
  #block-martis-views-block-partners-block-5 #views_slideshow_cycle_teaser_section_partners-block_5 .views-field:not(.views-field-body),
  #block-martis-views-block-partners-block-6 #views_slideshow_cycle_teaser_section_partners-block_6 .views-field:not(.views-field-body),
  #block-martis-views-block-partners-block-7 #views_slideshow_cycle_teaser_section_partners-block_7 .views-field:not(.views-field-body),
  #block-martis-views-block-partners-block-1 #views_slideshow_cycle_teaser_section_partners-block_1 [id^="views_slideshow_cycle_div_partners-block_"] .views-field:not(.views-field-body),
  #block-martis-views-block-partners-block-2 #views_slideshow_cycle_teaser_section_partners-block_2 [id^="views_slideshow_cycle_div_partners-block_"] .views-field:not(.views-field-body),
  #block-martis-views-block-partners-block-3 #views_slideshow_cycle_teaser_section_partners-block_3 [id^="views_slideshow_cycle_div_partners-block_"] .views-field:not(.views-field-body),
  #block-martis-views-block-partners-block-4 #views_slideshow_cycle_teaser_section_partners-block_4 [id^="views_slideshow_cycle_div_partners-block_"] .views-field:not(.views-field-body),
  #block-martis-views-block-partners-block-5 #views_slideshow_cycle_teaser_section_partners-block_5 [id^="views_slideshow_cycle_div_partners-block_"] .views-field:not(.views-field-body),
  #block-martis-views-block-partners-block-6 #views_slideshow_cycle_teaser_section_partners-block_6 [id^="views_slideshow_cycle_div_partners-block_"] .views-field:not(.views-field-body),
  #block-martis-views-block-partners-block-7 #views_slideshow_cycle_teaser_section_partners-block_7 [id^="views_slideshow_cycle_div_partners-block_"] .views-field:not(.views-field-body) {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    left: auto !important;
    right: auto !important;
    position: static !important;
    grid-column: 1 / -1 !important;
  }

  #block-martis-views-block-partners-block-1 #views_slideshow_cycle_teaser_section_partners-block_1 .views-field.views-field-body,
  #block-martis-views-block-partners-block-2 #views_slideshow_cycle_teaser_section_partners-block_2 .views-field.views-field-body,
  #block-martis-views-block-partners-block-3 #views_slideshow_cycle_teaser_section_partners-block_3 .views-field.views-field-body,
  #block-martis-views-block-partners-block-4 #views_slideshow_cycle_teaser_section_partners-block_4 .views-field.views-field-body,
  #block-martis-views-block-partners-block-5 #views_slideshow_cycle_teaser_section_partners-block_5 .views-field.views-field-body,
  #block-martis-views-block-partners-block-6 #views_slideshow_cycle_teaser_section_partners-block_6 .views-field.views-field-body,
  #block-martis-views-block-partners-block-7 #views_slideshow_cycle_teaser_section_partners-block_7 .views-field.views-field-body,
  #block-martis-views-block-partners-block-1 #views_slideshow_cycle_teaser_section_partners-block_1 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-body,
  #block-martis-views-block-partners-block-2 #views_slideshow_cycle_teaser_section_partners-block_2 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-body,
  #block-martis-views-block-partners-block-3 #views_slideshow_cycle_teaser_section_partners-block_3 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-body,
  #block-martis-views-block-partners-block-4 #views_slideshow_cycle_teaser_section_partners-block_4 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-body,
  #block-martis-views-block-partners-block-5 #views_slideshow_cycle_teaser_section_partners-block_5 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-body,
  #block-martis-views-block-partners-block-6 #views_slideshow_cycle_teaser_section_partners-block_6 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-body,
  #block-martis-views-block-partners-block-7 #views_slideshow_cycle_teaser_section_partners-block_7 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-body {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    left: auto !important;
    right: auto !important;
    position: relative !important;
    grid-column: 1 / -1 !important;
  }

  #block-martis-views-block-partners-block-1 #views_slideshow_cycle_teaser_section_partners-block_1 .views-field.views-field-body,
  #block-martis-views-block-partners-block-2 #views_slideshow_cycle_teaser_section_partners-block_2 .views-field.views-field-body,
  #block-martis-views-block-partners-block-3 #views_slideshow_cycle_teaser_section_partners-block_3 .views-field.views-field-body,
  #block-martis-views-block-partners-block-4 #views_slideshow_cycle_teaser_section_partners-block_4 .views-field.views-field-body,
  #block-martis-views-block-partners-block-5 #views_slideshow_cycle_teaser_section_partners-block_5 .views-field.views-field-body,
  #block-martis-views-block-partners-block-6 #views_slideshow_cycle_teaser_section_partners-block_6 .views-field.views-field-body,
  #block-martis-views-block-partners-block-7 #views_slideshow_cycle_teaser_section_partners-block_7 .views-field.views-field-body {
    grid-area: body !important;
    grid-row: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    margin-left: 0 !important;
    margin-top: 0 !important;
    align-self: stretch !important;
  }

  #block-martis-views-block-partners-block-1 #views_slideshow_cycle_teaser_section_partners-block_1 .views-field.views-field-field-link,
  #block-martis-views-block-partners-block-2 #views_slideshow_cycle_teaser_section_partners-block_2 .views-field.views-field-field-link,
  #block-martis-views-block-partners-block-3 #views_slideshow_cycle_teaser_section_partners-block_3 .views-field.views-field-field-link,
  #block-martis-views-block-partners-block-4 #views_slideshow_cycle_teaser_section_partners-block_4 .views-field.views-field-field-link,
  #block-martis-views-block-partners-block-5 #views_slideshow_cycle_teaser_section_partners-block_5 .views-field.views-field-field-link,
  #block-martis-views-block-partners-block-6 #views_slideshow_cycle_teaser_section_partners-block_6 .views-field.views-field-field-link,
  #block-martis-views-block-partners-block-7 #views_slideshow_cycle_teaser_section_partners-block_7 .views-field.views-field-field-link {
    grid-area: link !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  #block-martis-views-block-partners-block-1 #views_slideshow_cycle_teaser_section_partners-block_1 .views-field.views-field-field-image,
  #block-martis-views-block-partners-block-2 #views_slideshow_cycle_teaser_section_partners-block_2 .views-field.views-field-field-image,
  #block-martis-views-block-partners-block-3 #views_slideshow_cycle_teaser_section_partners-block_3 .views-field.views-field-field-image,
  #block-martis-views-block-partners-block-4 #views_slideshow_cycle_teaser_section_partners-block_4 .views-field.views-field-field-image,
  #block-martis-views-block-partners-block-5 #views_slideshow_cycle_teaser_section_partners-block_5 .views-field.views-field-field-image,
  #block-martis-views-block-partners-block-6 #views_slideshow_cycle_teaser_section_partners-block_6 .views-field.views-field-field-image,
  #block-martis-views-block-partners-block-7 #views_slideshow_cycle_teaser_section_partners-block_7 .views-field.views-field-field-image {
    grid-area: logo !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
  }

  #block-martis-views-block-partners-block-1 #views_slideshow_cycle_teaser_section_partners-block_1 .views-field.views-field-title,
  #block-martis-views-block-partners-block-2 #views_slideshow_cycle_teaser_section_partners-block_2 .views-field.views-field-title,
  #block-martis-views-block-partners-block-3 #views_slideshow_cycle_teaser_section_partners-block_3 .views-field.views-field-title,
  #block-martis-views-block-partners-block-4 #views_slideshow_cycle_teaser_section_partners-block_4 .views-field.views-field-title,
  #block-martis-views-block-partners-block-5 #views_slideshow_cycle_teaser_section_partners-block_5 .views-field.views-field-title,
  #block-martis-views-block-partners-block-6 #views_slideshow_cycle_teaser_section_partners-block_6 .views-field.views-field-title,
  #block-martis-views-block-partners-block-7 #views_slideshow_cycle_teaser_section_partners-block_7 .views-field.views-field-title {
    grid-area: title !important;
    margin-left: 0 !important;
    text-align: center !important;
  }

  /* Homepage block-1: undo slideshow clip + Custom CSS label/body hacks */
  #block-martis-views-block-partners-block-1 #views_slideshow_cycle_main_partners-block_1,
  #block-martis-views-block-partners-block-1 #views_slideshow_cycle_teaser_section_partners-block_1 {
    overflow: visible !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    margin-bottom: 0 !important;
  }

  #block-martis-views-block-partners-block-1 #views_slideshow_cycle_teaser_section_partners-block_1 [id^="views_slideshow_cycle_div_partners-block_"] {
    overflow: visible !important;
    height: auto !important;
    min-height: 0 !important;
  }

  #block-martis-views-block-partners-block-1 #views_slideshow_cycle_teaser_section_partners-block_1 .views-label,
  #block-martis-views-block-partners-block-1 #views_slideshow_cycle_teaser_section_partners-block_1 [id^="views_slideshow_cycle_div_partners-block_"] .views-label,
  #block-martis-views-block-partners-block-1 #views_slideshow_cycle_teaser_section_partners-block_1 .views-field .field-content,
  #block-martis-views-block-partners-block-1 #views_slideshow_cycle_teaser_section_partners-block_1 [id^="views_slideshow_cycle_div_partners-block_"] .views-field .field-content {
    margin-left: 0 !important;
    margin-top: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  #block-martis-views-block-partners-block-1 #views_slideshow_cycle_teaser_section_partners-block_1 .views-label.views-label-title,
  #block-martis-views-block-partners-block-1 #views_slideshow_cycle_teaser_section_partners-block_1 .views-label.views-label-field-image,
  #block-martis-views-block-partners-block-1 #views_slideshow_cycle_teaser_section_partners-block_1 [id^="views_slideshow_cycle_div_partners-block_"] .views-label.views-label-title,
  #block-martis-views-block-partners-block-1 #views_slideshow_cycle_teaser_section_partners-block_1 [id^="views_slideshow_cycle_div_partners-block_"] .views-label.views-label-field-image {
    display: block !important;
    text-align: center !important;
    margin-right: 0 !important;
    margin-top: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  #block-martis-views-block-partners-block-1 #views_slideshow_cycle_teaser_section_partners-block_1 .views-field.views-field-title .field-content,
  #block-martis-views-block-partners-block-1 #views_slideshow_cycle_teaser_section_partners-block_1 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-title .field-content {
    display: block !important;
    text-align: center !important;
    margin-right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  #block-martis-views-block-partners-block-1 #views_slideshow_cycle_teaser_section_partners-block_1 .views-field.views-field-field-image .media,
  #block-martis-views-block-partners-block-1 #views_slideshow_cycle_teaser_section_partners-block_1 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-field-image .media {
    margin-left: auto !important;
    margin-right: auto !important;
    margin-bottom: 0 !important;
  }

  #block-martis-views-block-partners-block-1 #views_slideshow_cycle_teaser_section_partners-block_1 .views-field.views-field-body,
  #block-martis-views-block-partners-block-1 #views_slideshow_cycle_teaser_section_partners-block_1 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-body {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    margin-left: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  /* All blocks: label + media centering cascade */
  #block-martis-views-block-partners-block-1 #views_slideshow_cycle_teaser_section_partners-block_1 .views-label,
  #block-martis-views-block-partners-block-2 #views_slideshow_cycle_teaser_section_partners-block_2 .views-label,
  #block-martis-views-block-partners-block-3 #views_slideshow_cycle_teaser_section_partners-block_3 .views-label,
  #block-martis-views-block-partners-block-4 #views_slideshow_cycle_teaser_section_partners-block_4 .views-label,
  #block-martis-views-block-partners-block-5 #views_slideshow_cycle_teaser_section_partners-block_5 .views-label,
  #block-martis-views-block-partners-block-6 #views_slideshow_cycle_teaser_section_partners-block_6 .views-label,
  #block-martis-views-block-partners-block-7 #views_slideshow_cycle_teaser_section_partners-block_7 .views-label,
  #block-martis-views-block-partners-block-1 #views_slideshow_cycle_teaser_section_partners-block_1 [id^="views_slideshow_cycle_div_partners-block_"] .views-label,
  #block-martis-views-block-partners-block-2 #views_slideshow_cycle_teaser_section_partners-block_2 [id^="views_slideshow_cycle_div_partners-block_"] .views-label,
  #block-martis-views-block-partners-block-3 #views_slideshow_cycle_teaser_section_partners-block_3 [id^="views_slideshow_cycle_div_partners-block_"] .views-label,
  #block-martis-views-block-partners-block-4 #views_slideshow_cycle_teaser_section_partners-block_4 [id^="views_slideshow_cycle_div_partners-block_"] .views-label,
  #block-martis-views-block-partners-block-5 #views_slideshow_cycle_teaser_section_partners-block_5 [id^="views_slideshow_cycle_div_partners-block_"] .views-label,
  #block-martis-views-block-partners-block-6 #views_slideshow_cycle_teaser_section_partners-block_6 [id^="views_slideshow_cycle_div_partners-block_"] .views-label,
  #block-martis-views-block-partners-block-7 #views_slideshow_cycle_teaser_section_partners-block_7 [id^="views_slideshow_cycle_div_partners-block_"] .views-label {
    margin-left: 0 !important;
    margin-right: 0 !important;
    text-align: center !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  #block-martis-views-block-partners-block-1 #views_slideshow_cycle_teaser_section_partners-block_1 .views-field.views-field-title .field-content,
  #block-martis-views-block-partners-block-2 #views_slideshow_cycle_teaser_section_partners-block_2 .views-field.views-field-title .field-content,
  #block-martis-views-block-partners-block-3 #views_slideshow_cycle_teaser_section_partners-block_3 .views-field.views-field-title .field-content,
  #block-martis-views-block-partners-block-4 #views_slideshow_cycle_teaser_section_partners-block_4 .views-field.views-field-title .field-content,
  #block-martis-views-block-partners-block-5 #views_slideshow_cycle_teaser_section_partners-block_5 .views-field.views-field-title .field-content,
  #block-martis-views-block-partners-block-6 #views_slideshow_cycle_teaser_section_partners-block_6 .views-field.views-field-title .field-content,
  #block-martis-views-block-partners-block-7 #views_slideshow_cycle_teaser_section_partners-block_7 .views-field.views-field-title .field-content,
  #block-martis-views-block-partners-block-1 #views_slideshow_cycle_teaser_section_partners-block_1 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-title .field-content,
  #block-martis-views-block-partners-block-2 #views_slideshow_cycle_teaser_section_partners-block_2 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-title .field-content,
  #block-martis-views-block-partners-block-3 #views_slideshow_cycle_teaser_section_partners-block_3 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-title .field-content,
  #block-martis-views-block-partners-block-4 #views_slideshow_cycle_teaser_section_partners-block_4 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-title .field-content,
  #block-martis-views-block-partners-block-5 #views_slideshow_cycle_teaser_section_partners-block_5 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-title .field-content,
  #block-martis-views-block-partners-block-6 #views_slideshow_cycle_teaser_section_partners-block_6 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-title .field-content,
  #block-martis-views-block-partners-block-7 #views_slideshow_cycle_teaser_section_partners-block_7 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-title .field-content {
    margin-left: 0 !important;
    margin-right: 0 !important;
    text-align: center !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  #block-martis-views-block-partners-block-1 #views_slideshow_cycle_teaser_section_partners-block_1 .views-field.views-field-field-image .media,
  #block-martis-views-block-partners-block-2 #views_slideshow_cycle_teaser_section_partners-block_2 .views-field.views-field-field-image .media,
  #block-martis-views-block-partners-block-3 #views_slideshow_cycle_teaser_section_partners-block_3 .views-field.views-field-field-image .media,
  #block-martis-views-block-partners-block-4 #views_slideshow_cycle_teaser_section_partners-block_4 .views-field.views-field-field-image .media,
  #block-martis-views-block-partners-block-5 #views_slideshow_cycle_teaser_section_partners-block_5 .views-field.views-field-field-image .media,
  #block-martis-views-block-partners-block-6 #views_slideshow_cycle_teaser_section_partners-block_6 .views-field.views-field-field-image .media,
  #block-martis-views-block-partners-block-7 #views_slideshow_cycle_teaser_section_partners-block_7 .views-field.views-field-field-image .media,
  #block-martis-views-block-partners-block-1 #views_slideshow_cycle_teaser_section_partners-block_1 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-field-image .media,
  #block-martis-views-block-partners-block-2 #views_slideshow_cycle_teaser_section_partners-block_2 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-field-image .media,
  #block-martis-views-block-partners-block-3 #views_slideshow_cycle_teaser_section_partners-block_3 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-field-image .media,
  #block-martis-views-block-partners-block-4 #views_slideshow_cycle_teaser_section_partners-block_4 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-field-image .media,
  #block-martis-views-block-partners-block-5 #views_slideshow_cycle_teaser_section_partners-block_5 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-field-image .media,
  #block-martis-views-block-partners-block-6 #views_slideshow_cycle_teaser_section_partners-block_6 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-field-image .media,
  #block-martis-views-block-partners-block-7 #views_slideshow_cycle_teaser_section_partners-block_7 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-field-image .media {
    margin-left: auto !important;
    margin-right: auto !important;
    margin-bottom: 0 !important;
  }

  #block-martis-views-block-partners-block-1 #views_slideshow_cycle_main_partners-block_1 .views-field,
  #block-martis-views-block-partners-block-1 #views_slideshow_cycle_main_partners-block_1 .views-label,
  #block-martis-views-block-partners-block-1 #views_slideshow_cycle_main_partners-block_1 .views-field .field-content,
  #block-martis-views-block-partners-block-1 #views_slideshow_cycle_main_partners-block_1 .views-field.views-field-title,
  #block-martis-views-block-partners-block-1 #views_slideshow_cycle_main_partners-block_1 .views-field.views-field-field-image,
  #block-martis-views-block-partners-block-1 #views_slideshow_cycle_main_partners-block_1 .views-field.views-field-field-link,
  #block-martis-views-block-partners-block-1 #views_slideshow_cycle_main_partners-block_1 .views-field.views-field-body {
    margin-left: 0 !important;
    margin-right: 0 !important;
    left: auto !important;
    right: auto !important;
    max-width: 100% !important;
  }

  #block-martis-views-block-partners-block-1 #views_slideshow_cycle_main_partners-block_1 .views-field.views-field-field-image .media,
  #block-martis-views-block-partners-block-1 #views_slideshow_cycle_main_partners-block_1 .views-field.views-field-field-image .field-content {
    margin-left: auto !important;
    margin-right: auto !important;
  }

  /* Beat per-slide Custom CSS (div#slide_id adds type specificity) */
  #block-martis-views-block-partners-block-1 #views_slideshow_cycle_teaser_section_partners-block_1 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-title,
  #block-martis-views-block-partners-block-2 #views_slideshow_cycle_teaser_section_partners-block_2 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-title,
  #block-martis-views-block-partners-block-3 #views_slideshow_cycle_teaser_section_partners-block_3 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-title,
  #block-martis-views-block-partners-block-4 #views_slideshow_cycle_teaser_section_partners-block_4 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-title,
  #block-martis-views-block-partners-block-5 #views_slideshow_cycle_teaser_section_partners-block_5 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-title,
  #block-martis-views-block-partners-block-6 #views_slideshow_cycle_teaser_section_partners-block_6 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-title,
  #block-martis-views-block-partners-block-7 #views_slideshow_cycle_teaser_section_partners-block_7 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-title {
    margin-left: 0 !important;
    margin-right: 0 !important;
    text-align: center !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  #block-martis-views-block-partners-block-1 #views_slideshow_cycle_teaser_section_partners-block_1 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-field-image,
  #block-martis-views-block-partners-block-2 #views_slideshow_cycle_teaser_section_partners-block_2 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-field-image,
  #block-martis-views-block-partners-block-3 #views_slideshow_cycle_teaser_section_partners-block_3 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-field-image,
  #block-martis-views-block-partners-block-4 #views_slideshow_cycle_teaser_section_partners-block_4 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-field-image,
  #block-martis-views-block-partners-block-5 #views_slideshow_cycle_teaser_section_partners-block_5 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-field-image,
  #block-martis-views-block-partners-block-6 #views_slideshow_cycle_teaser_section_partners-block_6 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-field-image,
  #block-martis-views-block-partners-block-7 #views_slideshow_cycle_teaser_section_partners-block_7 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-field-image {
    margin-left: 0;
    margin-right: 0 !important;
    text-align: center !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  #block-martis-views-block-partners-block-1 #views_slideshow_cycle_teaser_section_partners-block_1 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-body,
  #block-martis-views-block-partners-block-2 #views_slideshow_cycle_teaser_section_partners-block_2 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-body,
  #block-martis-views-block-partners-block-3 #views_slideshow_cycle_teaser_section_partners-block_3 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-body,
  #block-martis-views-block-partners-block-4 #views_slideshow_cycle_teaser_section_partners-block_4 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-body,
  #block-martis-views-block-partners-block-5 #views_slideshow_cycle_teaser_section_partners-block_5 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-body,
  #block-martis-views-block-partners-block-6 #views_slideshow_cycle_teaser_section_partners-block_6 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-body,
  #block-martis-views-block-partners-block-7 #views_slideshow_cycle_teaser_section_partners-block_7 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-body {
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow: visible !important;
    /* Was 2rem 0.5rem — too tight L/R; quotes + text need room. */
    padding: 1.25rem 1.25rem 1.4rem !important;
    position: relative !important;
  }
}

/* Title label + content — always centered (beats Custom CSS) */
[id^="block-martis-views-block-partners-block-"] .views-label.views-label-title,
[id^="block-martis-views-block-partners-block-"] .views-field.views-field-title .views-label.views-label-title,
[id^="block-martis-views-block-partners-block-"] .views-field.views-field-title .field-content,
[id^="block-martis-views-block-partners-block-"] [id^="views_slideshow_cycle_teaser_section_partners-block_"] .views-label.views-label-title,
[id^="block-martis-views-block-partners-block-"] [id^="views_slideshow_cycle_teaser_section_partners-block_"] .views-field.views-field-title .views-label.views-label-title,
[id^="block-martis-views-block-partners-block-"] [id^="views_slideshow_cycle_teaser_section_partners-block_"] .views-field.views-field-title .field-content,
[id^="block-martis-views-block-partners-block-"] [id^="views_slideshow_cycle_teaser_section_partners-block_"] [id^="views_slideshow_cycle_div_partners-block_"] .views-label.views-label-title,
[id^="block-martis-views-block-partners-block-"] [id^="views_slideshow_cycle_teaser_section_partners-block_"] [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-title .views-label.views-label-title,
[id^="block-martis-views-block-partners-block-"] [id^="views_slideshow_cycle_teaser_section_partners-block_"] [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-title .field-content {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

[id^="block-martis-views-block-partners-block-"] .views-field.views-field-title,
[id^="block-martis-views-block-partners-block-"] [id^="views_slideshow_cycle_teaser_section_partners-block_"] .views-field.views-field-title,
[id^="block-martis-views-block-partners-block-"] [id^="views_slideshow_cycle_teaser_section_partners-block_"] [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-title {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  text-align: center !important;
}

/* ==========================================================================
   Partner body quote alignment (2026-08-08 final v2)
   Quotes on .field-content (stable position:relative containing block).
   High-specificity selectors beat Custom CSS + padding-left:0 nukes.
   Body panel also position:relative (for overflow/stacking), but quotes
   live on field-content so they sit with the text block.
   ========================================================================== */

html body #block-martis-views-block-partners-block-1 .views-field.views-field-body,
html body #block-martis-views-block-partners-block-2 .views-field.views-field-body,
html body #block-martis-views-block-partners-block-3 .views-field.views-field-body,
html body #block-martis-views-block-partners-block-4 .views-field.views-field-body,
html body #block-martis-views-block-partners-block-5 .views-field.views-field-body,
html body #block-martis-views-block-partners-block-6 .views-field.views-field-body,
html body #block-martis-views-block-partners-block-7 .views-field.views-field-body {
  position: relative !important;
  overflow: visible !important;
  /* Outer panel padding — generous L/R so quotes + text breathe. */
  padding: 1.35rem 1.5rem 1.5rem !important;
  box-sizing: border-box !important;
}

/* No quotes on the body box itself (field-content owns them). */
html body #block-martis-views-block-partners-block-1 .views-field.views-field-body::before,
html body #block-martis-views-block-partners-block-2 .views-field.views-field-body::before,
html body #block-martis-views-block-partners-block-3 .views-field.views-field-body::before,
html body #block-martis-views-block-partners-block-4 .views-field.views-field-body::before,
html body #block-martis-views-block-partners-block-5 .views-field.views-field-body::before,
html body #block-martis-views-block-partners-block-6 .views-field.views-field-body::before,
html body #block-martis-views-block-partners-block-7 .views-field.views-field-body::before,
html body #block-martis-views-block-partners-block-1 .views-field.views-field-body::after,
html body #block-martis-views-block-partners-block-2 .views-field.views-field-body::after,
html body #block-martis-views-block-partners-block-3 .views-field.views-field-body::after,
html body #block-martis-views-block-partners-block-4 .views-field.views-field-body::after,
html body #block-martis-views-block-partners-block-5 .views-field.views-field-body::after,
html body #block-martis-views-block-partners-block-6 .views-field.views-field-body::after,
html body #block-martis-views-block-partners-block-7 .views-field.views-field-body::after {
  content: none !important;
  display: none !important;
}

/* field-content: containing block + padding that beats padding-left:0 nukes.
   Two-ID selectors required to beat mobile cascade at block-1. */
html body #block-martis-views-block-partners-block-1 .views-field.views-field-body .field-content,
html body #block-martis-views-block-partners-block-2 .views-field.views-field-body .field-content,
html body #block-martis-views-block-partners-block-3 .views-field.views-field-body .field-content,
html body #block-martis-views-block-partners-block-4 .views-field.views-field-body .field-content,
html body #block-martis-views-block-partners-block-5 .views-field.views-field-body .field-content,
html body #block-martis-views-block-partners-block-6 .views-field.views-field-body .field-content,
html body #block-martis-views-block-partners-block-7 .views-field.views-field-body .field-content,
html body #block-martis-views-block-partners-block-1 #views_slideshow_cycle_teaser_section_partners-block_1 .views-field.views-field-body .field-content,
html body #block-martis-views-block-partners-block-2 #views_slideshow_cycle_teaser_section_partners-block_2 .views-field.views-field-body .field-content,
html body #block-martis-views-block-partners-block-3 #views_slideshow_cycle_teaser_section_partners-block_3 .views-field.views-field-body .field-content,
html body #block-martis-views-block-partners-block-4 #views_slideshow_cycle_teaser_section_partners-block_4 .views-field.views-field-body .field-content,
html body #block-martis-views-block-partners-block-5 #views_slideshow_cycle_teaser_section_partners-block_5 .views-field.views-field-body .field-content,
html body #block-martis-views-block-partners-block-6 #views_slideshow_cycle_teaser_section_partners-block_6 .views-field.views-field-body .field-content,
html body #block-martis-views-block-partners-block-7 #views_slideshow_cycle_teaser_section_partners-block_7 .views-field.views-field-body .field-content,
html body #block-martis-views-block-partners-block-1 #views_slideshow_cycle_teaser_section_partners-block_1 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-body .field-content,
html body #block-martis-views-block-partners-block-2 #views_slideshow_cycle_teaser_section_partners-block_2 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-body .field-content,
html body #block-martis-views-block-partners-block-3 #views_slideshow_cycle_teaser_section_partners-block_3 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-body .field-content,
html body #block-martis-views-block-partners-block-4 #views_slideshow_cycle_teaser_section_partners-block_4 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-body .field-content,
html body #block-martis-views-block-partners-block-5 #views_slideshow_cycle_teaser_section_partners-block_5 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-body .field-content,
html body #block-martis-views-block-partners-block-6 #views_slideshow_cycle_teaser_section_partners-block_6 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-body .field-content,
html body #block-martis-views-block-partners-block-7 #views_slideshow_cycle_teaser_section_partners-block_7 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-body .field-content {
  position: relative !important;
  display: block !important;
  box-sizing: border-box !important;
  margin: 0 !important;
  /* Room for 2rem quotes at corners without text collision. */
  padding: 1.1rem 1.4rem 1.2rem !important;
  padding-left: 1.4rem !important;
  padding-right: 1.4rem !important;
  padding-top: 1.1rem !important;
  padding-bottom: 1.2rem !important;
}

/* Opening curly quote — top-left inside field-content padding */
html body #block-martis-views-block-partners-block-1 .views-field.views-field-body .field-content::before,
html body #block-martis-views-block-partners-block-2 .views-field.views-field-body .field-content::before,
html body #block-martis-views-block-partners-block-3 .views-field.views-field-body .field-content::before,
html body #block-martis-views-block-partners-block-4 .views-field.views-field-body .field-content::before,
html body #block-martis-views-block-partners-block-5 .views-field.views-field-body .field-content::before,
html body #block-martis-views-block-partners-block-6 .views-field.views-field-body .field-content::before,
html body #block-martis-views-block-partners-block-7 .views-field.views-field-body .field-content::before {
  content: "\201C" !important;
  display: block !important;
  position: absolute !important;
  top: 0.2rem !important;
  left: 0.2rem !important;
  right: auto !important;
  bottom: auto !important;
  width: auto !important;
  height: auto !important;
  font-size: 2rem !important;
  line-height: 1 !important;
  font-weight: 700 !important;
  color: #7b2cbf !important;
  z-index: 2 !important;
  pointer-events: none !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
  opacity: 1 !important;
  visibility: visible !important;
}

/* Closing curly quote — bottom-right inside field-content padding */
html body #block-martis-views-block-partners-block-1 .views-field.views-field-body .field-content::after,
html body #block-martis-views-block-partners-block-2 .views-field.views-field-body .field-content::after,
html body #block-martis-views-block-partners-block-3 .views-field.views-field-body .field-content::after,
html body #block-martis-views-block-partners-block-4 .views-field.views-field-body .field-content::after,
html body #block-martis-views-block-partners-block-5 .views-field.views-field-body .field-content::after,
html body #block-martis-views-block-partners-block-6 .views-field.views-field-body .field-content::after,
html body #block-martis-views-block-partners-block-7 .views-field.views-field-body .field-content::after {
  content: "\201D" !important;
  display: block !important;
  position: absolute !important;
  top: auto !important;
  left: auto !important;
  bottom: 0.15rem !important;
  right: 0.2rem !important;
  width: auto !important;
  height: auto !important;
  font-size: 2rem !important;
  line-height: 1 !important;
  font-weight: 700 !important;
  color: #7b2cbf !important;
  z-index: 2 !important;
  pointer-events: none !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
  opacity: 1 !important;
  visibility: visible !important;
}

@media (max-width: 991.98px) {
  /* Two-ID selectors required — earlier mobile cascade used 2 IDs + padding 2rem 0.5rem. */
  html body #block-martis-views-block-partners-block-1 .views-field.views-field-body,
  html body #block-martis-views-block-partners-block-2 .views-field.views-field-body,
  html body #block-martis-views-block-partners-block-3 .views-field.views-field-body,
  html body #block-martis-views-block-partners-block-4 .views-field.views-field-body,
  html body #block-martis-views-block-partners-block-5 .views-field.views-field-body,
  html body #block-martis-views-block-partners-block-6 .views-field.views-field-body,
  html body #block-martis-views-block-partners-block-7 .views-field.views-field-body,
  html body #block-martis-views-block-partners-block-1 #views_slideshow_cycle_teaser_section_partners-block_1 .views-field.views-field-body,
  html body #block-martis-views-block-partners-block-2 #views_slideshow_cycle_teaser_section_partners-block_2 .views-field.views-field-body,
  html body #block-martis-views-block-partners-block-3 #views_slideshow_cycle_teaser_section_partners-block_3 .views-field.views-field-body,
  html body #block-martis-views-block-partners-block-4 #views_slideshow_cycle_teaser_section_partners-block_4 .views-field.views-field-body,
  html body #block-martis-views-block-partners-block-5 #views_slideshow_cycle_teaser_section_partners-block_5 .views-field.views-field-body,
  html body #block-martis-views-block-partners-block-6 #views_slideshow_cycle_teaser_section_partners-block_6 .views-field.views-field-body,
  html body #block-martis-views-block-partners-block-7 #views_slideshow_cycle_teaser_section_partners-block_7 .views-field.views-field-body,
  html body #block-martis-views-block-partners-block-1 #views_slideshow_cycle_teaser_section_partners-block_1 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-body,
  html body #block-martis-views-block-partners-block-2 #views_slideshow_cycle_teaser_section_partners-block_2 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-body,
  html body #block-martis-views-block-partners-block-3 #views_slideshow_cycle_teaser_section_partners-block_3 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-body,
  html body #block-martis-views-block-partners-block-4 #views_slideshow_cycle_teaser_section_partners-block_4 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-body,
  html body #block-martis-views-block-partners-block-5 #views_slideshow_cycle_teaser_section_partners-block_5 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-body,
  html body #block-martis-views-block-partners-block-6 #views_slideshow_cycle_teaser_section_partners-block_6 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-body,
  html body #block-martis-views-block-partners-block-7 #views_slideshow_cycle_teaser_section_partners-block_7 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-body {
    padding: 1.25rem 1.25rem 1.4rem !important;
    padding-left: 1.25rem !important;
    padding-right: 1.25rem !important;
    position: relative !important;
    overflow: visible !important;
  }

  html body #block-martis-views-block-partners-block-1 .views-field.views-field-body .field-content,
  html body #block-martis-views-block-partners-block-2 .views-field.views-field-body .field-content,
  html body #block-martis-views-block-partners-block-3 .views-field.views-field-body .field-content,
  html body #block-martis-views-block-partners-block-4 .views-field.views-field-body .field-content,
  html body #block-martis-views-block-partners-block-5 .views-field.views-field-body .field-content,
  html body #block-martis-views-block-partners-block-6 .views-field.views-field-body .field-content,
  html body #block-martis-views-block-partners-block-7 .views-field.views-field-body .field-content,
  html body #block-martis-views-block-partners-block-1 #views_slideshow_cycle_teaser_section_partners-block_1 .views-field.views-field-body .field-content,
  html body #block-martis-views-block-partners-block-2 #views_slideshow_cycle_teaser_section_partners-block_2 .views-field.views-field-body .field-content,
  html body #block-martis-views-block-partners-block-3 #views_slideshow_cycle_teaser_section_partners-block_3 .views-field.views-field-body .field-content,
  html body #block-martis-views-block-partners-block-4 #views_slideshow_cycle_teaser_section_partners-block_4 .views-field.views-field-body .field-content,
  html body #block-martis-views-block-partners-block-5 #views_slideshow_cycle_teaser_section_partners-block_5 .views-field.views-field-body .field-content,
  html body #block-martis-views-block-partners-block-6 #views_slideshow_cycle_teaser_section_partners-block_6 .views-field.views-field-body .field-content,
  html body #block-martis-views-block-partners-block-7 #views_slideshow_cycle_teaser_section_partners-block_7 .views-field.views-field-body .field-content {
    padding: 1rem 1.2rem 1.1rem !important;
    padding-left: 1.2rem !important;
    padding-right: 1.2rem !important;
    padding-top: 1rem !important;
    padding-bottom: 1.1rem !important;
  }

  html body #block-martis-views-block-partners-block-1 .views-field.views-field-body .field-content::before,
  html body #block-martis-views-block-partners-block-2 .views-field.views-field-body .field-content::before,
  html body #block-martis-views-block-partners-block-3 .views-field.views-field-body .field-content::before,
  html body #block-martis-views-block-partners-block-4 .views-field.views-field-body .field-content::before,
  html body #block-martis-views-block-partners-block-5 .views-field.views-field-body .field-content::before,
  html body #block-martis-views-block-partners-block-6 .views-field.views-field-body .field-content::before,
  html body #block-martis-views-block-partners-block-7 .views-field.views-field-body .field-content::before {
    top: 0.15rem !important;
    left: 0.15rem !important;
    font-size: 1.85rem !important;
  }

  html body #block-martis-views-block-partners-block-1 .views-field.views-field-body .field-content::after,
  html body #block-martis-views-block-partners-block-2 .views-field.views-field-body .field-content::after,
  html body #block-martis-views-block-partners-block-3 .views-field.views-field-body .field-content::after,
  html body #block-martis-views-block-partners-block-4 .views-field.views-field-body .field-content::after,
  html body #block-martis-views-block-partners-block-5 .views-field.views-field-body .field-content::after,
  html body #block-martis-views-block-partners-block-6 .views-field.views-field-body .field-content::after,
  html body #block-martis-views-block-partners-block-7 .views-field.views-field-body .field-content::after {
    bottom: 0.1rem !important;
    right: 0.15rem !important;
    font-size: 1.85rem !important;
  }
}

/* ==========================================================================
   Partner slide clickability (title/logo → partner node; no Read more button)
   ========================================================================== */
[id^="block-martis-views-block-partners-block-"] .views-field.views-field-title a,
[id^="block-martis-views-block-partners-block-"] .views-field.views-field-title h3 a {
  color: #1a1a1a !important;
  text-decoration: none !important;
  font-weight: 600 !important;
}

[id^="block-martis-views-block-partners-block-"] .views-field.views-field-title a:hover,
[id^="block-martis-views-block-partners-block-"] .views-field.views-field-title a:focus-visible {
  color: #7b2cbf !important;
  text-decoration: underline !important;
  text-underline-offset: 2px;
}

[id^="block-martis-views-block-partners-block-"] a.partner-slide-logo-link {
  display: inline-flex !important;
  justify-content: center !important;
  align-items: center !important;
  text-decoration: none !important;
}

[id^="block-martis-views-block-partners-block-"] a.partner-slide-logo-link:hover img,
[id^="block-martis-views-block-partners-block-"] a.partner-slide-logo-link:focus-visible img {
  box-shadow: 0 0 0 3px #7b2cbf !important;
}

/* Body field in slideshow is summary/trimmed — keep quote box compact. */
[id^="block-martis-views-block-partners-block-"] .views-field.views-field-body .field-content {
  font-size: 0.95rem !important;
  line-height: 1.5 !important;
}

/* Preferred brands block title → partners hub link */
.partners-brands-block .block-title a.partners-block-title-link,
#block-martis-views-block-partners-block-1 .block-title a.partners-block-title-link,
#block-martis-views-block-partners-block-2 .block-title a.partners-block-title-link,
#block-martis-views-block-partners-block-3 .block-title a.partners-block-title-link,
#block-martis-views-block-partners-block-4 .block-title a.partners-block-title-link,
#block-martis-views-block-partners-block-5 .block-title a.partners-block-title-link,
#block-martis-views-block-partners-block-6 .block-title a.partners-block-title-link,
#block-martis-views-block-partners-block-7 .block-title a.partners-block-title-link {
  color: inherit !important;
  -webkit-text-fill-color: inherit !important;
  text-decoration: none !important;
  border-bottom: 2px solid transparent;
  transition: border-color 0.15s ease, color 0.15s ease;
}
.partners-brands-block .block-title a.partners-block-title-link:hover,
.partners-brands-block .block-title a.partners-block-title-link:focus-visible,
#block-martis-views-block-partners-block-1 .block-title a.partners-block-title-link:hover,
#block-martis-views-block-partners-block-2 .block-title a.partners-block-title-link:hover,
#block-martis-views-block-partners-block-3 .block-title a.partners-block-title-link:hover,
#block-martis-views-block-partners-block-4 .block-title a.partners-block-title-link:hover,
#block-martis-views-block-partners-block-5 .block-title a.partners-block-title-link:hover,
#block-martis-views-block-partners-block-6 .block-title a.partners-block-title-link:hover,
#block-martis-views-block-partners-block-7 .block-title a.partners-block-title-link:hover {
  color: #6716aa !important;
  -webkit-text-fill-color: #6716aa !important;
  border-bottom-color: #6716aa;
  text-decoration: none !important;
}

/* ==========================================================================
   Partner slideshow — Cyber 1-col + true circular white logos (2026-08-09)
   End-of-file cascade wins over Custom CSS and earlier rules in this file.
   ========================================================================== */

/* Full-width block (beats front 57.5% shrink) */
.path-frontpage #block-martis-views-block-partners-block-1 .views-element-container,
.path-frontpage #wrapper #block-martis-views-block-partners-block-1 .views-element-container,
#block-martis-views-block-partners-block-1 .views-element-container,
#block-martis-views-block-partners-block-2 .views-element-container,
#block-martis-views-block-partners-block-3 .views-element-container,
#block-martis-views-block-partners-block-4 .views-element-container,
#block-martis-views-block-partners-block-5 .views-element-container,
#block-martis-views-block-partners-block-6 .views-element-container,
#block-martis-views-block-partners-block-7 .views-element-container,
[id^="block-martis-views-block-partners-block-"] .views-element-container {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Single-column slide stack — all breakpoints */
#block-martis-views-block-partners-block-1 .views_slideshow_cycle_slide .views-row,
#block-martis-views-block-partners-block-2 .views_slideshow_cycle_slide .views-row,
#block-martis-views-block-partners-block-3 .views_slideshow_cycle_slide .views-row,
#block-martis-views-block-partners-block-4 .views_slideshow_cycle_slide .views-row,
#block-martis-views-block-partners-block-5 .views_slideshow_cycle_slide .views-row,
#block-martis-views-block-partners-block-6 .views_slideshow_cycle_slide .views-row,
#block-martis-views-block-partners-block-7 .views_slideshow_cycle_slide .views-row,
[id^="block-martis-views-block-partners-block-"] .views_slideshow_cycle_slide .views-row {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-rows: auto !important;
  grid-template-areas:
    "title"
    "logo"
    "link"
    "body" !important;
  column-gap: 0 !important;
  row-gap: 0.8rem !important;
  align-items: stretch !important;
  justify-items: center !important;
  width: 100% !important;
  max-width: 960px !important;
  margin: 0 auto !important;
  padding: 1.25rem 1.15rem 1.4rem !important;
  box-sizing: border-box !important;
}

[id^="block-martis-views-block-partners-block-"] .views_slideshow_cycle_slide {
  background: #ffffff !important;
  border-radius: 16px !important;
}

/* Fields full width of single column */
[id^="block-martis-views-block-partners-block-"] .views_slideshow_cycle_slide .views-field,
[id^="block-martis-views-block-partners-block-"] .views_slideshow_cycle_slide .views-field.views-field-title,
[id^="block-martis-views-block-partners-block-"] .views_slideshow_cycle_slide .views-field.views-field-field-image,
[id^="block-martis-views-block-partners-block-"] .views_slideshow_cycle_slide .views-field.views-field-field-link,
[id^="block-martis-views-block-partners-block-"] .views_slideshow_cycle_slide .views-field.views-field-body {
  grid-column: 1 / -1 !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  justify-self: stretch !important;
}

[id^="block-martis-views-block-partners-block-"] .views-field.views-field-title { grid-area: title !important; }
[id^="block-martis-views-block-partners-block-"] .views-field.views-field-field-image { grid-area: logo !important; }
[id^="block-martis-views-block-partners-block-"] .views-field.views-field-field-link { grid-area: link !important; }
[id^="block-martis-views-block-partners-block-"] .views-field.views-field-body {
  grid-area: body !important;
  grid-row: auto !important;
}

/* Body: full-width white card + purple left accent (Cyber-like) */
[id^="block-martis-views-block-partners-block-"] .views-field.views-field-body,
#block-martis-views-block-partners-block-1 .views-field.views-field-body,
#block-martis-views-block-partners-block-2 .views-field.views-field-body,
#block-martis-views-block-partners-block-3 .views-field.views-field-body,
#block-martis-views-block-partners-block-4 .views-field.views-field-body,
#block-martis-views-block-partners-block-5 .views-field.views-field-body,
#block-martis-views-block-partners-block-6 .views-field.views-field-body,
#block-martis-views-block-partners-block-7 .views-field.views-field-body {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0.25rem 0 0 !important;
  padding: 1.35rem 1.35rem 1.5rem !important;
  background: #ffffff !important;
  border: 1px solid #e9d5ff !important;
  border-left: 5px solid #6716aa !important;
  border-radius: 14px !important;
  box-shadow: 0 4px 14px rgba(59, 10, 92, 0.08) !important;
  box-sizing: border-box !important;
}

[id^="block-martis-views-block-partners-block-"] .views-field.views-field-body .field-content,
[id^="block-martis-views-block-partners-block-"] .views-field.views-field-body .field-content p,
[id^="block-martis-views-block-partners-block-"] .views-field.views-field-body .field-content h2 {
  text-align: left !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
}

/* ---------- Perfect circular white logo wells ---------- */
[id^="block-martis-views-block-partners-block-"] .views-field.views-field-field-image .field-content,
[id^="block-martis-views-block-partners-block-"] .views-field.views-field-field-image .media,
[id^="block-martis-views-block-partners-block-"] .views-field.views-field-field-image .media.media--blazy,
[id^="block-martis-views-block-partners-block-"] a.partner-slide-logo-link,
#block-martis-views-block-partners-block-1 .views-field.views-field-field-image .field-content,
#block-martis-views-block-partners-block-1 .views-field.views-field-field-image .media,
#block-martis-views-block-partners-block-2 .views-field.views-field-field-image .field-content,
#block-martis-views-block-partners-block-2 .views-field.views-field-field-image .media,
#block-martis-views-block-partners-block-3 .views-field.views-field-field-image .field-content,
#block-martis-views-block-partners-block-4 .views-field.views-field-field-image .field-content,
#block-martis-views-block-partners-block-5 .views-field.views-field-field-image .field-content,
#block-martis-views-block-partners-block-6 .views-field.views-field-field-image .field-content,
#block-martis-views-block-partners-block-7 .views-field.views-field-field-image .field-content {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 140px !important;
  height: 140px !important;
  min-width: 140px !important;
  min-height: 140px !important;
  max-width: 140px !important;
  max-height: 140px !important;
  margin: 0.25rem auto !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding: 0.55rem !important;
  background: #ffffff !important;
  background-color: #ffffff !important;
  border: 2px solid #000 !important;
  border-radius: 50% !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
  box-shadow: 0 3px 10px rgba(59, 10, 92, 0.12) !important;
  aspect-ratio: 1 / 1 !important;
}

/* Image fills the circular well without becoming an oval */
[id^="block-martis-views-block-partners-block-"] .views-field.views-field-field-image .field-content img,
[id^="block-martis-views-block-partners-block-"] .views-field.views-field-field-image .media img,
[id^="block-martis-views-block-partners-block-"] .views-field.views-field-field-image .media__element,
[id^="block-martis-views-block-partners-block-"] a.partner-slide-logo-link img,
#block-martis-views-block-partners-block-1 .views-field.views-field-field-image img,
#block-martis-views-block-partners-block-2 .views-field.views-field-field-image img,
#block-martis-views-block-partners-block-3 .views-field.views-field-field-image img,
#block-martis-views-block-partners-block-4 .views-field.views-field-field-image img,
#block-martis-views-block-partners-block-5 .views-field.views-field-field-image img,
#block-martis-views-block-partners-block-6 .views-field.views-field-field-image img,
#block-martis-views-block-partners-block-7 .views-field.views-field-field-image img,
html #wrapper [id^="block-martis-views-block-partners-block-"] .views-field-field-image .field-content img {
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  object-fit: contain !important;
  object-position: center !important;
  border-radius: 0 !important;
  border: 0 !important;
  background: transparent !important;
  padding: 0 !important;
  margin: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  display: block !important;
  box-shadow: none !important;
  aspect-ratio: auto !important;
}

/* Kill Custom CSS horizontal logo shifts */
html #wrapper [id^="block-martis-views-block-partners-block-"] .views-field-field-image .field-content img,
[id^="block-martis-views-block-partners-block-"] [id^="views_slideshow_cycle_div_partners-block_"] .views-field img,
[id^="block-martis-views-block-partners-block-"] .views_slideshow_cycle_slide .views-field img {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* Mobile: slightly smaller circle, still perfect square */
@media (max-width: 991.98px) {
  [id^="block-martis-views-block-partners-block-"] .views_slideshow_cycle_slide .views-row {
    max-width: 100% !important;
    padding: 0.85rem 0.75rem 1.1rem !important;
    row-gap: 0.65rem !important;
  }

  [id^="block-martis-views-block-partners-block-"] .views-field.views-field-field-image .field-content,
  [id^="block-martis-views-block-partners-block-"] .views-field.views-field-field-image .media,
  [id^="block-martis-views-block-partners-block-"] a.partner-slide-logo-link,
  #block-martis-views-block-partners-block-1 .views-field.views-field-field-image .field-content,
  #block-martis-views-block-partners-block-1 .views-field.views-field-field-image .media {
    width: 120px !important;
    height: 120px !important;
    min-width: 120px !important;
    min-height: 120px !important;
    max-width: 120px !important;
    max-height: 120px !important;
    aspect-ratio: 1 / 1 !important;
  }

  [id^="block-martis-views-block-partners-block-"] .views-field.views-field-field-image .field-content img,
  [id^="block-martis-views-block-partners-block-"] .views-field.views-field-field-image .media img,
  [id^="block-martis-views-block-partners-block-"] .views-field-field-image .field-content img {
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    height: 100% !important; /* NOT auto — prevents oval */
    object-fit: contain !important;
  }
}


/* ==========================================================================
   Kill oval rings: full-width wrappers must not use border-radius 50%
   ========================================================================== */
[id^="block-martis-views-block-partners-block-"] .views-field.views-field-field-image,
[id^="block-martis-views-block-partners-block-"] .views-field.views-field-field-image .views-label {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  width: 100% !important;
  max-width: 100% !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  padding: 0 !important;
}

/* Only these nodes may be circular */
[id^="block-martis-views-block-partners-block-"] .views-field.views-field-field-image .field-content,
[id^="block-martis-views-block-partners-block-"] .views-field.views-field-field-image .media,
[id^="block-martis-views-block-partners-block-"] a.partner-slide-logo-link {
  width: 140px !important;
  height: 140px !important;
  min-width: 140px !important;
  min-height: 140px !important;
  max-width: 140px !important;
  max-height: 140px !important;
  border-radius: 50% !important;
  border: 2px solid #000 !important;
  background: #fff !important;
  aspect-ratio: 1 / 1 !important;
  overflow: hidden !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
  padding: 0.55rem !important;
}

[id^="block-martis-views-block-partners-block-"] .views-field.views-field-field-image img,
[id^="block-martis-views-block-partners-block-"] a.partner-slide-logo-link img {
  border-radius: 0 !important;
  border: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

@media (max-width: 991.98px) {
  [id^="block-martis-views-block-partners-block-"] .views-field.views-field-field-image .field-content,
  [id^="block-martis-views-block-partners-block-"] .views-field.views-field-field-image .media,
  [id^="block-martis-views-block-partners-block-"] a.partner-slide-logo-link {
    width: 120px !important;
    height: 120px !important;
    min-width: 120px !important;
    min-height: 120px !important;
    max-width: 120px !important;
    max-height: 120px !important;
  }
}

/* ==========================================================================
   FINAL oval kill (2026-08-09): field-content was full-width + radius 50%
   Structure: .field-content > a.partner-slide-logo-link > .media > img
   Only the <a> / .media should be the circle.
   ========================================================================== */
#block-martis-views-block-partners-block-1 .views-field-field-image .field-content,
#block-martis-views-block-partners-block-2 .views-field-field-image .field-content,
#block-martis-views-block-partners-block-3 .views-field-field-image .field-content,
#block-martis-views-block-partners-block-4 .views-field-field-image .field-content,
#block-martis-views-block-partners-block-5 .views-field-field-image .field-content,
#block-martis-views-block-partners-block-6 .views-field-field-image .field-content,
#block-martis-views-block-partners-block-7 .views-field-field-image .field-content,
[id^="block-martis-views-block-partners-block-"] .views-field.views-field-field-image > .field-content {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  width: auto !important;
  max-width: none !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  margin: 0 auto !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
  aspect-ratio: auto !important;
}

/* Single circle ring on the logo link (or media if no link) */
#block-martis-views-block-partners-block-1 .views-field-field-image a.partner-slide-logo-link,
#block-martis-views-block-partners-block-2 .views-field-field-image a.partner-slide-logo-link,
#block-martis-views-block-partners-block-3 .views-field-field-image a.partner-slide-logo-link,
#block-martis-views-block-partners-block-4 .views-field-field-image a.partner-slide-logo-link,
#block-martis-views-block-partners-block-5 .views-field-field-image a.partner-slide-logo-link,
#block-martis-views-block-partners-block-6 .views-field-field-image a.partner-slide-logo-link,
#block-martis-views-block-partners-block-7 .views-field-field-image a.partner-slide-logo-link,
[id^="block-martis-views-block-partners-block-"] a.partner-slide-logo-link {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 140px !important;
  height: 140px !important;
  min-width: 140px !important;
  min-height: 140px !important;
  max-width: 140px !important;
  max-height: 140px !important;
  margin: 0.25rem auto !important;
  padding: 0.55rem !important;
  border: 2px solid #000 !important;
  border-radius: 50% !important;
  background: #ffffff !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
  aspect-ratio: 1 / 1 !important;
  box-shadow: 0 3px 10px rgba(59, 10, 92, 0.12) !important;
}

/* Media inside link: no second ring */
#block-martis-views-block-partners-block-1 .views-field-field-image a.partner-slide-logo-link .media,
#block-martis-views-block-partners-block-2 .views-field-field-image a.partner-slide-logo-link .media,
#block-martis-views-block-partners-block-3 .views-field-field-image a.partner-slide-logo-link .media,
#block-martis-views-block-partners-block-4 .views-field-field-image a.partner-slide-logo-link .media,
#block-martis-views-block-partners-block-5 .views-field-field-image a.partner-slide-logo-link .media,
#block-martis-views-block-partners-block-6 .views-field-field-image a.partner-slide-logo-link .media,
#block-martis-views-block-partners-block-7 .views-field-field-image a.partner-slide-logo-link .media,
[id^="block-martis-views-block-partners-block-"] a.partner-slide-logo-link .media {
  width: 100% !important;
  height: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  max-width: 100% !important;
  max-height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: hidden !important;
}

#block-martis-views-block-partners-block-1 .views-field-field-image img,
#block-martis-views-block-partners-block-2 .views-field-field-image img,
#block-martis-views-block-partners-block-3 .views-field-field-image img,
#block-martis-views-block-partners-block-4 .views-field-field-image img,
#block-martis-views-block-partners-block-5 .views-field-field-image img,
#block-martis-views-block-partners-block-6 .views-field-field-image img,
#block-martis-views-block-partners-block-7 .views-field-field-image img,
[id^="block-martis-views-block-partners-block-"] .views-field-field-image img {
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: contain !important;
  border: 0 !important;
  border-radius: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

@media (max-width: 991.98px) {
  #block-martis-views-block-partners-block-1 .views-field-field-image a.partner-slide-logo-link,
  #block-martis-views-block-partners-block-2 .views-field-field-image a.partner-slide-logo-link,
  #block-martis-views-block-partners-block-3 .views-field-field-image a.partner-slide-logo-link,
  #block-martis-views-block-partners-block-4 .views-field-field-image a.partner-slide-logo-link,
  #block-martis-views-block-partners-block-5 .views-field-field-image a.partner-slide-logo-link,
  #block-martis-views-block-partners-block-6 .views-field-field-image a.partner-slide-logo-link,
  #block-martis-views-block-partners-block-7 .views-field-field-image a.partner-slide-logo-link,
  [id^="block-martis-views-block-partners-block-"] a.partner-slide-logo-link {
    width: 120px !important;
    height: 120px !important;
    min-width: 120px !important;
    min-height: 120px !important;
    max-width: 120px !important;
    max-height: 120px !important;
  }
}

/* ==========================================================================
   HIGHEST SPECIFICITY oval kill — beats
   #block … [id^=views_slideshow_cycle_div] .views-field .field-content
   ========================================================================== */
#block-martis-views-block-partners-block-1 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-field-image .field-content,
#block-martis-views-block-partners-block-2 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-field-image .field-content,
#block-martis-views-block-partners-block-3 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-field-image .field-content,
#block-martis-views-block-partners-block-4 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-field-image .field-content,
#block-martis-views-block-partners-block-5 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-field-image .field-content,
#block-martis-views-block-partners-block-6 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-field-image .field-content,
#block-martis-views-block-partners-block-7 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-field-image .field-content,
#block-martis-views-block-partners-block-1 [id^="views_slideshow_cycle_div_partners-block_"] .views-field .field-content,
#block-martis-views-block-partners-block-2 [id^="views_slideshow_cycle_div_partners-block_"] .views-field .field-content,
#block-martis-views-block-partners-block-3 [id^="views_slideshow_cycle_div_partners-block_"] .views-field .field-content,
#block-martis-views-block-partners-block-4 [id^="views_slideshow_cycle_div_partners-block_"] .views-field .field-content,
#block-martis-views-block-partners-block-5 [id^="views_slideshow_cycle_div_partners-block_"] .views-field .field-content,
#block-martis-views-block-partners-block-6 [id^="views_slideshow_cycle_div_partners-block_"] .views-field .field-content,
#block-martis-views-block-partners-block-7 [id^="views_slideshow_cycle_div_partners-block_"] .views-field .field-content {
  /* Only neutralize when this field-content is the image wrapper */
}

/* Image field only — force non-circular wrapper */
#block-martis-views-block-partners-block-1 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-field-image .field-content,
#block-martis-views-block-partners-block-2 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-field-image .field-content,
#block-martis-views-block-partners-block-3 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-field-image .field-content,
#block-martis-views-block-partners-block-4 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-field-image .field-content,
#block-martis-views-block-partners-block-5 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-field-image .field-content,
#block-martis-views-block-partners-block-6 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-field-image .field-content,
#block-martis-views-block-partners-block-7 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-field-image .field-content,
#block-martis-views-block-partners-block-1 #views_slideshow_cycle_teaser_section_partners-block_1 .views-field.views-field-field-image .field-content,
#block-martis-views-block-partners-block-1 #views_slideshow_cycle_main_partners-block_1 .views-field.views-field-field-image .field-content {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  width: fit-content !important;
  max-width: none !important;
  min-width: 0 !important;
  height: fit-content !important;
  min-height: 0 !important;
  max-height: none !important;
  margin: 0 auto !important;
  padding: 0 !important;
  border: 0 none transparent !important;
  border-width: 0 !important;
  border-style: none !important;
  border-color: transparent !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
  aspect-ratio: auto !important;
}

/* Circle only on logo link — max specificity */
#block-martis-views-block-partners-block-1 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-field-image a.partner-slide-logo-link,
#block-martis-views-block-partners-block-2 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-field-image a.partner-slide-logo-link,
#block-martis-views-block-partners-block-3 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-field-image a.partner-slide-logo-link,
#block-martis-views-block-partners-block-4 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-field-image a.partner-slide-logo-link,
#block-martis-views-block-partners-block-5 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-field-image a.partner-slide-logo-link,
#block-martis-views-block-partners-block-6 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-field-image a.partner-slide-logo-link,
#block-martis-views-block-partners-block-7 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-field-image a.partner-slide-logo-link {
  display: flex !important;
  width: 120px !important;
  height: 120px !important;
  min-width: 120px !important;
  min-height: 120px !important;
  max-width: 120px !important;
  max-height: 120px !important;
  border: 2px solid #000 !important;
  border-radius: 50% !important;
  background: #fff !important;
  padding: 0.5rem !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
  aspect-ratio: 1 / 1 !important;
  margin: 0.25rem auto !important;
}

@media (min-width: 992px) {
  #block-martis-views-block-partners-block-1 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-field-image a.partner-slide-logo-link,
  #block-martis-views-block-partners-block-2 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-field-image a.partner-slide-logo-link,
  #block-martis-views-block-partners-block-3 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-field-image a.partner-slide-logo-link,
  #block-martis-views-block-partners-block-4 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-field-image a.partner-slide-logo-link,
  #block-martis-views-block-partners-block-5 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-field-image a.partner-slide-logo-link,
  #block-martis-views-block-partners-block-6 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-field-image a.partner-slide-logo-link,
  #block-martis-views-block-partners-block-7 [id^="views_slideshow_cycle_div_partners-block_"] .views-field.views-field-field-image a.partner-slide-logo-link {
    width: 140px !important;
    height: 140px !important;
    min-width: 140px !important;
    min-height: 140px !important;
    max-width: 140px !important;
    max-height: 140px !important;
  }
}

/* assets/css/hub-intro-buttons.css */
/**
 * hub-intro-buttons.css
 * Sitewide hub-intro CTAs (Free Project Consultation / Get in touch / Book).
 * Beats custom_css .jd-hub-intro { max-width:22rem; margin-left:1.15rem }
 * and square 6px buttons. Matches webform-modern pills.
 */

html body #wrapper .jd-hub-intro,
html body #wrapper .hub-intro,
html body #wrapper .partners-listing-intro.hub-intro {
  max-width: 46rem !important;
  width: auto !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
}

/* /team listing: match Cyberlytics intro column (52rem), beat the 46rem above. */
html body.path-team.page-team #wrapper .jd-hub-intro,
html body.path-team.page-team #block-martis-teamh1title .jd-hub-intro,
html body.path-team #wrapper .jd-hub-intro {
  max-width: 52rem !important;
  width: 100% !important;
}

html body #wrapper .jd-hub-intro__cta,
html body #wrapper .hub-intro__cta,
html body #wrapper .hub-intro__links,
html body #wrapper .partners-listing-intro .hub-intro__links {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 0.55rem 0.65rem !important;
  align-items: center !important;
  justify-content: flex-start !important;
  margin: 0.15rem 0 0 !important;
}

html body #wrapper a.jd-hub-intro__btn,
html body #wrapper a.hub-intro__btn,
html body #wrapper .jd-hub-intro a.button,
html body #wrapper .hub-intro a.button,
html body #wrapper .jd-hub-intro__cta a,
html body #wrapper .partners-listing-intro a.hub-intro__btn,
html body #wrapper .partners-hub__btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 2.85rem !important;
  padding: 0.7rem 1.4rem !important;
  border: 2px solid #000 !important;
  border-radius: 999px !important;
  background: #6716aa !important;
  background-image: none !important;
  background-color: #6716aa !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-weight: 700 !important;
  font-size: 0.98rem !important;
  line-height: 1.2 !important;
  text-decoration: none !important;
  text-shadow: none !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
  width: auto !important;
  max-width: 100% !important;
  opacity: 1 !important;
}

html body #wrapper a.jd-hub-intro__btn:hover,
html body #wrapper a.hub-intro__btn:hover,
html body #wrapper a.jd-hub-intro__btn:focus-visible,
html body #wrapper a.hub-intro__btn:focus-visible,
html body #wrapper .partners-listing-intro a.hub-intro__btn:hover,
html body #wrapper .partners-hub__btn:hover {
  background: #3b0a5c !important;
  background-color: #3b0a5c !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  filter: none !important;
  outline: 2px solid #b781e3 !important;
  outline-offset: 2px !important;
}

html body #wrapper a.jd-hub-intro__btn--ghost,
html body #wrapper a.hub-intro__btn--ghost,
html body #wrapper .partners-listing-intro a.hub-intro__btn--ghost,
html body #wrapper .partners-hub__btn--ghost {
  background: #ffffff !important;
  background-color: #ffffff !important;
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
}

html body #wrapper a.jd-hub-intro__btn--ghost:hover,
html body #wrapper a.hub-intro__btn--ghost:hover,
html body #wrapper a.jd-hub-intro__btn--ghost:focus-visible,
html body #wrapper a.hub-intro__btn--ghost:focus-visible {
  background: #f3e8ff !important;
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
}

@media (max-width: 767.98px) {
  html body #wrapper #content-wide-top .row.layout,
  html body #wrapper #content-wide-top .layout.layout--onecol,
  html body #wrapper #content-wide-top .layout__region,
  html body #wrapper #content-wide-top .layout__region--content,
  html body #wrapper .view-header .row.layout,
  html body #wrapper .view-header .layout__region--content {
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  html body #wrapper .jd-hub-intro,
  html body #wrapper .hub-intro,
  html body #wrapper .partners-listing-intro.hub-intro {
    width: calc(100% - 2rem) !important;
    max-width: calc(100% - 2rem) !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  html body.path-team #wrapper .jd-hub-intro,
  html body.path-team.page-team #block-martis-teamh1title .jd-hub-intro {
    width: 100% !important;
    max-width: 52rem !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  html body.path-partners #wrapper .view-header,
  html body[class*="-partners"] #wrapper .view-header {
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  html body #wrapper .jd-hub-intro__cta,
  html body #wrapper .hub-intro__cta,
  html body #wrapper .hub-intro__links,
  html body #wrapper .partners-listing-intro .hub-intro__links {
    justify-content: stretch !important;
    width: 100% !important;
  }

  html body #wrapper a.jd-hub-intro__btn,
  html body #wrapper a.hub-intro__btn,
  html body #wrapper .jd-hub-intro a.button,
  html body #wrapper .hub-intro a.button,
  html body #wrapper .jd-hub-intro__cta a,
  html body #wrapper .partners-listing-intro a.hub-intro__btn,
  html body #wrapper .partners-hub__btn {
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}

/* assets/css/blog-directories.css */
/**
 * blog-directories.css
 * /blog intro, /blog/category + /blog/tag cards, high-intent purple pills.
 * Loaded LAST so it beats Custom CSS + chrome-layout-fix v13/v14.
 *
 * Cards are direct children of the view (not .view-content). Grid belongs
 * on .blog-term-index-view; header/hero/intro span all columns.
 */

/* ---- High-intent purple pill ----
   Specificity must beat chrome:
   html body.path-blog.page-blog #wrapper .region.region-content .blog-listing-intro a.blog-term-index-back-btn
   html body.path-blog.page-blog #wrapper .blog-post-teaser .post-link .read-more
   #edit-submit-blog-search { width: 10% }
*/
html body.path-blog.page-blog #wrapper .region.region-content .blog-listing-intro a.blog-term-index-back-btn,
html body.path-blog.page-blog #wrapper .view-blog .blog-listing-intro a.blog-term-index-back-btn,
html body.path-blog.page-blog #wrapper .blog-listing-intro a.blog-term-index-back-btn,
html body.page-blog-term-index #wrapper .blog-term-index-cue,
html body.page-blog-term-index #wrapper .blog-term-index-card .blog-term-index-cue,
html body.page-blog-term-index #wrapper .region.region-content .blog-term-index-cue,
html body.path-blog.page-blog #wrapper .blog-post-teaser .post-link .read-more,
html body.path-blog.page-blog #wrapper .blog-post-teaser a.read-more,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-link .read-more,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser a.read-more,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-link .read-more,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser a.read-more,
html body.page-blog-term-archive #wrapper .blog-post-teaser .post-link .read-more,
html body.page-blog-term-archive #wrapper .blog-post-teaser a.read-more,
html body.path-blog.page-blog #wrapper #edit-submit-blog-search,
html body.path-blog.page-blog #wrapper #views-exposed-form-blog-search-blog-search .form-submit,
html body.path-blog.page-blog #wrapper #block-martis-exposedformblog-searchblog-search .form-submit,
html body.page-blog-term-index #wrapper #edit-submit-blog-search,
html body.page-blog-term-index #wrapper #views-exposed-form-blog-search-blog-search .form-submit,
html body.page-blog-term-index #wrapper #block-martis-exposedformblog-searchblog-search .form-submit,
html body.path-taxonomy.page-blog-category #wrapper #edit-submit-blog-search,
html body.path-taxonomy.page-blog-tag #wrapper #edit-submit-blog-search,
html body.page-blog-term-archive #wrapper #edit-submit-blog-search,
html body.page-blog-term-archive #wrapper #block-martis-exposedformblog-searchblog-search .form-submit {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  min-width: 7.5rem !important;
  max-width: none !important;
  min-height: 2.75rem !important;
  padding: 0.55rem 1.25rem !important;
  border: 2px solid #000 !important;
  border-radius: 999px !important;
  background: linear-gradient(180deg, #b781e3 0%, #6716aa 55%, #3b0a5c 100%) !important;
  background-color: #6716aa !important;
  background-image: linear-gradient(180deg, #b781e3 0%, #6716aa 55%, #3b0a5c 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-weight: 800 !important;
  font-size: 0.98rem !important;
  line-height: 1.2 !important;
  text-decoration: none !important;
  text-shadow: none !important;
  box-shadow: 0 3px 0 #000, 0 8px 18px rgba(103, 22, 170, 0.35) !important;
  box-sizing: border-box !important;
  cursor: pointer !important;
  transition: transform 0.15s ease, filter 0.15s ease, box-shadow 0.15s ease !important;
}

html body.path-blog.page-blog #wrapper .region.region-content .blog-listing-intro a.blog-term-index-back-btn:hover,
html body.path-blog.page-blog #wrapper .blog-listing-intro a.blog-term-index-back-btn:hover,
html body.path-blog.page-blog #wrapper .blog-listing-intro a.blog-term-index-back-btn:focus-visible,
html body.page-blog-term-index #wrapper .blog-term-index-card:hover .blog-term-index-cue,
html body.page-blog-term-index #wrapper .blog-term-index-cue:hover,
html body.path-blog.page-blog #wrapper #edit-submit-blog-search:hover,
html body.page-blog-term-index #wrapper #edit-submit-blog-search:hover,
html body.path-taxonomy.page-blog-category #wrapper #edit-submit-blog-search:hover,
html body.path-taxonomy.page-blog-tag #wrapper #edit-submit-blog-search:hover,
html body.page-blog-term-archive #wrapper #edit-submit-blog-search:hover {
  filter: brightness(1.08) !important;
  transform: translateY(-2px) scale(1.03) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  background: linear-gradient(180deg, #c9a0e8 0%, #7b2cbf 55%, #3b0a5c 100%) !important;
}

html body.page-node-type-blog #wrapper .blog-node-back,
html body.page-node-type-blog #wrapper p.blog-term-index-back.blog-node-back {
  margin: 0 0 1rem;
}

html body.page-node-type-blog #wrapper .blog-node-back a.blog-term-index-back-btn,
html body.page-node-type-blog #wrapper p.blog-term-index-back.blog-node-back a.blog-term-index-back-btn {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 2.75rem !important;
  padding: 0.5rem 1.2rem !important;
  background: #ffffff !important;
  color: #5b21b6 !important;
  -webkit-text-fill-color: #5b21b6 !important;
  border: 2px solid #000 !important;
  border-radius: 999px !important;
  font-weight: 800 !important;
  text-decoration: none !important;
  box-shadow: 0 2px 0 #000 !important;
}

/* Ghost: Back to the blog only (intro panel, not /blog listing CTAs). */
html body.page-blog-term-index #wrapper .region.region-content .blog-term-index-intro a.blog-term-index-back-btn,
html body.page-blog-term-index.path-blog #wrapper .region.region-content a.blog-term-index-back-btn,
html body.page-blog-term-index #wrapper .blog-term-index-intro a.blog-term-index-back-btn,
html body.page-blog-term-index #wrapper .blog-term-index-back a.blog-term-index-back-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 2.75rem !important;
  padding: 0.5rem 1.2rem !important;
  background: #ffffff !important;
  background-color: #ffffff !important;
  background-image: none !important;
  color: #5b21b6 !important;
  -webkit-text-fill-color: #5b21b6 !important;
  border: 2px solid #000 !important;
  border-radius: 999px !important;
  font-weight: 800 !important;
  text-decoration: none !important;
  box-shadow: 0 2px 0 #000 !important;
  text-shadow: none !important;
  filter: none !important;
  transform: none !important;
}

html body.page-blog-term-index #wrapper .region.region-content .blog-term-index-intro a.blog-term-index-back-btn:hover,
html body.page-blog-term-index #wrapper .blog-term-index-intro a.blog-term-index-back-btn:hover,
html body.page-blog-term-index #wrapper .blog-term-index-back a.blog-term-index-back-btn:hover {
  background: #faf5ff !important;
  background-image: none !important;
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  filter: none !important;
  transform: translateY(-1px) !important;
}

/* ---- /blog intro card ---- */
html body.path-blog.page-blog #wrapper .blog-listing-intro,
html body.path-blog.page-blog #wrapper .region.region-content .blog-listing-intro,
html body.path-blog.page-blog #wrapper .view-blog > .view-header .blog-listing-intro {
  display: block !important;
  width: 100% !important;
  max-width: 52rem !important;
  margin: -3rem auto 1.15rem !important;
  padding: 1.15rem 1.3rem 1.2rem !important;
  background: #ffffff !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  border: 1px solid #e9d5ff !important;
  border-left: 5px solid #6716aa !important;
  border-radius: 14px !important;
  box-shadow: 0 4px 14px rgba(59, 10, 92, 0.08) !important;
  box-sizing: border-box !important;
  text-align: left !important;
  font-size: 1.05rem !important;
  line-height: 1.6 !important;
}

html body.path-blog.page-blog #wrapper .region.region-content .blog-listing-intro p,
html body.path-blog.page-blog #wrapper .blog-listing-intro p {
  background: transparent !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  border: 0 !important;
  box-shadow: none !important;
  text-shadow: none !important;
  padding: 0 !important;
  margin: 0 0 0.7rem !important;
  display: block !important;
}

html body.path-blog.page-blog #wrapper .region.region-content .blog-listing-intro p.blog-listing-intro__actions,
html body.path-blog.page-blog #wrapper .blog-listing-intro p.blog-listing-intro__actions {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 1rem !important;
  margin: 1rem 0 0 !important;
}

/* ---- Directory grid: 3 / 2 / 1 on the VIEW ---- */
html body.page-blog-term-index #wrapper .blog-term-index-view,
html body.page-blog-term-index #wrapper .view-blog-taxonomy.blog-term-index-view,
html body.page-blog-term-index #wrapper .view-blog-taxonomy {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  align-items: stretch !important;
  gap: 1.15rem !important;
  max-width: 1120px !important;
  margin: -2rem auto 2rem !important;
  padding: 0 0.85rem 1.5rem !important;
  background: transparent !important;
}

html body.page-blog-term-index #wrapper .blog-term-index-view > .view-header,
html body.page-blog-term-index #wrapper .view-blog-taxonomy > .view-header,
html body.page-blog-term-index #wrapper .blog-term-index-hero,
html body.page-blog-term-index #wrapper .blog-term-index-intro,
html body.page-blog-term-index #wrapper .blog-term-index-view > .view-footer,
html body.page-blog-term-index #wrapper .blog-term-index-view > .pagerer-container,
html body.page-blog-term-index #wrapper .blog-term-index-view > nav.pager,
html body.page-blog-term-index #wrapper .view-blog-taxonomy > nav.pager {
  grid-column: 1 / -1 !important;
  width: 100% !important;
}

html body.page-blog-term-index #wrapper .blog-term-index-card,
html body.page-blog-term-index #wrapper .blog-term-index-view .views-row,
html body.page-blog-term-index #wrapper .view-blog-taxonomy .blog-term-index-card {
  display: flex !important;
  flex-direction: column !important;
  background: #ffffff !important;
  background-image: none !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  border: 1px solid #e9d5ff !important;
  border-radius: 14px !important;
  box-shadow: 0 4px 14px rgba(59, 10, 92, 0.07) !important;
  padding: 1.05rem 1.15rem 1.1rem !important;
  margin: 0 !important;
  min-height: 100% !important;
  box-sizing: border-box !important;
}

html body.page-blog-term-index #wrapper .blog-term-index-card h2.blog-term-index-title,
html body.page-blog-term-index #wrapper .blog-term-index-title {
  margin: 0 0 0.55rem !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  font-size: 1.2rem !important;
  font-weight: 800 !important;
  line-height: 1.3 !important;
}

html body.page-blog-term-index #wrapper .blog-term-index-card h2 a,
html body.page-blog-term-index #wrapper .blog-term-index-title a {
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  text-decoration: none !important;
  text-shadow: none !important;
}

html body.page-blog-term-index #wrapper .blog-term-index-card h2 a:hover {
  color: #6716aa !important;
  -webkit-text-fill-color: #6716aa !important;
}

html body.page-blog-term-index #wrapper .blog-term-index-desc,
html body.page-blog-term-index #wrapper .blog-term-index-card .blog-term-index-desc,
html body.page-blog-term-index #wrapper .blog-term-index-card .views-field-description__value,
html body.page-blog-term-index #wrapper .blog-term-index-card .views-field-description,
html body.page-blog-term-index #wrapper .blog-term-index-card .views-field-description * {
  display: block !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  text-shadow: none !important;
  font-size: 0.98rem !important;
  line-height: 1.5 !important;
  font-weight: 500 !important;
  margin: 0 0 0.85rem !important;
  padding: 0 !important;
  flex: 1 1 auto !important;
}

html body.page-blog-term-index #wrapper .blog-term-index-cue-wrap {
  margin-top: auto !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}

html body.page-blog-term-index #wrapper .blog-term-index-hero {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  text-align: center !important;
  margin: 0.35rem auto 0.85rem !important;
}

html body.page-blog-term-index #wrapper .blog-term-index-eyebrow {
  display: inline-block !important;
  margin: 0 0 0.55rem !important;
  padding: 0.2rem 0.7rem !important;
  background: #f3e8ff !important;
  color: #5b21b6 !important;
  -webkit-text-fill-color: #5b21b6 !important;
  border-radius: 999px !important;
  font-size: 0.82rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
}

html body.page-blog-term-index #wrapper h1.blog-term-index-h1,
html body.page-blog-term-index #wrapper .blog-term-index-hero h1.blog-term-index-h1 {
  display: block !important;
  max-width: 40rem !important;
  margin: 0 auto 0.85rem !important;
  padding: 0.75rem 1.15rem !important;
  background: linear-gradient(180deg, #b781e3 0%, #6716aa 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border: 2px solid #000 !important;
  border-radius: 12px !important;
  font-size: clamp(1.25rem, 3vw, 1.7rem) !important;
  font-weight: 800 !important;
  line-height: 1.25 !important;
  text-shadow: none !important;
}

html body.page-blog-term-index #wrapper .blog-term-index-intro {
  max-width: 46rem !important;
  margin: 0 auto -0.5rem !important;
  padding: 1.05rem 1.2rem 1.1rem !important;
  background: #ffffff !important;
  border: 1px solid #e9d5ff !important;
  border-left: 5px solid #6716aa !important;
  border-radius: 14px !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  box-shadow: 0 4px 14px rgba(59, 10, 92, 0.07) !important;
}

html body.page-blog-term-index #wrapper .region.region-content .blog-term-index-intro p,
html body.page-blog-term-index #wrapper .blog-term-index-intro p {
  background: transparent !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  border: 0 !important;
  margin: 0 0 0.7rem !important;
  padding: 0 !important;
  text-shadow: none !important;
}

@media (max-width: 1099.98px) {
  html body.page-blog-term-index #wrapper .blog-term-index-view,
  html body.page-blog-term-index #wrapper .view-blog-taxonomy.blog-term-index-view,
  html body.page-blog-term-index #wrapper .view-blog-taxonomy {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 575.98px) {
  html body.page-blog-term-index #wrapper .blog-term-index-view,
  html body.page-blog-term-index #wrapper .view-blog-taxonomy.blog-term-index-view,
  html body.page-blog-term-index #wrapper .view-blog-taxonomy {
    grid-template-columns: 1fr !important;
  }

  html body.path-blog.page-blog #wrapper .view-header,
  html body.path-blog.page-blog #wrapper .view-item > .view-header,
  html body.path-blog.page-blog #wrapper .view-blog > .view-header {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  html body.path-blog.page-blog #wrapper .blog-listing-intro,
  html body.path-blog.page-blog #wrapper .region.region-content .blog-listing-intro,
  html body.path-blog.page-blog #wrapper .view-header .blog-listing-intro,
  html body.path-blog.page-blog #wrapper .blog-listing-intro.blog-term-index-intro {
    width: min(52rem, calc(100vw - 2.7rem)) !important;
    max-width: min(52rem, calc(100vw - 2.7rem)) !important;
    margin-left: calc(1.35rem + (100% - 100vw) / 2) !important;
    margin-right: auto !important;
  }

  html body.page-blog-term-index #wrapper .blog-term-index-intro,
  html body.page-blog-term-index #wrapper .blog-term-index-view {
    width: calc(100% - 0rem) !important;
    max-width: calc(100% - 0rem) !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  html body.path-blog.page-blog #wrapper .region.region-content .blog-listing-intro a.blog-term-index-back-btn,
  html body.path-blog.page-blog #wrapper .blog-listing-intro a.blog-term-index-back-btn,
  html body.page-blog-term-index #wrapper .blog-term-index-cue {
    width: 100% !important;
  }
}

/* ==========================================================================
   Term-archive teasers = /blog listing cards
   /blog/category/* and /blog/tag/*  (body.page-blog-term-archive)
   ========================================================================== */

html body.page-blog-term-archive #wrapper .views-element-container.row,
html body.path-taxonomy.page-blog-category #wrapper .blog-tag-listing-view,
html body.path-taxonomy.page-blog-tag #wrapper .blog-tag-listing-view {
  margin-left: 0 !important;
  margin-right: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  float: none !important;
}

html body.page-blog-term-archive #wrapper .blog-tag-listing-view,
html body.path-taxonomy.page-blog-category #wrapper .blog-tag-listing-view,
html body.path-taxonomy.page-blog-tag #wrapper .blog-tag-listing-view,
html body.page-blog-term-archive #wrapper .view-taxonomy-term {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 310px), 1fr)) !important;
  align-items: stretch !important;
  gap: 1.65rem !important;
  row-gap: 1.85rem !important;
  max-width: 1120px !important;
  margin: 0 auto 1.75rem !important;
  padding: 0 0.5rem 1rem !important;
}

html body.page-blog-term-archive #wrapper .blog-tag-listing-view > .view-header,
html body.page-blog-term-archive #wrapper .blog-tag-listing-view > .view-footer,
html body.page-blog-term-archive #wrapper .blog-tag-listing-view > nav,
html body.page-blog-term-archive #wrapper .blog-tag-listing-view > .pagerer-container,
html body.path-taxonomy.page-blog-category #wrapper .blog-tag-listing-view > .view-header,
html body.path-taxonomy.page-blog-tag #wrapper .blog-tag-listing-view > .view-header {
  grid-column: 1 / -1 !important;
  width: 100% !important;
}

html body.page-blog-term-archive #wrapper .blog-tag-listing-view > .views-row,
html body.path-taxonomy.page-blog-category #wrapper .blog-tag-listing-view > .views-row,
html body.path-taxonomy.page-blog-tag #wrapper .blog-tag-listing-view > .views-row {
  display: flex !important;
  flex-direction: column !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
  width: auto !important;
  max-width: none !important;
}

html body.page-blog-term-archive #wrapper article.blog-post-teaser.post-row,
html body.page-blog-term-archive #wrapper article.blog-post-teaser,
html body.page-blog-term-archive #wrapper .blog-post-teaser,
html body.path-taxonomy.page-blog-category #wrapper article.blog-post-teaser,
html body.path-taxonomy.page-blog-tag #wrapper article.blog-post-teaser {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  width: 100% !important;
  max-width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 0 0.35rem !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  overflow: visible !important;
}

html body.page-blog-term-archive #wrapper .blog-post-teaser .post-content-wrap,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-content-wrap,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-content-wrap {
  display: flex !important;
  flex-direction: column !important;
  flex: 1 1 auto !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  gap: 0 !important;
  overflow: visible !important;
}

html body.page-blog-term-archive #wrapper .blog-post-teaser .post-thumb,
html body.page-blog-term-archive #wrapper .blog-post-teaser .post-media,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-thumb,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-thumb {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 0.4rem !important;
  position: relative !important;
  z-index: 3 !important;
  overflow: visible !important;
  order: 0 !important;
  height: auto !important;
}

html body.page-blog-term-archive #wrapper .blog-post-teaser .post-image,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-image,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-image {
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  max-height: none !important;
  aspect-ratio: auto !important;
  margin: 0.25rem 0 -1.15rem !important;
  padding: 0 !important;
  border: 3px solid #3b0a5c !important;
  border-radius: 14px !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
  background: #1a0a24 !important;
  box-shadow: 0 4px 14px rgba(59, 10, 92, 0.2) !important;
  position: relative !important;
  z-index: 3 !important;
  display: block !important;
  transform: none !important;
}

html body.page-blog-term-archive #wrapper .blog-post-teaser .post-image img,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-image img,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-image img {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  object-fit: cover !important;
  object-position: center !important;
  border: 0 !important;
  border-radius: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
}

html body.page-blog-term-archive #wrapper .blog-post-teaser .content-wrap,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .content-wrap,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .content-wrap {
  display: flex !important;
  flex-direction: column !important;
  flex: 1 1 auto !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  align-items: stretch !important;
}

html body.page-blog-term-archive #wrapper .blog-post-teaser .post-content,
html body.page-blog-term-archive #wrapper article.blog-post-teaser .post-content,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-content,
html body.path-taxonomy.page-blog-category #wrapper article.blog-post-teaser .post-content,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-content,
html body.path-taxonomy.page-blog-tag #wrapper article.blog-post-teaser .post-content,
html body.path-taxonomy.vocabulary-category.page-blog-category #wrapper .blog-post-teaser .post-content,
html body.path-taxonomy.vocabulary-tags.page-blog-tag #wrapper .blog-post-teaser .post-content {
  display: flex !important;
  flex-direction: column !important;
  flex: 1 1 auto !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  padding: 2.35rem 1.1rem 1.15rem !important;
  box-sizing: border-box !important;
  background:
    radial-gradient(90% 70% at 15% 0%, rgba(201, 160, 232, 0.28) 0%, transparent 50%),
    linear-gradient(160deg, #7b2cbf 0%, #6716aa 48%, #3b0a5c 100%) !important;
  background-color: #6716aa !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border: 2px solid #000 !important;
  border-radius: 14px !important;
  box-shadow: 0 4px 16px rgba(59, 10, 92, 0.16) !important;
  position: relative !important;
  z-index: 1 !important;
}

html body.page-blog-term-archive #wrapper .blog-post-teaser .field-label,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .field-label,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .field-label {
  display: none !important;
}

html body.page-blog-term-archive #wrapper .blog-post-teaser .post-title-wrap,
html body.page-blog-term-archive #wrapper .blog-post-teaser .post-title,
html body.page-blog-term-archive #wrapper .blog-post-teaser .post-title a,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-title,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-title a,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-title,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-title a {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  text-align: center !important;
  text-decoration: none !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.15) !important;
  font-weight: 800 !important;
  font-size: clamp(1.05rem, 1.8vw, 1.22rem) !important;
  line-height: 1.28 !important;
  margin: 0 0 0.45rem !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  width: 100% !important;
  display: -webkit-box !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 2 !important;
  overflow: hidden !important;
}

html body.page-blog-term-archive #wrapper .blog-post-teaser .post-excerpt,
html body.page-blog-term-archive #wrapper .blog-post-teaser .post-excerpt .field-item,
html body.page-blog-term-archive #wrapper .blog-post-teaser .post-excerpt *,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-excerpt,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-excerpt *,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-excerpt,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-excerpt * {
  color: #f3e8ff !important;
  -webkit-text-fill-color: #f3e8ff !important;
  background: transparent !important;
  border: 0 !important;
  text-align: center !important;
  font-size: 0.92rem !important;
  line-height: 1.5 !important;
  margin: 0 0 0.55rem !important;
  padding: 0 !important;
  text-shadow: none !important;
}

html body.page-blog-term-archive #wrapper .blog-post-teaser .post-excerpt,
html body.page-blog-term-archive #wrapper .blog-post-teaser .post-excerpt .field-item,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-excerpt,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-excerpt {
  display: -webkit-box !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 3 !important;
  overflow: hidden !important;
}

html body.page-blog-term-archive #wrapper .blog-post-teaser .post-meta,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-meta,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-meta {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 0.4rem !important;
  margin: 0.15rem 0 0.45rem !important;
  padding: 0 !important;
  width: 100% !important;
  height: auto !important;
  max-height: none !important;
}

html body.page-blog-term-archive #wrapper .blog-post-teaser .post-meta-item.post-comment,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-meta-item.post-comment,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-meta-item.post-comment {
  display: none !important;
}

html body.page-blog-term-archive #wrapper .blog-post-teaser .post-meta-item,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-meta-item,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-meta-item {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.25rem !important;
  background: #ffffff !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  border: 1.5px solid #3b0a5c !important;
  border-radius: 999px !important;
  padding: 0.22rem 0.55rem !important;
  font-size: 0.72rem !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  margin: 0 !important;
  white-space: nowrap !important;
  box-shadow: none !important;
}

html body.page-blog-term-archive #wrapper .blog-post-teaser .post-meta-item *,
html body.page-blog-term-archive #wrapper .blog-post-teaser .post-meta-item a,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-meta-item *,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-meta-item * {
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  background: transparent !important;
  border: 0 !important;
  text-shadow: none !important;
  font-size: inherit !important;
  padding: 0 !important;
  margin: 0 !important;
}

html body.page-blog-term-archive #wrapper .blog-post-teaser .post-tags,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-tags,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-tags {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 0.3rem !important;
  margin: 0.15rem 0 0.25rem !important;
  padding: 0.55rem 0 0 !important;
  width: 100% !important;
  background: transparent !important;
  border: 0 !important;
  border-top: 1px solid rgba(255, 255, 255, 0.18) !important;
}

html body.page-blog-term-archive #wrapper .blog-post-teaser .post-tags > i,
html body.page-blog-term-archive #wrapper .blog-post-teaser .post-tags .tags-label,
html body.page-blog-term-archive #wrapper .blog-post-teaser .post-tags .field-label,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-tags > i,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-tags .tags-label,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-tags > i,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-tags .tags-label {
  display: none !important;
}

html body.page-blog-term-archive #wrapper .blog-post-teaser .post-tags a,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-tags a,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-tags a,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .tags-list a {
  display: inline-flex !important;
  background: #ffffff !important;
  color: #6716aa !important;
  -webkit-text-fill-color: #6716aa !important;
  border: 1px solid #3b0a5c !important;
  border-radius: 999px !important;
  font-weight: 700 !important;
  font-size: 0.7rem !important;
  padding: 0.18rem 0.5rem !important;
  margin: 0 !important;
  text-decoration: none !important;
}

html body.page-blog-term-archive #wrapper .blog-post-teaser .post-link,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-link,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-link {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  width: 100% !important;
  margin-top: auto !important;
  margin-bottom: 0.15rem !important;
  padding: 0.75rem 0 0.25rem !important;
  text-align: center !important;
}

html body.page-blog-term-archive #wrapper .blog-post-teaser a.read-more,
html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser a.read-more,
html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser a.read-more {
  width: auto !important;
  max-width: 14rem !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

@media (max-width: 767.98px) {
  html body.page-blog-term-archive #wrapper .blog-tag-listing-view,
  html body.path-taxonomy.page-blog-category #wrapper .blog-tag-listing-view,
  html body.path-taxonomy.page-blog-tag #wrapper .blog-tag-listing-view {
    grid-template-columns: 1fr !important;
    gap: 1.35rem !important;
    padding-left: 0.25rem !important;
    padding-right: 0.25rem !important;
  }

  html body.page-blog-term-archive #wrapper .blog-post-teaser .post-image,
  html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-image,
  html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-image {
    margin: 0.2rem 0 -1rem !important;
    border-radius: 12px !important;
  }

  html body.page-blog-term-archive #wrapper .blog-post-teaser .post-content,
  html body.path-taxonomy.page-blog-category #wrapper .blog-post-teaser .post-content,
  html body.path-taxonomy.page-blog-tag #wrapper .blog-post-teaser .post-content {
    padding: 2.1rem 0.95rem 1.05rem !important;
    border-radius: 12px !important;
  }
}

/* ==========================================================================
   Team carousel on /blog/category, /blog/tag, and term archives
   #block-martis-views-block-team-team-carousel-2
   ========================================================================== */

html body.page-blog-term-index #wrapper #block-martis-views-block-team-team-carousel-2,
html body.page-blog-term-archive #wrapper #block-martis-views-block-team-team-carousel-2 {
  display: block !important;
  width: 100% !important;
  max-width: 920px !important;
  margin: 1.5rem auto 2.25rem !important;
  padding: 0 1rem !important;
  float: none !important;
  overflow: visible !important;
}

html body.page-blog-term-index #wrapper #block-martis-views-block-team-team-carousel-2 .container-wrap,
html body.page-blog-term-archive #wrapper #block-martis-views-block-team-team-carousel-2 .container-wrap,
html body.page-blog-term-index #wrapper #block-martis-views-block-team-team-carousel-2 .views-element-container,
html body.page-blog-term-archive #wrapper #block-martis-views-block-team-team-carousel-2 .views-element-container {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
}

html body.page-blog-term-index #wrapper #block-martis-views-block-team-team-carousel-2 .block-title,
html body.page-blog-term-archive #wrapper #block-martis-views-block-team-team-carousel-2 .block-title {
  display: block !important;
  width: 100% !important;
  margin: 0 0 1rem !important;
  padding: 0 !important;
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  font-size: clamp(1.25rem, 2.4vw, 1.7rem) !important;
  font-weight: 800 !important;
  line-height: 1.25 !important;
  text-align: center !important;
  background: transparent !important;
  border: 0 !important;
}

html body.page-blog-term-index #wrapper #block-martis-views-block-team-team-carousel-2 .flexslider,
html body.page-blog-term-archive #wrapper #block-martis-views-block-team-team-carousel-2 .flexslider {
  background: transparent !important;
  border: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  box-shadow: none !important;
  overflow: hidden !important;
}

html body.page-blog-term-index #wrapper #block-martis-views-block-team-team-carousel-2 .flexslider .slides,
html body.page-blog-term-archive #wrapper #block-martis-views-block-team-team-carousel-2 .flexslider .slides {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  overflow: hidden !important;
}

html body.page-blog-term-index #wrapper #block-martis-views-block-team-team-carousel-2 .flexslider .slides > li,
html body.page-blog-term-archive #wrapper #block-martis-views-block-team-team-carousel-2 .flexslider .slides > li {
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
}

html body.page-blog-term-index #wrapper #block-martis-views-block-team-team-carousel-2 .flex-control-nav,
html body.page-blog-term-index #wrapper #block-martis-views-block-team-team-carousel-2 .flex-direction-nav,
html body.page-blog-term-archive #wrapper #block-martis-views-block-team-team-carousel-2 .flex-control-nav,
html body.page-blog-term-archive #wrapper #block-martis-views-block-team-team-carousel-2 .flex-direction-nav {
  display: none !important;
}

html body.page-blog-term-index #wrapper #block-martis-views-block-team-team-carousel-2 .team-teaser,
html body.page-blog-term-archive #wrapper #block-martis-views-block-team-team-carousel-2 .team-teaser {
  display: flex !important;
  flex-direction: row !important;
  align-items: flex-start !important;
  gap: 1.25rem !important;
  margin: 0 !important;
  padding: 1.15rem 1.2rem 1.2rem !important;
  background: #ffffff !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  border: 2px solid #000 !important;
  border-radius: 14px !important;
  box-shadow: 0 6px 16px rgba(59, 10, 92, 0.12) !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
}

html body.page-blog-term-index #wrapper #block-martis-views-block-team-team-carousel-2 .team-thumb,
html body.page-blog-term-archive #wrapper #block-martis-views-block-team-team-carousel-2 .team-thumb {
  position: relative !important;
  flex: 0 0 180px !important;
  width: 180px !important;
  max-width: 180px !important;
  margin: 0 !important;
  padding: 0 !important;
}

html body.page-blog-term-index #wrapper #block-martis-views-block-team-team-carousel-2 .team-thumb img,
html body.page-blog-term-archive #wrapper #block-martis-views-block-team-team-carousel-2 .team-thumb img {
  display: block !important;
  width: 180px !important;
  height: 220px !important;
  max-width: 100% !important;
  object-fit: cover !important;
  object-position: center top !important;
  border: 2px solid #000 !important;
  border-radius: 12px !important;
  margin: 0 !important;
}

html body.page-blog-term-index #wrapper #block-martis-views-block-team-team-carousel-2 .team-social,
html body.page-blog-term-archive #wrapper #block-martis-views-block-team-team-carousel-2 .team-social {
  position: absolute !important;
  left: 50% !important;
  bottom: 0.55rem !important;
  transform: translateX(-50%) !important;
  display: flex !important;
  flex-direction: row !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 0.35rem !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  z-index: 2 !important;
}

html body.page-blog-term-index #wrapper #block-martis-views-block-team-team-carousel-2 .team-social a,
html body.page-blog-term-archive #wrapper #block-martis-views-block-team-team-carousel-2 .team-social a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 2rem !important;
  height: 2rem !important;
  margin: 0 !important;
  background: #6716aa !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border: 2px solid #000 !important;
  border-radius: 999px !important;
  font-size: 0.85rem !important;
  line-height: 1 !important;
  text-decoration: none !important;
  overflow: hidden !important;
}

html body.page-blog-term-index #wrapper #block-martis-views-block-team-team-carousel-2 .team-meta,
html body.page-blog-term-archive #wrapper #block-martis-views-block-team-team-carousel-2 .team-meta {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0.15rem 0 0 !important;
  text-align: left !important;
}

html body.page-blog-term-index #wrapper #block-martis-views-block-team-team-carousel-2 .team-name,
html body.page-blog-term-index #wrapper #block-martis-views-block-team-team-carousel-2 .team-name a,
html body.page-blog-term-archive #wrapper #block-martis-views-block-team-team-carousel-2 .team-name,
html body.page-blog-term-archive #wrapper #block-martis-views-block-team-team-carousel-2 .team-name a {
  display: block !important;
  margin: 0 0 0.25rem !important;
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  font-size: 1.25rem !important;
  font-weight: 800 !important;
  line-height: 1.25 !important;
  text-decoration: none !important;
  background: transparent !important;
  border: 0 !important;
}

html body.page-blog-term-index #wrapper #block-martis-views-block-team-team-carousel-2 .team-position,
html body.page-blog-term-archive #wrapper #block-martis-views-block-team-team-carousel-2 .team-position {
  margin: 0 0 0.55rem !important;
  color: #6716aa !important;
  -webkit-text-fill-color: #6716aa !important;
  font-size: 0.95rem !important;
  font-weight: 700 !important;
}

html body.page-blog-term-index #wrapper #block-martis-views-block-team-team-carousel-2 .team-biography,
html body.page-blog-term-archive #wrapper #block-martis-views-block-team-team-carousel-2 .team-biography {
  margin: 0 !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  font-size: 0.95rem !important;
  line-height: 1.55 !important;
  background: transparent !important;
  border: 0 !important;
}

@media (max-width: 767.98px) {
  html body.page-blog-term-index #wrapper #block-martis-views-block-team-team-carousel-2,
  html body.page-blog-term-archive #wrapper #block-martis-views-block-team-team-carousel-2 {
    padding: 0 1rem 0.5rem !important;
    margin-bottom: 1.5rem !important;
  }

  html body.page-blog-term-index #wrapper .blog-term-index-view,
  html body.page-blog-term-index #wrapper .view-blog-taxonomy.blog-term-index-view,
  html body.page-blog-term-index #wrapper .view-blog-taxonomy {
    margin: -4rem auto 2rem !important;
  }

  html body.path-blog.page-blog #wrapper .view-header,
  html body.path-blog.page-blog #wrapper .view-item > .view-header,
  html body.path-blog.page-blog #wrapper .view-blog > .view-header {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  html body.path-blog.page-blog #wrapper .blog-listing-intro,
  html body.path-blog.page-blog #wrapper .region.region-content .blog-listing-intro,
  html body.path-blog.page-blog #wrapper .view-header .blog-listing-intro,
  html body.path-blog.page-blog #wrapper .blog-listing-intro.blog-term-index-intro {
    width: min(52rem, calc(100vw - 2.7rem)) !important;
    max-width: min(52rem, calc(100vw - 2.7rem)) !important;
    margin-top: -4.5rem !important;
    margin-right: auto !important;
    margin-bottom: 1.15rem !important;
    margin-left: calc(1.35rem + (100% - 100vw) / 2) !important;
  }

  html body.page-blog-term-index #wrapper #block-martis-views-block-team-team-carousel-2 .team-teaser,
  html body.page-blog-term-archive #wrapper #block-martis-views-block-team-team-carousel-2 .team-teaser {
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
  }

  html body.page-blog-term-index #wrapper #block-martis-views-block-team-team-carousel-2 .team-thumb,
  html body.page-blog-term-archive #wrapper #block-martis-views-block-team-team-carousel-2 .team-thumb {
    flex-basis: auto !important;
  }

  html body.page-blog-term-index #wrapper #block-martis-views-block-team-team-carousel-2 .team-meta,
  html body.page-blog-term-archive #wrapper #block-martis-views-block-team-team-carousel-2 .team-meta {
    text-align: center !important;
  }
  article.blog-post-teaser.post-row {
    margin-bottom: 0rem !important;
  }
  .page-node-type-blog #block-martis-views-block-team-team-carousel-2 {
    margin-top: -4rem !important;
  }
}

/* assets/css/blog-faq-accordion.css */
/**
 * Blog FAQ accordion chrome. Colors stay in chrome-layout-fix.css.
 */
html body.page-node-type-blog #wrapper .post-body dt.faq-question > button.jd-faq-question-toggle {
  all: unset !important;
  box-sizing: border-box !important;
  cursor: pointer !important;
  display: block !important;
  font: inherit !important;
  text-align: inherit !important;
  width: 100% !important;
}
html body.page-node-type-blog #wrapper .post-body dt.faq-question:has(> button.jd-faq-question-toggle:focus-visible) {
  outline: 3px solid rgba(157, 78, 221, 0.7) !important;
  outline-offset: 3px !important;
}
body.page-node-type-blog .post-body .faq-accordion dt.faq-question,
body.page-node-type-blog .post-body dl.faq-list dt.faq-question,
body.page-node-type-blog .post-body .faq-accordion dt {
  cursor: pointer;
  position: relative;
  overflow: visible;
}

body.page-node-type-blog .post-body .faq-accordion dt.faq-question::after,
body.page-node-type-blog .post-body dl.faq-list dt.faq-question::after,
body.page-node-type-blog .post-body .faq-accordion dt::after,
body.page-node-type-blog .post-body .faq-accordion dt:first-child::after,
body.page-node-type-blog .post-body .faq-accordion dt:first-of-type::after,
body.page-node-type-blog .post-body .faq-accordion dt.faq-question:first-child::after,
body.page-node-type-blog .post-body .faq-accordion dt.faq-question[aria-expanded="false"]::after,
body.page-node-type-blog .post-body dl.faq-list dt.faq-question[aria-expanded="false"]::after {
  content: '+' !important;
  position: absolute;
  top: 50%;
  right: 0.85rem;
  transform: translateY(-50%) rotate(0deg);
  color: #ffffff;
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1;
  pointer-events: none;
}

body.page-node-type-blog .post-body .faq-accordion dt.faq-question.is-open::after,
body.page-node-type-blog .post-body dl.faq-list dt.faq-question.is-open::after,
body.page-node-type-blog .post-body .faq-accordion dt.is-open::after,
body.page-node-type-blog .post-body .faq-accordion dt.faq-question[aria-expanded="true"]::after,
body.page-node-type-blog .post-body dl.faq-list dt.faq-question[aria-expanded="true"]::after,
body.page-node-type-blog .post-body .faq-accordion dt[aria-expanded="true"]::after,
body.page-node-type-blog .post-body .faq-accordion dt.is-open:first-child::after,
body.page-node-type-blog .post-body .faq-accordion dt.faq-question.is-open:first-child::after {
  content: '\2212' !important;
}

body.page-node-type-blog .post-body .faq-accordion dd.faq-answer[hidden],
body.page-node-type-blog .post-body dl.faq-list dd.faq-answer[hidden],
body.page-node-type-blog .post-body .faq-accordion dd[hidden] {
  display: none !important;
}

body.page-node-type-blog .post-body .faq-accordion,
body.page-node-type-blog .post-body dl.faq-list {
  margin: 1.25rem 0 !important;
  padding: 0 !important;
}

body.page-node-type-blog .post-body .faq-accordion dt.faq-question,
body.page-node-type-blog .post-body dl.faq-list dt.faq-question {
  background: linear-gradient(135deg, #3b0a5c 0%, #6716aa 100%) !important;
  border: 1px solid rgba(59, 10, 92, 0.72) !important;
  border-radius: 12px !important;
  box-shadow: 0 7px 18px -14px rgba(59, 10, 92, 0.75) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-size: clamp(0.96rem, 1.7vw, 1.08rem) !important;
  font-weight: 800 !important;
  line-height: 1.4 !important;
  margin: 0 0 0.65rem !important;
  min-height: 52px !important;
  padding: 0.85rem 3.25rem 0.85rem 1rem !important;
  transition: background 160ms ease, box-shadow 160ms ease, transform 160ms ease !important;
}

body.page-node-type-blog .post-body .faq-accordion dt.faq-question p,
body.page-node-type-blog .post-body dl.faq-list dt.faq-question p,
html body.page-node-type-blog #wrapper .post-body .faq-accordion dt.faq-question p,
html body.page-node-type-blog #wrapper .post-body dl.faq-list dt.faq-question p {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: inherit !important;
  -webkit-text-fill-color: inherit !important;
  font: inherit !important;
  line-height: inherit !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.page-node-type-blog .post-body .faq-accordion dt.faq-question:hover,
body.page-node-type-blog .post-body dl.faq-list dt.faq-question:hover {
  background: linear-gradient(135deg, #4c0d76 0%, #7b2cbf 100%) !important;
  box-shadow: 0 11px 24px -16px rgba(59, 10, 92, 0.9) !important;
}

body.page-node-type-blog .post-body .faq-accordion dt.faq-question.is-open,
body.page-node-type-blog .post-body dl.faq-list dt.faq-question.is-open,
body.page-node-type-blog .post-body .faq-accordion dt.faq-question[aria-expanded='true'],
body.page-node-type-blog .post-body dl.faq-list dt.faq-question[aria-expanded='true'] {
  background: linear-gradient(135deg, #6716aa 0%, #9d4edd 100%) !important;
  border-radius: 12px 12px 6px 6px !important;
  box-shadow: 0 10px 24px -15px rgba(59, 10, 92, 0.9) !important;
  margin-bottom: 0.35rem !important;
}

body.page-node-type-blog .post-body .faq-accordion dt.faq-question:focus-visible,
body.page-node-type-blog .post-body dl.faq-list dt.faq-question:focus-visible {
  outline: 3px solid rgba(157, 78, 221, 0.35) !important;
  outline-offset: 3px !important;
}

body.page-node-type-blog .post-body .faq-accordion dd.faq-answer,
body.page-node-type-blog .post-body dl.faq-list dd.faq-answer {
  background: #faf5ff !important;
  border: 1px solid #e9d5ff !important;
  border-left: 4px solid #9d4edd !important;
  border-radius: 6px 6px 12px 12px !important;
  color: #33263d !important;
  margin: 0 0 0.75rem !important;
  padding: 1rem 1.1rem !important;
  transform-origin: top center;
}

body.page-node-type-blog .post-body .faq-accordion dd.faq-answer p,
body.page-node-type-blog .post-body dl.faq-list dd.faq-answer p,
html body.page-node-type-blog #wrapper .post-body .faq-accordion dd.faq-answer p,
html body.page-node-type-blog #wrapper .post-body dl.faq-list dd.faq-answer p {
  background: transparent !important;
  border: 0 !important;
  color: #33263d !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.page-node-type-blog .post-body .faq-accordion dd.faq-answer p + p,
body.page-node-type-blog .post-body dl.faq-list dd.faq-answer p + p {
  margin-top: 0.75rem !important;
}

@media (max-width: 767.98px) {
  body.page-node-type-blog .post-body .faq-accordion dt.faq-question,
  body.page-node-type-blog .post-body dl.faq-list dt.faq-question {
    border-radius: 10px !important;
    margin-bottom: 0.55rem !important;
    min-height: 48px !important;
    padding: 0.75rem 2.85rem 0.75rem 0.85rem !important;
  }

  body.page-node-type-blog .post-body .faq-accordion dd.faq-answer,
  body.page-node-type-blog .post-body dl.faq-list dd.faq-answer {
    padding: 0.85rem 0.9rem !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.page-node-type-blog .post-body .faq-accordion dt.faq-question,
  body.page-node-type-blog .post-body dl.faq-list dt.faq-question {
    transition: none !important;
  }
}

/* Win over historical #wrapper and post-body accordion declarations. */
html body.page-node-type-blog #wrapper .post-body .faq-accordion dt.faq-question,
html body.page-node-type-blog #wrapper .post-body dl.faq-list dt.faq-question {
  border: 1px solid rgba(59, 10, 92, 0.72) !important;
  border-radius: 12px !important;
  margin: 0 0 0.65rem !important;
  min-height: 52px !important;
  padding: 0.85rem 3.25rem 0.85rem 1rem !important;
}

html body.page-node-type-blog #wrapper .post-body .faq-accordion dt.faq-question.is-open,
html body.page-node-type-blog #wrapper .post-body dl.faq-list dt.faq-question.is-open,
html body.page-node-type-blog #wrapper .post-body .faq-accordion dt.faq-question[aria-expanded='true'],
html body.page-node-type-blog #wrapper .post-body dl.faq-list dt.faq-question[aria-expanded='true'] {
  border-radius: 12px 12px 6px 6px !important;
  margin-bottom: 0.35rem !important;
}

html body.page-node-type-blog #wrapper .post-body .faq-accordion dd.faq-answer,
html body.page-node-type-blog #wrapper .post-body dl.faq-list dd.faq-answer {
  background: #faf5ff !important;
  border: 1px solid #e9d5ff !important;
  border-left: 4px solid #9d4edd !important;
  border-radius: 6px 6px 12px 12px !important;
  margin: 0 0 0.75rem !important;
  padding: 1rem 1.1rem !important;
}

@media (max-width: 767.98px) {
  html body.page-node-type-blog #wrapper .post-body .faq-accordion dt.faq-question,
  html body.page-node-type-blog #wrapper .post-body dl.faq-list dt.faq-question {
    border-radius: 10px !important;
    margin-bottom: 0.55rem !important;
    min-height: 48px !important;
    padding: 0.75rem 2.85rem 0.75rem 0.85rem !important;
  }

  html body.page-node-type-blog #wrapper .post-body .faq-accordion dd.faq-answer,
  html body.page-node-type-blog #wrapper .post-body dl.faq-list dd.faq-answer {
    padding: 0.85rem 0.9rem !important;
  }
}

/* Full-width question bars and circular controls mirror the reference FAQ. */
html body.page-node-type-blog #wrapper .post-body .faq-section {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

html body.page-node-type-blog #wrapper .post-body .faq-accordion,
html body.page-node-type-blog #wrapper .post-body .faq-accordion dl.faq-list {
  box-sizing: border-box !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  max-width: none !important;
  width: 100% !important;
}

html body.page-node-type-blog #wrapper .post-body .faq-accordion dl.faq-list {
  margin-bottom: 0 !important;
  margin-top: 0 !important;
}

html body.page-node-type-blog #wrapper .post-body .faq-accordion dt.faq-question,
html body.page-node-type-blog #wrapper .post-body dl.faq-list dt.faq-question {
  align-items: center !important;
  background: linear-gradient(125deg, #3b0a5c 0%, #6716aa 72%, #7b2cbf 100%) !important;
  border: 1px solid #3b0a5c !important;
  border-radius: 12px !important;
  box-shadow: 0 7px 18px rgba(59, 10, 92, 0.16) !important;
  display: flex !important;
  margin: 0 0 0.65rem !important;
  min-height: 52px !important;
  padding: 0.8rem 3.5rem 0.8rem 1rem !important;
  width: 100% !important;
}

html body.page-node-type-blog #wrapper .post-body .faq-accordion dt.faq-question p,
html body.page-node-type-blog #wrapper .post-body dl.faq-list dt.faq-question p {
  flex: 1 1 auto !important;
  min-width: 0 !important;
}

html body.page-node-type-blog #wrapper .post-body .faq-accordion dt.faq-question::after,
html body.page-node-type-blog #wrapper .post-body dl.faq-list dt.faq-question::after {
  align-items: center !important;
  background: #ca9ef9 !important;
  border: 2px solid #9d4edd !important;
  border-radius: 50% !important;
  box-shadow: 0 3px 9px rgba(59, 10, 92, 0.24) !important;
  box-sizing: border-box !important;
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  content: '+' !important;
  display: flex !important;
  font-size: 1.3rem !important;
  font-weight: 800 !important;
  height: 32px !important;
  justify-content: center !important;
  line-height: 1 !important;
  right: 0.85rem !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  text-shadow: none !important;
  transition: background-color 160ms ease, border-color 160ms ease, color 160ms ease, box-shadow 160ms ease !important;
  width: 32px !important;
}

html body.page-node-type-blog #wrapper .post-body .faq-accordion dt.faq-question:is(.is-open, [aria-expanded='true']),
html body.page-node-type-blog #wrapper .post-body dl.faq-list dt.faq-question:is(.is-open, [aria-expanded='true']) {
  border-color: #9d4edd !important;
  border-radius: 12px 12px 8px 8px !important;
  box-shadow: 0 10px 24px rgba(59, 10, 92, 0.24), 0 0 0 3px rgba(157, 78, 221, 0.18) !important;
}

html body.page-node-type-blog #wrapper .post-body .faq-accordion dt.faq-question:is(.is-open, [aria-expanded='true'])::after,
html body.page-node-type-blog #wrapper .post-body dl.faq-list dt.faq-question:is(.is-open, [aria-expanded='true'])::after {
  background: #9d4edd !important;
  border-color: #f3e8ff !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  content: '\2212' !important;
  transform: translateY(-50%) !important;
}

html body.page-node-type-blog #wrapper .post-body .faq-accordion dt.faq-question:is(:hover, :focus-visible),
html body.page-node-type-blog #wrapper .post-body dl.faq-list dt.faq-question:is(:hover, :focus-visible) {
  border-color: #9d4edd !important;
  box-shadow: 0 10px 24px rgba(59, 10, 92, 0.25), 0 0 0 3px rgba(157, 78, 221, 0.2) !important;
}

html body.page-node-type-blog #wrapper .post-body .faq-accordion dt.faq-question:not(.is-open):is(:hover, :focus-visible)::after,
html body.page-node-type-blog #wrapper .post-body dl.faq-list dt.faq-question:not(.is-open):is(:hover, :focus-visible)::after {
  background: #faf5ff !important;
  border-color: #6716aa !important;
  box-shadow: 0 4px 12px rgba(59, 10, 92, 0.3) !important;
}

@media (max-width: 767.98px) {
  html body.page-node-type-blog #wrapper .post-body .faq-accordion dt.faq-question,
  html body.page-node-type-blog #wrapper .post-body dl.faq-list dt.faq-question {
    min-height: 50px !important;
    padding: 0.75rem 3.15rem 0.75rem 0.85rem !important;
  }

  html body.page-node-type-blog #wrapper .post-body .faq-accordion dt.faq-question::after,
  html body.page-node-type-blog #wrapper .post-body dl.faq-list dt.faq-question::after {
    height: 30px !important;
    right: 0.7rem !important;
    width: 30px !important;
  }
}

/* assets/css/high-intent-cta.css */
/**
 * High-intent CTA — match /automotive-services "View this package" pills.
 * Loaded last via martis_get_late_theme_css() so this beats Custom CSS,
 * chrome-layout-fix, slide-additional-content, and deal-499-form.
 *
 * Tokens (do not drift from hub service-card-cta strong):
 *   fill:    linear-gradient(180deg, #9b4dd4 0%, #6716aa 55%, #3b0a5c 100%)
 *   border:  2px solid #000
 *   radius:  999px
 *   type:    #fff / 800
 *   depth:   0 3px 0 #000, 0 8px 18px rgba(123, 44, 191, 0.35)
 */

/* -------------------------------------------------------------------------- */
/* Shared visual                                                              */
/* -------------------------------------------------------------------------- */

html body .slide-additional-content a.slide-seo-cta,
html body .slide-additional-content a.button.slide-seo-cta,
html body .slide-additional-content a.button.btn-lg.slide-seo-cta,
html body.page-node-type-slide .slide-additional-content a.slide-seo-cta,
html body.page-node-type-slide .slide-additional-content a.button.btn-lg,
html body.path-frontpage .slide-additional-content a.slide-seo-cta,
html body.page-houston-tx .slide-additional-content a.slide-seo-cta,
html body.page-katy-tx .slide-additional-content a.slide-seo-cta,
html body.page-cypress-tx .slide-additional-content a.slide-seo-cta,
html body.page-spring-tx .slide-additional-content a.slide-seo-cta,
html body.page-tomball-tx .slide-additional-content a.slide-seo-cta,
html body.page-jersey-village-tx .slide-additional-content a.slide-seo-cta,
html body .slide-carousel a.button.slide-button-link,
html body .hero.slide-carousel a.button.slide-button-link,
html body.page-node-type-slide a.button.slide-button-link,
html body.path-frontpage .slide-carousel a.button.slide-button-link,
html body.page-houston-tx .slide-carousel a.button.slide-button-link,
html body.page-katy-tx .slide-carousel a.button.slide-button-link,
html body.page-cypress-tx .slide-carousel a.button.slide-button-link,
html body.page-spring-tx .slide-carousel a.button.slide-button-link,
html body.page-tomball-tx .slide-carousel a.button.slide-button-link,
html body.page-jersey-village-tx .slide-carousel a.button.slide-button-link,
html body.cyb-form-landing .webform-button--submit,
html body.cyb-form-landing .webform-button--next,
html body.cyb-form-landing .webform-button--previous,
html body.cyb-form-landing .webform-button--draft,
html body.cyb-form-landing .webform-button--preview,
html body.cyb-form-landing .webform-ajax-form-wrapper input.webform-button--submit,
html body.cyb-form-landing .webform-ajax-form-wrapper input.webform-button--next,
html body.cyb-form-landing .webform-ajax-form-wrapper input.webform-button--previous,
html body.cyb-form-landing .webform-ajax-form-wrapper input.webform-button--draft,
html body.cyb-form-landing .webform-ajax-form-wrapper input.webform-button--preview,
html body.cyb-form-landing form.webform-submission-form input.webform-button--submit,
html body.cyb-form-landing form.webform-submission-form input.webform-button--next,
html body.cyb-form-landing form.webform-submission-form input.webform-button--previous,
html body.cyb-form-landing form.webform-submission-form input.webform-button--draft,
html body.cyb-form-landing form.webform-submission-form input.webform-button--preview,
html body .webform-submission-form .webform-button--submit,
html body .webform-submission-form .webform-button--next,
html body .webform-submission-form .webform-button--previous,
html body .webform-submission-form .webform-button--draft,
html body .webform-submission-form .webform-button--preview,
html body.path-blog .blog-post-teaser a.read-more,
html body.path-blog .blog-post-teaser .post-link .read-more,
html body.page-blog .blog-post-teaser a.read-more,
html body.path-taxonomy.page-blog-category .blog-post-teaser a.read-more,
html body.path-taxonomy.vocabulary-category .blog-post-teaser a.read-more,
html body.path-taxonomy.page-blog-tag .blog-post-teaser a.read-more,
html body.path-taxonomy.vocabulary-tags .blog-post-teaser a.read-more,
html body.path-blog.page-blog #wrapper .region.region-content .blog-listing-intro p.blog-listing-intro__actions a.blog-term-index-back-btn,
html body.path-blog.page-blog #wrapper .view-blog .blog-listing-intro p.blog-listing-intro__actions a.blog-term-index-back-btn,
html body.path-blog.page-blog #wrapper .region.region-content .blog-listing-intro a.blog-term-index-back-btn,
html body.path-blog.page-blog #wrapper .blog-listing-intro a.blog-term-index-back-btn,
html body.path-blog.page-blog #wrapper .blog-listing-intro__actions a.blog-term-index-back-btn,
html body.path-blog.page-blog #wrapper .blog-listing-intro__actions a,
html body.page-blog-term-index #wrapper .blog-term-index-cue,
html body.page-blog-term-index #wrapper .blog-term-index-card .blog-term-index-cue,
html body.path-products #wrapper .product-teaser-learn-more,
html body.path-products #wrapper .btn.product-teaser-learn-more,
html body.path-products #wrapper a.btn.btn-outline-primary.product-teaser-learn-more,
html body.path-products #wrapper .product-teaser-actions a.product-teaser-learn-more,
html body.path-products #wrapper .product-select a.button,
html body.path-taxonomy #wrapper .product-teaser-learn-more,
html body.path-taxonomy #wrapper .btn.product-teaser-learn-more,
html body.path-taxonomy #wrapper a.btn.btn-outline-primary.product-teaser-learn-more,
html body.path-taxonomy #wrapper .product-teaser-actions a.product-teaser-learn-more,
html body.path-taxonomy #wrapper .product-select a.button,
html body.path-product #wrapper .product-post .product-add-cart .button--add-to-cart,
html body.path-product #wrapper .product-post .product-add-cart .button--primary,
html body.path-product #wrapper .product-post .product-add-cart input.form-submit,
html body.path-product #wrapper .product-post .product-add-cart button[type="submit"],
html body.path-product #wrapper .commerce-order-item-add-to-cart-form input.button--add-to-cart,
html body.path-product #wrapper .product-teaser-learn-more,
html body.path-product #wrapper .btn.product-teaser-learn-more,
html body.path-products #wrapper #block-martis-exposedformproduct-catalogproduct-catalog-search .form-submit,
html body.path-taxonomy #wrapper #block-martis-exposedformproduct-catalogproduct-catalog-search .form-submit,
html body.path-product #wrapper #block-martis-exposedformproduct-catalogproduct-catalog-search .form-submit,
html body.path-products #wrapper #views-exposed-form-product-catalog-product-catalog-search input.form-submit,
html body.path-taxonomy #wrapper #views-exposed-form-product-catalog-product-catalog-search input.form-submit,
html body.path-product #wrapper #views-exposed-form-product-catalog-product-catalog-search input.form-submit,
html body.path-products #wrapper .views-exposed-form input.form-submit,
html body.path-taxonomy #wrapper .views-exposed-form input.form-submit,
html body.path-product #wrapper .views-exposed-form input.form-submit,
html body.path-blog #wrapper #views-exposed-form-blog-search-blog-search .form-submit,
html body.path-taxonomy #wrapper #views-exposed-form-blog-search-blog-search .form-submit {
  -webkit-appearance: none !important;
  appearance: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.35rem !important;
  width: auto !important;
  min-width: min(100%, 12.5rem) !important;
  max-width: 100% !important;
  min-height: 2.85rem !important;
  margin: 0 !important;
  padding: 0rem 1.35rem !important;
  border: 2px solid #000 !important;
  border-radius: 999px !important;
  background: linear-gradient(180deg, #9b4dd4 0%, #6716aa 55%, #3b0a5c 100%) !important;
  background-color: #7b2cbf !important;
  background-image: linear-gradient(180deg, #9b4dd4 0%, #6716aa 55%, #3b0a5c 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-family: var(--jd-font-display) !important;
  font-size: 0.8rem !important;
  font-weight: 800 !important;
  font-style: normal !important;
  letter-spacing: 0.02em !important;
  line-height: 1.2 !important;
  text-align: center !important;
  text-decoration: none !important;
  text-transform: none !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.35) !important;
  white-space: normal !important;
  word-break: break-word !important;
  box-shadow:
    0 3px 0 #000,
    0 8px 18px rgba(123, 44, 191, 0.35) !important;
  cursor: pointer !important;
  visibility: visible !important;
  opacity: 1 !important;
  transform: none !important;
  filter: none !important;
  transition: transform 0.15s ease, box-shadow 0.15s ease, filter 0.15s ease !important;
  box-sizing: border-box !important;
}

html body .slide-additional-content a.slide-seo-cta:hover,
html body .slide-additional-content a.button.slide-seo-cta:hover,
html body .slide-additional-content a.button.btn-lg.slide-seo-cta:hover,
html body.page-node-type-slide .slide-additional-content a.slide-seo-cta:hover,
html body.path-frontpage .slide-additional-content a.slide-seo-cta:hover,
html body.page-houston-tx .slide-additional-content a.slide-seo-cta:hover,
html body.page-katy-tx .slide-additional-content a.slide-seo-cta:hover,
html body.page-cypress-tx .slide-additional-content a.slide-seo-cta:hover,
html body.page-spring-tx .slide-additional-content a.slide-seo-cta:hover,
html body.page-tomball-tx .slide-additional-content a.slide-seo-cta:hover,
html body.page-jersey-village-tx .slide-additional-content a.slide-seo-cta:hover,
html body .slide-carousel a.button.slide-button-link:hover,
html body .hero.slide-carousel a.button.slide-button-link:hover,
html body.page-node-type-slide a.button.slide-button-link:hover,
html body.path-frontpage .slide-carousel a.button.slide-button-link:hover,
html body.page-houston-tx .slide-carousel a.button.slide-button-link:hover,
html body.page-katy-tx .slide-carousel a.button.slide-button-link:hover,
html body.page-cypress-tx .slide-carousel a.button.slide-button-link:hover,
html body.page-spring-tx .slide-carousel a.button.slide-button-link:hover,
html body.page-tomball-tx .slide-carousel a.button.slide-button-link:hover,
html body.page-jersey-village-tx .slide-carousel a.button.slide-button-link:hover,
html body.cyb-form-landing .webform-button--submit:hover,
html body.cyb-form-landing .webform-button--next:hover,
html body.cyb-form-landing .webform-button--previous:hover,
html body.cyb-form-landing .webform-button--draft:hover,
html body.cyb-form-landing .webform-button--preview:hover,
html body.cyb-form-landing .webform-ajax-form-wrapper input.webform-button--submit:hover,
html body.cyb-form-landing .webform-ajax-form-wrapper input.webform-button--next:hover,
html body.cyb-form-landing .webform-ajax-form-wrapper input.webform-button--previous:hover,
html body.cyb-form-landing .webform-ajax-form-wrapper input.webform-button--draft:hover,
html body.cyb-form-landing .webform-ajax-form-wrapper input.webform-button--preview:hover,
html body .webform-submission-form .webform-button--submit:hover,
html body .webform-submission-form .webform-button--next:hover,
html body .webform-submission-form .webform-button--previous:hover,
html body .webform-submission-form .webform-button--draft:hover,
html body .webform-submission-form .webform-button--preview:hover,
html body.path-blog.page-blog #wrapper .region.region-content .blog-listing-intro p.blog-listing-intro__actions a.blog-term-index-back-btn:hover,
html body.path-blog.page-blog #wrapper .blog-listing-intro__actions a.blog-term-index-back-btn:hover,
html body.page-blog-term-index #wrapper .blog-term-index-cue:hover,
html body.path-products #wrapper .product-teaser-learn-more:hover,
html body.path-products #wrapper .btn.product-teaser-learn-more:hover,
html body.path-products #wrapper a.btn.btn-outline-primary.product-teaser-learn-more:hover,
html body.path-products #wrapper .product-select a.button:hover,
html body.path-taxonomy #wrapper .product-teaser-learn-more:hover,
html body.path-taxonomy #wrapper .btn.product-teaser-learn-more:hover,
html body.path-taxonomy #wrapper .product-select a.button:hover,
html body.path-product #wrapper .product-post .product-add-cart .button--add-to-cart:hover,
html body.path-product #wrapper .product-post .product-add-cart .button--primary:hover,
html body.path-product #wrapper .product-post .product-add-cart input.form-submit:hover,
html body.path-product #wrapper .commerce-order-item-add-to-cart-form input.button--add-to-cart:hover,
html body.path-product #wrapper .product-teaser-learn-more:hover,
html body.path-products #wrapper #block-martis-exposedformproduct-catalogproduct-catalog-search .form-submit:hover,
html body.path-taxonomy #wrapper #block-martis-exposedformproduct-catalogproduct-catalog-search .form-submit:hover,
html body.path-product #wrapper #block-martis-exposedformproduct-catalogproduct-catalog-search .form-submit:hover,
html body.path-products #wrapper #views-exposed-form-product-catalog-product-catalog-search input.form-submit:hover,
html body.path-taxonomy #wrapper #views-exposed-form-product-catalog-product-catalog-search input.form-submit:hover,
html body.path-products #wrapper .views-exposed-form input.form-submit:hover,
html body.path-product #wrapper .views-exposed-form input.form-submit:hover,
html body.path-blog #wrapper #views-exposed-form-blog-search-blog-search .form-submit:hover,
html body.path-taxonomy #wrapper #views-exposed-form-blog-search-blog-search .form-submit:hover,
html body .slide-additional-content a.slide-seo-cta:focus-visible,
html body .slide-carousel a.button.slide-button-link:focus-visible,
html body.cyb-form-landing .webform-button--submit:focus-visible,
html body.cyb-form-landing .webform-button--next:focus-visible,
html body.cyb-form-landing .webform-button--previous:focus-visible,
html body.cyb-form-landing .webform-button--draft:focus-visible,
html body.cyb-form-landing .webform-button--preview:focus-visible,
html body.path-blog.page-blog #wrapper .blog-listing-intro__actions a.blog-term-index-back-btn:focus-visible,
html body.path-products #wrapper .product-teaser-learn-more:focus-visible,
html body.path-product #wrapper .product-post .product-add-cart .button--add-to-cart:focus-visible {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  background: linear-gradient(180deg, #a855f7 0%, #7b2cbf 50%, #6716aa 100%) !important;
  background-image: linear-gradient(180deg, #a855f7 0%, #7b2cbf 50%, #6716aa 100%) !important;
  filter: brightness(1.05) !important;
  transform: translateY(-2px) scale(1.03) !important;
  box-shadow:
    0 4px 0 #000,
    0 12px 22px rgba(123, 44, 191, 0.45) !important;
  text-decoration: none !important;
}

html body .slide-additional-content a.slide-seo-cta:active,
html body .slide-carousel a.button.slide-button-link:active,
html body.page-node-type-slide a.button.slide-button-link:active,
html body.cyb-form-landing .webform-button--submit:active,
html body.cyb-form-landing .webform-button--next:active,
html body.cyb-form-landing .webform-button--previous:active,
html body.cyb-form-landing .webform-button--draft:active,
html body.cyb-form-landing .webform-button--preview:active,
html body .webform-submission-form .webform-button--submit:active,
html body .webform-submission-form .webform-button--next:active,
html body .webform-submission-form .webform-button--previous:active,
html body .webform-submission-form .webform-button--draft:active,
html body .webform-submission-form .webform-button--preview:active,
html body.path-blog .blog-post-teaser a.read-more:active,
html body.path-blog.page-blog #wrapper .blog-listing-intro__actions a.blog-term-index-back-btn:active,
html body.page-blog-term-index #wrapper .blog-term-index-cue:active,
html body.path-products #wrapper .product-teaser-learn-more:active,
html body.path-taxonomy #wrapper .product-teaser-learn-more:active,
html body.path-product #wrapper .product-post .product-add-cart .button--add-to-cart:active {
  transform: translateY(1px) scale(1) !important;
  box-shadow:
    0 1px 0 #000,
    0 4px 10px rgba(123, 44, 191, 0.28) !important;
}

html body .slide-additional-content a.slide-seo-cta:focus-visible,
html body .slide-carousel a.button.slide-button-link:focus-visible,
html body.cyb-form-landing .webform-button--submit:focus-visible,
html body.cyb-form-landing .webform-button--next:focus-visible,
html body.cyb-form-landing .webform-button--previous:focus-visible,
html body.cyb-form-landing .webform-button--draft:focus-visible,
html body.cyb-form-landing .webform-button--preview:focus-visible,
html body.path-blog .blog-post-teaser a.read-more:focus-visible,
html body.path-blog.page-blog #wrapper .blog-listing-intro__actions a.blog-term-index-back-btn:focus-visible,
html body.page-blog-term-index #wrapper .blog-term-index-card a:focus-visible,
html body.path-products #wrapper .product-teaser-learn-more:focus-visible,
html body.path-product #wrapper .product-post .product-add-cart .button--add-to-cart:focus-visible,
html body.path-products #wrapper #views-exposed-form-product-catalog-product-catalog-search input.form-submit:focus-visible,
html body.path-blog #wrapper #views-exposed-form-blog-search-blog-search .form-submit:focus-visible {
  outline: 3px solid #c9a227 !important;
  outline-offset: 3px !important;
}

/* -------------------------------------------------------------------------- */
/* Context tweaks                                                             */
/* -------------------------------------------------------------------------- */

html body .slide-additional-content .text-md-end a.slide-seo-cta,
html body .slide-carousel .slide-button {
  overflow: visible !important;
}

html body.path-blog .blog-post-teaser .post-link,
html body.page-blog .blog-post-teaser .post-link,
html body.path-taxonomy.page-blog-category .blog-post-teaser .post-link,
html body.path-taxonomy.vocabulary-category .blog-post-teaser .post-link,
html body.path-taxonomy.page-blog-tag .blog-post-teaser .post-link,
html body.path-taxonomy.vocabulary-tags .blog-post-teaser .post-link {
  display: flex !important;
  justify-content: center !important;
  width: 100% !important;
}

html body.path-blog.page-blog #wrapper .blog-listing-intro__actions {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 0.65rem !important;
  align-items: center !important;
}

html body.page-blog-term-index #wrapper .blog-term-index-cue-wrap,
html body.page-blog-term-index #wrapper .blog-term-index-card .views-field-nothing {
  width: 100% !important;
  margin-top: auto !important;
  padding-top: 0.85rem !important;
}

html body.page-blog-term-index #wrapper .blog-term-index-cue::after {
  content: " →" !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-weight: 800 !important;
}

html body.path-products #wrapper .product-teaser-actions,
html body.path-taxonomy #wrapper .product-teaser-actions {
  display: flex !important;
  justify-content: center !important;
  width: 100% !important;
}

html body.path-products #wrapper .product-teaser-learn-more,
html body.path-taxonomy #wrapper .product-teaser-learn-more,
html body.path-products #wrapper .product-select a.button,
html body.path-taxonomy #wrapper .product-select a.button,
html body.path-product #wrapper .product-post .product-add-cart .button--add-to-cart,
html body.path-product #wrapper .product-post .product-add-cart input.form-submit {
  width: 100% !important;
  min-width: 0 !important;
}

/* Back-to-blog on term indexes stays a ghost pill. */
html body.page-blog-term-index #wrapper .blog-term-index-back a.blog-term-index-back-btn,
html body.page-blog-term-index #wrapper .blog-term-index-intro a.blog-term-index-back-btn {
  background: #ffffff !important;
  background-image: none !important;
  color: #5b21b6 !important;
  -webkit-text-fill-color: #5b21b6 !important;
  border: 2px solid #000 !important;
  box-shadow: 0 2px 0 #000 !important;
  text-shadow: none !important;
  min-width: 0 !important;
}

html body.page-blog-term-index #wrapper .blog-term-index-back a.blog-term-index-back-btn:hover,
html body.page-blog-term-index #wrapper .blog-term-index-intro a.blog-term-index-back-btn:hover {
  background: #f3e8ff !important;
  background-image: none !important;
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  transform: translateY(-1px) !important;
  filter: none !important;
}

/* -------------------------------------------------------------------------- */
/* Mobile                                                                     */
/* -------------------------------------------------------------------------- */

@media (max-width: 767.98px) {
  html body .slide-additional-content a.slide-seo-cta,
  html body .slide-additional-content a.button.slide-seo-cta,
  html body.page-node-type-slide .slide-additional-content a.slide-seo-cta,
  html body.path-frontpage .slide-additional-content a.slide-seo-cta,
  html body[class*="page-"] .slide-additional-content a.slide-seo-cta,
  html body .slide-carousel a.button.slide-button-link,
  html body.cyb-form-landing .webform-button--submit,
  html body.cyb-form-landing .webform-button--next,
  html body.cyb-form-landing .webform-button--previous,
  html body.cyb-form-landing .webform-button--draft,
  html body.cyb-form-landing .webform-button--preview,
  html body .webform-submission-form .webform-button--submit,
  html body .webform-submission-form .webform-button--next,
  html body .webform-submission-form .webform-button--previous,
  html body .webform-submission-form .webform-button--draft,
  html body .webform-submission-form .webform-button--preview,
  html body.path-blog .blog-post-teaser a.read-more,
  html body.path-taxonomy .blog-post-teaser a.read-more,
  html body.path-blog.page-blog #wrapper .blog-listing-intro__actions a.blog-term-index-back-btn,
  html body.page-blog-term-index #wrapper .blog-term-index-cue,
  html body.path-products #wrapper .product-teaser-learn-more,
  html body.path-taxonomy #wrapper .product-teaser-learn-more,
  html body.path-products #wrapper .product-select a.button,
  html body.path-product #wrapper .product-post .product-add-cart .button--add-to-cart {
    width: 100% !important;
    min-width: 0 !important;
    padding: 0.85rem 1rem !important;
    font-size: 1.08rem !important;
  }

  html body.path-blog.page-blog #wrapper .blog-listing-intro__actions {
    flex-direction: column !important;
    align-items: stretch !important;
  }
}

html body.cyb-form-landing fieldset[data-drupal-selector="edit-how-should-we-contact-you-"],
html body.cyb-form-landing fieldset[data-drupal-selector="edit-preferred-contact"],
html body.cyb-form-landing fieldset[data-drupal-selector="edit-preferred-contact-method"],
html body.cyb-form-landing fieldset[data-drupal-selector="edit-how-should-we-contact-you-"] .fieldset-wrapper,
html body.cyb-form-landing fieldset[data-drupal-selector="edit-preferred-contact"] .fieldset-wrapper,
html body.cyb-form-landing fieldset[data-drupal-selector="edit-preferred-contact-method"] .fieldset-wrapper {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  text-align: left !important;
}

html body.cyb-form-landing div[class="js-webform-radios webform-options-display-one-column radios"],
html body.cyb-form-landing .js-webform-radios.webform-options-display-one-column.radios {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr)) !important;
  justify-items: stretch !important;
  gap: 0.55rem !important;
  width: 100% !important;
  max-width: 100% !important;
}

html body.cyb-form-landing #edit-preferred-contact-method.webform-options-display-one-column,
html body.cyb-form-landing #edit-preferred-contact-method {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

html body.cyb-form-landing div[class="js-webform-radios webform-options-display-one-column radios"] .form-item,
html body.cyb-form-landing .js-webform-radios.webform-options-display-one-column .form-item {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  flex: 1 1 0 !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  box-shadow: none !important;
}

html body.cyb-form-landing div[class="js-webform-radios webform-options-display-one-column radios"] label.option,
html body.cyb-form-landing div[class="js-webform-radios webform-options-display-one-column radios"] .control-label.option {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  box-sizing: border-box !important;
  min-height: 2.85rem !important;
  margin: 0 !important;
  padding: 0.7rem 0.75rem !important;
  background: #ffffff !important;
  border: 1px solid #c5d4cb !important;
  border-radius: 12px !important;
  color: #10231a !important;
  -webkit-text-fill-color: #10231a !important;
  font-weight: 700 !important;
}

html body.cyb-form-landing div[class="js-webform-radios webform-options-display-one-column radios"] input:checked + label.option {
  background: #6716aa !important;
  border: 2px solid #000 !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

/* Contact-method radios — last word so Custom CSS cannot flatten them */
html body.cyb-form-landing #edit-how-should-we-contact-you-,
html body.cyb-form-landing #edit-preferred-contact {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 0.55rem !important;
  width: 100% !important;
  max-width: 100% !important;
}

html body.cyb-form-landing #edit-preferred-contact-method {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 0.55rem !important;
  width: 100% !important;
  max-width: 100% !important;
}

html body.cyb-form-landing #edit-how-should-we-contact-you- input.form-radio,
html body.cyb-form-landing #edit-preferred-contact input.form-radio,
html body.cyb-form-landing #edit-preferred-contact-method input.form-radio {
  position: absolute !important;
  opacity: 0 !important;
  width: 1px !important;
  height: 1px !important;
}

html body.cyb-form-landing #edit-how-should-we-contact-you- label.option,
html body.cyb-form-landing #edit-preferred-contact label.option,
html body.cyb-form-landing #edit-preferred-contact-method label.option {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  min-height: 2.85rem !important;
  padding: 0.7rem 0.75rem !important;
  background: #ffffff !important;
  border: 1px solid #c5d4cb !important;
  border-radius: 12px !important;
  color: #10231a !important;
  -webkit-text-fill-color: #10231a !important;
  font-weight: 700 !important;
}

html body.cyb-form-landing #edit-how-should-we-contact-you- input.form-radio:checked + label,
html body.cyb-form-landing #edit-preferred-contact input.form-radio:checked + label,
html body.cyb-form-landing #edit-preferred-contact-method input.form-radio:checked + label {
  background: #6716aa !important;
  border: 2px solid #000 !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

/* Checkbox groups — same choice cards as radios (last word) */
html body.cyb-form-landing .js-webform-checkboxes,
html body.cyb-form-landing .form-checkboxes,
html body.cyb-form-landing fieldset.webform-type-checkboxes .js-webform-checkboxes,
html body.cyb-form-landing fieldset.webform-type-webform-checkboxes .js-webform-checkboxes {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)) !important;
  justify-items: stretch !important;
  gap: 0.55rem !important;
  width: 100% !important;
  max-width: 100% !important;
}

html body.cyb-form-landing .js-webform-checkboxes > .form-item,
html body.cyb-form-landing .form-checkboxes > .form-item {
  position: relative !important;
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
  background: transparent !important;
  background-color: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

html body.cyb-form-landing .js-webform-checkboxes input.form-checkbox,
html body.cyb-form-landing .form-checkboxes input.form-checkbox {
  position: absolute !important;
  opacity: 0 !important;
  width: 1px !important;
  height: 1px !important;
}

html body.cyb-form-landing .js-webform-checkboxes label.option,
html body.cyb-form-landing .form-checkboxes label.option,
html body.cyb-form-landing .js-webform-checkboxes label.control-label.option,
html body.cyb-form-landing .form-checkboxes label.control-label.option {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  box-sizing: border-box !important;
  min-height: 2.85rem !important;
  margin: 0 !important;
  padding: 0.7rem 0.75rem !important;
  background: #ffffff !important;
  border: 1px solid #c5d4cb !important;
  border-radius: 12px !important;
  color: #10231a !important;
  -webkit-text-fill-color: #10231a !important;
  font-family: var(--jd-font-display) !important;
  font-weight: 700 !important;
  text-align: center !important;
  text-shadow: none !important;
  cursor: pointer !important;
}

html body.cyb-form-landing .js-webform-checkboxes input.form-checkbox:checked + label.option,
html body.cyb-form-landing .form-checkboxes input.form-checkbox:checked + label,
html body.cyb-form-landing .js-webform-checkboxes .form-item:has(input:checked) label.option,
html body.cyb-form-landing .form-checkboxes .form-item:has(input:checked) label.option {
  background: #6716aa !important;
  border: 2px solid #000 !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  text-shadow: none !important;
}

html body.cyb-form-landing .messages.messages--error,
html body.cyb-form-landing .form-item--error-message,
html body.cyb-form-landing .form-item--error-message.alert {
  text-shadow: none !important;
  -webkit-text-stroke: 0 !important;
  font-family: var(--jd-font-display) !important;
}

html body.cyb-form-landing .form-item-terms,
html body.cyb-form-landing .js-form-item-terms,
html body.cyb-form-landing .webform-type-checkbox.form-item-terms,
html body.cyb-form-landing .fieldset-wrapper .form-item.form-item-terms,
html body.cyb-form-landing .fieldset-wrapper .js-form-item.form-item-terms,
html body.cyb-form-landing .webform-ajax-form-wrapper .form-item-terms,
html body.cyb-form-landing.path-webform .row.content-layout .fieldset-wrapper .form-item.form-item-terms,
html body.cyb-form-landing .webform-ajax-form-wrapper .fieldset-wrapper .form-item.form-item-terms,
html body.cyb-form-landing.path-webform .row.content-layout .fieldset-wrapper .js-form-item-terms {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  margin-top: 0.35rem !important;
  padding: 0.9rem 1rem 0.9rem 2.85rem !important;
  background: #ffffff !important;
  background-color: #ffffff !important;
  border: 1px solid #c5d4cb !important;
  border-radius: 12px !important;
  box-shadow: none !important;
}

html body.cyb-form-landing .form-item-terms input.form-checkbox,
html body.cyb-form-landing .js-form-item-terms input.form-checkbox {
  position: absolute !important;
  opacity: 0 !important;
  width: 1px !important;
  height: 1px !important;
}

html body.cyb-form-landing .form-item-terms label.option,
html body.cyb-form-landing .js-form-item-terms label.option,
html body.cyb-form-landing .form-item-terms label {
  display: block !important;
  width: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  color: #10231a !important;
  -webkit-text-fill-color: #10231a !important;
  font-family: var(--jd-font-display) !important;
  font-weight: 550 !important;
  line-height: 1.45 !important;
  text-align: left !important;
  text-shadow: none !important;
  box-shadow: none !important;
}

html body.cyb-form-landing .form-item-terms label::before,
html body.cyb-form-landing .js-form-item-terms label::before {
  content: "" !important;
  position: absolute !important;
  left: 1rem !important;
  top: 1.05rem !important;
  width: 1.15rem !important;
  height: 1.15rem !important;
  box-sizing: border-box !important;
  background: #ffffff !important;
  border: 1.5px solid #c5d4cb !important;
  border-radius: 4px !important;
}

html body.cyb-form-landing .form-item-terms input:checked + label::before,
html body.cyb-form-landing .js-form-item-terms input:checked + label::before {
  background: #6716aa !important;
  border: 2px solid #000 !important;
  box-shadow: inset 0 0 0 2px #ffffff !important;
}

@media (max-width: 767.98px) {
  html body.cyb-form-landing #edit-how-should-we-contact-you-,
  html body.cyb-form-landing #edit-preferred-contact,
  html body.cyb-form-landing #edit-preferred-contact-method,
  html body.cyb-form-landing .js-webform-radios,
  html body.cyb-form-landing .js-webform-checkboxes,
  html body.cyb-form-landing .form-checkboxes {
    grid-template-columns: 1fr !important;
  }
}

/* -------------------------------------------------------------------------- */
/* /form index CTAs — same high-intent pill + arrow                           */
/* -------------------------------------------------------------------------- */
html body.page-form-index #wrapper .form-index-card .form-index-cta,
html body.cyb-form-landing.page-form-index #wrapper .form-index-grid .form-index-cta,
html body.page-form-index #wrapper .jd-form-index__card .jd-form-index__cta,
html body.page-form #wrapper .jd-form-index__card .jd-form-index__cta {
  -webkit-appearance: none !important;
  appearance: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.35rem !important;
  width: auto !important;
  min-width: min(100%, 12.5rem) !important;
  max-width: 100% !important;
  min-height: 2.85rem !important;
  margin: 0.9rem 0 0 !important;
  padding: 0.75rem 1.35rem !important;
  border: 2px solid #000 !important;
  border-radius: 999px !important;
  background: linear-gradient(180deg, #9b4dd4 0%, #6716aa 55%, #3b0a5c 100%) !important;
  background-color: #7b2cbf !important;
  background-image: linear-gradient(180deg, #9b4dd4 0%, #6716aa 55%, #3b0a5c 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-family: var(--jd-font-display) !important;
  font-size: 1.05rem !important;
  font-weight: 800 !important;
  font-style: normal !important;
  letter-spacing: 0.02em !important;
  line-height: 1.2 !important;
  text-align: center !important;
  text-decoration: none !important;
  text-transform: none !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.35) !important;
  white-space: normal !important;
  box-shadow:
    0 3px 0 #000,
    0 8px 18px rgba(123, 44, 191, 0.35) !important;
  box-sizing: border-box !important;
  transition: transform 0.15s ease, box-shadow 0.15s ease, filter 0.15s ease !important;
}

html body.page-form-index #wrapper .form-index-card .form-index-cta::after,
html body.cyb-form-landing.page-form-index #wrapper .form-index-grid .form-index-cta::after,
html body.page-form-index #wrapper .jd-form-index__card .jd-form-index__cta::after,
html body.page-form #wrapper .jd-form-index__card .jd-form-index__cta::after {
  content: " →" !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-weight: 800 !important;
}

html body.page-form-index #wrapper .form-index-card:hover .form-index-cta,
html body.page-form-index #wrapper .form-index-card:focus-visible .form-index-cta,
html body.page-form-index #wrapper .jd-form-index__card:hover .jd-form-index__cta,
html body.page-form #wrapper .jd-form-index__card:hover .jd-form-index__cta {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  background: linear-gradient(180deg, #a855f7 0%, #7b2cbf 50%, #6716aa 100%) !important;
  background-image: linear-gradient(180deg, #a855f7 0%, #7b2cbf 50%, #6716aa 100%) !important;
  filter: brightness(1.05) !important;
  transform: translateY(-2px) scale(1.03) !important;
  box-shadow:
    0 4px 0 #000,
    0 12px 22px rgba(123, 44, 191, 0.45) !important;
}

@media (max-width: 767.98px) {
  html body.page-form-index #wrapper .form-index-card .form-index-cta,
  html body.cyb-form-landing.page-form-index #wrapper .form-index-grid .form-index-cta,
  html body.page-form-index #wrapper .jd-form-index__card .jd-form-index__cta,
  html body.page-form #wrapper .jd-form-index__card .jd-form-index__cta {
    width: 100% !important;
    min-width: 0 !important;
    padding: 0.85rem 1rem !important;
    font-size: 1.05rem !important;
  }
}

/* -------------------------------------------------------------------------- */
/* City + national hub consult CTA                                            */
/* -------------------------------------------------------------------------- */
html body #wrapper .hub-intro a.button.hub-intro__btn.hub-intro__btn--consult,
html body #wrapper .hub-intro a.hub-intro__btn--consult,
html body.path-taxonomy #wrapper .hub-intro a.button.hub-intro__btn--consult,
html body.page-automotive-services #wrapper .hub-intro a.button.hub-intro__btn--consult,
html body.page-marine-and-rv-services #wrapper .hub-intro a.button.hub-intro__btn--consult,
html body[class*="-automotive-services"] #wrapper .hub-intro a.button.hub-intro__btn--consult,
html body[class*="-marine-and-rv-services"] #wrapper .hub-intro a.button.hub-intro__btn--consult {
  -webkit-appearance: none !important;
  appearance: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.35rem !important;
  width: auto !important;
  min-width: min(100%, 12.5rem) !important;
  max-width: 100% !important;
  min-height: 2.85rem !important;
  margin: 0 !important;
  padding: 0.75rem 1.35rem !important;
  border: 2px solid #000 !important;
  border-radius: 999px !important;
  background: linear-gradient(180deg, #9b4dd4 0%, #6716aa 55%, #3b0a5c 100%) !important;
  background-color: #7b2cbf !important;
  background-image: linear-gradient(180deg, #9b4dd4 0%, #6716aa 55%, #3b0a5c 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-family: var(--jd-font-display) !important;
  font-size: 1.05rem !important;
  font-weight: 800 !important;
  font-style: normal !important;
  letter-spacing: 0.02em !important;
  line-height: 1.2 !important;
  text-align: center !important;
  text-decoration: none !important;
  text-transform: none !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.35) !important;
  white-space: normal !important;
  box-shadow:
    0 3px 0 #000,
    0 8px 18px rgba(123, 44, 191, 0.35) !important;
  cursor: pointer !important;
  transform: none !important;
  filter: none !important;
  transition: transform 0.15s ease, box-shadow 0.15s ease, filter 0.15s ease !important;
  box-sizing: border-box !important;
}

html body #wrapper .hub-intro a.button.hub-intro__btn.hub-intro__btn--consult::after,
html body #wrapper .hub-intro a.hub-intro__btn--consult::after,
html body.path-taxonomy #wrapper .hub-intro a.button.hub-intro__btn--consult::after,
html body.page-automotive-services #wrapper .hub-intro a.button.hub-intro__btn--consult::after,
html body.page-marine-and-rv-services #wrapper .hub-intro a.button.hub-intro__btn--consult::after,
html body[class*="-automotive-services"] #wrapper .hub-intro a.button.hub-intro__btn--consult::after,
html body[class*="-marine-and-rv-services"] #wrapper .hub-intro a.button.hub-intro__btn--consult::after {
  content: " →" !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-weight: 800 !important;
}

html body #wrapper .hub-intro a.button.hub-intro__btn.hub-intro__btn--consult:hover,
html body #wrapper .hub-intro a.hub-intro__btn--consult:hover,
html body #wrapper .hub-intro a.button.hub-intro__btn.hub-intro__btn--consult:focus-visible,
html body.path-taxonomy #wrapper .hub-intro a.button.hub-intro__btn--consult:hover,
html body.page-automotive-services #wrapper .hub-intro a.button.hub-intro__btn--consult:hover,
html body.page-marine-and-rv-services #wrapper .hub-intro a.button.hub-intro__btn--consult:hover,
html body[class*="-automotive-services"] #wrapper .hub-intro a.button.hub-intro__btn--consult:hover,
html body[class*="-marine-and-rv-services"] #wrapper .hub-intro a.button.hub-intro__btn--consult:hover {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  background: linear-gradient(180deg, #a855f7 0%, #7b2cbf 50%, #6716aa 100%) !important;
  background-image: linear-gradient(180deg, #a855f7 0%, #7b2cbf 50%, #6716aa 100%) !important;
  filter: brightness(1.05) !important;
  transform: translateY(-2px) scale(1.03) !important;
  box-shadow:
    0 4px 0 #000,
    0 12px 22px rgba(123, 44, 191, 0.45) !important;
  text-decoration: none !important;
}

html body.path-automotive-services #wrapper .hub-intro .hub-intro__links,
html body.path-marine-and-rv-services #wrapper .hub-intro .hub-intro__links,
html body[class*="-automotive-services"] #wrapper .hub-intro .hub-intro__links,
html body[class*="-marine-and-rv-services"] #wrapper .hub-intro .hub-intro__links {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  width: 100% !important;
  text-align: center !important;
}

html body.path-automotive-services #wrapper .hub-intro a.hub-intro__btn--consult,
html body.path-marine-and-rv-services #wrapper .hub-intro a.hub-intro__btn--consult,
html body[class*="-automotive-services"] #wrapper .hub-intro a.hub-intro__btn--consult,
html body[class*="-marine-and-rv-services"] #wrapper .hub-intro a.hub-intro__btn--consult {
  margin-left: auto !important;
  margin-right: auto !important;
}

@media (max-width: 767.98px) {
  html body #wrapper .hub-intro a.button.hub-intro__btn.hub-intro__btn--consult,
  html body #wrapper .hub-intro a.hub-intro__btn--consult,
  html body.path-taxonomy #wrapper .hub-intro a.button.hub-intro__btn--consult,
  html body.page-automotive-services #wrapper .hub-intro a.button.hub-intro__btn--consult,
  html body.page-marine-and-rv-services #wrapper .hub-intro a.button.hub-intro__btn--consult,
  html body[class*="-automotive-services"] #wrapper .hub-intro a.button.hub-intro__btn--consult,
  html body[class*="-marine-and-rv-services"] #wrapper .hub-intro a.button.hub-intro__btn--consult {
    width: 100% !important;
    min-width: 0 !important;
    padding: 0.85rem 1rem !important;
    font-size: 1.05rem !important;
  }

  html body #wrapper .hub-intro .hub-intro__links {
    width: 100% !important;
  }
}

html body #wrapper #content-wide-top #block-martis-exposedformblog-searchblog-search .form-submit,
html body #wrapper #content-wide-top #block-martis-exposedformproduct-catalogproduct-catalog-search .form-submit,
html body #wrapper #content-wide-top #edit-submit-blog-search,
html body #wrapper #content-wide-top [id^="edit-submit-product-catalog"] {
  min-width: 8.75rem !important;
  width: auto !important;
  max-width: none !important;
  flex-shrink: 0 !important;
}

/* -------------------------------------------------------------------------- */
/* Partners listing — consult + card CTAs (not partner nodes / slideshow)     */
/* -------------------------------------------------------------------------- */
html body.path-partners:not(.page-node-type-partners) #wrapper .partners-listing-intro .hub-intro__btn:not(.hub-intro__btn--ghost),
html body.path-partners:not(.page-node-type-partners) #wrapper .view-header .hub-intro__btn:not(.hub-intro__btn--ghost),
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) #wrapper .partners-listing-intro .hub-intro__btn:not(.hub-intro__btn--ghost),
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) #wrapper .view-header .hub-intro__btn:not(.hub-intro__btn--ghost),
html body.path-partners:not(.page-node-type-partners) #wrapper .partner-teaser__cta,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) #wrapper .partner-teaser__cta {
  -webkit-appearance: none !important;
  appearance: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.35rem !important;
  width: auto !important;
  min-width: min(100%, 12.5rem) !important;
  max-width: 100% !important;
  min-height: 2.85rem !important;
  margin: 0 !important;
  padding: 0.75rem 1.35rem !important;
  border: 2px solid #000 !important;
  border-radius: 999px !important;
  background: linear-gradient(180deg, #9b4dd4 0%, #6716aa 55%, #3b0a5c 100%) !important;
  background-color: #7b2cbf !important;
  background-image: linear-gradient(180deg, #9b4dd4 0%, #6716aa 55%, #3b0a5c 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-family: var(--jd-font-display) !important;
  font-size: 1.05rem !important;
  font-weight: 800 !important;
  font-style: normal !important;
  letter-spacing: 0.02em !important;
  line-height: 1.2 !important;
  text-align: center !important;
  text-decoration: none !important;
  text-transform: none !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.35) !important;
  white-space: normal !important;
  box-shadow:
    0 3px 0 #000,
    0 8px 18px rgba(123, 44, 191, 0.35) !important;
  cursor: pointer !important;
  transform: none !important;
  filter: none !important;
  transition: transform 0.15s ease, box-shadow 0.15s ease, filter 0.15s ease !important;
  box-sizing: border-box !important;
}

html body.path-partners:not(.page-node-type-partners) #wrapper .partner-teaser__cta,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) #wrapper .partner-teaser__cta {
  min-width: 0 !important;
  min-height: 2.5rem !important;
  margin-top: auto !important;
  padding: 0.5rem 1.15rem !important;
  font-size: 0.95rem !important;
}

html body.path-partners:not(.page-node-type-partners) #wrapper .partners-listing-intro .hub-intro__btn:not(.hub-intro__btn--ghost)::after,
html body.path-partners:not(.page-node-type-partners) #wrapper .view-header .hub-intro__btn:not(.hub-intro__btn--ghost)::after,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) #wrapper .partners-listing-intro .hub-intro__btn:not(.hub-intro__btn--ghost)::after,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) #wrapper .view-header .hub-intro__btn:not(.hub-intro__btn--ghost)::after,
html body.path-partners:not(.page-node-type-partners) #wrapper .partner-teaser__cta::after,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) #wrapper .partner-teaser__cta::after {
  content: " →" !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-weight: 800 !important;
}

html body.path-partners:not(.page-node-type-partners) #wrapper .partners-listing-intro .hub-intro__btn:not(.hub-intro__btn--ghost):hover,
html body.path-partners:not(.page-node-type-partners) #wrapper .view-header .hub-intro__btn:not(.hub-intro__btn--ghost):hover,
html body.path-partners:not(.page-node-type-partners) #wrapper .partners-listing-intro .hub-intro__btn:not(.hub-intro__btn--ghost):focus-visible,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) #wrapper .partners-listing-intro .hub-intro__btn:not(.hub-intro__btn--ghost):hover,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) #wrapper .view-header .hub-intro__btn:not(.hub-intro__btn--ghost):hover,
html body.path-partners:not(.page-node-type-partners) #wrapper .partner-teaser__cta:hover,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) #wrapper .partner-teaser__cta:hover,
html body.path-partners:not(.page-node-type-partners) #wrapper .partner-teaser__cta:focus-visible,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) #wrapper .partner-teaser__cta:focus-visible {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  background: linear-gradient(180deg, #a855f7 0%, #7b2cbf 50%, #6716aa 100%) !important;
  background-image: linear-gradient(180deg, #a855f7 0%, #7b2cbf 50%, #6716aa 100%) !important;
  filter: brightness(1.05) !important;
  transform: translateY(-2px) scale(1.03) !important;
  box-shadow:
    0 4px 0 #000,
    0 12px 22px rgba(123, 44, 191, 0.45) !important;
  text-decoration: none !important;
}

@media (max-width: 767.98px) {
  html body.path-partners:not(.page-node-type-partners) #wrapper .partners-listing-intro .hub-intro__btn:not(.hub-intro__btn--ghost),
  html body.path-partners:not(.page-node-type-partners) #wrapper .view-header .hub-intro__btn:not(.hub-intro__btn--ghost),
  html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) #wrapper .partners-listing-intro .hub-intro__btn:not(.hub-intro__btn--ghost),
  html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) #wrapper .view-header .hub-intro__btn:not(.hub-intro__btn--ghost),
  html body.path-partners:not(.page-node-type-partners) #wrapper .partner-teaser__cta,
  html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) #wrapper .partner-teaser__cta {
    width: 100% !important;
    min-width: 0 !important;
    padding: 0.85rem 1rem !important;
    font-size: 1.05rem !important;
  }
}

/* -------------------------------------------------------------------------- */
/* Product catalog sort Apply — input cannot use ::after                      */
/* -------------------------------------------------------------------------- */
html body.path-products #wrapper #views-exposed-form-product-catalog-product-catalog .form-submit,
html body.path-products #wrapper #views-exposed-form-product-catalog-product-catalog #edit-submit-product-catalog,
html body.page-products #wrapper #views-exposed-form-product-catalog-product-catalog .form-submit,
html body.path-taxonomy #wrapper #views-exposed-form-product-category-listings-page-category .form-submit,
html body.path-taxonomy #wrapper #views-exposed-form-brand-product-listings-page-brand .form-submit,
html body.path-taxonomy #wrapper .product-catalog > form.views-exposed-form:not(#views-exposed-form-product-catalog-product-catalog-search) .form-submit {
  -webkit-appearance: none !important;
  appearance: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  min-width: 8.75rem !important;
  max-width: 100% !important;
  min-height: 2.85rem !important;
  margin: 0 !important;
  padding: 0.75rem 1.35rem !important;
  border: 2px solid #000 !important;
  border-radius: 999px !important;
  background: linear-gradient(180deg, #9b4dd4 0%, #6716aa 55%, #3b0a5c 100%) !important;
  background-color: #7b2cbf !important;
  background-image: linear-gradient(180deg, #9b4dd4 0%, #6716aa 55%, #3b0a5c 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-family: var(--jd-font-display) !important;
  font-size: 1.05rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.02em !important;
  line-height: 1.2 !important;
  text-transform: none !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.35) !important;
  box-shadow:
    0 3px 0 #000,
    0 8px 18px rgba(123, 44, 191, 0.35) !important;
  cursor: pointer !important;
  transition: transform 0.15s ease, box-shadow 0.15s ease, filter 0.15s ease !important;
  box-sizing: border-box !important;
}

html body.path-products #wrapper #views-exposed-form-product-catalog-product-catalog .form-submit:hover,
html body.path-products #wrapper #views-exposed-form-product-catalog-product-catalog #edit-submit-product-catalog:hover,
html body.path-products #wrapper #views-exposed-form-product-catalog-product-catalog .form-submit:focus-visible,
html body.path-taxonomy #wrapper #views-exposed-form-product-category-listings-page-category .form-submit:hover,
html body.path-taxonomy #wrapper #views-exposed-form-brand-product-listings-page-brand .form-submit:hover,
html body.path-taxonomy #wrapper .product-catalog > form.views-exposed-form:not(#views-exposed-form-product-catalog-product-catalog-search) .form-submit:hover {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  background: linear-gradient(180deg, #a855f7 0%, #7b2cbf 50%, #6716aa 100%) !important;
  background-image: linear-gradient(180deg, #a855f7 0%, #7b2cbf 50%, #6716aa 100%) !important;
  filter: brightness(1.05) !important;
  transform: translateY(-2px) scale(1.03) !important;
  box-shadow:
    0 4px 0 #000,
    0 12px 22px rgba(123, 44, 191, 0.45) !important;
}

/* Form-landing option grids — last word on mobile */
@media (max-width: 767.98px) {
  html body.cyb-form-landing #edit-how-should-we-contact-you-,
  html body.cyb-form-landing #edit-preferred-contact,
  html body.cyb-form-landing #edit-preferred-contact-method,
  html body.cyb-form-landing #edit-preferred-contact-method.webform-options-display-one-column,
  html body.cyb-form-landing .js-webform-radios,
  html body.cyb-form-landing .js-webform-radios.webform-options-display-one-column.radios,
  html body.cyb-form-landing .js-webform-checkboxes,
  html body.cyb-form-landing .form-checkboxes,
  html body.cyb-form-landing fieldset[aria-invalid="true"] .js-webform-radios,
  html body.cyb-form-landing fieldset[aria-invalid="true"] .js-webform-checkboxes,
  html body.cyb-form-landing fieldset[aria-invalid="true"] .form-checkboxes {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 767.98px) {
  html body.path-products #wrapper #views-exposed-form-product-catalog-product-catalog .form-submit,
  html body.path-products #wrapper #views-exposed-form-product-catalog-product-catalog #edit-submit-product-catalog,
  html body.path-taxonomy #wrapper #views-exposed-form-product-category-listings-page-category .form-submit,
  html body.path-taxonomy #wrapper #views-exposed-form-brand-product-listings-page-brand .form-submit,
  html body.path-taxonomy #wrapper .product-catalog > form.views-exposed-form:not(#views-exposed-form-product-catalog-product-catalog-search) .form-submit {
    width: 100% !important;
    min-width: 0 !important;
    padding: 0.85rem 1rem !important;
    font-size: 1.05rem !important;
  }
}
@media (max-width: 1000px) {
  html body.path-products #wrapper #views-exposed-form-product-catalog-product-catalog,
  html body.page-products #wrapper #views-exposed-form-product-catalog-product-catalog,
  html body.path-taxonomy #wrapper #views-exposed-form-product-category-listings-page-category,
  html body.path-taxonomy #wrapper #views-exposed-form-brand-product-listings-page-brand,
  html body.path-products #wrapper .product-catalog > form.views-exposed-form:not(#views-exposed-form-product-catalog-product-catalog-search),
  html body.path-taxonomy #wrapper .product-catalog > form.views-exposed-form:not(#views-exposed-form-product-catalog-product-catalog-search) {
    margin-top: 1.5rem !important;
    margin-bottom: -1rem !important;
    margin-right: auto !important;
    margin-left: 0rem !important;
  }
}

/* Last-loaded: listing canvas matches /spring-tx/partners (white, not mint). */
html body.path-partners:not(.page-node-type-partners) #wrapper #main-content,
html body.path-partners:not(.page-node-type-partners) #wrapper .region.region-content,
html body.path-partners:not(.page-node-type-partners) #wrapper .main-content,
html body.path-partners:not(.page-node-type-partners) .content-layout,
html body.path-partners.page-partners #wrapper #main-content,
html body.path-partners.page-partners #wrapper .region.region-content,
html body.path-partners.page-partners #wrapper .main-content,
html body.path-partners.page-partners .content-layout,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) #wrapper #main-content,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) #wrapper .region.region-content,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) #wrapper .main-content,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .content-layout {
  background: #ffffff !important;
  background-color: #ffffff !important;
  background-image: none !important;
}

/* Last-loaded: /partners + city listings — match /spring-tx/partners 2-col + even gap. */
html body.path-partners.page-partners #wrapper .row.grid-noppading.grid-wrapper,
html body.path-partners:not(.page-node-type-partners) #wrapper .row.grid-noppading.grid-wrapper,
html body.path-partners:not(.page-node-type-partners) #wrapper .partners-listing-view .row.grid-noppading.grid-wrapper,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) #wrapper .row.grid-noppading.grid-wrapper {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  align-items: stretch !important;
  column-gap: 0px !important;
  row-gap: 0px !important;
}

html body.path-partners.page-partners #wrapper .partners-listing-col.col-12.col-sm-12.col-md-6.col-lg-4.grid-item,
html body.path-partners:not(.page-node-type-partners) #wrapper .partners-listing-col.col-12.col-sm-12.col-md-6.col-lg-4.grid-item,
html body.path-partners:not(.page-node-type-partners) #wrapper .row.grid-noppading.grid-wrapper > .grid-item,
html body.path-partners.page-partners #wrapper .row.grid-noppading.grid-wrapper > .grid-item,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) #wrapper .partners-listing-col.col-12.col-sm-12.col-md-6.col-lg-4.grid-item,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) #wrapper .row.grid-noppading.grid-wrapper > .grid-item {
  flex: 0 1 calc(50% - 10px) !important;
  max-width: calc(50% - 10px) !important;
  width: calc(50% - 10px) !important;
  margin: 0 !important;
  padding: 0 !important;
  margin-bottom: -2rem !important;
}

@media (max-width: 767.98px) {
  html body.path-partners.page-partners #wrapper .partners-listing-col.col-12.col-sm-12.col-md-6.col-lg-4.grid-item,
  html body.path-partners:not(.page-node-type-partners) #wrapper .partners-listing-col.col-12.col-sm-12.col-md-6.col-lg-4.grid-item,
  html body.path-partners:not(.page-node-type-partners) #wrapper .row.grid-noppading.grid-wrapper > .grid-item,
  html body.path-partners.page-partners #wrapper .row.grid-noppading.grid-wrapper > .grid-item,
  html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) #wrapper .partners-listing-col.col-12.col-sm-12.col-md-6.col-lg-4.grid-item,
  html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) #wrapper .row.grid-noppading.grid-wrapper > .grid-item {
    flex: 0 0 100% !important;
    max-width: 100% !important;
    width: 100% !important;
    margin-bottom: -1rem !important;
  }
}

/* Blog teaser Read more — hover keeps the rest-state fill (no mint / no brighter gradient). */
html body.path-blog .blog-post-teaser a.read-more:hover,
html body.path-blog .blog-post-teaser a.read-more:focus-visible,
html body.path-blog .blog-post-teaser .post-link .read-more:hover,
html body.path-blog .blog-post-teaser .post-link .read-more:focus-visible,
html body.page-blog .blog-post-teaser a.read-more:hover,
html body.page-blog .blog-post-teaser a.read-more:focus-visible,
html body.path-taxonomy.page-blog-category .blog-post-teaser a.read-more:hover,
html body.path-taxonomy.vocabulary-category .blog-post-teaser a.read-more:hover,
html body.path-taxonomy.page-blog-tag .blog-post-teaser a.read-more:hover,
html body.path-taxonomy.vocabulary-tags .blog-post-teaser a.read-more:hover,
html body.page-blog-term-archive .blog-post-teaser a.read-more:hover,
html body.page-node-type-service .blog-post-teaser a.read-more:hover,
html body.page-node-type-service .blog-post-teaser a.read-more:focus-visible,
html body.page-node-type-service .blog-post-teaser .post-link .read-more:hover,
html body.page-node-type-service [id*="views-block-blog"] a.read-more:hover,
html body.page-node-type-service [id*="views-block-blog"] .post-link .read-more:hover {
  background: linear-gradient(180deg, #9b4dd4 0%, #6716aa 55%, #3b0a5c 100%) !important;
  background-color: #7b2cbf !important;
  background-image: linear-gradient(180deg, #9b4dd4 0%, #6716aa 55%, #3b0a5c 100%) !important;
  filter: none !important;
}

html body.path-partners:not(.page-node-type-partners) .partner-teaser__summary,
html body[class*="page-"][class*="-partners"]:not(.page-node-type-partners) .partner-teaser__summary {
  background: #ffffff !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
}

/* PDP Description / Reviews stay pinned while the product body scrolls.
   overflow-x:hidden on ancestors otherwise cancels position:sticky. */
html body.path-product,
html body.path-product #wrapper,
html body.path-product #main,
html body.path-product #content,
html body.path-product .main-container,
html body.path-product .region-content,
html body.path-product .product-post,
html body.path-product .product-post.pdp-content,
html body.path-product #wrapper .product-info {
  overflow: visible !important;
}

html body.path-product #wrapper .product-post .product-info > .nav.nav-tabs,
html body.path-product #wrapper .product-post .pdp-tabs {
  position: relative !important;
  z-index: 40 !important;
}

html body.path-product #wrapper .product-post .pdp-tabs-placeholder {
  display: none;
  width: 100%;
  pointer-events: none;
}

html body.path-product #wrapper .product-post .pdp-tabs-placeholder.is-active {
  display: block !important;
}

html body.path-product #wrapper .product-post .pdp-tabs.is-stuck,
html body.path-product #wrapper .product-post .product-info > .nav.nav-tabs.is-stuck {
  position: fixed !important;
  z-index: 400 !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  max-width: 100% !important;
  overflow: hidden !important;
}

/* Vehicle photo form: agree-terms offsets (must load last). */
html body.page-form-vehicle-data-collection.cyb-form-landing.path-webform #wrapper .form-item-agree-terms,
html body.page-form-vehicle-data-collection.cyb-form-landing.path-webform #wrapper .js-form-item-agree-terms {
  overflow: visible !important;
}

html body.page-form-vehicle-data-collection.cyb-form-landing.path-webform #wrapper #edit-agree-terms,
html body.page-form-vehicle-data-collection.cyb-form-landing.path-webform #wrapper .form-item-agree-terms input.form-checkbox,
html body.page-form-vehicle-data-collection.cyb-form-landing.path-webform #wrapper .js-form-item-agree-terms input.form-checkbox {
  position: absolute !important;
  top: 2rem !important;
  left: 7rem !important;
}

html body.page-form-vehicle-data-collection.cyb-form-landing.path-webform #wrapper label[for="edit-agree-terms"],
html body.page-form-vehicle-data-collection.cyb-form-landing.path-webform #wrapper .form-item-agree-terms label.control-label.option.js-form-required.form-required {
  position: relative !important;
  top: 2rem !important;
  width: 80% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-bottom: 3rem !important;
}

@media (max-width: 767.98px) {
  html body.page-form-vehicle-data-collection.cyb-form-landing.path-webform #wrapper .js-webform-type-checkbox.form-item-agree-terms,
  html body.page-form-vehicle-data-collection.cyb-form-landing.path-webform #wrapper .form-item-agree-terms.js-form-item-agree-terms {
    top: -1rem !important;
    position: relative !important;
  }

  html body.page-form-vehicle-data-collection.cyb-form-landing.path-webform #wrapper #edit-agree-terms,
  html body.page-form-vehicle-data-collection.cyb-form-landing.path-webform #wrapper .form-item-agree-terms input.form-checkbox,
  html body.page-form-vehicle-data-collection.cyb-form-landing.path-webform #wrapper .js-form-item-agree-terms input.form-checkbox {
    top: 0 !important;
    left: 2rem !important;
  }

  html body.page-form-vehicle-data-collection.cyb-form-landing.path-webform #wrapper label[for="edit-agree-terms"],
  html body.page-form-vehicle-data-collection.cyb-form-landing.path-webform #wrapper .form-item-agree-terms label.control-label.option.js-form-required.form-required {
    position: relative !important;
    top: 3rem !important;
  }

  html body.page-form-vehicle-data-collection.cyb-form-landing.path-webform #wrapper .jd-vehicle-photos .fieldset-wrapper {
    gap: 0.2rem !important;
    margin-bottom: 4rem !important;
  }

  html body.page-form-vehicle-data-collection.cyb-form-landing.path-webform #wrapper .jd-vehicle-photos .fieldset-wrapper > *,
  html body.page-form-vehicle-data-collection.cyb-form-landing.path-webform #wrapper .jd-vehicle-photo-card,
  html body.page-form-vehicle-data-collection.cyb-form-landing.path-webform #wrapper .form-item.jd-vehicle-photo-card {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }

  html body.page-form-vehicle-data-collection.cyb-form-landing.path-webform #wrapper .jd-vehicle-photo-card,
  html body.page-form-vehicle-data-collection.cyb-form-landing.path-webform #wrapper .form-item.jd-vehicle-photo-card {
    padding-top: 0.35rem !important;
    padding-bottom: 0.35rem !important;
  }
}

html body.page-form-vehicle-data-collection.cyb-form-landing.path-webform #wrapper .jd-vehicle-photos-intro {
  margin: 0 !important;
  padding: 0 !important;
  background: none !important;
  background-color: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

html body.path-webform #wrapper .jd-form-hero,
html body.path-webform #wrapper .jd-form-hero:hover,
html body.path-webform #wrapper .jd-form-hero:focus,
html body.path-webform #wrapper .jd-form-hero:focus-within,
html body.path-webform #wrapper .jd-form-hero.animate__animated,
html body.path-webform #wrapper .jd-form-hero.animate__animated:hover {
  box-shadow: 0 18px 40px rgba(26, 10, 36, 0.08) !important;
  filter: none !important;
}

html body.path-webform #wrapper .jd-form-sell section,
html body.path-webform #wrapper .jd-form-sell section:hover,
html body.path-webform #wrapper .jd-form-sell section:focus,
html body.path-webform #wrapper .jd-form-sell section:focus-within,
html body.path-webform #wrapper .jd-form-sell section.animate__animated,
html body.path-webform #wrapper .jd-form-sell section.animate__animated:hover {
  box-shadow: 0 14px 34px rgba(26, 10, 36, 0.06) !important;
  filter: none !important;
}

html body.page-form-vehicle-data-collection #wrapper .jd-vehicle-photo-card,
html body.page-form-vehicle-data-collection #wrapper .jd-vehicle-photo-card:hover,
html body.page-form-vehicle-data-collection #wrapper .form-item.jd-vehicle-photo-card,
html body.page-form-vehicle-data-collection #wrapper .form-item.jd-vehicle-photo-card:hover {
  box-shadow: 0 10px 22px rgba(26, 10, 36, 0.06) !important;
}

html body.page-form-vehicle-data-collection.cyb-form-landing.path-webform #wrapper .jd-vehicle-photos-intro p {
  margin: 0 0 1rem !important;
}

html body.page-form-vehicle-data-collection.cyb-form-landing.path-webform #wrapper .jd-vehicle-photo-angle {
  margin-left: 0.5rem !important;
}

html body.cyb-form-landing.path-webform.page-form-99-cent-basic #wrapper #edit-agree-terms,
html body.page-form-99-cent-basic #wrapper .form-item-agree-terms input.form-checkbox {
  position: absolute !important;
  left: 1.85rem !important;
  top: 1.05rem !important;
  width: 1.15rem !important;
  height: 1.15rem !important;
  margin: 0 !important;
}

@media (max-width: 767.98px) {
  html body.cyb-form-landing.path-webform.page-form-99-cent-basic #wrapper #edit-agree-terms,
  html body.page-form-99-cent-basic #wrapper .form-item-agree-terms input.form-checkbox {
    left: 1.5rem !important;
    top: 1rem !important;
  }

  html body.cyb-form-landing.path-webform.page-form-99-cent-basic #wrapper .form-item > label,
  html body.cyb-form-landing.path-webform.page-form-99-cent-basic #wrapper .form-item .control-label:not(.option) {
    padding-bottom: 1rem !important;
  }
}

html body.path-webform #wrapper .jd-form-hero-cta,
html body.path-webform #wrapper p.jd-form-hero-cta,
html body.path-webform #wrapper .jd-form-hero-cta.animate__animated,
html body.path-webform #wrapper .jd-form-landing .jd-form-hero-cta {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
}

html body.path-webform #wrapper .js-webform-radios .form-item,
html body.path-webform #wrapper .js-webform-type-radio,
html body.path-webform #wrapper #edit-what-type-of-vehicle--wrapper .form-item.js-form-type-radio {
  border: 1px solid #e9d5ff !important;
  box-shadow: none !important;
}

html body.path-webform #wrapper .js-webform-radios label.option,
html body.path-webform #wrapper .js-webform-type-radio label.option,
html body.path-webform #wrapper #edit-what-type-of-vehicle--wrapper label.control-label.option {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  border: 1px solid transparent !important;
  box-shadow: none !important;
  outline: none !important;
}

html body.path-webform #wrapper .js-webform-radios .form-item:hover,
html body.path-webform #wrapper .js-webform-type-radio:hover {
  border-color: #c9a0e8 !important;
  box-shadow: none !important;
}

html body.path-webform #wrapper .js-webform-radios .form-item:has(input:checked),
html body.path-webform #wrapper .js-webform-type-radio:has(input:checked),
html body.path-webform #wrapper .js-webform-radios .form-item:has(input:focus-visible) {
  border: 1.5px solid #6716aa !important;
  box-shadow: none !important;
  outline: none !important;
}

html body.path-webform #wrapper input:checked + label.option,
html body.path-webform #wrapper .form-item:has(input:checked) label.option,
html body.path-webform #wrapper label.control-label.option.js-form-required.form-required,
html body.path-webform #wrapper input:checked + label.control-label.option.js-form-required.form-required,
html body.path-webform #wrapper input:focus + label.control-label.option.js-form-required.form-required,
html body.path-webform #wrapper .form-item:has(input:checked) label.control-label.option.js-form-required.form-required,
html body.path-webform #wrapper .form-item:has(input:focus) label.control-label.option.js-form-required.form-required {
  border: 0 !important;
  box-shadow: none !important;
  text-shadow: none !important;
  outline: none !important;
}

html body.path-webform #wrapper .fieldset-wrapper .form-item > label,
html body.path-webform #wrapper .fieldset-wrapper .form-item .control-label:not(.option),
html body.path-webform #wrapper .jd-vehicle-photo-card > label {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

html body.path-webform #wrapper form.webform-submission-form input[type="text"]:focus,
html body.path-webform #wrapper form.webform-submission-form input[type="email"]:focus,
html body.path-webform #wrapper form.webform-submission-form input[type="tel"]:focus,
html body.path-webform #wrapper form.webform-submission-form input[type="number"]:focus,
html body.path-webform #wrapper form.webform-submission-form textarea:focus,
html body.path-webform #wrapper form.webform-submission-form select:focus,
html body.path-webform #wrapper .webform-ajax-form-wrapper input[type="text"]:focus,
html body.path-webform #wrapper .webform-ajax-form-wrapper input[type="email"]:focus,
html body.path-webform #wrapper .webform-ajax-form-wrapper input[type="tel"]:focus,
html body.path-webform #wrapper .webform-ajax-form-wrapper input[type="number"]:focus,
html body.path-webform #wrapper .webform-ajax-form-wrapper textarea:focus,
html body.path-webform #wrapper .webform-ajax-form-wrapper select:focus {
  border: 1.5px solid #6716aa !important;
  box-shadow: 0 0 0 2px rgba(103, 22, 170, 0.16) !important;
  outline: none !important;
  background-color: #ffffff !important;
}

html body.path-webform #wrapper form.webform-submission-form input[type="radio"]:focus,
html body.path-webform #wrapper form.webform-submission-form input[type="checkbox"]:focus,
html body.path-webform #wrapper form.webform-submission-form input[type="file"]:focus,
html body.path-webform #wrapper form.webform-submission-form input[type="submit"]:focus,
html body.path-webform #wrapper .webform-ajax-form-wrapper input[type="file"]:focus {
  outline: none !important;
  box-shadow: none !important;
}

html body.path-webform #wrapper .fieldset-wrapper label,
html body.path-webform #wrapper .js-webform-radios label.option {
  -webkit-tap-highlight-color: transparent !important;
}

html body.path-webform #wrapper .form-item-agree-terms,
html body.path-webform #wrapper .js-form-item-agree-terms,
html body.page-form-vehicle-data-collection #wrapper .form-item-agree-terms,
html body.page-form-99-cent-basic #wrapper .form-item-agree-terms {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

html body.page-form-99-cent-basic #wrapper .form-item-agree-terms,
html body.page-form-99-cent-basic #wrapper .js-form-item-agree-terms {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  margin: 0 0 1rem !important;
  padding: 0.9rem 0.95rem 0.9rem 2.6rem !important;
  background: #faf5ff !important;
  border: 1.5px solid #e9d5ff !important;
  border-radius: 10px !important;
}

html body.page-form-99-cent-basic #wrapper .form-item-agree-terms label,
html body.page-form-99-cent-basic #wrapper .form-item-agree-terms label.option,
html body.page-form-99-cent-basic #wrapper label[for="edit-agree-terms"] {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 0 1rem !important;
  text-align: left !important;
  justify-content: flex-start !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  font-weight: 600 !important;
  line-height: 1.45 !important;
  left: 4rem !important;
  position: relative !important;
  top: 1rem !important;
}

html body.page-form-get-in-touch #wrapper .js-webform-radios,
html body.page-form-get-in-touch #wrapper #edit-how-should-we-contact-you-,
html body.page-form-get-in-touch #wrapper #edit-preferred-contact,
html body.page-form-get-in-touch #wrapper #edit-preferred-contact-method,
html body.page-form-get-in-touch #wrapper .js-webform-checkboxes,
html body.page-form-get-in-touch #wrapper .form-item-terms,
html body.page-form-get-in-touch #wrapper .js-form-item-terms,
html body.page-form-get-in-touch #wrapper .form-item-city,
html body.page-form-get-in-touch #wrapper .js-form-item-city,
html body.page-form-get-in-touch #wrapper .form-item-city .select-wrapper,
html body.page-form-get-in-touch #wrapper .fieldset-wrapper .description {
  width: 80% !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
}

html body.page-form-get-in-touch #wrapper .js-webform-radios .form-item,
html body.page-form-get-in-touch #wrapper #edit-how-should-we-contact-you- .form-item,
html body.page-form-get-in-touch #wrapper #edit-preferred-contact .form-item,
html body.page-form-get-in-touch #wrapper #edit-preferred-contact-method .form-item {
  width: 100% !important;
  min-height: 2.85rem !important;
  border: 1.5px solid #e9d5ff !important;
  border-radius: 14px !important;
  background: #f3e8ff !important;
  box-shadow: none !important;
}

html body.page-form-get-in-touch #wrapper .js-webform-radios .form-item:has(input:checked),
html body.page-form-get-in-touch #wrapper #edit-how-should-we-contact-you- .form-item:has(input:checked),
html body.page-form-get-in-touch #wrapper #edit-preferred-contact .form-item:has(input:checked),
html body.page-form-get-in-touch #wrapper #edit-preferred-contact-method .form-item:has(input:checked) {
  background: #6716aa !important;
  border-color: #6716aa !important;
}

html body.page-form-get-in-touch #wrapper .js-webform-radios label.option,
html body.page-form-get-in-touch #wrapper #edit-how-should-we-contact-you- label.option,
html body.page-form-get-in-touch #wrapper #edit-preferred-contact label.option,
html body.page-form-get-in-touch #wrapper #edit-preferred-contact-method label.option {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  min-height: 2.85rem !important;
  margin: 0 !important;
  padding: 0.7rem 0.75rem !important;
  text-align: center !important;
  border: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
}

html body.page-form-get-in-touch #wrapper .js-webform-radios .form-item:has(input:checked) label.option,
html body.page-form-get-in-touch #wrapper #edit-how-should-we-contact-you- input:checked + label.option,
html body.page-form-get-in-touch #wrapper #edit-preferred-contact input:checked + label.option,
html body.page-form-get-in-touch #wrapper #edit-preferred-contact-method input:checked + label.option {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  background: #6716aa !important;
  border: 0 !important;
}

html body.page-form-get-in-touch #wrapper .form-item-terms,
html body.page-form-get-in-touch #wrapper .js-form-item-terms {
  padding: 0.95rem 1rem 0.95rem 2.75rem !important;
  border: 1px solid #e9d5ff !important;
  border-radius: 14px !important;
}

html body.page-form-get-in-touch #wrapper .form-item-terms label,
html body.page-form-get-in-touch #wrapper .form-item-terms label.option {
  text-align: left !important;
  justify-content: flex-start !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
}

html body.page-form-get-in-touch #wrapper .fieldset-wrapper .form-item > label,
html body.page-form-get-in-touch #wrapper .fieldset-wrapper .form-item .control-label:not(.option) {
  display: flex !important;
  justify-content: center !important;
  text-align: center !important;
  width: 100% !important;
}

html body.path-webform #wrapper #edit-what-type-of-vehicle--wrapper > .description,
html body.path-webform #wrapper #edit-what-type-of-vehicle--description,
html body.path-webform #wrapper fieldset[data-drupal-selector="edit-what-type-of-vehicle"] > .description {
  display: none !important;
}

html body.path-webform #wrapper .form-item-agree-terms label,
html body.path-webform #wrapper .form-item-agree-terms label.option,
html body.path-webform #wrapper label[for="edit-agree-terms"] {
  text-align: left !important;
  justify-content: flex-start !important;
  display: block !important;
}

html body.path-webform #wrapper .fieldset-wrapper .description,
html body.path-webform #wrapper .form-item .description,
html body.path-webform #wrapper #edit-what-type-of-vehicle--wrapper .description {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  position: static !important;
  top: auto !important;
  text-align: left !important;
}

html body.path-webform #wrapper .form-item-what-type-of-vehicle,
html body.path-webform #wrapper .js-form-item-what-type-of-vehicle,
html body.path-webform #wrapper #edit-what-type-of-vehicle--wrapper .form-item.js-form-type-radio {
  width: 100% !important;
  min-height: 2.85rem !important;
  border: 1.5px solid #e9d5ff !important;
  border-radius: 14px !important;
  background: #f3e8ff !important;
  box-shadow: none !important;
}

html body.path-webform #wrapper .form-item-what-type-of-vehicle:hover,
html body.path-webform #wrapper .js-form-item-what-type-of-vehicle:hover {
  border-color: #c9a0e8 !important;
}

html body.path-webform.cyb-form-landing #wrapper .form-item-what-type-of-vehicle:has(input:checked),
html body.path-webform.cyb-form-landing #wrapper .js-form-item-what-type-of-vehicle:has(input:checked),
html body.page-form-vehicle-data-collection #wrapper #edit-what-type-of-vehicle--wrapper .form-item:has(input:checked),
html body.page-form-vehicle-data-collection #wrapper .js-webform-radios > .form-item:has(input:checked) {
  background: #6716aa !important;
  background-color: #6716aa !important;
  border: 1.5px solid #6716aa !important;
  box-shadow: none !important;
}

html body.path-webform #wrapper .form-item-what-type-of-vehicle label.option,
html body.path-webform #wrapper .js-form-item-what-type-of-vehicle label.option {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  min-height: 2.85rem !important;
  margin: 0 !important;
  padding: 0.7rem 0.75rem !important;
  text-align: center !important;
  border: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  font-weight: 700 !important;
}

html body.path-webform.cyb-form-landing #wrapper .form-item-what-type-of-vehicle:has(input:checked) label.option,
html body.path-webform.cyb-form-landing #wrapper .js-form-item-what-type-of-vehicle:has(input:checked) label.option,
html body.page-form-vehicle-data-collection #wrapper .form-item-what-type-of-vehicle input:checked + label.option,
html body.page-form-vehicle-data-collection #wrapper #edit-what-type-of-vehicle--wrapper .form-item:has(input:checked) label {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  background: #6716aa !important;
  border: 0 !important;
  box-shadow: none !important;
}

html body.path-webform #wrapper .form-item .select-wrapper,
html body.path-webform #wrapper .form-item-city .select-wrapper,
html body.path-webform #wrapper .js-form-item-city .select-wrapper {
  position: relative !important;
  display: block !important;
  width: 80% !important;
  max-width: 80% !important;
  margin: 0.3rem auto 0 !important;
  padding: 0 !important;
  background: #faf5ff !important;
  border: 1.5px solid #e9d5ff !important;
  border-radius: 10px !important;
  box-sizing: border-box !important;
  box-shadow: none !important;
}

html body.path-webform #wrapper .webform-ajax-form-wrapper input[type="text"],
html body.path-webform #wrapper .webform-ajax-form-wrapper input[type="email"],
html body.path-webform #wrapper .webform-ajax-form-wrapper input[type="tel"],
html body.path-webform #wrapper .webform-ajax-form-wrapper input[type="number"],
html body.path-webform #wrapper .webform-ajax-form-wrapper select,
html body.path-webform #wrapper .webform-ajax-form-wrapper textarea,
html body.path-webform #wrapper form.webform-submission-form input[type="text"],
html body.path-webform #wrapper form.webform-submission-form input[type="email"],
html body.path-webform #wrapper form.webform-submission-form input[type="tel"],
html body.path-webform #wrapper form.webform-submission-form textarea,
html body.path-webform #wrapper input[data-once="webform-disable-autosubmit"],
html body.path-webform #wrapper input[data-drupal-selector="edit-your-phone"] {
  width: 80% !important;
  max-width: 80% !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

html body.page-form-99-cent-basic #wrapper .nice-select,
html body.page-form-99-cent-basic .nice-select.form-select,
html body.page-form-99-cent-basic .nice-select.form-select.required.form-control {
  display: none !important;
}

html body.page-form-99-cent-basic #wrapper .form-item-city select,
html body.page-form-99-cent-basic #wrapper select#edit-city {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

html body.page-form-99-cent-basic #wrapper .chosen-container {
  display: none !important;
}

html body.path-webform #wrapper .nice-select.form-select.required.form-control,
html body.path-webform .nice-select.form-select.required.form-control {
  display: block !important;
  width: 80% !important;
  max-width: 80% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  border-radius: 10px !important;
  text-align: center !important;
}

html body.path-webform #wrapper .form-item .select-wrapper::after,
html body.path-webform #wrapper .form-item-city .select-wrapper::after {
  content: "" !important;
  position: absolute !important;
  top: 50% !important;
  right: 1rem !important;
  width: 0.55rem !important;
  height: 0.55rem !important;
  margin-top: -0.38rem !important;
  border-right: 2px solid #6716aa !important;
  border-bottom: 2px solid #6716aa !important;
  transform: rotate(45deg) !important;
  pointer-events: none !important;
}

html body.path-webform #wrapper .form-item .select-wrapper select,
html body.path-webform #wrapper .form-item-city select,
html body.path-webform #wrapper .js-form-item-city select {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  min-height: 3rem !important;
  margin: 0 !important;
  padding: 0.75rem 2.4rem 0.75rem 0.95rem !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 10px !important;
  box-shadow: none !important;
  color: #1a0a24 !important;
  -webkit-text-fill-color: #1a0a24 !important;
  font-family: var(--jd-font-display) !important;
  font-size: 1rem !important;
  font-weight: 600 !important;
  text-align: center !important;
  text-align-last: center !important;
}

html body.path-webform #wrapper .form-item .select-wrapper:focus-within,
html body.path-webform #wrapper .form-item-city .select-wrapper:focus-within {
  border-color: #6716aa !important;
  box-shadow: 0 0 0 2px rgba(103, 22, 170, 0.16) !important;
}

html body.path-webform #wrapper .form-item-city,
html body.path-webform #wrapper .js-form-item-city {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

html body.path-webform #wrapper .js-webform-radios .form-item label,
html body.path-webform #wrapper .js-webform-type-radio label,
html body.path-webform #wrapper .webform-options-display-one-column .form-item label,
html body.path-webform #wrapper #edit-what-type-of-vehicle--wrapper label,
html body.path-webform #wrapper fieldset[data-drupal-selector="edit-what-type-of-vehicle"] .fieldset-wrapper div label,
html body.path-webform #wrapper fieldset[data-drupal-selector="edit-how-should-we-contact-you-"] label,
html body.path-webform #wrapper .form-item.js-form-type-radio > label.option {
  width: 80% !important;
  max-width: 80% !important;
  margin-left: 2.5rem !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
}

@media (max-width: 767.98px) {
  html body.path-webform #wrapper .webform-ajax-form-wrapper,
  html body.path-webform #wrapper form.webform-submission-form {
    padding: 0 0.85rem 1.15rem !important;
  }

  html body.page-form-99-cent-basic #wrapper .form-item-agree-terms,
  html body.page-form-vehicle-data-collection #wrapper .form-item-agree-terms,
  html body.page-form-get-in-touch #wrapper .js-webform-radios,
  html body.page-form-get-in-touch #wrapper #edit-how-should-we-contact-you-,
  html body.page-form-get-in-touch #wrapper #edit-preferred-contact,
  html body.page-form-get-in-touch #wrapper #edit-preferred-contact-method,
  html body.page-form-get-in-touch #wrapper .form-item-terms,
  html body.page-form-get-in-touch #wrapper .form-item-city,
  html body.page-form-get-in-touch #wrapper .form-item-city .select-wrapper {
    width: 90% !important;
    max-width: 100% !important;
    margin-bottom: -0.5rem !important;
    margin-left: 1.75rem !important;
  }

  html body.path-webform #wrapper .webform-section-title,
  html body.path-webform #wrapper .control-label,
  html body.path-webform #wrapper legend,
  html body.path-webform #wrapper .fieldset-legend,
  html body.path-webform #wrapper .fieldset-legend.js-form-required,
  html body.path-webform #wrapper label {
    margin-left: 0 !important;
  }

  html body.path-webform #wrapper .form-item-city,
  html body.path-webform #wrapper .js-form-item-city {
    text-align: center !important;
  }

  html body.path-webform #wrapper .form-item .select-wrapper select,
  html body.path-webform #wrapper .form-item-city select {
    font-size: 16px !important;
    text-align: center !important;
    text-align-last: center !important;
  }

  html body.path-webform #wrapper .js-webform-radios .form-item label,
  html body.path-webform #wrapper .js-webform-type-radio label,
  html body.path-webform #wrapper .webform-options-display-one-column .form-item label,
  html body.path-webform #wrapper #edit-what-type-of-vehicle--wrapper label,
  html body.path-webform #wrapper fieldset[data-drupal-selector="edit-what-type-of-vehicle"] .fieldset-wrapper div label,
  html body.path-webform #wrapper fieldset[data-drupal-selector="edit-how-should-we-contact-you-"] label,
  html body.path-webform #wrapper .form-item.js-form-type-radio > label.option {
    margin-left: 0.75rem !important;
    margin-right: auto !important;
    width: 80% !important;
  }

  html body.path-webform #wrapper .form-actions {
    width: 80% !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  html body.path-webform #wrapper .nice-select.form-select.required.form-control {
    width: 80% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    border-radius: 10px !important;
  }
}

@media (max-width: 767.98px) {
  html body.path-webform #wrapper .webform-ajax-form-wrapper input[type="text"],
  html body.path-webform #wrapper .webform-ajax-form-wrapper input[type="email"],
  html body.path-webform #wrapper .webform-ajax-form-wrapper input[type="tel"],
  html body.path-webform #wrapper .webform-ajax-form-wrapper input[type="number"],
  html body.path-webform #wrapper .webform-ajax-form-wrapper select,
  html body.path-webform #wrapper .webform-ajax-form-wrapper textarea,
  html body.path-webform #wrapper form.webform-submission-form input[type="text"],
  html body.path-webform #wrapper form.webform-submission-form input[type="email"],
  html body.path-webform #wrapper form.webform-submission-form input[type="tel"],
  html body.path-webform #wrapper form.webform-submission-form input[type="number"],
  html body.path-webform #wrapper form.webform-submission-form select,
  html body.path-webform #wrapper form.webform-submission-form textarea {
    font-size: 16px !important;
  }
}

@media (max-width: 991.98px) {
  html body.page-node-type-service .block.block-layout-builder.block-field-blocknodeservicefield-teaser-icon img,
  html body.page-node-type-service .block-field-blocknodeservicefield-teaser-icon img,
  html body.page-node-type-service .layout__region--first .block-field-blocknodeservicefield-teaser-icon img {
    position: relative !important;
    left: 9rem !important;
    top: 4rem !important;
  }
}

@media (min-width: 768px) {
  html body.page-form-vehicle-data-collection.cyb-form-landing.path-webform #wrapper label[for="edit-agree-terms"],
  html body.page-form-vehicle-data-collection.cyb-form-landing.path-webform #wrapper .form-item-agree-terms label.control-label.option.js-form-required.form-required {
    position: relative !important;
    top: 2rem !important;
    width: 80% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-bottom: 3rem !important;
  }

  html body.page-form-vehicle-data-collection.cyb-form-landing.path-webform #wrapper #edit-agree-terms,
  html body.page-form-vehicle-data-collection.cyb-form-landing.path-webform #wrapper .form-item-agree-terms input.form-checkbox,
  html body.page-form-vehicle-data-collection.cyb-form-landing.path-webform #wrapper .js-form-item-agree-terms input.form-checkbox {
    position: absolute !important;
    top: 2rem !important;
    left: 7rem !important;
  }
}

@media (max-width: 767.98px) {
  html body.path-webform #wrapper .webform-section-title,
  html body.path-webform #wrapper .control-label,
  html body.path-webform #wrapper legend,
  html body.path-webform #wrapper .fieldset-legend,
  html body.path-webform #wrapper .fieldset-legend.js-form-required,
  html body.path-webform #wrapper label {
    margin-left: 0 !important;
  }

  html body.page-form-get-in-touch #wrapper .js-webform-radios,
  html body.page-form-get-in-touch #wrapper #edit-how-should-we-contact-you-,
  html body.page-form-get-in-touch #wrapper #edit-preferred-contact,
  html body.page-form-get-in-touch #wrapper #edit-preferred-contact-method,
  html body.page-form-get-in-touch #wrapper .js-webform-checkboxes,
  html body.page-form-get-in-touch #wrapper .form-item-terms,
  html body.page-form-get-in-touch #wrapper .js-form-item-terms,
  html body.page-form-get-in-touch #wrapper .form-item-city,
  html body.page-form-get-in-touch #wrapper .js-form-item-city,
  html body.page-form-get-in-touch #wrapper .form-item-city .select-wrapper,
  html body.page-form-get-in-touch #wrapper .fieldset-wrapper .description {
    width: 90% !important;
    max-width: 100% !important;
    margin-left: 1.75rem !important;
    margin-right: auto !important;
  }

  html body.path-webform #wrapper .js-webform-radios,
  html body.path-webform #wrapper div.js-webform-radios.webform-options-display-one-column.radios {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0.6rem !important;
    width: 80% !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  html body.page-form-vehicle-data-collection.cyb-form-landing.path-webform #wrapper #edit-agree-terms,
  html body.page-form-vehicle-data-collection.cyb-form-landing.path-webform #wrapper .form-item-agree-terms input.form-checkbox,
  html body.page-form-vehicle-data-collection.cyb-form-landing.path-webform #wrapper .js-form-item-agree-terms input.form-checkbox {
    top: 0 !important;
    left: 2rem !important;
  }

  html body.page-form-vehicle-data-collection.cyb-form-landing.path-webform #wrapper label[for="edit-agree-terms"],
  html body.page-form-vehicle-data-collection.cyb-form-landing.path-webform #wrapper .form-item-agree-terms label.control-label.option.js-form-required.form-required {
    position: relative !important;
    top: 3rem !important;
  }
}

html body.page-form-99-cent-basic #wrapper #edit-vehicle-ymm--description,
html body.page-form-99-cent-basic #wrapper .form-item-vehicle-ymm .webform-element-description,
html body.page-form-99-cent-basic #wrapper .form-item-vehicle-ymm .description {
  display: block !important;
  width: 100% !important;
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

html body.path-webform #wrapper .fieldset-wrapper .form-item,
html body.path-webform #wrapper .row.content-layout .fieldset-wrapper .form-item,
html body.path-webform #wrapper .form-item,
html body.path-webform.cyb-form-landing #wrapper .fieldset-wrapper .form-item,
html body.path-webform.cyb-form-landing #wrapper .form-item {
  margin-left: auto !important;
  margin-right: auto !important;
}

html body.path-webform #wrapper #edit-what-type-of-vehicle--wrapper .fieldset-wrapper {
  width: 100% !important;
}

@media (min-width: 768px) {
  html body.path-webform #wrapper .js-webform-radios,
  html body.path-webform #wrapper div.js-webform-radios.webform-options-display-one-column.radios,
  html body.path-webform #wrapper #edit-what-type-of-vehicle--wrapper .js-webform-radios,
  html body.page-form-vehicle-data-collection.path-webform #wrapper .js-webform-radios,
  html body.cyb-form-landing.path-webform #wrapper .js-webform-radios.webform-options-display-one-column.radios {
    width: 80% !important;
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    box-sizing: border-box !important;
  }
}

html body .animate__animated:not([data-cyb-done]),
html body .animate__animated:not([data-cyb-done]) *,
html body .animate__animated:not([data-cyb-done]) *::before,
html body .animate__animated:not([data-cyb-done]) *::after {
  pointer-events: none !important;
}

html body header .animate__animated,
html body header .animate__animated *,
html body .header .animate__animated,
html body .header .animate__animated *,
html body #main-menu .animate__animated,
html body #main-menu .animate__animated * {
  pointer-events: auto !important;
}

html body.path-webform .jd-deal-intro,
html body.path-webform .jd-form-intro {
  width: 97% !important;
}

@media (max-width: 767.98px) {
  html body.path-webform .jd-deal-intro,
  html body.path-webform .jd-form-intro {
    width: 85% !important;
  }
}

@media (min-width: 768px) {
  html body.path-webform #wrapper .form-item-agree-terms label,
  html body.path-webform #wrapper .form-item-agree-terms label.option,
  html body.path-webform #wrapper label[for="edit-agree-terms"] {
    text-align: left !important;
    justify-content: flex-start !important;
    display: block !important;
    left: 4rem !important;
    position: relative !important;
    top: 1rem !important;
    padding-bottom: 1rem !important;
  }

  html body.cyb-form-landing.path-webform.page-form-99-cent-basic #wrapper #edit-agree-terms,
  html body.page-form-99-cent-basic #wrapper .form-item-agree-terms input.form-checkbox {
    position: absolute !important;
    left: 1.85rem !important;
  }
}

@media (max-width: 767.98px) {
  html body.cyb-form-landing.path-webform.page-form-99-cent-basic #wrapper #edit-agree-terms,
  html body.page-form-99-cent-basic #wrapper .form-item-agree-terms input.form-checkbox {
    left: 1.5rem !important;
  }

  html body.page-form-99-cent-basic #wrapper .form-item-agree-terms label,
  html body.page-form-99-cent-basic #wrapper .form-item-agree-terms label.option,
  html body.page-form-99-cent-basic #wrapper label[for="edit-agree-terms"] {
    width: 80% !important;
  }
}

@media (min-width: 992px) {
  html body.page-node-type-service .block.block-layout-builder.block-field-blocknodeservicefield-teaser-icon img,
  html body.page-node-type-service .block-field-blocknodeservicefield-teaser-icon img,
  html body.page-node-type-service .layout__region--first .block-field-blocknodeservicefield-teaser-icon img,
  html body.page-node-type-service .service-teaser img,
  html body.page-node-type-service .field-field-teaser-icon img,
  html body.page-node-type-service .field-field-media-image img {
    position: relative !important;
    left: auto !important;
    top: -10.5rem !important;
  }
}

/* assets/css/pricing-schedule-button.css */
/**
 * Pricing package Schedule buttons — JD purple high-intent pill.
 * Beats the pricing_booking_react green accent tokens and the legacy
 * /files/schedule.png fallback graphic.
 */

/* Reveal animations disable pointer events globally while running. Keep the
 * service pricing subtree usable even if legacy animation classes remain. */
html body.path-node.page-node-type-service #wrapper .nnc-pricing-container,
html body.path-node.page-node-type-service #wrapper .nnc-pricing-container * {
  pointer-events: auto !important;
}

html body.path-node.page-node-type-service #wrapper .nnc-pricing-container:is(.animate__animated, [data-cyb-animate]),
html body.path-node.page-node-type-service #wrapper .nnc-pricing-container :is(.animate__animated, [data-cyb-animate]) {
  animation: none !important;
  transform: none !important;
  translate: none !important;
  scale: none !important;
  opacity: 1 !important;
  visibility: visible !important;
  will-change: auto !important;
}

html body.page-node-type-service #wrapper [data-pricing-booking-react],
html body.page-node-type-service #wrapper [data-pricing-booking-mount] {
  --pricing-booking-accent: #9d4edd;
  --pricing-booking-accent-strong: #3b0a5c;
  --pricing-booking-button-text: #ffffff;
  --pricing-booking-focus: #f3e8ff;
}

/* Keep the initial mobile card available before the slider script runs.
   The slider's inline display values retain ownership after initialization. */
html body.path-node.page-node-type-service #wrapper .nnc-pricing-container .mobile-tab-container .slideshow-container > :is(.mySlides, .mySlides1, .mySlides2, .mySlides3, .mySlides4):first-child {
  display: block;
}

html body.page-node-type-service #wrapper .pricing-booking-react__button,
html body.page-node-type-service #wrapper .pricing-booking-fallback {
  -webkit-appearance: none !important;
  appearance: none !important;
  align-items: center !important;
  background: linear-gradient(180deg, #9b4dd4 0%, #6716aa 55%, #3b0a5c 100%) !important;
  background-color: #7b2cbf !important;
  background-image: linear-gradient(180deg, #9b4dd4 0%, #6716aa 55%, #3b0a5c 100%) !important;
  border: 2px solid #000 !important;
  border-radius: 999px !important;
  box-shadow:
    0 3px 0 #000,
    0 8px 18px rgba(123, 44, 191, 0.35) !important;
  box-sizing: border-box !important;
  color: #ffffff !important;
  cursor: pointer !important;
  display: inline-flex !important;
  filter: none !important;
  font-family: var(--jd-font-display) !important;
  font-size: 0.95rem !important;
  font-style: normal !important;
  font-weight: 800 !important;
  gap: 0.45rem !important;
  inline-size: min(100%, 18rem) !important;
  justify-content: center !important;
  letter-spacing: 0.02em !important;
  line-height: 1.2 !important;
  max-width: 100% !important;
  min-block-size: 3.25rem !important;
  min-height: 3.25rem !important;
  padding: 0.8rem 1.4rem !important;
  text-align: center !important;
  text-decoration: none !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.35) !important;
  text-transform: none !important;
  -webkit-text-fill-color: #ffffff !important;
  transition: transform 0.15s ease, box-shadow 0.15s ease, filter 0.15s ease !important;
}

@media (hover: hover) and (pointer: fine) {
html body.page-node-type-service #wrapper .pricing-booking-react__button:hover:not(:disabled),
html body.page-node-type-service #wrapper .pricing-booking-fallback:hover:not(:disabled) {
  background: linear-gradient(180deg, #a855f7 0%, #7b2cbf 50%, #6716aa 100%) !important;
  background-image: linear-gradient(180deg, #a855f7 0%, #7b2cbf 50%, #6716aa 100%) !important;
  box-shadow:
    0 4px 0 #000,
    0 12px 22px rgba(123, 44, 191, 0.45) !important;
  color: #ffffff !important;
  filter: brightness(1.05) !important;
  text-decoration: none !important;
  transform: translateY(-2px) scale(1.03) !important;
  -webkit-text-fill-color: #ffffff !important;
}

html body.page-node-type-service #wrapper .pricing-booking-react__button:active:not(:disabled),
html body.page-node-type-service #wrapper .pricing-booking-fallback:active:not(:disabled) {
  box-shadow:
    0 1px 0 #000,
    0 4px 10px rgba(123, 44, 191, 0.3) !important;
  transform: translateY(1px) !important;
}
}

html body.page-node-type-service #wrapper .pricing-booking-react__button:focus-visible,
html body.page-node-type-service #wrapper .pricing-booking-fallback:focus-visible {
  outline: 3px solid #f3e8ff !important;
  outline-offset: 3px !important;
}

html body.page-node-type-service #wrapper .pricing-booking-react__button *,
html body.page-node-type-service #wrapper .pricing-booking-fallback * {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

html body.page-node-type-service #wrapper .pricing-booking-react__icon {
  fill: currentColor !important;
}

html body.page-node-type-service #wrapper .pricing-booking-fallback__image {
  display: none !important;
}

html body.page-node-type-service #wrapper .pricing-booking-fallback .visually-hidden {
  clip: auto !important;
  clip-path: none !important;
  height: auto !important;
  overflow: visible !important;
  position: static !important;
  width: auto !important;
  white-space: normal !important;
}

@media (max-width: 47.99rem) {
  html body.page-node-type-service #wrapper .pricing-booking-react__button,
  html body.page-node-type-service #wrapper .pricing-booking-fallback {
    inline-size: 100% !important;
    max-inline-size: 22rem !important;
    min-block-size: 3.5rem !important;
  }
}

@media (hover: none), (pointer: coarse) {
  html body.path-node.page-node-type-service #wrapper .pricing-booking-react__button,
  html body.path-node.page-node-type-service #wrapper .pricing-booking-fallback {
    transform: none !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  html body.page-node-type-service #wrapper .pricing-booking-react__button,
  html body.page-node-type-service #wrapper .pricing-booking-fallback,
  html body.page-node-type-service #wrapper .pricing-booking-react__button:hover:not(:disabled),
  html body.page-node-type-service #wrapper .pricing-booking-fallback:hover:not(:disabled),
  html body.page-node-type-service #wrapper .pricing-booking-react__button:active:not(:disabled),
  html body.page-node-type-service #wrapper .pricing-booking-fallback:active:not(:disabled) {
    transition: none !important;
    transform: none !important;
  }
}

/* assets/css/webform-modern.css */
/**
 * Johnny Detail public Webform system.
 *
 * This file is injected after Custom CSS and the shared high-intent CTA layer.
 * Keep selectors scoped to public Webform markup so Drupal administration and
 * unrelated forms retain their native presentation.
 *
 * Optional layout classes for editors:
 *   .jd-form-grid.jd-form-grid--2  Two-column layout at tablet/desktop widths.
 *   .jd-form-span-all             Span the full grid width.
 */

html body.path-webform,
html body .webform-submission-form {
  --jd-wf-deep: #3b0a5c;
  --jd-wf-purple: #6716aa;
  --jd-wf-violet: #9d4edd;
  --jd-wf-accent: #9d4edd;
  --jd-wf-accent-deep: #7b2cbf;
  --jd-wf-accent-soft: #e9d5ff;
  --jd-wf-lilac: #f3e8ff;
  --jd-wf-mist: #faf5ff;
  --jd-wf-ink: #211029;
  --jd-wf-body: #475569;
  --jd-wf-muted: #64748b;
  --jd-wf-border: #e7d4fa;
  --jd-wf-border-strong: #d7b5f3;
  --jd-wf-danger: #b4234d;
  --jd-wf-danger-soft: #fff1f5;
  --jd-wf-success: #166534;
  --jd-wf-success-soft: #f0fdf4;
  --jd-wf-shadow: 0 22px 55px rgba(59, 10, 92, 0.11);
  --jd-wf-shadow-soft: 0 12px 30px rgba(59, 10, 92, 0.075);
  --jd-wf-radius: 24px;
  --jd-wf-radius-small: 15px;
  --jd-wf-gutter: 1.5rem;
  --jd-wf-stack: 1.25rem;
  --jd-wf-label: 0.5rem;
  --jd-wf-font: var(--jd-font-text);
}

/* -------------------------------------------------------------------------- */
/* Full-page shell                                                            */
/* -------------------------------------------------------------------------- */

html body.path-webform #wrapper {
  background:
    radial-gradient(circle at 7% 10%, rgba(157, 78, 221, 0.11), transparent 26rem),
    radial-gradient(circle at 93% 4%, rgba(157, 78, 221, 0.11), transparent 29rem),
    linear-gradient(180deg, #fff 0%, #fcf9ff 38%, #f8f2ff 100%) !important;
}

html body.path-webform #wrapper .col-md-9.left-content.main-content,
html body.path-webform #wrapper .col-md-9.left-content,
html body.path-webform #wrapper .col-md-9.main-content,
html body.path-webform #wrapper .col-md-9 {
  float: none !important;
  flex: 0 0 100% !important;
  max-width: 100% !important;
  width: 100% !important;
  margin-right: auto !important;
  margin-left: auto !important;
  padding-right: 0 !important;
  padding-left: 0 !important;
}

html body.path-webform #wrapper .col-md-3.sidebar,
html body.path-webform #wrapper aside.sidebar {
  display: none !important;
}

html body.path-webform #wrapper .region-content > .block-webform,
html body.path-webform #wrapper .webform-ajax-form-wrapper,
html body.path-webform #wrapper form.webform-submission-form {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 72rem !important;
  margin-right: auto !important;
  margin-left: auto !important;
}

html body.path-webform #wrapper .webform-ajax-form-wrapper {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* The non-AJAX offer form needs the same outer spacing as AJAX webforms. */
html body.path-webform.page-form-99-cent-basic #wrapper .block-system-main-block > .container-wrap > .block-content {
  box-sizing: border-box;
  width: 100%;
  max-width: 72rem;
  margin: 0 auto 3rem;
  padding: 20px;
}

html body.path-webform #wrapper form.webform-submission-form,
html body #wrapper form.webform-submission-form.jd-public-webform {
  position: relative !important;
  isolation: isolate;
  overflow: visible !important;
  margin-top: var(--jd-wf-gutter) !important;
  margin-bottom: var(--jd-wf-gutter) !important;
  margin-right: auto !important;
  margin-left: auto !important;
  padding: 0 0 var(--jd-wf-gutter) !important;
  background: rgba(255, 255, 255, 0.97) !important;
  border: 1px solid var(--jd-wf-border) !important;
  border-radius: var(--jd-wf-radius) !important;
  box-shadow: var(--jd-wf-shadow) !important;
  color: var(--jd-wf-body) !important;
  font-family: var(--jd-wf-font) !important;
  margin-bottom: -2rem !important;
  margin-top: -0.5rem !important;
}

html body.path-webform #wrapper .row.content-layout,
html body.path-webform #wrapper .row.content-layout *,
html body.path-webform #wrapper .progress-title,
html body.path-webform #wrapper .webform-progress__status {
  text-shadow: none !important;
}

/* -------------------------------------------------------------------------- */
/* Wizard progress                                                            */
/* -------------------------------------------------------------------------- */

html body.path-webform #wrapper .webform-progress {
  margin: 0 !important;
  padding: var(--jd-wf-gutter) var(--jd-wf-gutter) var(--jd-wf-stack) !important;
  background: linear-gradient(180deg, #fff 0%, #faf5ff 100%) !important;
  border: 0 !important;
  border-bottom: 1px solid var(--jd-wf-border) !important;
}

html body.path-webform #wrapper .webform-progress-tracker,
html body.path-webform #wrapper .progress-tracker.jd-progress-tracker {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  width: 100% !important;
  max-width: 64rem !important;
  margin: 0 auto !important;
  padding: 0 !important;
  list-style: none !important;
}

html body.path-webform #wrapper .webform-progress-tracker .progress-step {
  position: relative !important;
  display: flex !important;
  flex: 1 1 0 !important;
  flex-direction: column !important;
  align-items: center !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 0.3rem !important;
  background: transparent !important;
  border: 0 !important;
  color: var(--jd-wf-muted) !important;
  text-align: center !important;
}

html body.path-webform #wrapper .webform-progress-tracker .progress-step::before {
  position: absolute !important;
  z-index: 0 !important;
  top: 1rem !important;
  right: 50% !important;
  left: -50% !important;
  height: 3px !important;
  background: #eadcf8 !important;
  border: 0 !important;
  content: "" !important;
}

html body.path-webform #wrapper .webform-progress-tracker .progress-step:first-child::before {
  display: none !important;
}

html body.path-webform #wrapper .webform-progress-tracker .progress-step.is-complete::before,
html body.path-webform #wrapper .webform-progress-tracker .progress-step.is-active::before {
  background: linear-gradient(90deg, var(--jd-wf-purple), var(--jd-wf-accent)) !important;
}

html body.path-webform #wrapper .webform-progress-tracker .progress-marker {
  position: relative !important;
  z-index: 1 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 2.05rem !important;
  min-width: 2.05rem !important;
  height: 2.05rem !important;
  margin: 0 0 0.45rem !important;
  padding: 0 !important;
  background: #fff !important;
  border: 2px solid #cfa8ed !important;
  border-radius: 50% !important;
  box-shadow: 0 3px 10px rgba(59, 10, 92, 0.08) !important;
  color: var(--jd-wf-purple) !important;
  font-size: 0.84rem !important;
  font-weight: 850 !important;
  line-height: 1 !important;
}

html body.path-webform #wrapper .webform-progress-tracker .is-active .progress-marker {
  background: linear-gradient(145deg, var(--jd-wf-deep), var(--jd-wf-purple)) !important;
  border-color: var(--jd-wf-deep) !important;
  box-shadow: 0 0 0 4px rgba(157, 78, 221, 0.17), 0 7px 16px rgba(59, 10, 92, 0.22) !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

html body.path-webform #wrapper .webform-progress-tracker .is-complete .progress-marker {
  background: var(--jd-wf-lilac) !important;
  border-color: var(--jd-wf-purple) !important;
  color: var(--jd-wf-deep) !important;
}

html body.path-webform #wrapper .webform-progress-tracker .progress-text,
html body.path-webform #wrapper .webform-progress-tracker .progress-title {
  display: block !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  color: inherit !important;
  -webkit-text-fill-color: currentColor !important;
  font-size: 0.78rem !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  overflow-wrap: anywhere !important;
}

html body.path-webform #wrapper .webform-progress-tracker .is-active .progress-title {
  color: var(--jd-wf-deep) !important;
  font-weight: 850 !important;
}

html body.path-webform #wrapper .webform-progress__status {
  display: flex !important;
  justify-content: center !important;
  margin: 0.75rem 0 0 !important;
  padding: 0 !important;
}

html body.path-webform #wrapper .webform-progress__summary {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 1.75rem !important;
  margin: 0 !important;
  padding: 0.3rem 0.8rem !important;
  background: linear-gradient(135deg, var(--jd-wf-lilac), #f3e8ff) !important;
  border: 1px solid #e6cafa !important;
  border-radius: 999px !important;
  color: var(--jd-wf-deep) !important;
  -webkit-text-fill-color: var(--jd-wf-deep) !important;
  font-size: 0.76rem !important;
  font-weight: 800 !important;
  line-height: 1 !important;
}

/* -------------------------------------------------------------------------- */
/* Page, section, and editorial cards                                         */
/* -------------------------------------------------------------------------- */

html body.path-webform #wrapper .webform-wizard-page,
html body.path-webform #wrapper form.webform-submission-form > .webform-flexbox,
html body.path-webform #wrapper form.webform-submission-form > .js-form-wrapper:not(.form-actions):not(.webform-progress) {
  box-sizing: border-box !important;
  width: 100% !important;
  margin: 0 !important;
  padding: var(--jd-wf-gutter) !important;
  background: transparent !important;
  border: 0 !important;
}

html body.path-webform #wrapper .webform-wizard-page {
  width: 100% !important;
  margin: 0 !important;
  padding: var(--jd-wf-gutter) !important;
  background: transparent !important;
  border: 0 !important;
}

html body.path-webform #wrapper .jd-form-intro,
html body.path-webform #wrapper .jd-deal-intro,
html body.path-webform #wrapper .jd-form-hero,
html body.path-webform #wrapper .jd-form-sell section,
html body.path-webform #wrapper .jd-vehicle-photos-intro {
  box-sizing: border-box !important;
  color: var(--jd-wf-body) !important;
  font-family: var(--jd-wf-font) !important;
}

html body.path-webform #wrapper .jd-form-intro,
html body.path-webform #wrapper .jd-deal-intro {
  width: 100% !important;
  max-width: 62rem !important;
  margin: 0 auto var(--jd-wf-stack) !important;
  padding: var(--jd-wf-gutter) !important;
  background:
    linear-gradient(135deg, rgba(243, 232, 255, 0.58), rgba(255, 255, 255, 0.96) 48%, rgba(233, 213, 255, 0.22)) !important;
  border: 1px solid var(--jd-wf-border) !important;
  border-radius: 21px !important;
  box-shadow: var(--jd-wf-shadow-soft) !important;
}

html body.path-webform #wrapper .jd-form-intro h1,
html body.path-webform #wrapper .jd-deal-intro h1,
html body.path-webform #wrapper .jd-form-hero h1 {
  display: block !important;
  width: 100% !important;
  margin: 0 0 0.8rem !important;
  padding: 0 !important;
  background: none !important;
  border: 0 !important;
  box-shadow: none !important;
  color: var(--jd-wf-ink) !important;
  -webkit-text-fill-color: var(--jd-wf-ink) !important;
  font-size: clamp(1.75rem, 4vw, 2.45rem) !important;
  font-weight: 850 !important;
  letter-spacing: -0.035em !important;
  line-height: 1.1 !important;
  text-align: center !important;
  text-shadow: none !important;
}

html body.path-webform #wrapper .jd-form-intro h2,
html body.path-webform #wrapper .jd-deal-intro h2,
html body.path-webform #wrapper .jd-form-sell h2,
html body.path-webform #wrapper .jd-form-sell h3 {
  display: block !important;
  margin: 0 0 0.65rem !important;
  padding: 0 !important;
  background: none !important;
  border: 0 !important;
  box-shadow: none !important;
  color: var(--jd-wf-deep) !important;
  -webkit-text-fill-color: var(--jd-wf-deep) !important;
  font-size: 1.2rem !important;
  font-weight: 820 !important;
  letter-spacing: -0.012em !important;
  line-height: 1.25 !important;
  text-align: left !important;
  text-shadow: none !important;
}

html body.path-webform #wrapper .jd-form-intro p,
html body.path-webform #wrapper .jd-form-intro li,
html body.path-webform #wrapper .jd-deal-intro p,
html body.path-webform #wrapper .jd-deal-intro li,
html body.path-webform #wrapper .jd-form-hero p,
html body.path-webform #wrapper .jd-form-sell p,
html body.path-webform #wrapper .jd-form-sell li {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: var(--jd-wf-body) !important;
  -webkit-text-fill-color: var(--jd-wf-body) !important;
  font-size: 0.98rem !important;
  line-height: 1.65 !important;
  text-shadow: none !important;
}

html body.path-webform #wrapper .jd-form-intro p,
html body.path-webform #wrapper .jd-deal-intro p {
  margin: 0 0 0.75rem !important;
  padding: 0 !important;
}

html body.path-webform #wrapper .jd-form-intro ul,
html body.path-webform #wrapper .jd-deal-intro ul {
  margin: 0.65rem 0 0.85rem 1.25rem !important;
  padding: 0 !important;
}

html body.path-webform #wrapper .jd-form-intro li,
html body.path-webform #wrapper .jd-deal-intro li {
  margin: 0 0 0.45rem !important;
  padding-left: 0.25rem !important;
}

html body.path-webform #wrapper .jd-form-intro a,
html body.path-webform #wrapper .jd-deal-intro a,
html body.path-webform #wrapper .jd-form-hero a:not(.jd-form-hero-cta a) {
  color: var(--jd-wf-purple) !important;
  -webkit-text-fill-color: var(--jd-wf-purple) !important;
  font-weight: 800 !important;
  text-decoration-thickness: 1.5px !important;
  text-underline-offset: 3px !important;
}

html body.path-webform #wrapper .jd-form-landing {
  width: 100% !important;
  max-width: none !important;
  margin: 0 0 var(--jd-wf-stack) !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

html body.path-webform #wrapper .jd-form-hero {
  width: 100% !important;
  margin: 0 0 var(--jd-wf-stack) !important;
  padding: var(--jd-wf-gutter) !important;
  background:
    radial-gradient(circle at 90% 10%, rgba(157, 78, 221, 0.16), transparent 16rem),
    linear-gradient(135deg, #fff 0%, #fbf5ff 100%) !important;
  border: 1px solid var(--jd-wf-border) !important;
  border-radius: 22px !important;
  box-shadow: var(--jd-wf-shadow-soft) !important;
  text-align: center !important;
  transform: none !important;
}

html body.path-webform #wrapper .jd-form-kicker,
html body.path-webform #wrapper .jd-vehicle-photos-kicker {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  margin: 0 0 0.8rem !important;
  padding: 0.36rem 0.8rem !important;
  background: linear-gradient(135deg, var(--jd-wf-lilac), #f3e8ff) !important;
  border: 1px solid #e6c8fa !important;
  border-radius: 999px !important;
  color: var(--jd-wf-deep) !important;
  -webkit-text-fill-color: var(--jd-wf-deep) !important;
  font-size: 0.72rem !important;
  font-weight: 850 !important;
  letter-spacing: 0.07em !important;
  line-height: 1.2 !important;
  text-transform: uppercase !important;
}

html body.path-webform #wrapper .jd-form-lead,
html body.path-webform #wrapper .jd-form-phone {
  max-width: 43rem !important;
  margin: 0 auto 0.9rem !important;
}

html body.path-webform #wrapper .jd-form-chips {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  gap: 0.55rem !important;
  margin: 0.5rem 0 1rem !important;
  padding: 0 !important;
  list-style: none !important;
}

html body.path-webform #wrapper .jd-form-chips li {
  margin: 0 !important;
  padding: 0.42rem 0.78rem !important;
  background: #fff !important;
  border: 1px solid #e5c9f8 !important;
  border-radius: 999px !important;
  box-shadow: 0 4px 12px rgba(59, 10, 92, 0.05) !important;
  color: var(--jd-wf-deep) !important;
  -webkit-text-fill-color: var(--jd-wf-deep) !important;
  font-size: 0.8rem !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  list-style: none !important;
}

html body.path-webform #wrapper .jd-form-sell {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 1rem !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

html body.path-webform #wrapper .jd-form-sell section {
  min-width: 0 !important;
  margin: 0 !important;
  padding: 1.3rem 1.35rem !important;
  background: #fff !important;
  border: 1px solid var(--jd-wf-border) !important;
  border-radius: 17px !important;
  box-shadow: 0 8px 20px rgba(59, 10, 92, 0.055) !important;
  text-align: left !important;
  transform: none !important;
}

html body.path-webform #wrapper .jd-form-sell h2 { font-size: 1.05rem !important; }
html body.path-webform #wrapper .jd-form-sell h3 { margin-bottom: 0.25rem !important; font-size: 0.92rem !important; }
html body.path-webform #wrapper .jd-form-sell p,
html body.path-webform #wrapper .jd-form-sell li { margin: 0 !important; padding: 0 !important; font-size: 0.9rem !important; }

/* -------------------------------------------------------------------------- */
/* Semantic grid and form rhythm                                              */
/* -------------------------------------------------------------------------- */

html body:not(.path-admin) #wrapper .webform-submission-form fieldset {
  min-width: 0 !important;
  margin: 0 0 var(--jd-wf-stack) !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: var(--jd-wf-ink) !important;
}

html body:not(.path-admin) #wrapper .webform-submission-form fieldset > legend {
  display: block !important;
  float: none !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 0 1.15rem !important;
  padding: 0 0 0.72rem !important;
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid var(--jd-wf-border) !important;
  color: var(--jd-wf-ink) !important;
  text-align: left !important;
}

html body:not(.path-admin) #wrapper .webform-submission-form .fieldset-legend,
html body:not(.path-admin) #wrapper .webform-submission-form fieldset > legend > span {
  display: inline !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  color: var(--jd-wf-ink) !important;
  -webkit-text-fill-color: var(--jd-wf-ink) !important;
  font-size: 1.06rem !important;
  font-weight: 820 !important;
  line-height: 1.3 !important;
  text-align: left !important;
}

html body:not(.path-admin) #wrapper .webform-submission-form .jd-form-grid.jd-form-grid--2 > .fieldset-wrapper,
html body:not(.path-admin) #wrapper .webform-submission-form .webform-wizard-page.jd-form-grid.jd-form-grid--2 {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  align-items: start !important;
  gap: var(--jd-wf-stack) !important;
}

html body:not(.path-admin) #wrapper .webform-submission-form .jd-form-grid > .fieldset-wrapper > *,
html body:not(.path-admin) #wrapper .webform-submission-form .webform-wizard-page.jd-form-grid > * { min-width: 0 !important; }

html body:not(.path-admin) #wrapper .webform-submission-form .jd-form-span-all,
html body:not(.path-admin) #wrapper .webform-submission-form .jd-form-grid > .fieldset-wrapper > .jd-form-span-all,
html body:not(.path-admin) #wrapper .webform-submission-form .webform-wizard-page.jd-form-grid > .jd-form-span-all,
html body:not(.path-admin) #wrapper .webform-submission-form .jd-form-grid > .fieldset-wrapper > fieldset.form-composite {
  grid-column: 1 / -1 !important;
}

html body:not(.path-admin) #wrapper .webform-submission-form .form-item {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 0 var(--jd-wf-stack) !important;
  padding: 0 !important;
  color: var(--jd-wf-body) !important;
}

html body:not(.path-admin) #wrapper .webform-submission-form .jd-form-grid .form-item { margin-bottom: 0 !important; }

html body:not(.path-admin) #wrapper .webform-submission-form .form-item > label:not(.option),
html body:not(.path-admin) #wrapper .webform-submission-form .form-item > .control-label:not(.option),
html body:not(.path-admin) #wrapper .webform-submission-form .webform-element-label {
  display: block !important;
  width: 100% !important;
  margin: 0 0 var(--jd-wf-label) !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  color: var(--jd-wf-ink) !important;
  -webkit-text-fill-color: var(--jd-wf-ink) !important;
  font-size: 0.94rem !important;
  font-weight: 780 !important;
  line-height: 1.35 !important;
  text-align: left !important;
  text-shadow: none !important;
}

html body:not(.path-admin) #wrapper .webform-submission-form .form-required::after {
  display: inline !important;
  width: auto !important;
  height: auto !important;
  margin: 0 0 0 0.16rem !important;
  background: none !important;
  color: var(--jd-wf-accent-deep) !important;
  content: "*" !important;
  font-size: 1em !important;
  font-weight: 900 !important;
  vertical-align: baseline !important;
}

html body:not(.path-admin) #wrapper .webform-submission-form .description,
html body:not(.path-admin) #wrapper .webform-submission-form .webform-element-description,
html body:not(.path-admin) #wrapper .webform-submission-form .form-item .help-block {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0.48rem 0 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  color: var(--jd-wf-muted) !important;
  -webkit-text-fill-color: var(--jd-wf-muted) !important;
  font-size: 0.82rem !important;
  line-height: 1.5 !important;
  text-align: left !important;
}

html body:not(.path-admin) #wrapper .webform-submission-form .description p,
html body:not(.path-admin) #wrapper .webform-submission-form .webform-element-description p {
  margin: 0 !important;
  color: inherit !important;
  font-size: inherit !important;
  line-height: inherit !important;
}

/* -------------------------------------------------------------------------- */
/* Textual controls                                                           */
/* -------------------------------------------------------------------------- */

html body:not(.path-admin) #wrapper .webform-submission-form input[type="text"],
html body:not(.path-admin) #wrapper .webform-submission-form input[type="email"],
html body:not(.path-admin) #wrapper .webform-submission-form input[type="tel"],
html body:not(.path-admin) #wrapper .webform-submission-form input[type="number"],
html body:not(.path-admin) #wrapper .webform-submission-form input[type="url"],
html body:not(.path-admin) #wrapper .webform-submission-form input[type="search"],
html body:not(.path-admin) #wrapper .webform-submission-form input[type="password"],
html body:not(.path-admin) #wrapper .webform-submission-form input[type="date"],
html body:not(.path-admin) #wrapper .webform-submission-form input[type="time"],
html body:not(.path-admin) #wrapper .webform-submission-form input[type="datetime-local"],
html body:not(.path-admin) #wrapper .webform-submission-form select,
html body:not(.path-admin) #wrapper .webform-submission-form textarea {
  -webkit-appearance: none !important;
  appearance: none !important;
  box-sizing: border-box !important;
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  min-height: 3.35rem !important;
  margin: 0 !important;
  padding: 0.82rem 1rem !important;
  background: #fff !important;
  background-image: none !important;
  border: 1.5px solid var(--jd-wf-border-strong) !important;
  border-radius: 13px !important;
  box-shadow: 0 2px 4px rgba(59, 10, 92, 0.025), inset 0 1px 2px rgba(59, 10, 92, 0.025) !important;
  color: var(--jd-wf-ink) !important;
  -webkit-text-fill-color: var(--jd-wf-ink) !important;
  caret-color: var(--jd-wf-accent-deep) !important;
  font-family: var(--jd-wf-font) !important;
  font-size: 1rem !important;
  font-weight: 550 !important;
  line-height: 1.35 !important;
  text-align: left !important;
  text-shadow: none !important;
  transition: border-color 0.18s ease, box-shadow 0.18s ease, background-color 0.18s ease !important;
}

html body:not(.path-admin) #wrapper .webform-submission-form textarea {
  min-height: 8.5rem !important;
  resize: vertical !important;
}

html body:not(.path-admin) #wrapper .webform-submission-form .select-wrapper {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
}

html body:not(.path-admin) #wrapper .webform-submission-form select {
  padding-right: 2.8rem !important;
  background-image:
    linear-gradient(45deg, transparent 50%, var(--jd-wf-purple) 50%),
    linear-gradient(135deg, var(--jd-wf-purple) 50%, transparent 50%) !important;
  background-position: calc(100% - 1.18rem) 50%, calc(100% - 0.82rem) 50% !important;
  background-repeat: no-repeat !important;
  background-size: 0.38rem 0.38rem, 0.38rem 0.38rem !important;
}

html body:not(.path-admin) #wrapper .webform-submission-form .select-wrapper::after { display: none !important; }

html body:not(.path-admin) #wrapper .webform-submission-form input::placeholder,
html body:not(.path-admin) #wrapper .webform-submission-form textarea::placeholder {
  color: #8c7b99 !important;
  -webkit-text-fill-color: #8c7b99 !important;
  opacity: 1 !important;
}

html body:not(.path-admin) #wrapper .webform-submission-form input[type="text"]:hover,
html body:not(.path-admin) #wrapper .webform-submission-form input[type="email"]:hover,
html body:not(.path-admin) #wrapper .webform-submission-form input[type="tel"]:hover,
html body:not(.path-admin) #wrapper .webform-submission-form input[type="number"]:hover,
html body:not(.path-admin) #wrapper .webform-submission-form input[type="url"]:hover,
html body:not(.path-admin) #wrapper .webform-submission-form select:hover,
html body:not(.path-admin) #wrapper .webform-submission-form textarea:hover { border-color: #c694eb !important; }

html body:not(.path-admin) #wrapper .webform-submission-form input:focus,
html body:not(.path-admin) #wrapper .webform-submission-form select:focus,
html body:not(.path-admin) #wrapper .webform-submission-form textarea:focus { outline: 0 !important; }

html body:not(.path-admin) #wrapper .webform-submission-form input[type="text"]:focus-visible,
html body:not(.path-admin) #wrapper .webform-submission-form input[type="email"]:focus-visible,
html body:not(.path-admin) #wrapper .webform-submission-form input[type="tel"]:focus-visible,
html body:not(.path-admin) #wrapper .webform-submission-form input[type="number"]:focus-visible,
html body:not(.path-admin) #wrapper .webform-submission-form input[type="url"]:focus-visible,
html body:not(.path-admin) #wrapper .webform-submission-form input[type="search"]:focus-visible,
html body:not(.path-admin) #wrapper .webform-submission-form input[type="password"]:focus-visible,
html body:not(.path-admin) #wrapper .webform-submission-form input[type="date"]:focus-visible,
html body:not(.path-admin) #wrapper .webform-submission-form input[type="time"]:focus-visible,
html body:not(.path-admin) #wrapper .webform-submission-form input[type="datetime-local"]:focus-visible,
html body:not(.path-admin) #wrapper .webform-submission-form select:focus-visible,
html body:not(.path-admin) #wrapper .webform-submission-form textarea:focus-visible {
  background: #fff !important;
  border-color: var(--jd-wf-purple) !important;
  box-shadow: 0 0 0 4px rgba(157, 78, 221, 0.2), 0 7px 20px rgba(103, 22, 170, 0.1) !important;
}

html body:not(.path-admin) #wrapper .webform-submission-form input:-webkit-autofill,
html body:not(.path-admin) #wrapper .webform-submission-form textarea:-webkit-autofill,
html body:not(.path-admin) #wrapper .webform-submission-form select:-webkit-autofill {
  -webkit-box-shadow: 0 0 0 1000px #fff inset !important;
  -webkit-text-fill-color: var(--jd-wf-ink) !important;
}

html body:not(.path-admin) #wrapper .webform-submission-form input:disabled,
html body:not(.path-admin) #wrapper .webform-submission-form select:disabled,
html body:not(.path-admin) #wrapper .webform-submission-form textarea:disabled,
html body:not(.path-admin) #wrapper .webform-submission-form input[readonly],
html body:not(.path-admin) #wrapper .webform-submission-form textarea[readonly] {
  background: #f2edf6 !important;
  border-color: #ded3e7 !important;
  color: #766b7e !important;
  -webkit-text-fill-color: #766b7e !important;
  cursor: not-allowed !important;
  opacity: 1 !important;
}

/* -------------------------------------------------------------------------- */
/* Choice cards                                                               */
/* -------------------------------------------------------------------------- */

html body:not(.path-admin) #wrapper .webform-submission-form .js-webform-radios,
html body:not(.path-admin) #wrapper .webform-submission-form .js-webform-checkboxes {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 0.75rem !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

html body.page-form-vehicle-data-collection #wrapper #edit-what-type-of-vehicle,
html body.page-form-99-cent-basic #wrapper [id^="edit-vehicle-type"] {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

html body:not(.path-admin) #wrapper .webform-submission-form .js-webform-radios .form-item,
html body:not(.path-admin) #wrapper .webform-submission-form .js-webform-checkboxes .form-item,
html body:not(.path-admin) #wrapper .webform-submission-form .form-type-radio {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

html body:not(.path-admin) #wrapper .webform-submission-form .form-type-radio input.form-radio {
  position: absolute !important;
  z-index: 1 !important;
  top: 0.8rem !important;
  left: 0.8rem !important;
  width: 1px !important;
  height: 1px !important;
  margin: 0 !important;
  padding: 0 !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

html body:not(.path-admin) #wrapper .webform-submission-form .form-type-radio label.option {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  min-height: 3.4rem !important;
  margin: 0 !important;
  padding: 0.72rem 0.9rem 0.72rem 2.75rem !important;
  background: linear-gradient(145deg, #fff 0%, #faf4ff 100%) !important;
  border: 1.5px solid var(--jd-wf-border) !important;
  border-radius: 13px !important;
  box-shadow: 0 4px 12px rgba(59, 10, 92, 0.04) !important;
  color: var(--jd-wf-deep) !important;
  -webkit-text-fill-color: var(--jd-wf-deep) !important;
  cursor: pointer !important;
  font-size: 0.91rem !important;
  font-weight: 760 !important;
  line-height: 1.3 !important;
  text-align: left !important;
  transition: border-color 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease, background 0.16s ease !important;
}

html body:not(.path-admin) #wrapper .webform-submission-form .form-type-radio label.option::before {
  position: absolute !important;
  top: 50% !important;
  left: 0.95rem !important;
  box-sizing: border-box !important;
  width: 1.18rem !important;
  height: 1.18rem !important;
  background: #fff !important;
  border: 2px solid #bd91df !important;
  border-radius: 50% !important;
  content: "" !important;
  transform: translateY(-50%) !important;
}

html body:not(.path-admin) #wrapper .webform-submission-form .form-type-radio input:checked + label.option {
  background: linear-gradient(135deg, var(--jd-wf-lilac), #f3e8ff) !important;
  border-color: var(--jd-wf-purple) !important;
  box-shadow: 0 0 0 3px rgba(157, 78, 221, 0.16), 0 8px 18px rgba(59, 10, 92, 0.09) !important;
  color: var(--jd-wf-deep) !important;
}

html body:not(.path-admin) #wrapper .webform-submission-form .form-type-radio input:checked + label.option::before {
  background: var(--jd-wf-purple) !important;
  border-color: var(--jd-wf-purple) !important;
  box-shadow: inset 0 0 0 3px #fff !important;
}

html body:not(.path-admin) #wrapper .webform-submission-form .form-type-radio input:focus-visible + label.option {
  outline: 3px solid rgba(157, 78, 221, 0.48) !important;
  outline-offset: 2px !important;
  border-color: var(--jd-wf-purple) !important;
}

@media (hover: hover) and (pointer: fine) {
  html body:not(.path-admin) #wrapper .webform-submission-form .form-type-radio label.option:hover {
    border-color: #bb80e7 !important;
    box-shadow: 0 8px 18px rgba(59, 10, 92, 0.085) !important;
    transform: translateY(-1px) !important;
  }
}

html body:not(.path-admin) #wrapper .webform-submission-form .webform-type-webform-radios-other .webform-radios-other-input,
html body:not(.path-admin) #wrapper .webform-submission-form .webform-type-webform-checkboxes-other .webform-checkboxes-other-input {
  grid-column: 1 / -1 !important;
  margin-top: 0.75rem !important;
}

html body:not(.path-admin) #wrapper .webform-submission-form .form-type-checkbox {
  position: relative !important;
  display: grid !important;
  grid-template-columns: 1.35rem minmax(0, 1fr) !important;
  align-items: start !important;
  gap: 0.15rem 0.85rem !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 0 1.35rem !important;
  padding: 1rem 1.05rem !important;
  background: linear-gradient(145deg, #fff, #fbf6ff) !important;
  border: 1.5px solid var(--jd-wf-border) !important;
  border-radius: 14px !important;
  box-shadow: 0 5px 15px rgba(59, 10, 92, 0.045) !important;
  text-align: left !important;
}

html body:not(.path-admin) #wrapper .webform-submission-form .form-type-checkbox input.form-checkbox {
  -webkit-appearance: none !important;
  appearance: none !important;
  position: relative !important;
  inset: auto !important;
  grid-column: 1 !important;
  grid-row: 1 !important;
  box-sizing: border-box !important;
  display: block !important;
  width: 1.28rem !important;
  min-width: 1.28rem !important;
  height: 1.28rem !important;
  min-height: 1.28rem !important;
  margin: 0.12rem 0 0 !important;
  padding: 0 !important;
  background: #fff !important;
  border: 2px solid #ae82ce !important;
  border-radius: 0.34rem !important;
  box-shadow: none !important;
  cursor: pointer !important;
  opacity: 1 !important;
  transform: none !important;
}

html body:not(.path-admin) #wrapper .webform-submission-form .form-type-checkbox input.form-checkbox::after {
  position: absolute !important;
  top: 0.08rem !important;
  left: 0.34rem !important;
  display: none !important;
  width: 0.38rem !important;
  height: 0.7rem !important;
  border: solid #fff !important;
  border-width: 0 0.16rem 0.16rem 0 !important;
  content: "" !important;
  transform: rotate(45deg) !important;
}

html body:not(.path-admin) #wrapper .webform-submission-form .form-type-checkbox input.form-checkbox:checked {
  background: linear-gradient(145deg, var(--jd-wf-purple), var(--jd-wf-accent-deep)) !important;
  border-color: var(--jd-wf-purple) !important;
}

html body:not(.path-admin) #wrapper .webform-submission-form .form-type-checkbox input.form-checkbox:checked::after { display: block !important; }

html body:not(.path-admin) #wrapper .webform-submission-form .form-type-checkbox input.form-checkbox:focus-visible {
  outline: 3px solid rgba(157, 78, 221, 0.48) !important;
  outline-offset: 3px !important;
}

html body:not(.path-admin) #wrapper .webform-submission-form .form-type-checkbox label.option {
  position: static !important;
  inset: auto !important;
  grid-column: 2 !important;
  grid-row: 1 !important;
  display: block !important;
  width: auto !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: var(--jd-wf-ink) !important;
  -webkit-text-fill-color: var(--jd-wf-ink) !important;
  cursor: pointer !important;
  font-size: 0.9rem !important;
  font-weight: 650 !important;
  line-height: 1.55 !important;
  text-align: left !important;
  transform: none !important;
}

html body:not(.path-admin) #wrapper .webform-submission-form .form-type-checkbox:has(input:checked) {
  background: linear-gradient(135deg, var(--jd-wf-lilac), #fff1fd) !important;
  border-color: #bf81ea !important;
  box-shadow: 0 0 0 3px rgba(157, 78, 221, 0.13), 0 8px 18px rgba(59, 10, 92, 0.07) !important;
}

html body:not(.path-admin) #wrapper .webform-submission-form .form-type-checkbox a {
  color: var(--jd-wf-purple) !important;
  -webkit-text-fill-color: var(--jd-wf-purple) !important;
  font-weight: 800 !important;
  text-decoration-thickness: 1.5px !important;
  text-underline-offset: 2px !important;
}

/* -------------------------------------------------------------------------- */
/* Managed files and vehicle photo cards                                      */
/* -------------------------------------------------------------------------- */

html body:not(.path-admin) #wrapper .webform-submission-form .form-managed-file {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 0.75rem !important;
  box-sizing: border-box !important;
  width: 100% !important;
  min-height: 5.5rem !important;
  margin: 0 !important;
  padding: 1rem !important;
  background: linear-gradient(145deg, #fff, #faf5ff) !important;
  border: 1.5px dashed #be8ee2 !important;
  border-radius: 14px !important;
  color: var(--jd-wf-body) !important;
}

html body:not(.path-admin) #wrapper .webform-submission-form input[type="file"] {
  box-sizing: border-box !important;
  display: block !important;
  flex: 1 1 18rem !important;
  width: 100% !important;
  max-width: 100% !important;
  min-height: 2.9rem !important;
  margin: 0 !important;
  padding: 0.35rem !important;
  background: #fff !important;
  border: 1px solid var(--jd-wf-border) !important;
  border-radius: 11px !important;
  color: var(--jd-wf-body) !important;
  -webkit-text-fill-color: var(--jd-wf-body) !important;
  font-family: var(--jd-wf-font) !important;
  font-size: 0.86rem !important;
}

html body:not(.path-admin) #wrapper .webform-submission-form input[type="file"]::file-selector-button {
  min-height: 2.25rem !important;
  margin-right: 0.75rem !important;
  padding: 0.45rem 0.8rem !important;
  background: var(--jd-wf-lilac) !important;
  border: 1px solid #b87fdf !important;
  border-radius: 8px !important;
  color: var(--jd-wf-deep) !important;
  font-family: var(--jd-wf-font) !important;
  font-weight: 800 !important;
  cursor: pointer !important;
}

html body:not(.path-admin) #wrapper .webform-submission-form input[type="file"]:focus-visible {
  outline: 3px solid rgba(157, 78, 221, 0.45) !important;
  outline-offset: 2px !important;
}

html body:not(.path-admin) #wrapper .webform-submission-form .form-managed-file .form-submit,
html body:not(.path-admin) #wrapper .webform-submission-form .form-managed-file .button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  min-width: 7.5rem !important;
  min-height: 2.55rem !important;
  margin: 0 !important;
  padding: 0.5rem 0.9rem !important;
  background: #fff !important;
  border: 1.5px solid var(--jd-wf-purple) !important;
  border-radius: 999px !important;
  box-shadow: none !important;
  color: var(--jd-wf-purple) !important;
  -webkit-text-fill-color: var(--jd-wf-purple) !important;
  font-size: 0.82rem !important;
  font-weight: 800 !important;
  text-shadow: none !important;
  transform: none !important;
}

html body:not(.path-admin) #wrapper .webform-submission-form .file,
html body:not(.path-admin) #wrapper .webform-submission-form .file a,
html body:not(.path-admin) #wrapper .webform-submission-form .file-size {
  color: var(--jd-wf-deep) !important;
  -webkit-text-fill-color: var(--jd-wf-deep) !important;
  overflow-wrap: anywhere !important;
}

html body:not(.path-admin) #wrapper .webform-submission-form .image-preview img,
html body:not(.path-admin) #wrapper .webform-submission-form .form-managed-file img {
  max-width: 100% !important;
  height: auto !important;
  border-radius: 11px !important;
}

html body.page-form-vehicle-data-collection #wrapper .jd-vehicle-photos-intro {
  grid-column: 1 / -1 !important;
  width: 100% !important;
  margin: 0 0 0.35rem !important;
  padding: 1rem 1.1rem !important;
  background: linear-gradient(135deg, var(--jd-wf-lilac), #fff5fe) !important;
  border: 1px solid var(--jd-wf-border) !important;
  border-radius: 14px !important;
  text-align: center !important;
}

html body.page-form-vehicle-data-collection #wrapper .jd-vehicle-photos-intro p {
  margin: 0 !important;
  font-size: 0.9rem !important;
  line-height: 1.55 !important;
}

html body.page-form-vehicle-data-collection #wrapper .jd-vehicle-photos > .fieldset-wrapper {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 1rem !important;
}

html body.page-form-vehicle-data-collection #wrapper .jd-vehicle-photo-card {
  display: flex !important;
  flex-direction: column !important;
  gap: 0.65rem !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 1rem 0.95rem !important;
  background: #fff !important;
  border: 1px solid var(--jd-wf-border) !important;
  border-radius: 15px !important;
  box-shadow: 0 7px 18px rgba(59, 10, 92, 0.055) !important;
}

html body.page-form-vehicle-data-collection #wrapper .jd-vehicle-photo-card > label,
html body.page-form-vehicle-data-collection #wrapper .jd-vehicle-photo-card .control-label {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-wrap: wrap !important;
  gap: 0.35rem !important;
  min-height: 2.5rem !important;
  margin: 0 !important;
  color: var(--jd-wf-deep) !important;
  -webkit-text-fill-color: var(--jd-wf-deep) !important;
  font-size: 0.84rem !important;
  font-weight: 800 !important;
  line-height: 1.35 !important;
  text-align: center !important;
}

html body.page-form-vehicle-data-collection #wrapper .jd-vehicle-photo-name {
  display: inline !important;
  text-align: center !important;
}

html body.page-form-vehicle-data-collection #wrapper .jd-vehicle-photo-angle {
  display: inline-flex !important;
  margin-left: 0.2rem !important;
  padding: 0.12rem 0.48rem !important;
  background: #fff1fd !important;
  border: 1px solid #efb4e9 !important;
  border-radius: 999px !important;
  color: var(--jd-wf-accent-deep) !important;
  -webkit-text-fill-color: var(--jd-wf-accent-deep) !important;
  font-size: 0.68rem !important;
  white-space: nowrap !important;
}

html body.page-form-vehicle-data-collection #wrapper .jd-vehicle-photo-card .form-managed-file {
  position: relative !important;
  flex: 1 1 auto !important;
  flex-direction: column !important;
  align-items: stretch !important;
  min-height: 10rem !important;
  margin: 0.25rem 0.2rem !important;
  padding: 0.85rem !important;
}

html body.page-form-vehicle-data-collection #wrapper .jd-vehicle-photo-card .form-managed-file::before {
  display: none !important;
  width: 100% !important;
  height: 4.8rem !important;
  margin: 0 0 0.25rem !important;
  background-color: transparent !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-size: contain !important;
  content: "" !important;
  opacity: 0.72 !important;
  pointer-events: none !important;
}

html body.page-form-vehicle-data-collection #wrapper form[data-jd-vehicle-type] .jd-vehicle-photo-card .form-managed-file::before { display: block !important; }
html body.page-form-vehicle-data-collection #wrapper .jd-vehicle-photo-card input[type="file"] { flex-basis: auto !important; font-size: 0.78rem !important; }
html body.page-form-vehicle-data-collection #wrapper .jd-vehicle-photo-card .description {
  width: 100% !important;
  margin: 0.45rem auto 0 !important;
  font-size: 0.75rem !important;
  text-align: center !important;
}

/* Angle reference artwork selected by the existing vehicle-type behavior. */
html body.page-form-vehicle-data-collection #wrapper form[data-jd-vehicle-type="automobile"] .jd-vehicle-photo-card--0 .form-managed-file::before { background-image: url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/automobile/0.svg"), url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/automobile/0.webp") !important; }
html body.page-form-vehicle-data-collection #wrapper form[data-jd-vehicle-type="automobile"] .jd-vehicle-photo-card--45 .form-managed-file::before { background-image: url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/automobile/45.svg"), url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/automobile/45.webp") !important; }
html body.page-form-vehicle-data-collection #wrapper form[data-jd-vehicle-type="automobile"] .jd-vehicle-photo-card--90 .form-managed-file::before { background-image: url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/automobile/90.svg"), url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/automobile/90.webp") !important; }
html body.page-form-vehicle-data-collection #wrapper form[data-jd-vehicle-type="automobile"] .jd-vehicle-photo-card--135 .form-managed-file::before { background-image: url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/automobile/135.svg"), url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/automobile/135.webp") !important; }
html body.page-form-vehicle-data-collection #wrapper form[data-jd-vehicle-type="automobile"] .jd-vehicle-photo-card--180 .form-managed-file::before { background-image: url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/automobile/180.svg"), url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/automobile/180.webp") !important; }
html body.page-form-vehicle-data-collection #wrapper form[data-jd-vehicle-type="automobile"] .jd-vehicle-photo-card--225 .form-managed-file::before { background-image: url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/automobile/225.svg"), url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/automobile/225.webp") !important; }
html body.page-form-vehicle-data-collection #wrapper form[data-jd-vehicle-type="automobile"] .jd-vehicle-photo-card--270 .form-managed-file::before { background-image: url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/automobile/270.svg"), url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/automobile/270.webp") !important; }
html body.page-form-vehicle-data-collection #wrapper form[data-jd-vehicle-type="automobile"] .jd-vehicle-photo-card--315 .form-managed-file::before { background-image: url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/automobile/315.svg"), url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/automobile/315.webp") !important; }
html body.page-form-vehicle-data-collection #wrapper form[data-jd-vehicle-type="motorcycle"] .jd-vehicle-photo-card--0 .form-managed-file::before { background-image: url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/motorcycle/0.svg"), url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/motorcycle/0.webp") !important; }
html body.page-form-vehicle-data-collection #wrapper form[data-jd-vehicle-type="motorcycle"] .jd-vehicle-photo-card--45 .form-managed-file::before { background-image: url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/motorcycle/45.svg"), url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/motorcycle/45.webp") !important; }
html body.page-form-vehicle-data-collection #wrapper form[data-jd-vehicle-type="motorcycle"] .jd-vehicle-photo-card--90 .form-managed-file::before { background-image: url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/motorcycle/90.svg"), url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/motorcycle/90.webp") !important; }
html body.page-form-vehicle-data-collection #wrapper form[data-jd-vehicle-type="motorcycle"] .jd-vehicle-photo-card--135 .form-managed-file::before { background-image: url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/motorcycle/135.svg"), url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/motorcycle/135.webp") !important; }
html body.page-form-vehicle-data-collection #wrapper form[data-jd-vehicle-type="motorcycle"] .jd-vehicle-photo-card--180 .form-managed-file::before { background-image: url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/motorcycle/180.svg"), url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/motorcycle/180.webp") !important; }
html body.page-form-vehicle-data-collection #wrapper form[data-jd-vehicle-type="motorcycle"] .jd-vehicle-photo-card--225 .form-managed-file::before { background-image: url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/motorcycle/225.svg"), url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/motorcycle/225.webp") !important; }
html body.page-form-vehicle-data-collection #wrapper form[data-jd-vehicle-type="motorcycle"] .jd-vehicle-photo-card--270 .form-managed-file::before { background-image: url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/motorcycle/270.svg"), url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/motorcycle/270.webp") !important; }
html body.page-form-vehicle-data-collection #wrapper form[data-jd-vehicle-type="motorcycle"] .jd-vehicle-photo-card--315 .form-managed-file::before { background-image: url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/motorcycle/315.svg"), url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/motorcycle/315.webp") !important; }
html body.page-form-vehicle-data-collection #wrapper form[data-jd-vehicle-type="atv"] .jd-vehicle-photo-card--0 .form-managed-file::before { background-image: url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/atv/0.svg"), url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/atv/0.webp") !important; }
html body.page-form-vehicle-data-collection #wrapper form[data-jd-vehicle-type="atv"] .jd-vehicle-photo-card--45 .form-managed-file::before { background-image: url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/atv/45.svg"), url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/atv/45.webp") !important; }
html body.page-form-vehicle-data-collection #wrapper form[data-jd-vehicle-type="atv"] .jd-vehicle-photo-card--90 .form-managed-file::before { background-image: url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/atv/90.svg"), url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/atv/90.webp") !important; }
html body.page-form-vehicle-data-collection #wrapper form[data-jd-vehicle-type="atv"] .jd-vehicle-photo-card--135 .form-managed-file::before { background-image: url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/atv/135.svg"), url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/atv/135.webp") !important; }
html body.page-form-vehicle-data-collection #wrapper form[data-jd-vehicle-type="atv"] .jd-vehicle-photo-card--180 .form-managed-file::before { background-image: url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/atv/180.svg"), url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/atv/180.webp") !important; }
html body.page-form-vehicle-data-collection #wrapper form[data-jd-vehicle-type="atv"] .jd-vehicle-photo-card--225 .form-managed-file::before { background-image: url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/atv/225.svg"), url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/atv/225.webp") !important; }
html body.page-form-vehicle-data-collection #wrapper form[data-jd-vehicle-type="atv"] .jd-vehicle-photo-card--270 .form-managed-file::before { background-image: url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/atv/270.svg"), url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/atv/270.webp") !important; }
html body.page-form-vehicle-data-collection #wrapper form[data-jd-vehicle-type="atv"] .jd-vehicle-photo-card--315 .form-managed-file::before { background-image: url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/atv/315.svg"), url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/atv/315.webp") !important; }
html body.page-form-vehicle-data-collection #wrapper form[data-jd-vehicle-type="boat"] .jd-vehicle-photo-card--0 .form-managed-file::before { background-image: url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/boat/0.svg"), url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/boat/0.webp") !important; }
html body.page-form-vehicle-data-collection #wrapper form[data-jd-vehicle-type="boat"] .jd-vehicle-photo-card--45 .form-managed-file::before { background-image: url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/boat/45.svg"), url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/boat/45.webp") !important; }
html body.page-form-vehicle-data-collection #wrapper form[data-jd-vehicle-type="boat"] .jd-vehicle-photo-card--90 .form-managed-file::before { background-image: url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/boat/90.svg"), url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/boat/90.webp") !important; }
html body.page-form-vehicle-data-collection #wrapper form[data-jd-vehicle-type="boat"] .jd-vehicle-photo-card--135 .form-managed-file::before { background-image: url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/boat/135.svg"), url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/boat/135.webp") !important; }
html body.page-form-vehicle-data-collection #wrapper form[data-jd-vehicle-type="boat"] .jd-vehicle-photo-card--180 .form-managed-file::before { background-image: url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/boat/180.svg"), url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/boat/180.webp") !important; }
html body.page-form-vehicle-data-collection #wrapper form[data-jd-vehicle-type="boat"] .jd-vehicle-photo-card--225 .form-managed-file::before { background-image: url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/boat/225.svg"), url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/boat/225.webp") !important; }
html body.page-form-vehicle-data-collection #wrapper form[data-jd-vehicle-type="boat"] .jd-vehicle-photo-card--270 .form-managed-file::before { background-image: url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/boat/270.svg"), url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/boat/270.webp") !important; }
html body.page-form-vehicle-data-collection #wrapper form[data-jd-vehicle-type="boat"] .jd-vehicle-photo-card--315 .form-managed-file::before { background-image: url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/boat/315.svg"), url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/boat/315.webp") !important; }
html body.page-form-vehicle-data-collection #wrapper form[data-jd-vehicle-type="rv"] .jd-vehicle-photo-card--0 .form-managed-file::before { background-image: url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/rv/0.svg"), url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/rv/0.webp") !important; }
html body.page-form-vehicle-data-collection #wrapper form[data-jd-vehicle-type="rv"] .jd-vehicle-photo-card--45 .form-managed-file::before { background-image: url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/rv/45.svg"), url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/rv/45.webp") !important; }
html body.page-form-vehicle-data-collection #wrapper form[data-jd-vehicle-type="rv"] .jd-vehicle-photo-card--90 .form-managed-file::before { background-image: url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/rv/90.svg"), url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/rv/90.webp") !important; }
html body.page-form-vehicle-data-collection #wrapper form[data-jd-vehicle-type="rv"] .jd-vehicle-photo-card--135 .form-managed-file::before { background-image: url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/rv/135.svg"), url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/rv/135.webp") !important; }
html body.page-form-vehicle-data-collection #wrapper form[data-jd-vehicle-type="rv"] .jd-vehicle-photo-card--180 .form-managed-file::before { background-image: url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/rv/180.svg"), url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/rv/180.webp") !important; }
html body.page-form-vehicle-data-collection #wrapper form[data-jd-vehicle-type="rv"] .jd-vehicle-photo-card--225 .form-managed-file::before { background-image: url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/rv/225.svg"), url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/rv/225.webp") !important; }
html body.page-form-vehicle-data-collection #wrapper form[data-jd-vehicle-type="rv"] .jd-vehicle-photo-card--270 .form-managed-file::before { background-image: url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/rv/270.svg"), url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/rv/270.webp") !important; }
html body.page-form-vehicle-data-collection #wrapper form[data-jd-vehicle-type="rv"] .jd-vehicle-photo-card--315 .form-managed-file::before { background-image: url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/rv/315.svg"), url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/rv/315.webp") !important; }
html body.page-form-vehicle-data-collection #wrapper form[data-jd-vehicle-type="sea-doo"] .jd-vehicle-photo-card--0 .form-managed-file::before { background-image: url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/sea-doo/0.svg"), url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/sea-doo/0.webp") !important; }
html body.page-form-vehicle-data-collection #wrapper form[data-jd-vehicle-type="sea-doo"] .jd-vehicle-photo-card--45 .form-managed-file::before { background-image: url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/sea-doo/45.svg"), url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/sea-doo/45.webp") !important; }
html body.page-form-vehicle-data-collection #wrapper form[data-jd-vehicle-type="sea-doo"] .jd-vehicle-photo-card--90 .form-managed-file::before { background-image: url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/sea-doo/90.svg"), url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/sea-doo/90.webp") !important; }
html body.page-form-vehicle-data-collection #wrapper form[data-jd-vehicle-type="sea-doo"] .jd-vehicle-photo-card--135 .form-managed-file::before { background-image: url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/sea-doo/135.svg"), url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/sea-doo/135.webp") !important; }
html body.page-form-vehicle-data-collection #wrapper form[data-jd-vehicle-type="sea-doo"] .jd-vehicle-photo-card--180 .form-managed-file::before { background-image: url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/sea-doo/180.svg"), url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/sea-doo/180.webp") !important; }
html body.page-form-vehicle-data-collection #wrapper form[data-jd-vehicle-type="sea-doo"] .jd-vehicle-photo-card--225 .form-managed-file::before { background-image: url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/sea-doo/225.svg"), url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/sea-doo/225.webp") !important; }
html body.page-form-vehicle-data-collection #wrapper form[data-jd-vehicle-type="sea-doo"] .jd-vehicle-photo-card--270 .form-managed-file::before { background-image: url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/sea-doo/270.svg"), url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/sea-doo/270.webp") !important; }
html body.page-form-vehicle-data-collection #wrapper form[data-jd-vehicle-type="sea-doo"] .jd-vehicle-photo-card--315 .form-managed-file::before { background-image: url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/sea-doo/315.svg"), url("/themes/martis/assets/images/vehicle-angles/walkaround-v7/sea-doo/315.webp") !important; }

/* -------------------------------------------------------------------------- */
/* Validation, messages, and confirmation                                     */
/* -------------------------------------------------------------------------- */

html body:not(.path-admin) #wrapper .webform-submission-form input.error,
html body:not(.path-admin) #wrapper .webform-submission-form select.error,
html body:not(.path-admin) #wrapper .webform-submission-form textarea.error,
html body:not(.path-admin) #wrapper .webform-submission-form [aria-invalid="true"] {
  background-color: var(--jd-wf-danger-soft) !important;
  border-color: var(--jd-wf-danger) !important;
  box-shadow: 0 0 0 3px rgba(180, 35, 77, 0.12) !important;
}

html body:not(.path-admin) #wrapper .webform-submission-form .form-item--error-message,
html body:not(.path-admin) #wrapper .webform-submission-form .form-item--error-message strong {
  display: block !important;
  width: 100% !important;
  margin: 0.5rem 0 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  color: var(--jd-wf-danger) !important;
  -webkit-text-fill-color: var(--jd-wf-danger) !important;
  font-size: 0.82rem !important;
  font-weight: 750 !important;
  line-height: 1.45 !important;
}

html body.path-webform #wrapper .messages,
html body.path-webform #wrapper .webform-message,
html body.path-webform #wrapper .webform-confirmation {
  position: relative !important;
  box-sizing: border-box !important;
  width: calc(100% - clamp(2rem, 7vw, 5.4rem)) !important;
  max-width: 62rem !important;
  margin: 1.5rem auto !important;
  padding: 1.15rem 3rem 1.15rem 1.25rem !important;
  background: #fff !important;
  border: 1px solid var(--jd-wf-border) !important;
  border-left: 5px solid var(--jd-wf-purple) !important;
  border-radius: 14px !important;
  box-shadow: var(--jd-wf-shadow-soft) !important;
  color: var(--jd-wf-body) !important;
}

html body.path-webform #wrapper .messages,
html body.path-webform #wrapper .webform-message,
html body.path-webform #wrapper .task-bar.alert,
html body.path-webform #wrapper [data-drupal-messages] {
  overflow: visible !important;
  pointer-events: auto !important;
  z-index: 40 !important;
}

html body.path-webform #wrapper .messages button.close,
html body.path-webform #wrapper .messages .btn-close,
html body.path-webform #wrapper .webform-message button.close,
html body.path-webform #wrapper .webform-message .btn-close,
html body.path-webform #wrapper .webform-message .js-webform-message__link,
html body.path-webform #wrapper [data-drupal-messages] button.close,
html body.path-webform #wrapper [data-drupal-messages] .btn-close,
html body.path-webform #wrapper .alert-dismissable .close,
html body.path-webform #wrapper .alert-dismissible .btn-close,
html body.path-webform #wrapper .button--dismiss {
  position: absolute !important;
  top: 0.45rem !important;
  right: 0.45rem !important;
  z-index: 50 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 2.75rem !important;
  min-width: 2.75rem !important;
  height: 2.75rem !important;
  min-height: 2.75rem !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  color: inherit !important;
  font-size: 1.65rem !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  opacity: 0.85 !important;
  cursor: pointer !important;
  pointer-events: auto !important;
  touch-action: manipulation !important;
  transition: opacity 0.15s ease, transform 0.15s ease !important;
}

html body.path-webform #wrapper .messages button.close:hover,
html body.path-webform #wrapper .messages button.close:focus,
html body.path-webform #wrapper .messages .btn-close:hover,
html body.path-webform #wrapper .messages .btn-close:focus,
html body.path-webform #wrapper .webform-message button.close:hover,
html body.path-webform #wrapper .webform-message button.close:focus,
html body.path-webform #wrapper [data-drupal-messages] button.close:hover,
html body.path-webform #wrapper [data-drupal-messages] button.close:focus,
html body.path-webform #wrapper .alert-dismissable .close:hover,
html body.path-webform #wrapper .alert-dismissable .close:focus,
html body.path-webform #wrapper .btn-close:hover,
html body.path-webform #wrapper .btn-close:focus {
  opacity: 1 !important;
  transform: scale(1.1) !important;
  outline: none !important;
}

html body.path-webform #wrapper .btn-close::before,
html body #wrapper .messages .btn-close::before,
html body #wrapper [data-drupal-messages] .btn-close::before {
  content: "\00d7";
  font-size: 1.65rem;
  font-weight: 700;
  line-height: 1;
}

html body.path-webform #wrapper .messages--error {
  background: var(--jd-wf-danger-soft) !important;
  border-color: #f2b6c6 !important;
  border-left-color: var(--jd-wf-danger) !important;
  color: #7d1838 !important;
}

html body.path-webform #wrapper .messages--status,
html body.path-webform #wrapper .webform-confirmation {
  background: linear-gradient(135deg, var(--jd-wf-success-soft), #fff) !important;
  border-color: #b9e8c7 !important;
  border-left-color: var(--jd-wf-success) !important;
  color: #14532d !important;
}

html body.path-webform #wrapper .webform-confirmation::before {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 2rem !important;
  height: 2rem !important;
  margin: 0 0 0.75rem !important;
  background: #dcfce7 !important;
  border: 1px solid #86d69f !important;
  border-radius: 50% !important;
  color: var(--jd-wf-success) !important;
  content: "✓" !important;
  font-size: 1rem !important;
  font-weight: 900 !important;
}

html body.path-webform #wrapper .messages a,
html body.path-webform #wrapper .webform-confirmation a { color: var(--jd-wf-purple) !important; font-weight: 800 !important; }

/* -------------------------------------------------------------------------- */
/* Actions and AJAX                                                           */
/* -------------------------------------------------------------------------- */

html body:not(.path-admin) #wrapper .webform-submission-form .form-actions.webform-actions {
  position: static !important;
  inset: auto !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: center !important;
  gap: var(--jd-wf-stack) !important;
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 62rem !important;
  margin: 0 auto !important;
  padding: 0 var(--jd-wf-gutter) var(--jd-wf-gutter) !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  transform: none !important;
  margin-top: -1.5rem !important;
}
html .cyb-form-landing.path-webform.page-form-99-cent-basic #wrapper .webform-submission-form .form-actions.webform-actions {
  margin-top: 1.5rem !important;
}
html body:not(.path-admin) #wrapper .webform-submission-form .webform-button--next,
html body:not(.path-admin) #wrapper .webform-submission-form .webform-button--submit,
html body.path-webform #wrapper .jd-form-hero-cta a {
  -webkit-appearance: none !important;
  appearance: none !important;
  position: static !important;
  inset: auto !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  min-width: min(100%, 13rem) !important;
  max-width: 100% !important;
  min-height: 3rem !important;
  margin: 0 !important;
  padding: 0.65rem 1.4rem !important;
  background: linear-gradient(135deg, var(--jd-wf-deep) 0%, var(--jd-wf-purple) 58%, #ad3acb 100%) !important;
  background-color: var(--jd-wf-purple) !important;
  background-image: linear-gradient(135deg, var(--jd-wf-deep) 0%, var(--jd-wf-purple) 58%, #ad3acb 100%) !important;
  border: 2px solid #1c0829 !important;
  border-radius: 999px !important;
  box-shadow: 0 3px 0 #1c0829, 0 9px 20px rgba(103, 22, 170, 0.26) !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  cursor: pointer !important;
  font-family: var(--jd-wf-font) !important;
  font-size: 0.92rem !important;
  font-weight: 850 !important;
  letter-spacing: 0.01em !important;
  line-height: 1.2 !important;
  text-align: center !important;
  text-decoration: none !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.28) !important;
  transform: none !important;
  transition: transform 0.16s ease, box-shadow 0.16s ease, filter 0.16s ease !important;
}

html body:not(.path-admin) #wrapper .webform-submission-form .webform-button--previous,
html body:not(.path-admin) #wrapper .webform-submission-form .webform-button--draft,
html body:not(.path-admin) #wrapper .webform-submission-form .webform-button--preview {
  -webkit-appearance: none !important;
  appearance: none !important;
  position: static !important;
  inset: auto !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  min-width: min(100%, 11rem) !important;
  max-width: 100% !important;
  min-height: 3rem !important;
  margin: 0 !important;
  padding: 0.65rem 1.25rem !important;
  background: linear-gradient(145deg, #fff, var(--jd-wf-lilac)) !important;
  background-image: linear-gradient(145deg, #fff, var(--jd-wf-lilac)) !important;
  border: 1.5px solid #a867d4 !important;
  border-radius: 999px !important;
  box-shadow: 0 5px 14px rgba(59, 10, 92, 0.08) !important;
  color: var(--jd-wf-deep) !important;
  -webkit-text-fill-color: var(--jd-wf-deep) !important;
  cursor: pointer !important;
  font-family: var(--jd-wf-font) !important;
  font-size: 0.9rem !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  text-align: center !important;
  text-shadow: none !important;
  transform: none !important;
  transition: transform 0.16s ease, box-shadow 0.16s ease, background 0.16s ease !important;
}

@media (hover: hover) and (pointer: fine) {
  html body:not(.path-admin) #wrapper .webform-submission-form .webform-button--next:hover,
  html body:not(.path-admin) #wrapper .webform-submission-form .webform-button--submit:hover,
  html body.path-webform #wrapper .jd-form-hero-cta a:hover {
    filter: brightness(1.08) !important;
    box-shadow: 0 4px 0 #1c0829, 0 13px 25px rgba(103, 22, 170, 0.34) !important;
    transform: translateY(-2px) !important;
  }

  html body:not(.path-admin) #wrapper .webform-submission-form .webform-button--previous:hover,
  html body:not(.path-admin) #wrapper .webform-submission-form .webform-button--draft:hover,
  html body:not(.path-admin) #wrapper .webform-submission-form .webform-button--preview:hover {
    background: #fff1fd !important;
    box-shadow: 0 8px 18px rgba(59, 10, 92, 0.12) !important;
    transform: translateY(-1px) !important;
  }
}

html body:not(.path-admin) #wrapper .webform-submission-form .webform-button--next:focus-visible,
html body:not(.path-admin) #wrapper .webform-submission-form .webform-button--submit:focus-visible,
html body:not(.path-admin) #wrapper .webform-submission-form .webform-button--previous:focus-visible,
html body:not(.path-admin) #wrapper .webform-submission-form .webform-button--draft:focus-visible,
html body:not(.path-admin) #wrapper .webform-submission-form .webform-button--preview:focus-visible,
html body.path-webform #wrapper .jd-form-hero-cta a:focus-visible {
  outline: 4px solid rgba(157, 78, 221, 0.52) !important;
  outline-offset: 4px !important;
}

html body:not(.path-admin) #wrapper .webform-submission-form .webform-button--next:active,
html body:not(.path-admin) #wrapper .webform-submission-form .webform-button--submit:active,
html body.path-webform #wrapper .jd-form-hero-cta a:active {
  box-shadow: 0 1px 0 #1c0829, 0 5px 12px rgba(103, 22, 170, 0.22) !important;
  transform: translateY(2px) !important;
}

html body:not(.path-admin) #wrapper .webform-submission-form input[type="submit"]:disabled,
html body:not(.path-admin) #wrapper .webform-submission-form .button:disabled {
  background: #ded4e5 !important;
  background-image: none !important;
  border-color: #b9acbf !important;
  box-shadow: none !important;
  color: #6f6575 !important;
  -webkit-text-fill-color: #6f6575 !important;
  cursor: not-allowed !important;
  opacity: 1 !important;
  transform: none !important;
}

html body:not(.path-admin) #wrapper .webform-submission-form .ajax-progress,
html body:not(.path-admin) #wrapper .webform-submission-form .ajax-progress-throbber {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.45rem !important;
  margin: 0.35rem !important;
  color: var(--jd-wf-deep) !important;
  font-size: 0.82rem !important;
  font-weight: 750 !important;
}

html body:not(.path-admin) #wrapper .webform-submission-form .ajax-progress .throbber {
  width: 1.15rem !important;
  height: 1.15rem !important;
  padding: 0 !important;
  background: transparent !important;
  border: 2px solid #d9b8ef !important;
  border-top-color: var(--jd-wf-accent-deep) !important;
  border-radius: 50% !important;
  animation: jd-wf-spin 0.75s linear infinite !important;
}

@keyframes jd-wf-spin { to { transform: rotate(360deg); } }

/* -------------------------------------------------------------------------- */
/* Responsive                                                                 */
/* -------------------------------------------------------------------------- */

@media (max-width: 1099.98px) {
  html body.page-form-vehicle-data-collection #wrapper .jd-vehicle-photos > .fieldset-wrapper {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 899.98px) {
  html body.path-webform #wrapper .jd-form-sell { grid-template-columns: 1fr !important; }
}

@media (max-width: 1000px) {
  html body.path-webform.page-form-99-cent-basic #wrapper .block-system-main-block > .container-wrap > .block-content {
    padding: 15px;
  }
}

@media (max-width: 767.98px) {
  html body.path-webform.page-form-99-cent-basic #wrapper .block-system-main-block > .container-wrap > .block-content {
    padding: 0 .85rem 1.15rem;
  }

  html body.path-webform,
  html body .webform-submission-form {
    --jd-wf-gutter: 1rem;
    --jd-wf-stack: 1rem;
  }

  html body.path-webform #wrapper #page-wrapper > .container,
  html body.path-webform #wrapper .content-layout > .container {
    width: 100% !important;
    max-width: 100% !important;
    padding-right: var(--jd-wf-gutter) !important;
    padding-left: var(--jd-wf-gutter) !important;
    margin-right: auto !important;
    margin-left: auto !important;
  }

  html body.path-webform #wrapper form.webform-submission-form {
    margin-top: var(--jd-wf-gutter) !important;
    margin-bottom: var(--jd-wf-gutter) !important;
    margin-right: auto !important;
    margin-left: auto !important;
    padding-bottom: var(--jd-wf-gutter) !important;
    border-radius: 19px !important;
    box-shadow: 0 14px 34px rgba(59, 10, 92, 0.1) !important;
    width: 104.5% !important;
    margin-top: -1rem !important;
    margin-bottom: -1rem !important;
  }

  html body.path-webform #wrapper .webform-progress { padding: var(--jd-wf-gutter) var(--jd-wf-gutter) var(--jd-wf-stack) !important; }
  html body.path-webform #wrapper .webform-progress-tracker .progress-step { padding-right: 0.12rem !important; padding-left: 0.12rem !important; }
  html body.path-webform #wrapper .webform-progress-tracker .progress-step::before { top: 0.88rem !important; }

  html body.path-webform #wrapper .webform-progress-tracker .progress-marker {
    width: 1.8rem !important;
    min-width: 1.8rem !important;
    height: 1.8rem !important;
    margin-bottom: 0.35rem !important;
    font-size: 0.75rem !important;
  }

  html body.path-webform #wrapper .webform-progress-tracker .progress-text,
  html body.path-webform #wrapper .webform-progress-tracker .progress-title { font-size: 0.68rem !important; }

  html body.path-webform #wrapper .webform-progress-tracker .progress-step:not(.is-active) .progress-text {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    clip: rect(0 0 0 0) !important;
    clip-path: inset(50%) !important;
    white-space: nowrap !important;
  }

  html body.path-webform #wrapper .webform-wizard-page,
  html body.path-webform #wrapper form.webform-submission-form > .webform-flexbox,
  html body.path-webform #wrapper form.webform-submission-form > .js-form-wrapper:not(.form-actions):not(.webform-progress) {
    padding: var(--jd-wf-gutter) !important;
  }

  html body:not(.path-admin) #wrapper .webform-submission-form .jd-form-grid.jd-form-grid--2 > .fieldset-wrapper,
  html body:not(.path-admin) #wrapper .webform-submission-form .webform-wizard-page.jd-form-grid.jd-form-grid--2 {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: var(--jd-wf-stack) !important;
  }

  html body:not(.path-admin) #wrapper .webform-submission-form .jd-form-span-all,
  html body:not(.path-admin) #wrapper .webform-submission-form .jd-form-grid > .fieldset-wrapper > .jd-form-span-all,
  html body:not(.path-admin) #wrapper .webform-submission-form .webform-wizard-page.jd-form-grid > .jd-form-span-all { grid-column: auto !important; }

  html body.path-webform #wrapper .jd-form-intro,
  html body.path-webform #wrapper .jd-deal-intro,
  html body.path-webform #wrapper .jd-form-hero {
    margin-bottom: var(--jd-wf-stack) !important;
    padding: var(--jd-wf-gutter) !important;
    border-radius: 16px !important;
  }

  html body.path-webform #wrapper .jd-form-intro h1,
  html body.path-webform #wrapper .jd-deal-intro h1,
  html body.path-webform #wrapper .jd-form-hero h1 { font-size: 1.7rem !important; }

  html body.path-webform #wrapper .jd-form-intro p,
  html body.path-webform #wrapper .jd-form-intro li,
  html body.path-webform #wrapper .jd-deal-intro p,
  html body.path-webform #wrapper .jd-deal-intro li,
  html body.path-webform #wrapper .jd-form-hero p { font-size: 0.94rem !important; line-height: 1.58 !important; }

  html body.path-webform #wrapper .jd-form-sell { gap: 0.75rem !important; }
  html body.path-webform #wrapper .jd-form-sell section { padding: 1rem !important; border-radius: 14px !important; }

  html body:not(.path-admin) #wrapper .webform-submission-form input[type="text"],
  html body:not(.path-admin) #wrapper .webform-submission-form input[type="email"],
  html body:not(.path-admin) #wrapper .webform-submission-form input[type="tel"],
  html body:not(.path-admin) #wrapper .webform-submission-form input[type="number"],
  html body:not(.path-admin) #wrapper .webform-submission-form input[type="url"],
  html body:not(.path-admin) #wrapper .webform-submission-form input[type="search"],
  html body:not(.path-admin) #wrapper .webform-submission-form input[type="password"],
  html body:not(.path-admin) #wrapper .webform-submission-form input[type="date"],
  html body:not(.path-admin) #wrapper .webform-submission-form input[type="time"],
  html body:not(.path-admin) #wrapper .webform-submission-form input[type="datetime-local"],
  html body:not(.path-admin) #wrapper .webform-submission-form select,
  html body:not(.path-admin) #wrapper .webform-submission-form textarea { min-height: 3.25rem !important; font-size: 16px !important; }

  html body.page-form-vehicle-data-collection #wrapper .jd-vehicle-photos > .fieldset-wrapper {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 0.8rem !important;
  }

  html body.page-form-vehicle-data-collection #wrapper .jd-vehicle-photo-card { padding: 0.9rem 0.8rem !important; }
  html body.page-form-vehicle-data-collection #wrapper .jd-vehicle-photo-card .form-managed-file {
    min-height: 8.5rem !important;
    margin: 0.2rem 0.15rem !important;
  }

  html body:not(.path-admin) #wrapper .webform-submission-form .form-actions.webform-actions {
    flex-direction: column !important;
    gap: var(--jd-wf-stack) !important;
    padding-right: var(--jd-wf-gutter) !important;
    padding-left: var(--jd-wf-gutter) !important;
  }

  html body:not(.path-admin) #wrapper .webform-submission-form .webform-button--next,
  html body:not(.path-admin) #wrapper .webform-submission-form .webform-button--submit,
  html body:not(.path-admin) #wrapper .webform-submission-form .webform-button--previous,
  html body:not(.path-admin) #wrapper .webform-submission-form .webform-button--draft,
  html body:not(.path-admin) #wrapper .webform-submission-form .webform-button--preview {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 3.1rem !important;
  }
}

@media (max-width: 479.98px) {
  html body:not(.path-admin) #wrapper .webform-submission-form .js-webform-radios,
  html body:not(.path-admin) #wrapper .webform-submission-form .js-webform-checkboxes,
  html body.page-form-vehicle-data-collection #wrapper #edit-what-type-of-vehicle,
  html body.page-form-99-cent-basic #wrapper [id^="edit-vehicle-type"] {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0.6rem !important;
  }

  html body:not(.path-admin) #wrapper .webform-submission-form .form-type-radio label.option {
    min-height: 3.3rem !important;
    padding: 0.62rem 0.65rem 0.62rem 2.25rem !important;
    font-size: 0.84rem !important;
  }

  html body:not(.path-admin) #wrapper .webform-submission-form .form-type-radio label.option::before { left: 0.7rem !important; }
  html body:not(.path-admin) #wrapper .webform-submission-form .form-type-checkbox { padding: 0.9rem !important; }

  html body:not(.path-admin) #wrapper .webform-submission-form .form-managed-file {
    align-items: stretch !important;
    padding: 0.8rem !important;
  }

  html body:not(.path-admin) #wrapper .webform-submission-form input[type="file"]::file-selector-button {
    display: block !important;
    width: 100% !important;
    margin: 0 0 0.5rem !important;
  }
}

@media (max-width: 339.98px) {
  html body:not(.path-admin) #wrapper .webform-submission-form .js-webform-radios,
  html body:not(.path-admin) #wrapper .webform-submission-form .js-webform-checkboxes,
  html body.page-form-vehicle-data-collection #wrapper #edit-what-type-of-vehicle,
  html body.page-form-99-cent-basic #wrapper [id^="edit-vehicle-type"] { grid-template-columns: minmax(0, 1fr) !important; }
}

/* -------------------------------------------------------------------------- */
/* Legacy Martis Webform neutralization                                       */
/* -------------------------------------------------------------------------- */

/* Older Custom CSS used higher-specificity purple slabs and 80% field widths. */
html body.cyb-form-landing.path-webform #wrapper form.webform-submission-form .webform-progress {
  position: relative !important;
  inset: auto !important;
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  float: none !important;
  border-top-left-radius: 20px !important;
  border-top-right-radius: 20px !important;
  border: 1px solid purple !important;
}

html body.cyb-form-landing.path-webform #wrapper form.webform-submission-form .webform-progress__status {
  position: static !important;
  inset: auto !important;
  display: flex !important;
  justify-content: center !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  float: none !important;
  font-family: var(--jd-wf-font) !important;
  font-style: normal !important;
  text-decoration: none !important;
  text-shadow: none !important;
  transform: none !important;
  filter: none !important;
}

html body.cyb-form-landing.path-webform #wrapper form.webform-submission-form .webform-progress__summary {
  position: static !important;
  inset: auto !important;
  font-family: var(--jd-wf-font) !important;
  font-style: normal !important;
  text-decoration: none !important;
  text-shadow: none !important;
  transform: none !important;
  filter: none !important;
}

html body.cyb-form-landing.path-webform #wrapper form.webform-submission-form .webform-progress__status::before,
html body.cyb-form-landing.path-webform #wrapper form.webform-submission-form .webform-progress__status::after,
html body.cyb-form-landing.path-webform #wrapper form.webform-submission-form .webform-progress__summary::before,
html body.cyb-form-landing.path-webform #wrapper form.webform-submission-form .webform-progress__summary::after {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  padding: 0 !important;
  background: none !important;
  border: 0 !important;
  box-shadow: none !important;
  content: none !important;
}

html body.cyb-form-landing.path-webform #wrapper form.webform-submission-form .webform-progress-tracker .progress-marker::before,
html body.cyb-form-landing.path-webform #wrapper form.webform-submission-form .webform-progress-tracker .progress-marker::after {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  padding: 0 !important;
  background: none !important;
  border: 0 !important;
  box-shadow: none !important;
  content: none !important;
}

html body.cyb-form-landing.path-webform #wrapper form.webform-submission-form .webform-progress-tracker .progress-step,
html body.cyb-form-landing.path-webform #wrapper form.webform-submission-form .webform-progress-tracker .progress-marker,
html body.cyb-form-landing.path-webform #wrapper form.webform-submission-form .webform-progress-tracker .progress-text,
html body.cyb-form-landing.path-webform #wrapper form.webform-submission-form .webform-progress-tracker .progress-title {
  font-family: var(--jd-wf-font) !important;
  font-style: normal !important;
  text-decoration: none !important;
  text-shadow: none !important;
  transform: none !important;
}

html body.cyb-form-landing.path-webform #wrapper form.webform-submission-form.webform-submission-add-form .form-wrapper .fieldset-wrapper > .form-item:not(.form-type-radio):not(.form-type-checkbox),
html body.cyb-form-landing.path-webform #wrapper form.webform-submission-form.webform-submission-add-form .form-wrapper > .form-item:not(.form-type-radio):not(.form-type-checkbox) {
  height: auto !important;
  min-height: 0 !important;
  margin-right: 0 !important;
  margin-left: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  text-shadow: none !important;
}

html body.cyb-form-landing.path-webform #wrapper form.webform-submission-form.webform-submission-add-form .form-wrapper .form-item > label:not(.option),
html body.cyb-form-landing.path-webform #wrapper form.webform-submission-form.webform-submission-add-form .form-wrapper .form-item > .control-label:not(.option),
html body.cyb-form-landing.path-webform #wrapper form.webform-submission-form.webform-submission-add-form .form-wrapper fieldset > legend,
html body.cyb-form-landing.path-webform #wrapper form.webform-submission-form.webform-submission-add-form .form-wrapper .fieldset-legend {
  align-items: flex-start !important;
  justify-content: flex-start !important;
  margin-right: 0 !important;
  margin-left: 0 !important;
  color: var(--jd-wf-ink) !important;
  -webkit-text-fill-color: var(--jd-wf-ink) !important;
  font-family: var(--jd-wf-font) !important;
  font-style: normal !important;
  text-align: center !important;
  text-decoration: none !important;
  text-shadow: none !important;
  transform: none !important;
  margin-top: 0.5rem !important;
}

html body.cyb-form-landing.path-webform #wrapper form.webform-submission-form.webform-submission-add-form .form-wrapper input[type="text"],
html body.cyb-form-landing.path-webform #wrapper form.webform-submission-form.webform-submission-add-form .form-wrapper input[type="email"],
html body.cyb-form-landing.path-webform #wrapper form.webform-submission-form.webform-submission-add-form .form-wrapper input[type="tel"],
html body.cyb-form-landing.path-webform #wrapper form.webform-submission-form.webform-submission-add-form .form-wrapper input[type="number"],
html body.cyb-form-landing.path-webform #wrapper form.webform-submission-form.webform-submission-add-form .form-wrapper input[type="url"],
html body.cyb-form-landing.path-webform #wrapper form.webform-submission-form.webform-submission-add-form .form-wrapper input[type="search"],
html body.cyb-form-landing.path-webform #wrapper form.webform-submission-form.webform-submission-add-form .form-wrapper input[type="password"],
html body.cyb-form-landing.path-webform #wrapper form.webform-submission-form.webform-submission-add-form .form-wrapper input[type="date"],
html body.cyb-form-landing.path-webform #wrapper form.webform-submission-form.webform-submission-add-form .form-wrapper input[type="time"],
html body.cyb-form-landing.path-webform #wrapper form.webform-submission-form.webform-submission-add-form .form-wrapper input[type="datetime-local"],
html body.cyb-form-landing.path-webform #wrapper form.webform-submission-form.webform-submission-add-form .form-wrapper select,
html body.cyb-form-landing.path-webform #wrapper form.webform-submission-form.webform-submission-add-form .form-wrapper textarea,
html body.cyb-form-landing.path-webform #wrapper form.webform-submission-form.webform-submission-add-form .form-wrapper .select-wrapper {
  width: 100% !important;
  max-width: 100% !important;
  margin-right: 0 !important;
  margin-left: 0 !important;
}

html body.cyb-form-landing.path-webform #wrapper form.webform-submission-form.webform-submission-add-form .form-wrapper .js-webform-radios,
html body.cyb-form-landing.path-webform #wrapper form.webform-submission-form.webform-submission-add-form .form-wrapper .js-webform-checkboxes,
html body.page-form-get-in-touch.cyb-form-landing.path-webform #wrapper form.webform-submission-form #edit-how-should-we-contact-you-,
html body.page-form-vehicle-data-collection.cyb-form-landing.path-webform #wrapper form.webform-submission-form #edit-what-type-of-vehicle,
html body.page-form-99-cent-basic.cyb-form-landing.path-webform #wrapper form.webform-submission-form [id^="edit-contact-method"],
html body.page-form-99-cent-basic.cyb-form-landing.path-webform #wrapper form.webform-submission-form [id^="edit-vehicle-type"] {
  width: 100% !important;
  max-width: 100% !important;
  margin-right: 0 !important;
  margin-left: 0 !important;
  margin-bottom: 1rem !important;
}

html body.cyb-form-landing.path-webform #wrapper form.webform-submission-form.webform-submission-add-form .form-wrapper .js-webform-radios .form-item,
html body.page-form-get-in-touch.cyb-form-landing.path-webform #wrapper form.webform-submission-form #edit-how-should-we-contact-you- .form-item,
html body.page-form-vehicle-data-collection.cyb-form-landing.path-webform #wrapper form.webform-submission-form #edit-what-type-of-vehicle .form-item,
html body.page-form-99-cent-basic.cyb-form-landing.path-webform #wrapper form.webform-submission-form [id^="edit-contact-method"] .form-item,
html body.page-form-99-cent-basic.cyb-form-landing.path-webform #wrapper form.webform-submission-form [id^="edit-vehicle-type"] .form-item {
  min-height: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

html body.cyb-form-landing.path-webform #wrapper form.webform-submission-form.webform-submission-add-form .form-wrapper .js-webform-radios label.option,
html body.page-form-get-in-touch.cyb-form-landing.path-webform #wrapper form.webform-submission-form #edit-how-should-we-contact-you- label.option,
html body.page-form-vehicle-data-collection.cyb-form-landing.path-webform #wrapper form.webform-submission-form #edit-what-type-of-vehicle label.option,
html body.page-form-99-cent-basic.cyb-form-landing.path-webform #wrapper form.webform-submission-form [id^="edit-contact-method"] label.option,
html body.page-form-99-cent-basic.cyb-form-landing.path-webform #wrapper form.webform-submission-form [id^="edit-vehicle-type"] label.option {
  justify-content: flex-start !important;
  width: 100% !important;
  max-width: 100% !important;
  min-height: 3.4rem !important;
  margin: 0 !important;
  padding: 0.72rem 0.9rem 0.72rem 2.75rem !important;
  background: linear-gradient(145deg, #fff 0%, #faf4ff 100%) !important;
  border: 1.5px solid var(--jd-wf-border) !important;
  border-radius: 13px !important;
  box-shadow: 0 4px 12px rgba(59, 10, 92, 0.04) !important;
  color: var(--jd-wf-deep) !important;
  -webkit-text-fill-color: var(--jd-wf-deep) !important;
  font-family: var(--jd-wf-font) !important;
  font-style: normal !important;
  text-align: left !important;
  text-shadow: none !important;
}

html body.cyb-form-landing.path-webform #wrapper form.webform-submission-form.webform-submission-add-form .form-wrapper .js-webform-radios input:checked + label.option,
html body.page-form-get-in-touch.cyb-form-landing.path-webform #wrapper form.webform-submission-form #edit-how-should-we-contact-you- input:checked + label.option,
html body.page-form-vehicle-data-collection.cyb-form-landing.path-webform #wrapper form.webform-submission-form #edit-what-type-of-vehicle input:checked + label.option,
html body.page-form-99-cent-basic.cyb-form-landing.path-webform #wrapper form.webform-submission-form [id^="edit-contact-method"] input:checked + label.option,
html body.page-form-99-cent-basic.cyb-form-landing.path-webform #wrapper form.webform-submission-form [id^="edit-vehicle-type"] input:checked + label.option {
  background: linear-gradient(135deg, var(--jd-wf-lilac), #f3e8ff) !important;
  border: 1.5px solid var(--jd-wf-purple) !important;
  box-shadow: 0 0 0 3px rgba(157, 78, 221, 0.16), 0 8px 18px rgba(59, 10, 92, 0.09) !important;
  color: var(--jd-wf-deep) !important;
  -webkit-text-fill-color: var(--jd-wf-deep) !important;
}

html body.page-form-99-cent-basic.cyb-form-landing.path-webform #wrapper form.webform-submission-form.webform-submission-add-form .form-wrapper .form-item-agree-terms,
html body.page-form-vehicle-data-collection.cyb-form-landing.path-webform #wrapper form.webform-submission-form.webform-submission-add-form .form-wrapper .form-item-agree-terms {
  position: relative !important;
  inset: auto !important;
  display: grid !important;
  grid-template-columns: 1.35rem minmax(0, 1fr) !important;
  align-items: start !important;
  gap: 0.15rem 0.85rem !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 0 1.35rem !important;
  padding: 1rem 1.05rem !important;
  background: linear-gradient(145deg, #fff, #fbf6ff) !important;
  border: 1.5px solid var(--jd-wf-border) !important;
  border-radius: 14px !important;
  box-shadow: 0 5px 15px rgba(59, 10, 92, 0.045) !important;
}

html body.page-form-99-cent-basic.cyb-form-landing.path-webform #wrapper form.webform-submission-form #edit-agree-terms,
html body.page-form-vehicle-data-collection.cyb-form-landing.path-webform #wrapper form.webform-submission-form #edit-agree-terms {
  position: relative !important;
  inset: auto !important;
  top: auto !important;
  left: auto !important;
  grid-column: 1 !important;
  grid-row: 1 !important;
  display: block !important;
  width: 1.28rem !important;
  min-width: 1.28rem !important;
  height: 1.28rem !important;
  min-height: 1.28rem !important;
  margin: 0.12rem 0 0 !important;
  padding: 0 !important;
  opacity: 1 !important;
  transform: none !important;
}

html body.page-form-99-cent-basic.cyb-form-landing.path-webform #wrapper form.webform-submission-form label[for="edit-agree-terms"],
html body.page-form-vehicle-data-collection.cyb-form-landing.path-webform #wrapper form.webform-submission-form label[for="edit-agree-terms"],
html body.page-form-99-cent-basic.cyb-form-landing.path-webform #wrapper form.webform-submission-form .form-item-agree-terms label.control-label.option.js-form-required.form-required,
html body.page-form-vehicle-data-collection.cyb-form-landing.path-webform #wrapper form.webform-submission-form .form-item-agree-terms label.control-label.option.js-form-required.form-required {
  position: static !important;
  inset: auto !important;
  top: auto !important;
  left: auto !important;
  grid-column: 2 !important;
  grid-row: 1 !important;
  display: block !important;
  width: auto !important;
  max-width: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: var(--jd-wf-ink) !important;
  -webkit-text-fill-color: var(--jd-wf-ink) !important;
  font-family: var(--jd-wf-font) !important;
  font-style: normal !important;
  line-height: 1.55 !important;
  text-align: left !important;
  transform: none !important;
}

@media (max-width: 767.98px) {
  html body.cyb-form-landing.path-webform #wrapper form.webform-submission-form.webform-submission-add-form .form-wrapper .js-webform-radios,
  html body.page-form-get-in-touch.cyb-form-landing.path-webform #wrapper form.webform-submission-form #edit-how-should-we-contact-you-,
  html body.page-form-vehicle-data-collection.cyb-form-landing.path-webform #wrapper form.webform-submission-form #edit-what-type-of-vehicle,
  html body.page-form-99-cent-basic.cyb-form-landing.path-webform #wrapper form.webform-submission-form [id^="edit-contact-method"],
  html body.page-form-99-cent-basic.cyb-form-landing.path-webform #wrapper form.webform-submission-form [id^="edit-vehicle-type"] {
    width: 100% !important;
    margin-right: 0 !important;
    margin-left: 0 !important;
  }

  .vehicle-capture {
    margin-bottom: -2rem !important;
  }
  html body.page-form-99-cent-basic.cyb-form-landing.path-webform #wrapper form.webform-submission-form label[for="edit-agree-terms"],
  html body.page-form-vehicle-data-collection.cyb-form-landing.path-webform #wrapper form.webform-submission-form label[for="edit-agree-terms"] {
    width: auto !important;
    padding: 0 !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  html body.path-webform *,
  html body.path-webform *::before,
  html body.path-webform *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* -------------------------------------------------------------------------- */
/* Vehicle Photo Card & Alert Dismissal Overrides (Desktop & Mobile)           */
/* -------------------------------------------------------------------------- */

html body #wrapper .jd-vehicle-photos .jd-vehicle-photo-card,
html body.cyb-form-landing.path-webform #wrapper .jd-vehicle-photos .jd-vehicle-photo-card {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  padding: clamp(0.85rem, 2.5vw, 1.15rem) !important;
  box-sizing: border-box !important;
}

html body #wrapper .jd-vehicle-photo-card > label,
html body #wrapper .jd-vehicle-photo-card .control-label,
html body.cyb-form-landing.path-webform #wrapper form.webform-submission-form .jd-vehicle-photo-card label,
html body.cyb-form-landing.path-webform #wrapper form.webform-submission-form .jd-vehicle-photo-card .control-label {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: center !important;
  flex-wrap: wrap !important;
  gap: 0.35rem !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 0 0.5rem !important;
  padding: 0 !important;
  text-align: center !important;
}

html body #wrapper .jd-vehicle-photo-card .jd-vehicle-photo-name,
html body.cyb-form-landing.path-webform #wrapper .jd-vehicle-photo-card .jd-vehicle-photo-name {
  display: inline-block !important;
  text-align: center !important;
  margin-right: auto !important;
}

html body #wrapper .jd-vehicle-photo-card .jd-vehicle-photo-angle,
html body.cyb-form-landing.path-webform #wrapper .jd-vehicle-photo-card .jd-vehicle-photo-angle {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 !important;
  padding: 0.15rem 0.5rem !important;
  border-radius: 999px !important;
}

html body #wrapper .jd-vehicle-photo-card .form-managed-file,
html body.cyb-form-landing.path-webform #wrapper .jd-vehicle-photo-card .form-managed-file {
  box-sizing: border-box !important;
  width: auto !important;
  margin: 0.35rem 0.25rem !important;
  padding: 0.85rem !important;
  border: 1.5px dashed #be8ee2 !important;
  border-radius: 12px !important;
}

html body #wrapper .jd-vehicle-photo-card .description,
html body #wrapper .jd-vehicle-photo-card .description *,
html body.cyb-form-landing.path-webform #wrapper .jd-vehicle-photo-card .description,
html body.cyb-form-landing.path-webform #wrapper .jd-vehicle-photo-card .description * {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0.5rem auto 0 !important;
  padding: 0 !important;
  text-align: center !important;
}

html body #wrapper .messages,
html body #wrapper .webform-message,
html body #wrapper .task-bar.alert,
html body #wrapper [data-drupal-messages] {
  overflow: visible !important;
  pointer-events: auto !important;
  z-index: 40 !important;
}

html body #wrapper .messages button.close,
html body #wrapper .messages .btn-close,
html body #wrapper .webform-message button.close,
html body #wrapper .webform-message .btn-close,
html body #wrapper .webform-message .js-webform-message__link,
html body #wrapper [data-drupal-messages] button.close,
html body #wrapper [data-drupal-messages] .btn-close,
html body #wrapper .alert-dismissable .close,
html body #wrapper .alert-dismissible .btn-close,
html body #wrapper .button--dismiss,
html body.cyb-form-landing.path-webform #wrapper .messages button.close,
html body.cyb-form-landing.path-webform #wrapper .webform-message button.close {
  position: absolute !important;
  top: 0.45rem !important;
  right: 0.45rem !important;
  z-index: 50 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 2.75rem !important;
  min-width: 2.75rem !important;
  height: 2.75rem !important;
  min-height: 2.75rem !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  cursor: pointer !important;
  pointer-events: auto !important;
  touch-action: manipulation !important;
  -webkit-tap-highlight-color: transparent !important;
}

/* GTranslate float must not cover the message close control. */
html body.path-webform .gtranslate_wrapper,
html body.path-webform .gt_switcher,
html body.path-webform .gt_switcher_wrapper,
html body.path-webform #gtranslate_wrapper,
html body.path-webform [id^="gt-"] {
  z-index: 20 !important;
}

/* assets/css/careers-job-applications.css */
/**
 * Careers directory, job pages, and application system.
 * Loaded after the canonical Webform stylesheet and before breadcrumbs.
 */

html body.path-careers #wrapper,
html body.page-node-type-job-posting #wrapper {
  --jd-careers-ink: #241438;
  --jd-careers-purple: #6716aa;
  --jd-careers-purple-dark: #3b0a5c;
  --jd-careers-purple-light: #9d4edd;
  --jd-careers-wash: #faf5ff;
  --jd-careers-soft: #f3e8ff;
  --jd-careers-border: #e2d4ec;
  --jd-careers-muted: #62596b;
}

html body.path-careers #wrapper .jd-careers-directory,
html body.page-node-type-job-posting #wrapper .node--type-job-posting {
  margin-inline: auto;
  max-width: 1180px;
  padding: clamp(1.5rem, 4vw, 4rem) clamp(1rem, 3vw, 2rem);
}

html body.page-node-type-job-posting #wrapper .jd-job-posting {
  background: linear-gradient(145deg, #fff 0%, var(--jd-careers-wash) 100%);
  border: 1px solid var(--jd-careers-border);
  border-radius: 24px;
  box-shadow: 0 20px 55px rgba(59, 10, 92, 0.09);
  color: var(--jd-careers-ink);
  margin-bottom: 2rem;
  overflow: hidden;
  padding: clamp(1.4rem, 4vw, 3.25rem);
}

/* Neutralize old broad paragraph/heading card rules on these new routes. */
html body.path-careers #wrapper .jd-careers-directory :is(p, h2, h3, li),
html body.page-node-type-job-posting #wrapper .jd-job-posting :is(p, h1, h2, li),
html body.path-careers #wrapper .jd-job-form-intro :is(p, h2),
html body.page-node-type-job-posting #wrapper .jd-job-form-intro :is(p, h2) {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: var(--jd-careers-ink) !important;
  max-width: none !important;
  padding: 0 !important;
  width: auto !important;
}

/* The directory hero shares the reference layout, with Johnny Detail colors. */
/* Scope shell resets to the directory, leaving job and application pages alone. */
html body.path-careers.page-careers #wrapper :is(#content-wide-top, #content-wide-top > .region, #page-wrapper) {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

html body.path-careers.page-careers #wrapper #content-wide-top #block-breadcrumbs {
  margin-bottom: .8rem !important;
}

html body.path-careers.page-careers #wrapper #page-wrapper > .container {
  width: 100% !important;
  margin-inline: auto !important;
  padding: 0 !important;
}

html body.path-careers.page-careers #wrapper #page-wrapper :is(.row.content-layout, .main-content, .region-content) {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

html body.path-careers.page-careers #wrapper #page-wrapper .main-content {
  flex-basis: 100%;
}

html body.path-careers.page-careers #wrapper .jd-careers-directory {
  box-sizing: border-box;
  width: min(calc(100% - 32px), 1120px) !important;
  max-width: 1120px;
  margin: 0 auto !important;
  padding: 0 !important;
}

html body.path-careers #wrapper .jd-careers-hero {
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  color: var(--jd-careers-ink);
  margin: 0 !important;
  padding: clamp(28px, 5vw, 56px) 0 34px;
  text-align: center;
}

html body.path-careers #wrapper .jd-careers-hero h1 {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: var(--jd-careers-ink) !important;
  display: block !important;
  font-size: clamp(2.15rem, 5vw, 4rem) !important;
  line-height: 1.04 !important;
  margin: 0 0 16px !important;
  max-width: none !important;
  padding: 0 !important;
  visibility: visible !important;
  width: auto !important;
}

html body.path-careers #wrapper .jd-careers-hero .jd-careers-eyebrow {
  color: var(--jd-careers-purple-dark) !important;
  font-size: .82rem;
  margin: 0 0 5.6px;
}

html body.path-careers #wrapper .jd-careers-hero > p:last-child {
  color: var(--jd-careers-muted) !important;
  font-size: clamp(1.05rem, 2vw, 1.25rem);
  line-height: 1.7;
  margin-bottom: 5.6px;
}

@media (max-width: 767.98px) {
  html body.path-careers.page-careers #wrapper #page-wrapper > .container {
    padding-inline: 1.35rem !important;
  }
}

@media (max-width: 720px) {
  html body.path-careers.page-careers #wrapper .jd-careers-directory {
    width: 100% !important;
  }

  html body.path-careers #wrapper .jd-careers-hero {
    padding-top: 26px;
  }
}

html body.page-node-type-job-posting #wrapper .jd-job-posting h1 {
  color: var(--jd-careers-purple-dark) !important;
  display: block !important;
  font-size: clamp(2rem, 5vw, 3.5rem) !important;
  line-height: 1.08 !important;
  margin: 0 0 1rem !important;
  visibility: visible !important;
}

html body.path-careers #wrapper .jd-careers-eyebrow,
html body.page-node-type-job-posting #wrapper .jd-job-eyebrow,
html body.page-node-type-job-posting #wrapper .jd-job-form-eyebrow {
  color: var(--jd-careers-purple) !important;
  font-size: 0.8rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  margin: 0 0 0.65rem;
  text-transform: uppercase;
}

html body.path-careers #wrapper .jd-careers-card-link,
html body.page-node-type-job-posting #wrapper .webform-button--submit {
  align-items: center;
  background: linear-gradient(135deg, var(--jd-careers-purple-dark), var(--jd-careers-purple));
  border: 0;
  border-radius: 999px;
  box-shadow: 0 8px 20px rgba(103, 22, 170, 0.2);
  color: #fff;
  display: inline-flex;
  font-weight: 800;
  justify-content: center;
  min-height: 48px;
  padding: 0.75rem 1.35rem;
  text-decoration: none;
}

html body.path-careers #wrapper .jd-careers-card-link:hover,
html body.page-node-type-job-posting #wrapper .webform-button--submit:hover {
  background: var(--jd-careers-purple-dark);
  color: #fff;
  transform: translateY(-1px);
}

html body.path-careers #wrapper .jd-careers-department {
  margin-block: 2.5rem;
}

/* The hero already supplies the spacing before the first department. */
html body.path-careers.page-careers #wrapper .jd-careers-hero + .jd-careers-department {
  margin-top: 0;
}

html body.path-careers #wrapper .jd-careers-department > h2 {
  color: var(--jd-careers-purple-dark) !important;
  margin-bottom: 1rem;
}

html body.path-careers #wrapper .jd-careers-grid {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

html body.path-careers #wrapper .jd-careers-card {
  background: #fff;
  border: 1px solid var(--jd-careers-border);
  border-radius: 18px;
  display: flex;
  flex-direction: column;
  min-height: 250px;
  padding: 1.35rem;
}

html body.path-careers #wrapper .jd-careers-card h3 {
  font-size: 1.2rem;
  line-height: 1.3;
  margin: 0 0 0.6rem;
}

html body.path-careers #wrapper .jd-careers-card h3 a {
  color: var(--jd-careers-purple-dark);
  text-decoration-thickness: 2px;
  text-underline-offset: 0.18em;
}

html body.path-careers #wrapper .jd-careers-location {
  color: var(--jd-careers-purple) !important;
  font-size: 0.9rem;
  font-weight: 700;
}

html body.path-careers #wrapper .jd-careers-card-link {
  align-self: flex-start;
  margin-top: auto;
}

html body.page-node-type-job-posting #wrapper .jd-job-lead {
  font-size: clamp(1.1rem, 2vw, 1.35rem);
  line-height: 1.65;
  max-width: 850px;
}

html body.page-node-type-job-posting #wrapper .jd-job-facts {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 1.75rem 0;
}

html body.page-node-type-job-posting #wrapper .jd-job-facts > div {
  background: #fff;
  border: 1px solid var(--jd-careers-border);
  border-radius: 14px;
  display: grid;
  gap: 0.35rem;
  padding: 1rem;
}

html body.page-node-type-job-posting #wrapper .jd-job-facts strong,
html body.page-node-type-job-posting #wrapper .jd-job-posting h2 {
  color: var(--jd-careers-purple-dark);
}

html body.page-node-type-job-posting #wrapper .jd-job-posting section,
html body.page-node-type-job-posting #wrapper .jd-job-equity {
  border-top: 1px solid var(--jd-careers-border);
  margin-top: 1.75rem;
  padding-top: 1.5rem;
}

html body.page-node-type-job-posting #wrapper .jd-job-equity {
  background: var(--jd-careers-soft);
  border: 0;
  border-radius: 16px;
  padding: 1.25rem;
}

html body.path-careers #wrapper .webform-submission-form,
html body.page-node-type-job-posting #wrapper .webform-submission-form {
  background: #fff;
  border: 1px solid var(--jd-careers-border);
  border-radius: 22px;
  box-shadow: 0 16px 44px rgba(59, 10, 92, 0.08);
  margin-block: 2rem;
  padding: clamp(1rem, 3vw, 2rem);
}

html body.path-careers #wrapper .webform-progress-tracker,
html body.page-node-type-job-posting #wrapper .webform-progress-tracker {
  margin-bottom: 2rem;
}

html body.path-careers #wrapper .webform-progress-tracker .progress-step.is-active .progress-marker,
html body.page-node-type-job-posting #wrapper .webform-progress-tracker .progress-step.is-active .progress-marker,
html body.path-careers #wrapper .webform-progress-tracker .progress-step.is-complete .progress-marker,
html body.page-node-type-job-posting #wrapper .webform-progress-tracker .progress-step.is-complete .progress-marker {
  background-color: var(--jd-careers-purple);
}

html body.path-careers #wrapper .form-item > label,
html body.page-node-type-job-posting #wrapper .form-item > label,
html body.path-careers #wrapper legend,
html body.page-node-type-job-posting #wrapper legend {
  color: var(--jd-careers-ink);
  font-weight: 750;
}

html body.path-careers #wrapper :is(input, select, textarea):focus,
html body.page-node-type-job-posting #wrapper :is(input, select, textarea):focus {
  border-color: var(--jd-careers-purple);
  box-shadow: 0 0 0 3px rgba(157, 78, 221, 0.22);
  outline: 0;
}

html body.path-careers #wrapper .jd-assessment-note,
html body.page-node-type-job-posting #wrapper .jd-assessment-note,
html body.path-careers #wrapper .jd-form-privacy,
html body.page-node-type-job-posting #wrapper .jd-form-privacy {
  background: var(--jd-careers-wash);
  border-left: 4px solid var(--jd-careers-purple);
  border-radius: 0 12px 12px 0;
  padding: 1rem 1.2rem;
}

@media (max-width: 800px) {
  html body.path-careers #wrapper .jd-careers-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 520px) {
  html body.path-careers #wrapper .jd-careers-grid,
  html body.page-node-type-job-posting #wrapper .jd-job-facts {
    grid-template-columns: 1fr;
  }

  html body.path-careers #wrapper .jd-careers-directory,
  html body.page-node-type-job-posting #wrapper .node--type-job-posting {
    padding-inline: 0.75rem;
  }

  html body.page-node-type-job-posting #wrapper .jd-job-posting,
  html body.path-careers #wrapper .webform-submission-form,
  html body.page-node-type-job-posting #wrapper .webform-submission-form {
    border-radius: 16px;
    padding: 1rem;
  }

  html body.path-careers #wrapper .webform-progress-tracker .progress-text,
  html body.page-node-type-job-posting #wrapper .webform-progress-tracker .progress-text {
    font-size: 0.72rem;
  }
}

/* Standalone role applications use path-webform instead of path-careers. */
html body.path-webform[class*="page-careers-apply-"] #wrapper {
  --jd-careers-ink: #241438;
  --jd-careers-purple: #6716aa;
  --jd-careers-purple-dark: #3b0a5c;
  --jd-careers-wash: #faf5ff;
  --jd-careers-soft: #f3e8ff;
  --jd-careers-border: #e2d4ec;
  color: var(--jd-careers-ink);
}

html body.path-webform[class*="page-careers-apply-"] #wrapper main,
html body.path-webform[class*="page-careers-apply-"] #wrapper .region-content {
  margin-inline: auto;
  max-width: 1180px;
}

html body.path-webform[class*="page-careers-apply-"] #wrapper .webform-submission-form {
  background: #fff !important;
  border: 1px solid var(--jd-careers-border) !important;
  border-radius: 22px !important;
  box-shadow: 0 16px 44px rgba(59, 10, 92, 0.08) !important;
  color: var(--jd-careers-ink) !important;
  margin: 2rem auto !important;
  max-width: 980px !important;
  padding: clamp(1rem, 3vw, 2rem) !important;
}

html body.path-webform[class*="page-careers-apply-"] #wrapper .jd-job-form-intro {
  background: var(--jd-careers-wash) !important;
  border: 1px solid var(--jd-careers-border) !important;
  border-radius: 16px !important;
  color: var(--jd-careers-ink) !important;
  margin-bottom: 1.5rem !important;
  padding: clamp(1rem, 3vw, 1.5rem) !important;
}

html body.path-webform[class*="page-careers-apply-"] #wrapper .jd-job-form-intro :is(p, h2),
html body.path-webform[class*="page-careers-apply-"] #wrapper .webform-submission-form :is(label, legend, .progress-title, .webform-progress__status) {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: var(--jd-careers-ink) !important;
  text-shadow: none !important;
}

html body.path-webform[class*="page-careers-apply-"] #wrapper .jd-job-form-intro h2 {
  color: var(--jd-careers-purple-dark) !important;
  font-size: clamp(1.75rem, 5vw, 2.6rem) !important;
  line-height: 1.15 !important;
  margin: 0 0 1rem !important;
  padding: 0 !important;
}

html body.path-webform[class*="page-careers-apply-"] #wrapper .jd-job-form-intro p {
  margin: 0.6rem 0 !important;
  padding: 0 !important;
}

html body.path-webform[class*="page-careers-apply-"] #wrapper .webform-submission-form :is(input, select, textarea) {
  background-color: #fff !important;
  color: var(--jd-careers-ink) !important;
  text-shadow: none !important;
}

html body.path-webform[class*="page-careers-apply-"] #wrapper .webform-submission-form :is(input, select, textarea):focus {
  border-color: var(--jd-careers-purple) !important;
  box-shadow: 0 0 0 3px rgba(157, 78, 221, 0.22) !important;
  outline: 0 !important;
}

html body.path-webform[class*="page-careers-apply-"] #wrapper .webform-progress-tracker .progress-step.is-active .progress-marker,
html body.path-webform[class*="page-careers-apply-"] #wrapper .webform-progress-tracker .progress-step.is-complete .progress-marker {
  background-color: var(--jd-careers-purple) !important;
}

html body.path-webform[class*="page-careers-apply-"] #wrapper .webform-button--submit,
html body.path-webform[class*="page-careers-apply-"] #wrapper .webform-button--next,
html body.path-webform[class*="page-careers-apply-"] #wrapper .webform-button--preview {
  background: linear-gradient(135deg, var(--jd-careers-purple-dark), var(--jd-careers-purple)) !important;
  border: 0 !important;
  border-radius: 999px !important;
  box-shadow: 0 8px 20px rgba(103, 22, 170, 0.2) !important;
  color: #fff !important;
  min-height: 48px !important;
  padding: 0.75rem 1.35rem !important;
  text-shadow: none !important;
}

@media (max-width: 520px) {
  html body.path-webform[class*="page-careers-apply-"] #wrapper .webform-submission-form {
    border-radius: 16px !important;
    margin: 1rem 0.75rem !important;
    padding: 1rem !important;
  }

  html body.path-webform[class*="page-careers-apply-"] #wrapper .webform-progress-tracker .progress-text,
  html body.path-webform[class*="page-careers-apply-"] #wrapper .webform-progress__status {
    clip: rect(0 0 0 0) !important;
    clip-path: inset(50%) !important;
    height: 1px !important;
    overflow: hidden !important;
    position: absolute !important;
    white-space: nowrap !important;
    width: 1px !important;
  }

  html body.path-webform[class*="page-careers-apply-"] #wrapper .webform-progress-tracker .progress-marker {
    height: 1.7rem !important;
    width: 1.7rem !important;
  }
}

/* --------------------------------------------------------------------------
 * Shared job application UI.
 *
 * The hiring module adds .jd-careers-application to every canonical job
 * application. Keep these rules form-scoped so standalone Webforms and forms
 * embedded on job postings share one responsive system without affecting
 * unrelated public Webforms.
 * -------------------------------------------------------------------------- */

html body.path-webform[class*="page-careers-apply-"] #wrapper .webform-ajax-form-wrapper,
html body.page-node-type-job-posting #wrapper .field-field-job-application .webform-ajax-form-wrapper {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
  margin: 0 auto !important;
  max-width: 100% !important;
  overflow: visible !important;
  padding: 0 !important;
  width: 100% !important;
}

html body:not(.path-admin) #wrapper form.jd-careers-application {
  background: #fff !important;
  border: 1px solid var(--jd-careers-border, #e2d4ec) !important;
  border-radius: 22px !important;
  box-shadow: 0 16px 44px rgba(59, 10, 92, 0.1) !important;
  box-sizing: border-box !important;
  color: var(--jd-careers-ink, #241438) !important;
  display: block !important;
  float: none !important;
  height: auto !important;
  margin: 2rem auto !important;
  max-width: 1200px !important;
  min-width: 0 !important;
  overflow: hidden !important;
  padding: clamp(1rem, 3vw, 2rem) !important;
  position: relative !important;
  width: 100% !important;
}

html body:not(.path-admin) #wrapper form.jd-careers-application *,
html body:not(.path-admin) #wrapper form.jd-careers-application *::before,
html body:not(.path-admin) #wrapper form.jd-careers-application *::after {
  box-sizing: border-box;
}

/* Wizard progress: full-width tracker, then a centered status line. */
html body:not(.path-admin) #wrapper form.jd-careers-application .webform-progress {
  background: linear-gradient(180deg, #fff 0%, var(--jd-careers-wash, #faf5ff) 100%) !important;
  border: 0 !important;
  border-bottom: 1px solid var(--jd-careers-border, #e2d4ec) !important;
  border-radius: 16px 16px 0 0 !important;
  display: block !important;
  float: none !important;
  height: auto !important;
  margin: 0 0 1.5rem !important;
  max-width: 100% !important;
  min-height: 0 !important;
  overflow: visible !important;
  padding: 1.25rem 1rem 1rem !important;
  position: relative !important;
  width: 100% !important;
}

html body:not(.path-admin) #wrapper form.jd-careers-application .webform-progress-tracker {
  align-items: flex-start !important;
  display: flex !important;
  float: none !important;
  justify-content: space-between !important;
  margin: 0 auto !important;
  max-width: 64rem !important;
  min-width: 0 !important;
  overflow: visible !important;
  padding: 0 !important;
  position: relative !important;
  width: 100% !important;
}

html body:not(.path-admin) #wrapper form.jd-careers-application .webform-progress-tracker .progress-step {
  align-items: center !important;
  background: transparent !important;
  border: 0 !important;
  color: var(--jd-careers-muted, #62596b) !important;
  display: flex !important;
  flex: 1 1 0 !important;
  flex-direction: column !important;
  margin: 0 !important;
  min-width: 0 !important;
  padding: 0 0.2rem !important;
  position: relative !important;
  text-align: center !important;
}

html body:not(.path-admin) #wrapper form.jd-careers-application .webform-progress-tracker .progress-step::before {
  background: #e7d8f3 !important;
  border: 0 !important;
  content: "" !important;
  display: block !important;
  height: 3px !important;
  left: -50% !important;
  position: absolute !important;
  right: 50% !important;
  top: 1rem !important;
  width: auto !important;
  z-index: 0 !important;
}

html body:not(.path-admin) #wrapper form.jd-careers-application .webform-progress-tracker .progress-step:first-child::before {
  display: none !important;
}

html body:not(.path-admin) #wrapper form.jd-careers-application .webform-progress-tracker .progress-step.is-active::before,
html body:not(.path-admin) #wrapper form.jd-careers-application .webform-progress-tracker .progress-step.is-complete::before {
  background: linear-gradient(90deg, var(--jd-careers-purple, #6716aa), var(--jd-careers-purple-light, #9d4edd)) !important;
}

html body:not(.path-admin) #wrapper form.jd-careers-application .webform-progress-tracker .progress-marker {
  align-items: center !important;
  background: #fff !important;
  border: 2px solid #cfa8ed !important;
  border-radius: 50% !important;
  box-shadow: 0 3px 10px rgba(59, 10, 92, 0.08) !important;
  color: var(--jd-careers-purple, #6716aa) !important;
  display: inline-flex !important;
  flex: 0 0 2.05rem !important;
  font-size: 0.82rem !important;
  font-weight: 850 !important;
  height: 2.05rem !important;
  justify-content: center !important;
  line-height: 1 !important;
  margin: 0 0 0.45rem !important;
  min-width: 2.05rem !important;
  padding: 0 !important;
  position: relative !important;
  width: 2.05rem !important;
  z-index: 1 !important;
}

html body:not(.path-admin) #wrapper form.jd-careers-application .webform-progress-tracker .progress-marker::before,
 .webform-progress-tracker .progress-marker::after {
  content: none !important;
  display: none !important;
}

html body:not(.path-admin) #wrapper form.jd-careers-application .webform-progress-tracker .progress-step.is-active .progress-marker {
  background: linear-gradient(145deg, var(--jd-careers-purple-dark, #3b0a5c), var(--jd-careers-purple, #6716aa)) !important;
  border-color: var(--jd-careers-purple-dark, #3b0a5c) !important;
  box-shadow: 0 0 0 4px rgba(157, 78, 221, 0.17), 0 7px 16px rgba(59, 10, 92, 0.22) !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

html body:not(.path-admin) #wrapper form.jd-careers-application .webform-progress-tracker .progress-step.is-complete .progress-marker {
  background: var(--jd-careers-soft, #f3e8ff) !important;
  border-color: var(--jd-careers-purple, #6716aa) !important;
  color: var(--jd-careers-purple-dark, #3b0a5c) !important;
}

html body:not(.path-admin) #wrapper form.jd-careers-application .webform-progress-tracker .progress-text,
html body:not(.path-admin) #wrapper form.jd-careers-application .webform-progress-tracker .progress-title {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: inherit !important;
  display: block !important;
  font-size: clamp(0.67rem, 1vw, 0.78rem) !important;
  font-weight: 700 !important;
  line-height: 1.22 !important;
  margin: 0 !important;
  max-width: 100% !important;
  overflow-wrap: anywhere !important;
  padding: 0 !important;
  text-shadow: none !important;
  -webkit-text-fill-color: currentColor !important;
}

html body:not(.path-admin) #wrapper form.jd-careers-application .webform-progress-tracker .progress-step.is-active .progress-title {
  color: var(--jd-careers-purple-dark, #3b0a5c) !important;
  font-weight: 850 !important;
}

html body:not(.path-admin) #wrapper form.jd-careers-application .webform-progress__status {
  align-items: center !important;
  background: var(--jd-careers-soft, #f3e8ff) !important;
  border: 1px solid #e6cafa !important;
  border-radius: 999px !important;
  box-shadow: none !important;
  clip: auto !important;
  clip-path: none !important;
  color: var(--jd-careers-purple-dark, #3b0a5c) !important;
  display: flex !important;
  float: none !important;
  font-size: 0.78rem !important;
  font-weight: 800 !important;
  gap: 0.35rem !important;
  height: auto !important;
  justify-content: center !important;
  margin: 0.85rem auto 0 !important;
  max-width: 100% !important;
  min-height: 2rem !important;
  overflow: visible !important;
  padding: 0.35rem 0.8rem !important;
  position: static !important;
  text-align: center !important;
  text-shadow: none !important;
  white-space: normal !important;
  width: max-content !important;
}

html body:not(.path-admin) #wrapper form.jd-careers-application .webform-progress__summary {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: inherit !important;
  margin: 0 !important;
  min-height: 0 !important;
  padding: 0 !important;
}

html body:not(.path-admin) #wrapper form.jd-careers-application .webform-progress__percentage {
  color: var(--jd-careers-purple, #6716aa) !important;
  font-weight: 850 !important;
  margin: 0 !important;
}

/* Form content and controls. */
html body:not(.path-admin) #wrapper form.jd-careers-application .jd-job-form-intro {
  background: var(--jd-careers-wash, #faf5ff) !important;
  border: 1px solid var(--jd-careers-border, #e2d4ec) !important;
  border-radius: 16px !important;
  color: var(--jd-careers-ink, #241438) !important;
  margin: 0 0 1.5rem !important;
  padding: clamp(1rem, 3vw, 1.5rem) !important;
}

html body:not(.path-admin) #wrapper form.jd-careers-application :is(.form-item, fieldset, .fieldset-wrapper, .form-wrapper) {
  max-width: 100% !important;
  min-width: 0 !important;
}

html body:not(.path-admin) #wrapper form.jd-careers-application .form-item {
  margin-bottom: 1.15rem !important;
}

html body:not(.path-admin) #wrapper form.jd-careers-application :is(label, legend, .fieldset-legend) {
  color: var(--jd-careers-ink, #241438) !important;
  font-weight: 750 !important;
  line-height: 1.4 !important;
  max-width: 100% !important;
  overflow-wrap: anywhere !important;
  text-shadow: none !important;
}

html body:not(.path-admin) #wrapper form.jd-careers-application :is(.description, .webform-element-description, .help-block) {
  color: var(--jd-careers-muted, #62596b) !important;
  line-height: 1.5 !important;
  margin-top: 0.4rem !important;
  max-width: 100% !important;
  overflow-wrap: anywhere !important;
  text-shadow: none !important;
}

html body:not(.path-admin) #wrapper form.jd-careers-application :is(
  input[type="text"],
  input[type="email"],
  input[type="tel"],
  input[type="number"],
  input[type="url"],
  input[type="date"],
  input[type="time"],
  input[type="datetime-local"],
  select,
  textarea
) {
  background: #fff !important;
  border: 1.5px solid #d7b9eb !important;
  border-radius: 12px !important;
  color: var(--jd-careers-ink, #241438) !important;
  display: block !important;
  font-size: 16px !important;
  line-height: 1.4 !important;
  margin: 0 !important;
  max-width: 100% !important;
  min-width: 0 !important;
  padding: 0.75rem 0.9rem !important;
  text-shadow: none !important;
  width: 100% !important;
}

html body:not(.path-admin) #wrapper form.jd-careers-application :is(
  input[type="text"],
  input[type="email"],
  input[type="tel"],
  input[type="number"],
  input[type="url"],
  input[type="date"],
  input[type="time"],
  input[type="datetime-local"],
  select
) {
  min-height: 3.25rem !important;
}

html body:not(.path-admin) #wrapper form.jd-careers-application textarea {
  min-height: 8rem !important;
  resize: vertical !important;
}

html body:not(.path-admin) #wrapper form.jd-careers-application :is(input, select, textarea):focus {
  border-color: var(--jd-careers-purple, #6716aa) !important;
  box-shadow: 0 0 0 4px rgba(157, 78, 221, 0.2) !important;
  outline: 0 !important;
}

/* Keep one accessible select; Martis otherwise draws a second clone. */
html body:not(.path-admin) #wrapper form.jd-careers-application :is(.nice-select, .chosen-container) {
  display: none !important;
}

/* Override the old path-webform rule that assigns required Nice Select clones
 * an explicit display value with several extra classes. */
html body.path-webform[class*="page-careers-apply-"] #wrapper form.jd-careers-application .nice-select,
html body.path-webform[class*="page-careers-apply-"] #wrapper form.jd-careers-application .nice-select.form-select,
html body.path-webform[class*="page-careers-apply-"] #wrapper form.jd-careers-application .nice-select.form-select.required.form-control,
html body.path-webform[class*="page-careers-apply-"] #wrapper form.jd-careers-application .chosen-container {
  display: none !important;
  height: 0 !important;
  margin: 0 !important;
  visibility: hidden !important;
  width: 0 !important;
}

html body:not(.path-admin) #wrapper form.jd-careers-application .select-wrapper {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  display: block !important;
  margin: 0 !important;
  max-width: 100% !important;
  padding: 0 !important;
  position: relative !important;
  width: 100% !important;
}

html body:not(.path-admin) #wrapper form.jd-careers-application .select-wrapper::before,
html body:not(.path-admin) #wrapper form.jd-careers-application .select-wrapper::after {
  content: none !important;
  display: none !important;
}

html body:not(.path-admin) #wrapper form.jd-careers-application select {
  appearance: auto !important;
  opacity: 1 !important;
  visibility: visible !important;
}

html body:not(.path-admin) #wrapper form.jd-careers-application [data-webform-key="assessment"] .js-webform-radios {
  grid-template-columns: minmax(0, 1fr) !important;
}

html body:not(.path-admin) #wrapper form.jd-careers-application :is(.js-webform-radios, .js-webform-checkboxes) {
  max-width: 100% !important;
  min-width: 0 !important;
  width: 100% !important;
}

html body:not(.path-admin) #wrapper form.jd-careers-application :is(.js-webform-radios, .js-webform-checkboxes) label.option {
  height: auto !important;
  min-height: 3.25rem !important;
  overflow-wrap: anywhere !important;
  white-space: normal !important;
}

html body:not(.path-admin) #wrapper form.jd-careers-application :is(.form-managed-file, .webform-document-file) {
  max-width: 100% !important;
  min-width: 0 !important;
  overflow-wrap: anywhere !important;
  width: 100% !important;
}

html body:not(.path-admin) #wrapper form.jd-careers-application .form-managed-file {
  align-items: center !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 0.75rem !important;
}

html body:not(.path-admin) #wrapper form.jd-careers-application input[type="file"] {
  max-width: 100% !important;
  min-height: 2.75rem !important;
  overflow: hidden !important;
  width: 100% !important;
}

html body:not(.path-admin) #wrapper form.jd-careers-application :is(.webform-multiple-table-responsive, .webform-multiple-table, .webform-custom-composite) {
  max-width: 100% !important;
  min-width: 0 !important;
  overflow-x: auto !important;
  overscroll-behavior-inline: contain;
  -webkit-overflow-scrolling: touch;
}

html body:not(.path-admin) #wrapper form.jd-careers-application .webform-signature-pad,
html body:not(.path-admin) #wrapper form.jd-careers-application .webform-signature-pad canvas {
  max-width: 100% !important;
  touch-action: none;
}

html body:not(.path-admin) #wrapper form.jd-careers-application :is(.webform-preview, .webform-submission-data) {
  max-width: 100% !important;
  min-width: 0 !important;
  overflow-wrap: anywhere !important;
}

html body:not(.path-admin) #wrapper form.jd-careers-application :is(.messages--error, .form-item--error-message) {
  border-radius: 10px !important;
  max-width: 100% !important;
  overflow-wrap: anywhere !important;
}

/* In-flow wizard actions; no mobile overlay above fields or the keyboard. */
html body:not(.path-admin) #wrapper form.jd-careers-application .form-actions.webform-actions {
  align-items: center !important;
  background: transparent !important;
  border: 0 !important;
  border-top: 1px solid var(--jd-careers-border, #e2d4ec) !important;
  box-shadow: none !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 1rem !important;
  justify-content: center !important;
  margin: 1.5rem auto 0 !important;
  max-width: 100% !important;
  padding: 1.25rem 0 0 !important;
  position: static !important;
  transform: none !important;
  width: 100% !important;
}

html body:not(.path-admin) #wrapper form.jd-careers-application .form-actions.webform-actions :is(input, button) {
  min-height: 3rem !important;
}

@media (max-width: 767.98px) {
  html body:not(.path-admin) #wrapper form.jd-careers-application {
    border-radius: 18px !important;
    margin: 1rem auto !important;
    max-width: 103% !important;
    padding: 0.75rem !important;
    width: 103% !important;
    margin-left: -0.25rem !important;
  }

  html body:not(.path-admin) #wrapper form.jd-careers-application .webform-progress {
    margin-bottom: 1rem !important;
    padding: 1rem 0.5rem 0.8rem !important;
  }

  html body:not(.path-admin) #wrapper form.jd-careers-application .webform-progress-tracker {
    align-items: flex-start !important;
    display: flex !important;
    margin: 0 auto !important;
    overflow: visible !important;
    padding: 0 0 2.35rem !important;
    position: relative !important;
    width: 100% !important;
  }

  html body:not(.path-admin) #wrapper form.jd-careers-application .webform-progress-tracker::before {
    background: #e7d8f3 !important;
    content: "" !important;
    display: block !important;
    height: 3px !important;
    left: 5.55% !important;
    position: absolute !important;
    right: 5.55% !important;
    top: 0.78rem !important;
    z-index: 0 !important;
  }

  html body:not(.path-admin) #wrapper form.jd-careers-application .webform-progress-tracker .progress-step,
  html body:not(.path-admin) #wrapper form.jd-careers-application .webform-progress-tracker .progress-step.is-active {
    flex: 1 1 0 !important;
    min-width: 0 !important;
    padding: 0 !important;
    position: static !important;
  }

  html body:not(.path-admin) #wrapper form.jd-careers-application .webform-progress-tracker .progress-step::before {
    display: none !important;
  }

  html body:not(.path-admin) #wrapper form.jd-careers-application .webform-progress-tracker .progress-marker {
    flex-basis: 1.55rem !important;
    font-size: 0.68rem !important;
    height: 1.55rem !important;
    margin: 0 !important;
    min-width: 1.55rem !important;
    width: 1.55rem !important;
  }

  html body:not(.path-admin) #wrapper form.jd-careers-application .webform-progress-tracker .progress-text {
    clip: rect(0 0 0 0) !important;
    clip-path: inset(50%) !important;
    height: 1px !important;
    overflow: hidden !important;
    position: absolute !important;
    white-space: nowrap !important;
    width: 1px !important;
  }

  html body:not(.path-admin) #wrapper form.jd-careers-application .webform-progress-tracker .progress-step.is-active .progress-text {
    clip: auto !important;
    clip-path: none !important;
    color: var(--jd-careers-purple-dark, #3b0a5c) !important;
    display: block !important;
    font-size: 0.82rem !important;
    font-weight: 850 !important;
    height: auto !important;
    left: 0 !important;
    line-height: 1.3 !important;
    max-width: 100% !important;
    overflow: visible !important;
    position: absolute !important;
    right: 0 !important;
    text-align: center !important;
    top: 1.95rem !important;
    white-space: normal !important;
    width: 100% !important;
  }

  html body:not(.path-admin) #wrapper form.jd-careers-application .webform-progress__status {
    display: flex !important;
    margin-top: 0.35rem !important;
    max-width: 100% !important;
    width: max-content !important;
  }

  html body:not(.path-admin) #wrapper form.jd-careers-application .jd-job-form-intro {
    border-radius: 14px !important;
    margin-bottom: 1rem !important;
    padding: 1rem !important;
  }

  html body:not(.path-admin) #wrapper form.jd-careers-application .jd-job-form-intro h2 {
    font-size: clamp(1.65rem, 9vw, 2.15rem) !important;
    overflow-wrap: anywhere !important;
  }

  html body:not(.path-admin) #wrapper form.jd-careers-application :is(.js-webform-radios, .js-webform-checkboxes) {
    gap: 0.7rem !important;
    grid-template-columns: minmax(0, 1fr) !important;
  }

  html body:not(.path-admin) #wrapper form.jd-careers-application .form-actions.webform-actions {
    align-items: stretch !important;
    flex-direction: column !important;
    gap: 0.85rem !important;
    padding-top: 1rem !important;
  }

  html body:not(.path-admin) #wrapper form.jd-careers-application .form-actions.webform-actions :is(
    .webform-button--next,
    .webform-button--preview,
    .webform-button--submit
  ) {
    order: 1 !important;
  }

  html body:not(.path-admin) #wrapper form.jd-careers-application .form-actions.webform-actions .webform-button--previous {
    order: 2 !important;
  }

  html body:not(.path-admin) #wrapper form.jd-careers-application .form-actions.webform-actions .webform-button--draft {
    order: 3 !important;
  }

  html body:not(.path-admin) #wrapper form.jd-careers-application .form-actions.webform-actions :is(input, button) {
    margin: 0 !important;
    max-width: 100% !important;
    min-height: 3.1rem !important;
    min-width: 0 !important;
    width: 100% !important;
  }
}

@media (max-width: 379.98px) {
  html body:not(.path-admin) #wrapper form.jd-careers-application {
    padding: 0.6rem !important;
  }

  html body:not(.path-admin) #wrapper form.jd-careers-application .webform-progress-tracker .progress-marker {
    flex-basis: 1.4rem !important;
    font-size: 0.62rem !important;
    height: 1.4rem !important;
    min-width: 1.4rem !important;
    width: 1.4rem !important;
  }

  html body:not(.path-admin) #wrapper form.jd-careers-application .webform-progress-tracker::before {
    top: 0.7rem !important;
  }
}

/* Searchable public careers board; hiring admin has its own module library. */
html body.path-careers #wrapper { --jd-careers-purple: #6716aa; --jd-careers-purple-dark: #3b0a5c; --jd-career-ink: #241438; --jd-career-muted: #62596b; --jd-career-border: #e2d4ec; }
html body.path-careers #wrapper .jd-careers-index { box-sizing: border-box; width: 100%; max-width: 1160px; margin-inline: auto; }
html body.path-careers #wrapper .jd-careers-index * { box-sizing: border-box; }
html body.path-careers #wrapper .jd-careers-hero { padding: 28px 0 32px; text-align: left !important; background: none !important; border: 0 !important; box-shadow: none !important; }
html body.path-careers #wrapper :is(.jd-careers-kicker,.jd-career-card__department) { margin: 0 0 10px; text-align: left !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: none !important; box-shadow: none !important; color: #6716aa !important; -webkit-text-fill-color: #6716aa !important; font-size: 12px; font-weight: 800; line-height: 1.5; letter-spacing: .08em; text-transform: uppercase; }
html body.path-careers #wrapper .jd-careers-hero h1 { max-width: 900px; text-align: left !important; margin: 0 0 18px; padding: 0; color: #241438; -webkit-text-fill-color: #241438; font-size: clamp(30px,3.8vw,52px); line-height: 1.12; letter-spacing: -.025em; }
html body.path-careers #wrapper .jd-careers-hero > p:last-of-type { max-width: 760px; text-align: left !important; margin: 0 0 20px; padding: 0 !important; background: none !important; border: 0 !important; box-shadow: none !important; color: #62596b !important; -webkit-text-fill-color: #62596b !important; font-size: 18px; line-height: 1.65; }
html body.path-careers #wrapper :is(.jd-careers-highlights,.jd-career-card__facts,.jd-careers-active-filters) { list-style: none; display: flex; flex-wrap: wrap; gap: 8px; margin: 18px 0 0; padding: 0; }
html body.path-careers #wrapper :is(.jd-careers-highlights,.jd-career-card__facts) li { margin: 0; padding: 7px 11px; border: 1px solid #e2d4ec; border-radius: 7px; background: #f3e8ff; color: #3b0a5c; -webkit-text-fill-color: #3b0a5c; font-size: 13px; line-height: 1.5; }
html body.path-careers #wrapper .jd-careers-board__heading { display: flex; gap: 20px; justify-content: space-between; align-items: end; margin-bottom: 20px; }
html body.path-careers #wrapper :is(.jd-careers-board__heading h2,.jd-careers-process h2) { margin: 0; font-size: clamp(24px,2.5vw,32px); line-height: 1.2; color: #241438; -webkit-text-fill-color: #241438; }
html body.path-careers #wrapper .jd-careers-board__heading > p { margin: 0; color: #62596b; -webkit-text-fill-color: #62596b; font-size: 15px; }
html body.path-careers #wrapper .jd-careers-filters { display: grid; grid-template-columns: 1.3fr 1fr 1fr; gap: 18px; padding: 24px; border: 1px solid #e2d4ec; border-radius: 16px; background: #fff; box-shadow: 0 8px 24px #6716aa06; }
html body.path-careers #wrapper .jd-careers-filter { min-width: 0; }
html body.path-careers #wrapper .jd-careers-filters label { display: block; margin: 0 0 8px; font-size: 14px; font-weight: 700; color: #241438; -webkit-text-fill-color: #241438; }
html body.path-careers #wrapper .jd-careers-filters :is(input[type=text],input[type=search],input[type=email],input[type=tel],input[type=url],input[type=date],input[type=number],select,textarea) { width: 100%; max-width: 100%; min-height: 48px; padding: 11px 13px; border: 1px solid #cfa8ed !important; border-radius: 9px; background-color: #fff; color: #241438; -webkit-text-fill-color: #241438; font-size: 16px; line-height: 1.5; box-shadow: none; }
html body.path-careers #wrapper .jd-careers-filters select { padding-right: 36px; text-overflow: ellipsis; }
html body.path-careers #wrapper .jd-careers-filter-actions { grid-column: 2 / -1; display: flex; align-items: end; justify-content: end; gap: 20px; }
html body.path-careers #wrapper .jd-careers-button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; margin: 0; padding: 12px 22px !important; border: 1px solid #6716aa !important; border-radius: 9px !important; background: #6716aa !important; color: #fff !important; -webkit-text-fill-color: #fff !important; font-size: 16px !important; font-weight: 700 !important; line-height: 1.5; text-decoration: none !important; text-transform: none !important; box-shadow: none !important; transform: none !important; cursor: pointer; }
html body.path-careers #wrapper .jd-careers-button:hover { background: #3b0a5c !important; }
html body.path-careers #wrapper .jd-careers-reset { display: inline-flex; align-items: center; min-height: 48px; color: #6716aa; -webkit-text-fill-color: #6716aa; font-size: 15px; font-weight: 700; text-decoration: underline; text-underline-offset: 4px; }
html body.path-careers #wrapper .jd-careers-results-meta { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; margin: 22px 0 16px; }
html body.path-careers #wrapper .jd-careers-results-meta p { margin: 0; font-size: 15px; color: #62596b; -webkit-text-fill-color: #62596b; }
html body.path-careers #wrapper .jd-careers-active-filters { margin: 0; }
html body.path-careers #wrapper .jd-careers-active-filters a { display: inline-flex; align-items: center; gap: 12px; min-height: 44px; padding: 8px 12px; border: 1px solid #d7b9eb; border-radius: 8px; background: #fff; color: #6716aa; -webkit-text-fill-color: #6716aa; font-size: 14px; text-decoration: none; overflow-wrap: anywhere; }
html body.path-careers #wrapper .jd-careers-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 20px; }
html body.path-careers #wrapper .jd-career-card { display: flex; flex-direction: column; min-width: 0; padding: 26px; border: 1px solid #e2d4ec; border-radius: 16px; background: #fff; box-shadow: 0 6px 20px #6716aa05; transition: border-color 160ms ease,box-shadow 160ms ease; }
html body.path-careers #wrapper .jd-career-card:is(:hover,:focus-within) { border-color: #6716aa; box-shadow: 0 10px 28px #6716aa10; }
html body.path-careers #wrapper .jd-career-card h3 { margin: 0 0 8px; font-size: 24px; line-height: 1.25; }
html body.path-careers #wrapper .jd-career-card h3 a { color: #241438; -webkit-text-fill-color: #241438; text-decoration: none; }
html body.path-careers #wrapper .jd-career-card__facts { margin: 8px 0 16px; gap: 6px; }
html body.path-careers #wrapper .jd-career-card__facts li { font-size: 12px; padding: 5px 8px; }
html body.path-careers #wrapper .jd-career-card__summary { text-align: left !important; margin: 0 0 24px; color: #62596b; -webkit-text-fill-color: #62596b; font-size: 16px; line-height: 1.65; }
html body.path-careers #wrapper .jd-career-card__cta { display: flex; align-items: center; justify-content: space-between; min-height: 48px; margin-top: auto; padding-top: 14px; border-top: 1px solid #eee4f4; color: #6716aa; -webkit-text-fill-color: #6716aa; font-size: 16px; font-weight: 800; text-decoration: none; }
html body.path-careers #wrapper .jd-careers-pager { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin: 28px 0; }
html body.path-careers #wrapper .jd-careers-pager a { display: flex; justify-content: center; align-items: center; min-height: 48px; min-width: 48px; border: 1px solid #d7b9eb; border-radius: 9px; background: #fff; color: #6716aa; -webkit-text-fill-color: #6716aa; text-decoration: none; }
html body.path-careers #wrapper .jd-careers-pager a[aria-current] { background: #6716aa; color: #fff; -webkit-text-fill-color: #fff; }
html body.path-careers #wrapper .jd-careers-empty { padding: 36px 24px; text-align: center; border: 1px dashed #cfa8ed; border-radius: 16px; background: #fff; }
html body.path-careers #wrapper .jd-careers-empty > span { font-size: 48px; color: #6716aa; -webkit-text-fill-color: #6716aa; }
html body.path-careers #wrapper .jd-careers-process { padding: 28px; margin: 40px 0 24px; border-radius: 16px; background: #f3e8ff; }
html body.path-careers #wrapper .jd-careers-process ol { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 32px; margin: 24px 0 0; padding-left: 20px; }
html body.path-careers #wrapper .jd-careers-process li { padding-left: 4px; font-size: 16px; }
html body.path-careers #wrapper .jd-careers-process strong { display: block; margin-bottom: 8px; color: #241438; -webkit-text-fill-color: #241438; }
html body.path-careers #wrapper .jd-careers-process span { color: #62596b; -webkit-text-fill-color: #62596b; font-size: 15px; line-height: 1.6; }
html body.path-careers #wrapper .jd-careers-index { width: min(calc(100% - 32px), 1120px); margin: 0 auto 32px; padding: 0; }
html body.path-careers #wrapper #page-wrapper .jd-careers-index :is(p,h2,h3,li) { background: transparent !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; color: #241438 !important; max-width: none !important; padding: 0 !important; text-shadow: none !important; -webkit-text-fill-color: currentColor !important; width: auto !important; }
html body.path-careers #wrapper .jd-careers-index p { text-align: left !important; }
html body.path-careers #wrapper .jd-careers-index .jd-careers-hero h1 { color: #241438 !important; -webkit-text-fill-color: #241438 !important; line-height: 1.12 !important; font-size: clamp(30px,3.8vw,52px) !important; }
html body.path-careers #wrapper .jd-careers-index .jd-careers-hero { text-align: left; }
html body.path-careers #wrapper #page-wrapper .jd-careers-index :is(.jd-careers-highlights,.jd-career-card__facts) li { background: #f3e8ff !important; border: 1px solid #e2d4ec !important; border-radius: 7px !important; color: #3b0a5c !important; padding: 7px 11px !important; }
html body.path-careers #wrapper #page-wrapper .jd-careers-index :is(.jd-careers-kicker,.jd-career-card__department) { color: #6716aa !important; }
html body.path-careers #wrapper #page-wrapper .jd-careers-index :is(.jd-career-card__summary,.jd-careers-results-meta p,.jd-careers-board__heading > p,.jd-careers-hero > p:last-of-type) { color: #62596b !important; }
html body.path-careers #wrapper .jd-careers-index .jd-careers-highlights { margin-bottom: 0; }
html body.path-careers #wrapper .jd-careers-index .jd-careers-board { margin-top: 12px; }
html body.path-careers #wrapper .jd-careers-index .jd-careers-process li { padding: 0 0 0 4px; }
html body.path-careers #wrapper .jd-careers-index .jd-careers-active-filters li { margin: 0; padding: 0; }
html body.path-careers #wrapper .jd-careers-index .jd-careers-filters :is(.nice-select,.chosen-container) { display: none !important; }
html body.path-careers #wrapper .jd-careers-index .jd-careers-filters select { display: block !important; appearance: auto; opacity: 1; visibility: visible; }
html body.path-careers #wrapper .jd-careers-index :is(a,button,input,select):focus-visible { outline: 3px solid #9d4edd !important; outline-offset: 3px; }
@media (max-width: 767px) {
 html body.path-careers #wrapper .jd-careers-index { width: 100%; }
 html body.path-careers #wrapper .jd-careers-index .jd-careers-hero { padding: 20px 0 28px; }
 html body.path-careers #wrapper .jd-careers-board__heading { display: block; }
 html body.path-careers #wrapper .jd-careers-board__heading > p { margin-top: 10px; }
 html body.path-careers #wrapper .jd-careers-filters { grid-template-columns: 1fr; padding: 18px; gap: 16px; }
 html body.path-careers #wrapper .jd-careers-filter-actions { grid-column: auto; justify-content: stretch; flex-direction: column; align-items: stretch; gap: 4px; }
 html body.path-careers #wrapper .jd-careers-reset { justify-content: center; }
 html body.path-careers #wrapper .jd-careers-grid { grid-template-columns: 1fr; gap: 16px; }
 html body.path-careers #wrapper .jd-career-card { padding: 20px; }
 html body.path-careers #wrapper .jd-career-card h3 { font-size: 23px; }
 html body.path-careers #wrapper .jd-careers-process { padding: 24px 20px; }
 html body.path-careers #wrapper .jd-careers-process ol { grid-template-columns: 1fr; gap: 20px; }
}
@media (prefers-reduced-motion: reduce) { html body.path-careers #wrapper .jd-career-card { transition: none; } }

/* assets/css/messages-ui.css */
/**
 * @file
 * Public message cards and shared Better Messages theme tokens.
 * Explicit overrides contain legacy form and Bootstrap message rules.
 */

html body:not(.path-admin) :is(.jd-messages-stack, [data-drupal-messages], [data-drupal-messages-fallback], #better-messages-default, #wrapper .messages) {
  --jd-msg-font: var(--jd-font-text, system-ui, sans-serif);
  --jd-msg-accent: #6716aa;
  --jd-msg-on-accent: #fff;
  --jd-msg-ink: #241438;
  --jd-msg-muted: #65576e;
  --jd-msg-surface: #fff;
  --jd-msg-border: #e4d7ef;
  --jd-msg-shadow: 0 16px 48px rgb(59 10 92 / 18%);
  --jd-msg-card-shadow: 0 4px 16px rgb(36 20 56 / 5%);
  --jd-msg-focus: rgb(103 22 170 / 20%);
  --jd-msg-status-surface: #faf5ff;
  --jd-msg-status-border: #d7bceb;
  --jd-msg-status-ink: #3b0a5c;
  --jd-msg-status-accent: #6716aa;
  --jd-msg-warning-surface: #fffbeb;
  --jd-msg-warning-border: #e8ce87;
  --jd-msg-warning-ink: #624409;
  --jd-msg-warning-accent: #946000;
  --jd-msg-error-surface: #fff5f4;
  --jd-msg-error-border: #e8b8b3;
  --jd-msg-error-ink: #772c27;
  --jd-msg-error-accent: #ad3430;
}

html body:not(.path-admin) :is(.task-bar.cyberlytics-message-stack, .jd-messages-stack) {
  animation: none !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
  clear: both !important;
  display: block !important;
  float: none !important;
  inset: auto !important;
  margin: 1rem auto !important;
  max-width: 72rem !important;
  opacity: 1 !important;
  padding: 0 12px !important;
  position: relative !important;
  transform: none !important;
  visibility: visible !important;
  width: 100% !important;
  z-index: 40 !important;
}

html body:not(.path-admin) :is(.jd-messages-stack, [data-drupal-messages], [data-drupal-messages-fallback]) .messages__wrapper,
html body:not(.path-admin) .jd-messages-stack > [data-drupal-messages] {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  display: block !important;
  margin: 0 !important;
  max-width: none !important;
  padding: 0 !important;
  width: 100% !important;
}

html body:not(.path-admin) :is(.task-bar.cyberlytics-message-stack, .jd-messages-stack, [data-drupal-messages], [data-drupal-messages-fallback])[hidden] {
  display: none !important;
}

html body:not(.path-admin) :is(#wrapper, .jd-messages-stack, [data-drupal-messages], [data-drupal-messages-fallback]) .messages {
  --jd-msg-card-surface: var(--jd-msg-status-surface);
  --jd-msg-card-border: var(--jd-msg-status-border);
  --jd-msg-card-ink: var(--jd-msg-status-ink);
  --jd-msg-card-accent: var(--jd-msg-status-accent);
  background: var(--jd-msg-card-surface) !important;
  background-image: none !important;
  border: 1px solid var(--jd-msg-card-border) !important;
  border-inline-start: 4px solid var(--jd-msg-card-accent) !important;
  border-radius: 14px !important;
  box-shadow: var(--jd-msg-card-shadow) !important;
  box-sizing: border-box !important;
  color: var(--jd-msg-card-ink) !important;
  display: block !important;
  float: none !important;
  font-family: var(--jd-msg-font) !important;
  font-size: 1rem !important;
  line-height: 1.55 !important;
  margin: 0 !important;
  max-width: none !important;
  min-height: 0 !important;
  min-width: 0 !important;
  overflow-wrap: anywhere !important;
  padding: 0.75rem 1rem 1rem 3.25rem !important;
  position: relative !important;
  text-align: start !important;
  text-shadow: none !important;
  width: 100% !important;
  -webkit-text-fill-color: var(--jd-msg-card-ink) !important;
  -webkit-text-stroke: 0 !important;
}

html body:not(.path-admin) :is(#wrapper, .jd-messages-stack, [data-drupal-messages], [data-drupal-messages-fallback]) .messages--warning {
  --jd-msg-card-surface: var(--jd-msg-warning-surface);
  --jd-msg-card-border: var(--jd-msg-warning-border);
  --jd-msg-card-ink: var(--jd-msg-warning-ink);
  --jd-msg-card-accent: var(--jd-msg-warning-accent);
}

html body:not(.path-admin) :is(#wrapper, .jd-messages-stack, [data-drupal-messages], [data-drupal-messages-fallback]) .messages--error {
  --jd-msg-card-surface: var(--jd-msg-error-surface);
  --jd-msg-card-border: var(--jd-msg-error-border);
  --jd-msg-card-ink: var(--jd-msg-error-ink);
  --jd-msg-card-accent: var(--jd-msg-error-accent);
}

html body:not(.path-admin) :is(#wrapper, .jd-messages-stack, [data-drupal-messages], [data-drupal-messages-fallback]) .messages + .messages {
  margin-top: 0.75rem !important;
}

html body:not(.path-admin) :is(#wrapper, .jd-messages-stack, [data-drupal-messages], [data-drupal-messages-fallback]) .messages::before {
  align-items: center !important;
  background: var(--jd-msg-card-accent) !important;
  border-radius: 50% !important;
  color: var(--jd-msg-on-accent) !important;
  content: "\2713" !important;
  display: inline-flex !important;
  font: 700 1rem/1 Arial, sans-serif !important;
  height: 1.75rem !important;
  inset-inline-start: 0.75rem !important;
  justify-content: center !important;
  position: absolute !important;
  top: 1.25rem !important;
  width: 1.75rem !important;
  -webkit-text-fill-color: var(--jd-msg-on-accent) !important;
}

html body:not(.path-admin) :is(#wrapper, .jd-messages-stack, [data-drupal-messages], [data-drupal-messages-fallback]) .messages--warning::before { content: "!" !important; }
html body:not(.path-admin) :is(#wrapper, .jd-messages-stack, [data-drupal-messages], [data-drupal-messages-fallback]) .messages--error::before { content: "\00d7" !important; font-size: 1.25rem !important; }
html body:not(.path-admin) :is(#wrapper, .jd-messages-stack, [data-drupal-messages], [data-drupal-messages-fallback]) .messages::after { content: none !important; display: none !important; }

html body:not(.path-admin) :is(#wrapper, .jd-messages-stack, [data-drupal-messages], [data-drupal-messages-fallback]) :is(.messages__content, .messages__header, .messages__list, .messages__item) {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: inherit !important;
  font-family: inherit !important;
  font-size: 1rem !important;
  line-height: 1.55 !important;
  margin: 0 !important;
  max-width: none !important;
  padding: 0 !important;
  text-shadow: none !important;
  width: auto !important;
  -webkit-text-fill-color: inherit !important;
}

html body:not(.path-admin) :is(#wrapper, .jd-messages-stack, [data-drupal-messages], [data-drupal-messages-fallback]) h2.messages__header {
  align-items: center !important;
  display: flex !important;
  font-weight: 700 !important;
  min-height: 44px !important;
  padding-inline-end: 2.75rem !important;
  text-transform: none !important;
}

html body:not(.path-admin) :is(#wrapper, .jd-messages-stack, [data-drupal-messages], [data-drupal-messages-fallback]) .messages__list { list-style: disc outside !important; padding-inline-start: 1.25rem !important; }
html body:not(.path-admin) :is(#wrapper, .jd-messages-stack, [data-drupal-messages], [data-drupal-messages-fallback]) .messages__item + .messages__item { margin-top: 0.4rem !important; }
html body:not(.path-admin) :is(#wrapper, .jd-messages-stack, [data-drupal-messages], [data-drupal-messages-fallback]) .messages__item::before,
html body:not(.path-admin) :is(#wrapper, .jd-messages-stack, [data-drupal-messages], [data-drupal-messages-fallback]) .messages__item::after { content: none !important; }

html body:not(.path-admin) :is(#wrapper, .jd-messages-stack, [data-drupal-messages], [data-drupal-messages-fallback]) .messages a {
  color: inherit !important;
  font-weight: 700 !important;
  overflow-wrap: anywhere !important;
  text-decoration: underline !important;
  text-decoration-thickness: 1px !important;
  text-underline-offset: 0.18em !important;
  -webkit-text-fill-color: currentColor !important;
}

html body:not(.path-admin) :is(#wrapper, .jd-messages-stack, [data-drupal-messages], [data-drupal-messages-fallback]) .messages a:hover { text-decoration-thickness: 2px !important; }

html body:not(.path-admin) :is(#wrapper, .jd-messages-stack, [data-drupal-messages], [data-drupal-messages-fallback]) .messages .jd-message__dismiss {
  align-items: center !important;
  appearance: none !important;
  background: transparent !important;
  border: 1px solid transparent !important;
  border-radius: 10px !important;
  box-shadow: none !important;
  color: inherit !important;
  cursor: pointer !important;
  display: inline-flex !important;
  float: none !important;
  font: 400 1.5rem/1 Arial, sans-serif !important;
  height: 44px !important;
  inset-inline-end: 0.5rem !important;
  justify-content: center !important;
  letter-spacing: 0 !important;
  margin: 0 !important;
  min-height: 44px !important;
  min-width: 44px !important;
  opacity: 1 !important;
  padding: 0 !important;
  position: absolute !important;
  text-shadow: none !important;
  top: 0.75rem !important;
  visibility: visible !important;
  width: 44px !important;
  -webkit-text-fill-color: currentColor !important;
}

html body:not(.path-admin) :is(#wrapper, .jd-messages-stack, [data-drupal-messages], [data-drupal-messages-fallback]) .messages .jd-message__dismiss:hover { background: var(--jd-msg-surface) !important; border-color: currentColor !important; }
html body:not(.path-admin) :is(#wrapper, .jd-messages-stack, [data-drupal-messages], [data-drupal-messages-fallback]) .messages :is(a, button):focus-visible { box-shadow: 0 0 0 4px var(--jd-msg-focus) !important; outline: 2px solid var(--jd-msg-card-accent) !important; outline-offset: 2px !important; }

/* No JavaScript: show the message content without an inert dismissal control. */
html:not(.js) body:not(.path-admin) :is(#wrapper, .jd-messages-stack, [data-drupal-messages], [data-drupal-messages-fallback]) .messages .jd-message__dismiss { display: none !important; }

@media (max-width: 767.98px) {
  html body:not(.path-admin) :is(.task-bar.cyberlytics-message-stack, .jd-messages-stack) { margin-block: 0.75rem !important; }
}

@media (prefers-reduced-motion: reduce) {
  html body:not(.path-admin) :is(.jd-messages-stack, [data-drupal-messages], [data-drupal-messages-fallback]),
  html body:not(.path-admin) :is(.jd-messages-stack, [data-drupal-messages], [data-drupal-messages-fallback]) * { animation: none !important; scroll-behavior: auto !important; transition: none !important; }
}

/* assets/css/better-messages-ui.css */
/**
 * @file
 * Better Messages presentation. Scoped rules contain legacy fixed positions.
 */

/* Visibility conditions and no JavaScript leave messages in normal flow. */
html body:not(.path-admin) #better-messages-default:not(.better-messages-overlay),
html:not(.js) body:not(.path-admin) #better-messages-default {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
  display: block !important;
  float: none !important;
  inset: auto !important;
  margin: 0 !important;
  max-height: none !important;
  max-width: none !important;
  min-height: 0 !important;
  min-width: 0 !important;
  overflow: visible !important;
  padding: 0 !important;
  position: static !important;
  transform: none !important;
  width: 100% !important;
  z-index: auto !important;
}

html body:not(.path-admin) #better-messages-default:not(.better-messages-overlay) #better-messages-inner,
html:not(.js) body:not(.path-admin) #better-messages-default #better-messages-inner,
html body:not(.path-admin) #better-messages-default:not(.better-messages-overlay) .better-messages-content,
html:not(.js) body:not(.path-admin) #better-messages-default .better-messages-content {
  display: block !important;
  max-height: none !important;
  overflow: visible !important;
  padding: 0 !important;
}

html body:not(.path-admin) #better-messages-default:not(.better-messages-overlay) .better-messages-footer,
html:not(.js) body:not(.path-admin) #better-messages-default .better-messages-footer { display: none !important; }

/* Center one bounded panel with equal gutters and safe-area clearance. */
html.js body:not(.path-admin) #better-messages-default.better-messages-overlay {
  --jd-msg-panel-height: calc(100vh - 24px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px));
  background: var(--jd-msg-surface) !important;
  border: 1px solid var(--jd-msg-border) !important;
  border-radius: 18px !important;
  bottom: auto !important;
  box-shadow: var(--jd-msg-shadow) !important;
  box-sizing: border-box !important;
  color: var(--jd-msg-ink) !important;
  cursor: auto !important;
  float: none !important;
  font-family: var(--jd-msg-font) !important;
  font-size: 1rem !important;
  left: calc(50% + (env(safe-area-inset-left, 0px) - env(safe-area-inset-right, 0px)) / 2) !important;
  line-height: 1.55 !important;
  margin: 0 !important;
  max-height: var(--jd-msg-panel-height) !important;
  max-width: 560px !important;
  min-height: 0 !important;
  min-width: 0 !important;
  overflow: hidden !important;
  padding: 0 !important;
  position: fixed !important;
  right: auto !important;
  top: calc(50% + (env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)) / 2) !important;
  transform: translate(-50%, -50%) !important;
  width: calc(100vw - 24px - env(safe-area-inset-left, 0px) - env(safe-area-inset-right, 0px)) !important;
  z-index: 510 !important;
  -webkit-text-fill-color: var(--jd-msg-ink) !important;
}

@supports (height: 100dvh) {
  html.js body:not(.path-admin) #better-messages-default.better-messages-overlay {
    --jd-msg-panel-height: calc(100dvh - 24px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px));
  }
}

html.js body:not(.path-admin) #better-messages-default.better-messages-overlay #better-messages-inner {
  display: flex !important;
  flex-direction: column !important;
  max-height: var(--jd-msg-panel-height) !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

html.js body:not(.path-admin) #better-messages-default.better-messages-overlay .better-messages-content {
  box-sizing: border-box !important;
  flex: 1 1 auto !important;
  margin: 0 !important;
  max-height: none !important;
  min-height: 0 !important;
  overflow: auto !important;
  overscroll-behavior: contain;
  padding: 1rem !important;
  scrollbar-gutter: stable;
}

/* Do not add the inline stack's gutters or hidden dismiss-button reserve. */
html.js body:not(.path-admin) #better-messages-default.better-messages-overlay :is(.task-bar.cyberlytics-message-stack, .jd-messages-stack) { margin: 0 !important; max-width: none !important; padding: 0 !important; z-index: auto !important; }
html.js body:not(.path-admin) #better-messages-default.better-messages-overlay .messages { box-shadow: none !important; padding: 0.75rem 0.875rem 0.875rem 3rem !important; }
html.js body:not(.path-admin) #better-messages-default.better-messages-overlay .messages::before { inset-inline-start: 0.625rem !important; top: 0.75rem !important; }
html.js body:not(.path-admin) #better-messages-default.better-messages-overlay h2.messages__header { margin-bottom: 0.25rem !important; min-height: 28px !important; padding-inline-end: 0 !important; }
html.js body:not(.path-admin) #better-messages-default.better-messages-overlay .messages .jd-message__dismiss { display: none !important; }

/* Restore inline controls despite the old overlay-wide close rule. */
html.js body:not(.path-admin) #better-messages-default:not(.better-messages-overlay) .messages .jd-message__dismiss { display: inline-flex !important; visibility: visible !important; }

html.js body:not(.path-admin) #better-messages-default.better-messages-overlay .better-messages-footer {
  align-items: center !important;
  background: var(--jd-msg-surface) !important;
  border: 0 !important;
  border-top: 1px solid var(--jd-msg-border) !important;
  border-radius: 0 !important;
  box-sizing: border-box !important;
  display: flex !important;
  flex: 0 0 auto !important;
  gap: 0.75rem !important;
  justify-content: flex-end !important;
  margin: 0 !important;
  min-height: 0 !important;
  padding: 0.75rem 1rem !important;
  text-align: end !important;
}

html.js body:not(.path-admin) #better-messages-default.better-messages-overlay .better-messages-timer { color: var(--jd-msg-muted) !important; display: none !important; float: none !important; font-size: 0.875rem !important; visibility: hidden !important; }

html.js body:not(.path-admin) #better-messages-default.better-messages-overlay button.better-messages-close {
  align-items: center !important;
  appearance: none !important;
  background: var(--jd-msg-accent) !important;
  border: 1px solid var(--jd-msg-accent) !important;
  border-radius: 10px !important;
  box-shadow: none !important;
  color: var(--jd-msg-on-accent) !important;
  cursor: pointer !important;
  display: inline-flex !important;
  float: none !important;
  font-family: var(--jd-msg-font) !important;
  font-size: 1rem !important;
  font-weight: 700 !important;
  gap: 0.5rem !important;
  height: auto !important;
  justify-content: center !important;
  letter-spacing: 0 !important;
  line-height: 1.4 !important;
  margin: 0 !important;
  min-height: 44px !important;
  min-width: 96px !important;
  opacity: 1 !important;
  padding: 0.625rem 1.125rem !important;
  position: static !important;
  text-decoration: none !important;
  text-shadow: none !important;
  text-transform: none !important;
  visibility: visible !important;
  width: auto !important;
  -webkit-text-fill-color: var(--jd-msg-on-accent) !important;
}

html.js body:not(.path-admin) #better-messages-default.better-messages-overlay button.better-messages-close::before,
html.js body:not(.path-admin) #better-messages-default.better-messages-overlay button.better-messages-close::after { content: none !important; display: none !important; }
html.js body:not(.path-admin) #better-messages-default.better-messages-overlay button.better-messages-close:hover { filter: brightness(0.9); }
html.js body:not(.path-admin) #better-messages-default.better-messages-overlay button.better-messages-close:focus-visible,
html.js body:not(.path-admin) #better-messages-default.better-messages-overlay:focus-visible { box-shadow: 0 0 0 4px var(--jd-msg-focus) !important; outline: 2px solid var(--jd-msg-accent) !important; outline-offset: 2px !important; }

@media (max-width: 767.98px) {
  html.js body:not(.path-admin) #better-messages-default.better-messages-overlay { border-radius: 14px !important; }
  html.js body:not(.path-admin) #better-messages-default.better-messages-overlay .better-messages-content,
  html.js body:not(.path-admin) #better-messages-default.better-messages-overlay .better-messages-footer { padding: 0.75rem !important; }
}

@media (prefers-reduced-motion: reduce) {
  html body:not(.path-admin) #better-messages-default,
  html body:not(.path-admin) #better-messages-default * { animation: none !important; scroll-behavior: auto !important; transition: none !important; }
}

/* assets/css/vehicle-capture-react.css */
:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) {
  --jd-capture-ink: #241438;
  --jd-capture-purple: #6716aa;
  --jd-capture-purple-dark: #3b0a5c;
  --jd-capture-soft: #faf5ff;
  --jd-capture-line: #dcc7eb;
}

/* Capture layout follows the available form width, including narrow desktop
   columns next to Gin navigation. The shell remains Drupal/React-owned. */
:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture-react-shell {
  container: jd-vehicle-capture / inline-size;
  min-width: 0;
  max-width: 100%;
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture-react-shell > [data-vehicle-capture-react],
:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture-react-shell > .fieldset-wrapper > [data-vehicle-capture-react] {
  grid-column: 1 / -1;
  width: 100%;
  min-width: 0;
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture-account-prompt {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.35rem 1.5rem;
  align-items: center;
  margin: 0 0 1.35rem;
  padding: 1.2rem 1.3rem;
  color: #241438 !important;
  background: linear-gradient(135deg, #faf5ff 0%, #f3e8ff 100%) !important;
  border: 1px solid #d8b9ee !important;
  border-left: 5px solid #6716aa !important;
  border-radius: 1rem !important;
  box-shadow: 0 12px 28px -24px rgba(59, 10, 92, 0.65) !important;
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture-account-prompt__title {
  display: block;
  margin: 0;
  color: #3b0a5c !important;
  font-family: var(--jd-font-display) !important;
  font-size: clamp(1.08rem, 2vw, 1.28rem) !important;
  font-style: normal !important;
  font-weight: 800 !important;
  line-height: 1.25 !important;
  letter-spacing: -0.015em !important;
  text-decoration: none !important;
  text-shadow: none !important;
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture-account-prompt__copy {
  grid-column: 1;
  margin: 0 !important;
  padding: 0 !important;
  color: #54475e !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  font-size: 0.96rem !important;
  font-style: normal !important;
  font-weight: 500 !important;
  line-height: 1.5 !important;
  text-shadow: none !important;
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture-account-prompt__action.button {
  grid-row: 1 / 3;
  grid-column: 2;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  min-height: 3rem;
  margin: 0 !important;
  padding: 0.75rem 1.15rem !important;
  color: #fff !important;
  background: #6716aa !important;
  border: 2px solid #6716aa !important;
  border-radius: 0.75rem !important;
  box-shadow: none !important;
  font-family: var(--jd-font-display) !important;
  font-size: 0.94rem !important;
  font-style: normal !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  text-align: center !important;
  text-decoration: none !important;
  text-shadow: none !important;
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture-account-prompt__action.button:hover,
:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture-account-prompt__action.button:focus-visible {
  color: #fff !important;
  background: #3b0a5c !important;
  border-color: #3b0a5c !important;
  box-shadow: 0 0 0 4px rgba(157, 78, 221, 0.18) !important;
  transform: none !important;
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture-react-shell.is-react-ready .vehicle-capture-react-fallback-field,
:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture-react-shell.is-react-ready .vehicle-capture-react-fallback-field.form-item--error,
:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture-react-shell.is-react-ready .vehicle-capture-react-uploader,
:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture-react-shell.is-react-ready .form-item-vehicle-capture-upload,
:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture-react-shell.is-react-ready > legend,
:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture-react-shell.is-react-ready .fieldset-legend,
:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .jd-vehicle-photos.is-react-ready > legend {
  display: none !important;
}

html body.page-form-vehicle-data-collection #wrapper [data-drupal-messages],
html body.page-form-vehicle-data-collection #wrapper .messages,
html body.page-form-vehicle-data-collection #wrapper .webform-message {
  position: relative !important;
  inset: auto !important;
  float: none !important;
  width: min(100%, 58rem) !important;
  max-width: 58rem !important;
  margin: 0.85rem auto !important;
  padding: 1rem 1.15rem 1rem 3.4rem !important;
  color: #3b0a5c !important;
  background: #faf5ff !important;
  border: 1px solid #d8b9ee !important;
  border-left: 5px solid #6716aa !important;
  border-radius: 0.9rem !important;
  box-shadow: 0 10px 24px -20px rgba(59, 10, 92, 0.7) !important;
  font-family: inherit !important;
  font-size: 0.98rem !important;
  line-height: 1.5 !important;
  text-align: left !important;
}

html body.page-form-vehicle-data-collection #wrapper .messages--error {
  color: #7d1838 !important;
  background: #fff1f4 !important;
  border-color: #f2b6c6 !important;
  border-left-color: #c81e4a !important;
}

html body.page-form-vehicle-data-collection #wrapper .messages a,
html body.page-form-vehicle-data-collection #wrapper .webform-message a {
  color: #6716aa !important;
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .webform-submission-form .form-item-vehicle-capture-upload {
  display: grid;
  grid-column: 1 / -1;
  justify-items: center;
  width: 100%;
  margin: 1.1rem 0 0;
  text-align: center !important;
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .webform-submission-form .form-item-vehicle-capture-upload > label,
:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .webform-submission-form .form-item-vehicle-capture-upload .description,
:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .webform-submission-form .form-item-vehicle-capture-upload .help-block,
:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .webform-submission-form .form-item-vehicle-capture-upload .description *,
:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .webform-submission-form .form-item-vehicle-capture-upload .help-block * {
  float: none !important;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .webform-submission-form .form-item-vehicle-capture-upload .description,
:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .webform-submission-form .form-item-vehicle-capture-upload .help-block {
  margin-top: 0.35rem !important;
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture--handoff-only {
  padding: clamp(1.2rem, 3vw, 2.2rem);
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture__handoff {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 1rem 1.5rem;
  align-items: center;
  margin: 0;
  padding: 1.35rem 1.4rem;
  color: var(--jd-capture-ink);
  background: linear-gradient(135deg, #faf5ff 0%, #f3e8ff 100%);
  border: 1px solid #d8b9ee;
  border-radius: 1rem;
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture__handoff h3 {
  margin: 0.15rem 0 0.4rem;
  color: #3b0a5c;
  font-size: clamp(1.15rem, 2vw, 1.4rem);
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture__handoff p,
:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture--done p,
:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture--received p {
  margin: 0 0 0.65rem;
  color: #4a3b55 !important;
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture__handoff a {
  color: #6716aa;
  font-weight: 700;
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture__handoff > * {
  min-width: 0;
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture__handoff a {
  overflow-wrap: anywhere;
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture__handoff-code {
  display: grid;
  place-items: center;
  width: min(100%, 11.5rem);
  height: auto;
  aspect-ratio: 1;
  padding: 0.45rem;
  background: #fff;
  border-radius: 0.85rem;
  box-shadow: 0 8px 20px -16px rgba(59, 10, 92, 0.9);
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture__handoff-code svg {
  width: 100%;
  height: auto;
}

html body.path-webform #wrapper .row.content-layout,
html body.path-webform #wrapper .row.content-layout *,
html body.path-webform #wrapper .progress-title,
html body.path-webform #wrapper .webform-progress__status,
:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture,
:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture * {
  text-shadow: none !important;
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture {
  width: min(100%, 58rem);
  margin: 0 auto;
  padding: clamp(1rem, 3vw, 2rem);
  color: var(--jd-capture-ink);
  background: linear-gradient(180deg, #fff 0%, var(--jd-capture-soft) 100%);
  border: 2px solid var(--jd-capture-purple-dark);
  border-radius: 1.4rem;
  box-shadow: 0 1rem 2.5rem rgba(59, 10, 92, 0.16);
  font-family: var(--jd-font-text) !important;
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture,
:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture p,
:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture button,
:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture small,
:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture span,
:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture a,
:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .jd-vehicle-photos-description {
  font-family: var(--jd-font-text) !important;
  font-style: normal !important;
  letter-spacing: normal;
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture h3,
:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture__kicker,
:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .jd-vehicle-photos-kicker,
:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .webform-progress,
:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .webform-progress * {
  font-family: var(--jd-font-display) !important;
  font-style: normal !important;
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture__header {
  min-height: 0;
  padding: 0;
  background: transparent;
  border: 0;
  text-align: center;
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture__kicker {
  margin: 0 0 0.25rem;
  color: var(--jd-capture-purple) !important;
  font-family: var(--jd-font-display) !important;
  font-size: 0.78rem;
  font-style: normal !important;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture h3 {
  margin: 0;
  color: var(--jd-capture-purple-dark);
  font-family: var(--jd-font-display) !important;
  font-size: clamp(1.25rem, 4cqi, 2rem);
  font-style: normal !important;
  font-weight: 700 !important;
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture__header > p {
  max-width: 44rem;
  margin: 0.5rem auto 0.85rem;
  color: var(--jd-capture-ink) !important;
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture__meter {
  width: 100%;
  height: 0.5rem;
  overflow: hidden;
  background: #eadcf5;
  border-radius: 999px;
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture__meter span {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, #6716aa, #9d4edd);
  transition: width 180ms ease;
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture__scanner {
  position: relative;
  display: grid;
  place-items: center;
  width: 100%;
  aspect-ratio: 16 / 10;
  max-height: 34rem;
  margin: 1rem auto;
  overflow: hidden;
  background: radial-gradient(circle at center, #5a4965 0%, #18131d 72%);
  border: 2px solid #130918;
  border-radius: 1.1rem;
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture__scanner video,
:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture__selected {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) :is(.vehicle-capture__guide, .vehicle-capture__reference) {
  position: absolute;
  inset: 50% auto auto 50%;
  transform: translate(-50%, -50%);
  z-index: 1;
  width: 86%;
  height: 86%;
  max-height: none !important;
  object-fit: contain;
  opacity: 1;
  pointer-events: none;
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture__guide { z-index: 3; }

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture__reference--ghost {
  /* UI-only alignment aid: never drawn into the photo capture canvas. */
  opacity: 0.35;
  z-index: 2;
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture :is(.vehicle-capture__selected, .vehicle-capture__thumbs img) {
  max-height: none !important;
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture__scanner video {
  z-index: 0;
  /* Fill the live viewport; capture still saves the complete source frame. */
  object-fit: cover;
  object-position: center;
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture__empty {
  display: grid;
  z-index: 1;
  gap: 0.25rem;
  color: #fff;
  text-align: center;
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture__empty span {
  font-size: clamp(2.25rem, 10vw, 5rem);
  font-weight: 900;
  opacity: 0.28;
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture__corner {
  position: absolute;
  z-index: 3;
  width: 3.5rem;
  height: 3.5rem;
  border-color: #fff;
  border-style: solid;
  filter: drop-shadow(0 0 0.35rem #6716aa);
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture__corner--tl { top: 8%; left: 6%; border-width: 4px 0 0 4px; border-radius: 0.7rem 0 0; }
:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture__corner--tr { top: 8%; right: 6%; border-width: 4px 4px 0 0; border-radius: 0 0.7rem 0 0; }
:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture__corner--bl { bottom: 8%; left: 6%; border-width: 0 0 4px 4px; border-radius: 0 0 0 0.7rem; }
:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture__corner--br { right: 6%; bottom: 8%; border-width: 0 4px 4px 0; border-radius: 0 0 0.7rem; }

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture__prompt {
  position: absolute;
  z-index: 4;
  left: 50%;
  bottom: 1.15rem;
  width: min(calc(100% - 5.5rem), 36rem);
  margin: 0;
  padding: 0.55rem 0.9rem;
  color: #faf5ff !important;
  background: rgba(19, 9, 24, 0.78);
  border: 1px solid rgba(243, 232, 255, 0.28);
  border-radius: 0.85rem;
  box-shadow: 0 0.6rem 1.4rem rgba(0, 0, 0, 0.28);
  backdrop-filter: blur(10px);
  font-size: 0.92rem;
  font-weight: 600;
  line-height: 1.35;
  text-align: center;
  text-shadow: none !important;
  transform: translateX(-50%);
  pointer-events: none;
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture button {
  min-height: 2.75rem;
  padding: 0.65rem 1rem;
  max-width: 100%;
  min-width: 0;
  color: var(--jd-capture-purple-dark);
  font-size: 1rem;
  font-weight: 750;
  line-height: 1.35;
  text-align: center;
  white-space: normal;
  overflow-wrap: anywhere;
  background: #fff;
  border: 2px solid var(--jd-capture-purple);
  border-radius: 0.75rem;
  cursor: pointer;
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture button:hover,
:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture button:focus-visible {
  color: #fff;
  background: var(--jd-capture-purple);
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture button:focus-visible {
  outline: 3px solid #9d4edd;
  outline-offset: 3px;
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture button:disabled {
  cursor: not-allowed;
  opacity: 0.48;
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture__controls,
:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture__reorder {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.55rem;
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture .vehicle-capture__primary,
:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture .vehicle-capture__complete {
  color: #fff;
  background: linear-gradient(135deg, #6716aa, #3b0a5c);
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture__thumbs {
  display: grid;
  grid-template-columns: repeat(8, minmax(0, 1fr));
  gap: 0.45rem;
  margin: 1rem 0;
  padding: 0;
  list-style: none;
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture__thumbs button {
  position: relative;
  width: 100%;
  min-height: 0;
  aspect-ratio: 1;
  padding: 0;
  overflow: hidden;
  background: #fff;
  border-color: var(--jd-capture-line);
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture__thumbs button.is-active {
  border-color: #6716aa;
  box-shadow: 0 0 0 3px rgba(103, 22, 170, 0.22);
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture__thumbs button.is-complete::after {
  position: absolute;
  top: 0.2rem;
  right: 0.2rem;
  display: grid;
  place-items: center;
  width: 1.25rem;
  height: 1.25rem;
  color: #fff;
  background: #287a46;
  border-radius: 50%;
  content: "✓";
  font-size: 0.75rem;
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture__thumbs img {
  width: 100%;
  height: 100%;
  margin: 0;
  object-fit: cover;
  opacity: 0.86;
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture__thumbs span {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  padding: 0.1rem;
  color: #fff;
  background: rgba(36, 20, 56, 0.8);
  font-size: 0.68rem;
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture__thumbs .vehicle-capture__sample {
  position: absolute;
  inset: 0;
  padding: 0;
  background: #faf5ff;
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture__sample img {
  position: absolute;
  inset: 0;
  object-fit: contain;
  opacity: 1;
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture__message {
  margin: 0.85rem 0;
  padding: 0.7rem 0.9rem;
  color: var(--jd-capture-ink) !important;
  background: #f3e8ff;
  border-left: 4px solid #6716aa;
  border-radius: 0.4rem;
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture progress {
  width: 100%;
  height: 0.8rem;
  accent-color: #6716aa;
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture__footer {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(17rem, 0.72fr);
  align-items: center;
  min-height: 0 !important;
  height: auto !important;
  gap: 1.25rem;
  margin-top: 1.15rem;
  padding: 1rem;
  background: #fff;
  border: 1px solid var(--jd-capture-line);
  border-radius: 1rem;
  box-shadow: 0 10px 24px -22px rgba(59, 10, 92, 0.85);
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture--received .vehicle-capture__footer {
  display: flex;
  justify-content: center;
  grid-template-columns: 1fr;
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture--received .vehicle-capture__complete {
  width: min(100%, 28rem);
  margin-inline: auto;
  text-align: center;
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture__readiness {
  display: flex;
  gap: 0.85rem;
  align-items: center;
  min-width: 0;
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture__count {
  display: flex;
  flex: 0 0 auto;
  align-items: baseline;
  justify-content: center;
  width: 4rem;
  height: 4rem;
  color: #fff;
  background: linear-gradient(145deg, #6716aa, #3b0a5c);
  border: 4px solid #eadcf5;
  border-radius: 50%;
  box-shadow: 0 0 0 1px #9d4edd;
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture__count strong {
  font-size: 1.45rem;
  line-height: 3.45rem;
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture__count span {
  font-size: 0.78rem;
  font-weight: 800;
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture__readiness-copy {
  display: grid;
  gap: 0.12rem;
  min-width: 0;
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture__readiness-copy strong {
  color: #3b0a5c;
  font-size: 1.05rem;
  line-height: 1.25;
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture__readiness-copy span {
  color: #685c70;
  font-size: 0.86rem;
  line-height: 1.35;
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture .vehicle-capture__complete {
  display: grid;
  gap: 0.16rem;
  width: 100%;
  min-height: 4rem;
  padding: 0.72rem 1rem;
  border: 0;
  border-radius: 0.8rem;
  box-shadow: 0 8px 18px -12px rgba(59, 10, 92, 0.75);
  line-height: 1.2;
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture .vehicle-capture__complete span {
  font-size: 0.98rem;
  font-weight: 850;
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture .vehicle-capture__complete small {
  font-size: 0.73rem;
  font-weight: 650;
  opacity: 0.82;
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture .vehicle-capture__complete:disabled {
  color: #675b70;
  background: #eee8f2;
  border: 1px solid #d8cde0;
  box-shadow: none;
  opacity: 1;
}

@media (max-width: 600px) {
  :is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture-account-prompt {
    grid-template-columns: 1fr;
    gap: 0.5rem;
    padding: 1rem;
  }

  :is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture-account-prompt__copy,
  :is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture-account-prompt__action.button {
    grid-row: auto;
    grid-column: 1;
  }

  :is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture-account-prompt__action.button {
    width: 100%;
    margin-top: 0.25rem !important;
  }
}

@container jd-vehicle-capture (max-width: 600px) {
  :is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture {
    padding: 0.85rem;
    border-radius: 1rem;
  }

  :is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture__scanner {
    aspect-ratio: 3 / 4;
  }

  :is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture__handoff {
    grid-template-columns: 1fr;
    justify-items: center;
    text-align: center;
  }

  :is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture__prompt {
    bottom: 3.5rem;
    width: min(calc(100% - 3rem), 36rem);
    padding: 0.55rem 0.9rem;
    font-size: 0.82rem;
    line-height: 1.3;
  }

  :is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture__thumbs {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  :is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture__footer {
    grid-template-columns: 1fr;
    gap: 0.8rem;
    padding: 0.8rem;
  }

  :is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture__count {
    width: 3.55rem;
    height: 3.55rem;
  }

  :is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture__count strong {
    line-height: 3rem;
  }
}

@media (max-width: 390px) {
  :is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture-account-prompt__title {
    font-size: 1.05rem !important;
  }
}

@container jd-vehicle-capture (max-width: 390px) {
  :is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture__readiness-copy strong {
    font-size: 0.98rem;
  }
}

html body.jda-account-route--userregister #user-register-form .vehicle-capture {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html body.jda-account-route--userregister .vehicle-capture__header > p {
  max-width: none;
}

html body.jda-account-route--userregister .vehicle-capture__scanner {
  width: 100%;
}

@container jd-vehicle-capture (max-width: 699.98px) {
  html body.jda-account-route--userregister .vehicle-capture__scanner {
    aspect-ratio: 4 / 5;
  }
}

@media (prefers-reduced-motion: reduce) {
  :is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture) .vehicle-capture * {
    scroll-behavior: auto !important;
    transition: none !important;
  }
}


/* Keep capture instructions readable despite legacy content paragraph rules.
   Scanner prompts and feedback retain their deliberately styled backgrounds. */
:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture, html body.path-dashboard #wrapper .jdd-vehicle-capture) .vehicle-capture p:not(.vehicle-capture__prompt):not(.vehicle-capture__message) {
  color: #241438 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  text-shadow: none !important;
}

:is(html body.page-form-vehicle-data-collection #wrapper, html body.page-user-register, html body.jda-account-route--userregister, html body.page-vehicle-capture, html body.path-dashboard #wrapper .jdd-vehicle-capture) .vehicle-capture p.vehicle-capture__kicker:not(.vehicle-capture__prompt):not(.vehicle-capture__message) {
  color: #6716aa !important;
}

/* assets/css/newsletter-signup.css */
/**
 * Global Johnny Detail newsletter pre-footer.
 * Two-column desktop layout with a compact, left-aligned mobile stack.
 */
html body:not(.path-admin) #wrapper #content-wide-bottom {
  margin-top: 0 !important;
  overflow: visible;
}

html body:not(.path-admin) #wrapper #content-wide-bottom .region.region-content-wide-bottom {
  border-top: 2px solid #000;
}

html body:not(.path-admin) #wrapper #block-martis-johnny-detail-newsletter-signup {
  --jd-newsletter-purple-dark: #3b0a5c;
  background: linear-gradient(135deg, #3b0a5c 0%, #6716aa 52%, #7929b8 100%);
  color: #fff;
  margin: 0;
  padding: clamp(2.25rem, 5vw, 4.25rem) 1rem;
  position: relative;
}

html body:not(.path-admin) #wrapper #block-martis-johnny-detail-newsletter-signup::before {
  background: rgba(255, 255, 255, 0.12);
  content: "";
  inset: 0;
  pointer-events: none;
  position: absolute;
}

html body:not(.path-admin) #wrapper #block-martis-johnny-detail-newsletter-signup > * {
  position: relative;
}

html body:not(.path-admin) #wrapper #block-martis-johnny-detail-newsletter-signup > .container-wrap {
  display: grid;
  gap: 0.8rem clamp(2rem, 6vw, 5rem);
  grid-template-columns: minmax(260px, 0.85fr) minmax(420px, 1.15fr);
  margin: 0 auto;
  max-width: 1170px !important;
  /* Preserve the native gutters when legacy hub rules target every container. */
  padding: 0 15px !important;
  width: 100%;
}

html body:not(.path-admin) #wrapper #block-martis-johnny-detail-newsletter-signup .block-title-wrap {
  grid-column: 1;
  margin: 0;
}

html body:not(.path-admin) #wrapper #block-martis-johnny-detail-newsletter-signup .block-title {
  color: #fff !important;
  font-size: clamp(1.75rem, 3vw, 2.55rem);
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.12;
  margin: 0;
  max-width: 520px;
  text-align: left;
}

html body:not(.path-admin) #wrapper #block-martis-johnny-detail-newsletter-signup .block-content {
  grid-column: 2;
}

html body:not(.path-admin) #wrapper #block-martis-johnny-detail-newsletter-signup form {
  display: grid;
  gap: 0.85rem;
  margin: 0;
}

html body:not(.path-admin) #wrapper #block-martis-johnny-detail-newsletter-signup form > .field--name-subscriptions:empty {
  display: none;
}

html body:not(.path-admin) #wrapper #block-martis-johnny-detail-newsletter-signup form > .form-item-message {
  align-self: start;
  color: #fff;
  font-size: 1.05rem;
  line-height: 1.65;
  margin: 0;
  margin-left: 0 !important;
  margin-right: 0 !important;
  max-width: 510px;
  left: 0rem !important;
  position: relative !important;
}

html body:not(.path-admin) #wrapper #block-martis-johnny-detail-newsletter-signup label,
html body:not(.path-admin) #wrapper #block-martis-johnny-detail-newsletter-signup .form-item__label {
  color: #fff !important;
  display: block;
  font-weight: 700;
  margin-bottom: 0.4rem;
}

html body:not(.path-admin) #wrapper #block-martis-johnny-detail-newsletter-signup input[type="email"] {
  background: #fff !important;
  border: 2px solid rgba(255, 255, 255, 0.8) !important;
  border-radius: 8px !important;
  box-sizing: border-box;
  color: #24102f !important;
  min-height: 48px;
  padding: 0.75rem 0.9rem !important;
  width: 100%;
}

html body:not(.path-admin) #wrapper #block-martis-johnny-detail-newsletter-signup input[type="email"]:focus {
  border-color: #f3e8ff !important;
  box-shadow: 0 0 0 4px rgba(243, 232, 255, 0.28) !important;
  outline: 2px solid transparent;
}

html body:not(.path-admin) #wrapper #block-martis-johnny-detail-newsletter-signup input[type="checkbox"] {
  accent-color: var(--jd-newsletter-purple-dark);
  flex: 0 0 22px;
  height: 22px;
  margin: 0.15rem 0.6rem 0 0;
  min-width: 22px;
  width: 22px;
}

html body:not(.path-admin) #wrapper #block-martis-johnny-detail-newsletter-signup .form-type-checkbox {
  align-items: flex-start;
  display: flex;
  margin: 0;
  text-align: left;
}

html body:not(.path-admin) #wrapper #block-martis-johnny-detail-newsletter-signup .form-type-checkbox label {
  flex: 1 1 auto;
  font-size: 0.95rem;
  font-weight: 500;
  line-height: 1.5;
  margin: 0;
  padding-bottom: 0 !important;
  text-align: left !important;
}

html body:not(.path-admin) #wrapper #block-martis-johnny-detail-newsletter-signup .description {
  color: #f3e8ff !important;
  font-size: 0.84rem;
  line-height: 1.45;
  margin-top: 0.4rem;
}

html body:not(.path-admin) #wrapper #block-martis-johnny-detail-newsletter-signup a {
  color: #fff !important;
  font-weight: 700;
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 3px;
}

html body:not(.path-admin) #wrapper #block-martis-johnny-detail-newsletter-signup .form-actions {
  align-items: center !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 0.75rem 1.15rem !important;
  justify-content: flex-start !important;
  margin: 0 !important;
  max-width: none !important;
  width: 100% !important;
}

html body:not(.path-admin) #wrapper #block-martis-johnny-detail-newsletter-signup .form-submit {
  background: #fff !important;
  border: 2px solid #fff !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: var(--jd-newsletter-purple-dark) !important;
  display: block !important;
  -webkit-text-fill-color: var(--jd-newsletter-purple-dark) !important;
  font-family: inherit !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  letter-spacing: normal !important;
  line-height: 48px !important;
  margin: 0 !important;
  max-width: 100% !important;
  min-height: 48px;
  padding: 0.7rem 1.4rem !important;
  text-transform: none !important;
  transform: none !important;
  width: auto !important;
}

html body:not(.path-admin) #wrapper #block-martis-johnny-detail-newsletter-signup .form-submit:hover {
  background: #f3e8ff !important;
  border-color: #f3e8ff !important;
  color: var(--jd-newsletter-purple-dark) !important;
  -webkit-text-fill-color: var(--jd-newsletter-purple-dark) !important;
  transform: none !important;
}

html body:not(.path-admin) #wrapper #block-martis-johnny-detail-newsletter-signup input:focus-visible,
html body:not(.path-admin) #wrapper #block-martis-johnny-detail-newsletter-signup a:focus-visible,
html body:not(.path-admin) #wrapper #block-martis-johnny-detail-newsletter-signup button:focus-visible {
  outline: 3px solid #fff !important;
  outline-offset: 3px !important;
}

html body:not(.path-admin) #wrapper #block-martis-johnny-detail-newsletter-signup .form-item--error-message,
html body:not(.path-admin) #wrapper #block-martis-johnny-detail-newsletter-signup .form-item__error-message {
  background: #fff;
  border-left: 4px solid #b42318;
  color: #7a271a !important;
  font-weight: 700;
  margin-top: 0.5rem;
  padding: 0.65rem 0.75rem;
}

/* Match the native content-wide gutter through its existing 1000px breakpoint. */
@media (max-width: 1000px) {
  html body:not(.path-admin) #wrapper #block-martis-johnny-detail-newsletter-signup > .container-wrap {
    padding-right: 14.5px !important;
  }
}

@media (max-width: 767px) {
  html body:not(.path-admin) #wrapper #block-martis-johnny-detail-newsletter-signup {
    padding: 2.25rem 1rem 2.5rem;
  }

  html body:not(.path-admin) #wrapper #block-martis-johnny-detail-newsletter-signup > .container-wrap {
    display: block;
  }

  html body:not(.path-admin) #wrapper #block-martis-johnny-detail-newsletter-signup .block-title {
    margin-bottom: 0.8rem;
  }

  html body:not(.path-admin) #wrapper #block-martis-johnny-detail-newsletter-signup form > .form-item-message {
    margin: 0 0 1.35rem;
    max-width: none;
    width: auto;
    left: 0rem !important;
  }

  html body:not(.path-admin) #wrapper #block-martis-johnny-detail-newsletter-signup form > * + * {
    margin-top: 0.9rem;
  }

  html body:not(.path-admin) #wrapper #block-martis-johnny-detail-newsletter-signup .form-actions,
  html body:not(.path-admin) #wrapper #block-martis-johnny-detail-newsletter-signup .form-submit {
    width: 100% !important;
  }

  html body:not(.path-admin) #wrapper #block-martis-johnny-detail-newsletter-signup .form-actions {
    align-items: stretch !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    margin: 0 !important;
  }

  html body:not(.path-admin) #wrapper #block-martis-johnny-detail-newsletter-signup .form-submit {
    font-size: 12px !important;
    line-height: normal !important;
  }

  html body:not(.path-admin) #wrapper #block-martis-johnny-detail-newsletter-signup .form-actions a {
    align-items: center;
    align-self: flex-start;
    display: inline-flex;
    min-height: 48px;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  html body:not(.path-admin) #wrapper #block-martis-johnny-detail-newsletter-signup .form-item-johnnydetail-consent {
    align-items: flex-start;
    box-sizing: border-box;
    justify-content: flex-start;
    margin-inline: 0 auto !important;
    max-width: none;
    padding-inline: 0 !important;
    text-align: left !important;
    width: 100%;
  }

  html body:not(.path-admin) #wrapper #block-martis-johnny-detail-newsletter-signup .form-item-johnnydetail-consent > label.control-label {
    align-self: flex-start;
    margin-inline: 0 auto !important;
    text-align: left !important;
    width: 100%;
  }

  html body:not(.path-admin) #wrapper #block-martis-johnny-detail-newsletter-signup .form-item-johnnydetail-consent > input.form-checkbox {
    margin: 0.15rem 0.6rem 0 0 !important;
  }
}

/* Listing canvas text fill must not override the newsletter's own colors. */
html body[class*="path-"].page-partners-hub #wrapper #block-martis-johnny-detail-newsletter-signup,
html body[class*="path-"].page-partners-hub #wrapper #block-martis-johnny-detail-newsletter-signup * {
  -webkit-text-fill-color: currentColor !important;
}

/* Quick win 2026-09-28: never truncate the newsletter signup description —
   always render the full message on every page and viewport width. */
html body:not(.path-admin) #wrapper #block-martis-johnny-detail-newsletter-signup form > .form-item-message {
  display: block !important;
  -webkit-line-clamp: unset !important;
  line-clamp: unset !important;
  max-height: none !important;
  overflow: visible !important;
  text-overflow: clip !important;
  white-space: normal !important;
  overflow-wrap: anywhere;
}

/* assets/css/simplenews-subscription-access.css */
/* Subscription-access request page: /simplenews/validate. */
html body.page-simplenews-validate #wrapper #page-wrapper {
  background:
    radial-gradient(circle at 10% 15%, rgba(183, 129, 227, 0.2), transparent 24rem),
    radial-gradient(circle at 92% 84%, rgba(121, 41, 184, 0.12), transparent 22rem),
    #faf5ff;
  padding: clamp(3rem, 7vw, 6.5rem) 0;
}

html body.page-simplenews-validate #wrapper #page-wrapper > .container {
  max-width: 880px;
}

html body.page-simplenews-validate #wrapper #page-wrapper .content-layout {
  display: block;
  margin: 0;
}

html body.page-simplenews-validate #wrapper #page-wrapper .main-content {
  float: none;
  max-width: none;
  padding: 0 15px;
  width: 100%;
}

html body.page-simplenews-validate #wrapper #page-wrapper .sidebar {
  display: none;
}

html body.page-simplenews-validate #wrapper #page-wrapper .block-system-main-block > .container-wrap {
  overflow: visible;
}

html body.page-simplenews-validate #wrapper .simplenews-subscriber-validate {
  background: #fff;
  border: 2px solid #b781e3;
  border-radius: 22px;
  box-shadow: 0 24px 60px rgba(59, 10, 92, 0.14);
  margin: 0 auto;
  overflow: hidden;
  padding: clamp(2rem, 5vw, 4rem);
  position: relative;
}

html body.page-simplenews-validate #wrapper .simplenews-subscriber-validate::before {
  background: linear-gradient(90deg, #3b0a5c, #9d4edd, #6716aa);
  content: "";
  height: 7px;
  inset: 0 0 auto;
  position: absolute;
}

html body.page-simplenews-validate #wrapper .jd-subscription-access__title {
  color: #3b0a5c !important;
  font-size: clamp(2rem, 5vw, 3.25rem);
  font-weight: 800;
  letter-spacing: -0.035em;
  line-height: 1.08;
  margin: 0 0 0.85rem;
}

html body.page-simplenews-validate #wrapper .simplenews-subscriber-validate > p {
  color: #55465d;
  font-size: 1.08rem;
  line-height: 1.65;
  margin: 0 0 2rem;
  max-width: 58ch;
}

html body.page-simplenews-validate #wrapper .simplenews-subscriber-validate .form-item-mail {
  margin: 0 0 1.4rem;
}

html body.page-simplenews-validate #wrapper .simplenews-subscriber-validate .form-item-mail label {
  color: #3b0a5c !important;
  display: block;
  font-size: 0.95rem;
  font-weight: 800;
  margin: 0 0 0.55rem;
}

html body.page-simplenews-validate #wrapper .simplenews-subscriber-validate input[type="email"] {
  background: #fff !important;
  border: 2px solid #cdb3dc !important;
  border-radius: 11px !important;
  box-shadow: inset 0 1px 2px rgba(59, 10, 92, 0.04);
  box-sizing: border-box;
  color: #24102f !important;
  font-size: 1rem;
  min-height: 54px;
  padding: 0.8rem 1rem !important;
  transition: border-color 160ms ease, box-shadow 160ms ease;
  width: 100%;
}

html body.page-simplenews-validate #wrapper .simplenews-subscriber-validate input[type="email"]:hover {
  border-color: #9d4edd !important;
}

html body.page-simplenews-validate #wrapper .simplenews-subscriber-validate input[type="email"]:focus {
  border-color: #7929b8 !important;
  box-shadow: 0 0 0 4px rgba(121, 41, 184, 0.16) !important;
  outline: 2px solid transparent;
}

html body.page-simplenews-validate #wrapper .simplenews-subscriber-validate .description {
  color: #685a70 !important;
  font-size: 0.84rem;
  line-height: 1.45;
  margin-top: 0.5rem;
}

html body.page-simplenews-validate #wrapper .simplenews-subscriber-validate .form-actions {
  margin: 0;
}

html body.page-simplenews-validate #wrapper .simplenews-subscriber-validate .form-submit {
  background: linear-gradient(135deg, #6716aa, #7929b8) !important;
  border: 2px solid #6716aa !important;
  border-radius: 11px !important;
  box-shadow: 0 10px 22px rgba(103, 22, 170, 0.24) !important;
  color: #fff !important;
  cursor: pointer;
  font-size: 1rem !important;
  font-weight: 800 !important;
  min-height: 52px;
  padding: 0.8rem 1.5rem !important;
  transition: box-shadow 160ms ease, transform 160ms ease;
}

html body.page-simplenews-validate #wrapper .simplenews-subscriber-validate .form-submit:hover {
  background: #3b0a5c !important;
  border-color: #3b0a5c !important;
  box-shadow: 0 13px 26px rgba(59, 10, 92, 0.28) !important;
  transform: translateY(-1px);
}

html body.page-simplenews-validate #wrapper .simplenews-subscriber-validate .form-submit:focus-visible {
  outline: 3px solid #b781e3 !important;
  outline-offset: 3px;
}

html body.page-simplenews-validate #wrapper .simplenews-subscriber-validate .form-item--error-message {
  color: #a21635 !important;
  font-weight: 700;
  margin-top: 0.55rem;
}

@media (max-width: 767px) {
  html body.page-simplenews-validate #wrapper #page-wrapper {
    padding: 2.25rem 0;
  }

  html body.page-simplenews-validate #wrapper #page-wrapper > .container {
    padding-left: 0.75rem;
    padding-right: 0.75rem;
  }

  html body.page-simplenews-validate #wrapper #page-wrapper .main-content {
    padding: 0;
  }

  html body.page-simplenews-validate #wrapper .simplenews-subscriber-validate {
    border-radius: 16px;
    padding: 2.25rem 1.2rem 1.4rem;
  }

  html body.page-simplenews-validate #wrapper .jd-subscription-access__title {
    font-size: clamp(1.85rem, 9vw, 2.4rem);
  }

  html body.page-simplenews-validate #wrapper .simplenews-subscriber-validate > p {
    font-size: 1rem;
    line-height: 1.55;
    margin-bottom: 1.5rem;
  }

  html body.page-simplenews-validate #wrapper .simplenews-subscriber-validate .form-submit {
    width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  html body.page-simplenews-validate #wrapper .simplenews-subscriber-validate input[type="email"],
  html body.page-simplenews-validate #wrapper .simplenews-subscriber-validate .form-submit {
    transition: none;
  }
}

/* assets/css/font-console-fixes.css */
/* Validated WOFF2 copy of the legacy FlexSlider icon font. */
@font-face {
  font-display: swap;
  font-family: "flexslider-icon-fixed";
  font-style: normal;
  font-weight: 400;
  src: url("/themes/martis/assets/lib/themify-icons/fonts/flexslider-icon-fixed.woff2") format("woff2");
}

html body .flex-direction-nav a::before,
html body .flex-pauseplay a::before {
  font-family: "flexslider-icon-fixed" !important;
  font-style: normal;
  font-weight: 400;
}

/* assets/css/commerce-storefront-ui.css */
/**
 * Johnny Detail storefront UI.
 *
 * Late-loaded on public catalog, taxonomy, search, and product routes only.
 * The global mini-cart and cart/checkout have dedicated stylesheets.
 */

html body.jd-storefront-page #wrapper {
  --jd-shop-deep: #3b0a5c;
  --jd-shop-purple: #6716aa;
  --jd-shop-violet: #9d4edd;
  --jd-shop-mid: #c77dff;
  --jd-shop-lilac: #f3e8ff;
  --jd-shop-mist: #faf5ff;
  --jd-shop-ink: #1a0a24;
  --jd-shop-muted: #5c5470;
  --jd-shop-border: #e9d5ff;
  --jd-shop-danger: #a12632;
  --jd-shop-radius: 18px;
  --jd-shop-radius-sm: 12px;
  --jd-shop-shadow: 0 14px 38px rgba(59, 10, 92, 0.1);
  --jd-shop-shadow-hover: 0 18px 42px rgba(59, 10, 92, 0.16);
  background: #ffffff;
  color: var(--jd-shop-ink);
}

html body.jd-storefront-page #wrapper :is(#page-wrapper, #page-wrapper-content, .product-page) {
  background: #ffffff !important;
}

html body.jd-storefront-page #wrapper :is(.main-content, .region-content, .jd-storefront-main) {
  float: none !important;
  margin-inline: auto !important;
  max-width: 100% !important;
  min-width: 0;
  width: 100% !important;
}

html body.jd-storefront-page #wrapper :is(#page-wrapper, #page-wrapper-content) > .container,
html body.jd-storefront-page #wrapper .jd-storefront-intro > .container {
  max-width: 78rem !important;
  margin-top: 0 !important;
}

html body.jd-storefront-page #wrapper .content-layout {
  display: block !important;
  margin-inline: 0 !important;
}

html body.jd-storefront-page #wrapper .content-layout > .sidebar {
  display: none !important;
}

/* Storefront title ------------------------------------------------------- */

html body.jd-storefront-page #wrapper .jd-storefront-intro {
  background: #ffffff;
  padding: clamp(1.4rem, 3vw, 2.4rem) 0 0;
}

html body.jd-storefront-page #wrapper .commerce-content-header {
  background: linear-gradient(135deg, #ffffff 0%, var(--jd-shop-mist) 100%) !important;
  border: 1px solid var(--jd-shop-border) !important;
  border-left: 6px solid var(--jd-shop-violet) !important;
  border-radius: var(--jd-shop-radius) !important;
  box-shadow: var(--jd-shop-shadow) !important;
  color: var(--jd-shop-ink) !important;
  margin: 0 0 clamp(1.4rem, 3vw, 2.2rem) !important;
  max-width: none !important;
  overflow: hidden;
  padding: clamp(1.25rem, 2.8vw, 2rem) clamp(1.15rem, 3vw, 2rem) !important;
  position: relative;
  transform: none !important;
}

html body.jd-storefront-page #wrapper .commerce-content-header::after {
  background: radial-gradient(circle, rgba(157, 78, 221, 0.14) 1px, transparent 1.5px);
  background-size: 18px 18px;
  content: '';
  inset: 0 0 0 62%;
  opacity: 0.7;
  pointer-events: none;
  position: absolute;
}

html body.jd-storefront-listing #wrapper .region-content .commerce-content-header {
  background: linear-gradient(135deg, #ffffff 0%, var(--jd-shop-mist) 100%) !important;
  border: 1px solid var(--jd-shop-border) !important;
  border-left: 6px solid var(--jd-shop-violet) !important;
  border-radius: var(--jd-shop-radius) !important;
  box-shadow: var(--jd-shop-shadow) !important;
  margin: 0 0 1rem !important;
  max-width: none !important;
  padding: clamp(1.25rem, 2.8vw, 2rem) !important;
  width: 100% !important;
}

html body.jd-storefront-listing #wrapper .product-category-listing-description {
  background: var(--jd-shop-mist) !important;
  border: 1px solid var(--jd-shop-border) !important;
  border-left: 4px solid var(--jd-shop-violet) !important;
  border-radius: 14px !important;
  box-shadow: none !important;
  color: var(--jd-shop-muted) !important;
  margin: 0 0 2rem !important;
  max-width: none !important;
  padding: 1rem 1.15rem !important;
  width: 100% !important;
}

html body.jd-storefront-listing #wrapper .product-category-listing-description p {
  -webkit-text-fill-color: var(--jd-shop-muted) !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: var(--jd-shop-muted) !important;
  line-height: 1.6 !important;
  margin: 0 !important;
  padding: 0 !important;
}

html body.jd-storefront-page #wrapper :is(.commerce-content-h1, h1.commerce-product-h1),
html body.jd-storefront-page #wrapper .commerce-content-header h1.commerce-content-h1 {
  -webkit-text-fill-color: var(--jd-shop-deep) !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: var(--jd-shop-deep) !important;
  display: block !important;
  font-size: clamp(1.55rem, 3.2vw, 2.25rem) !important;
  font-weight: 850 !important;
  letter-spacing: -0.025em !important;
  line-height: 1.18 !important;
  margin: 0 !important;
  max-width: 56rem;
  padding: 0 !important;
  position: relative;
  text-align: left !important;
  text-shadow: none !important;
  text-transform: none !important;
  z-index: 1;
}

/* Featured product headings -------------------------------------------- */

html body.jd-storefront-page #wrapper .featured-products-embed__title {
  color: var(--jd-shop-deep) !important;
  font-size: clamp(1.35rem, 2.6vw, 1.8rem) !important;
  font-weight: 850 !important;
  letter-spacing: -0.02em !important;
  line-height: 1.2 !important;
  margin: 0 0 1.2rem !important;
  padding: 0 0 0.65rem !important;
  position: relative;
  text-align: left !important;
  text-transform: none !important;
}

html body.jd-storefront-page #wrapper .featured-products-embed__title::after {
  background: var(--jd-shop-violet);
  border-radius: 999px;
  bottom: 0;
  content: '';
  height: 3px;
  left: 0;
  position: absolute;
  width: 64px;
}

/* Catalog and listing --------------------------------------------------- */

html body.jd-storefront-page #wrapper .product-catalog,
html body.jd-storefront-page #wrapper .product-search-page,
html body.jd-storefront-page #wrapper :is(.view-brand-product-listings, .view-product-category-listings) {
  background: #ffffff !important;
  border: 0 !important;
  box-shadow: none !important;
  margin: 0 auto !important;
  max-width: 78rem !important;
  padding: 0 !important;
}

html body.jd-storefront-page #wrapper #page-wrapper {
  padding-block: clamp(1.6rem, 4vw, 3.4rem) !important;
}

html body.jd-storefront-page #wrapper .product-catalog > .view-header,
html body.jd-storefront-page #wrapper .product-search-page > .view-header {
  align-items: center;
  display: flex !important;
  justify-content: flex-end;
  margin: 0 0 1rem !important;
  min-height: 44px;
  padding: 0 !important;
}

html body.jd-storefront-page #wrapper .switch-icon {
  display: inline-flex !important;
  gap: 0.45rem;
  margin: 0 !important;
}

html body.jd-storefront-page #wrapper .switch-icon span {
  align-items: center;
  background: #ffffff !important;
  border: 1px solid var(--jd-shop-border) !important;
  border-radius: 9px !important;
  color: var(--jd-shop-muted) !important;
  cursor: pointer;
  display: inline-flex !important;
  font-size: 1rem !important;
  height: 42px !important;
  justify-content: center;
  margin: 0 !important;
  width: 42px !important;
}

html body.jd-storefront-page #wrapper .switch-icon span.active,
html body.jd-storefront-page #wrapper .switch-icon span:hover {
  background: var(--jd-shop-lilac) !important;
  border-color: var(--jd-shop-violet) !important;
  color: var(--jd-shop-purple) !important;
}

html body.jd-storefront-page #wrapper .switch-icon :is(.list-switch, .grid-switch)::before {
  content: '' !important;
  display: block !important;
  font-family: inherit !important;
  height: 16px;
  width: 18px;
}

html body.jd-storefront-page #wrapper .switch-icon .list-switch::before {
  background: repeating-linear-gradient(to bottom, currentColor 0 2px, transparent 2px 6px);
}

html body.jd-storefront-page #wrapper .switch-icon .grid-switch::before {
  background:
    linear-gradient(to right, currentColor 0 42%, transparent 42% 58%, currentColor 58%),
    linear-gradient(to bottom, transparent 0 42%, #ffffff 42% 58%, transparent 58%);
  border: 1px solid currentColor;
}

/* Clip horizontal bleed without creating a nested vertical scroll container. */
@media (max-width: 991.98px) {
  html body.path-products.jd-storefront-landing #wrapper .product-catalog {
    overflow-x: clip !important;
    overflow-y: visible !important;
  }
}

html body.jd-storefront-page #wrapper .view-product-catalog .grid-wrapper,
html body.jd-storefront-page #wrapper .product-catalog .grid-wrapper,
html body.jd-storefront-page #wrapper .product-search-page .grid-wrapper,
html body.jd-storefront-page #wrapper .view-brand-product-listings .grid-wrapper,
html body.jd-storefront-page #wrapper .view-product-category-listings .grid-wrapper {
  display: grid !important;
  gap: 1.25rem !important;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: 0 !important;
  padding: 0 !important;
}

html body.jd-storefront-page #wrapper .view-product-catalog .grid-wrapper > .grid-item,
html body.jd-storefront-page #wrapper .product-catalog .grid-wrapper > .grid-item,
html body.jd-storefront-page #wrapper .product-search-page .grid-wrapper > .grid-item,
html body.jd-storefront-page #wrapper .view-brand-product-listings .grid-wrapper > .grid-item,
html body.jd-storefront-page #wrapper .view-product-category-listings .grid-wrapper > .grid-item {
  display: block !important;
  float: none !important;
  margin: 0 !important;
  max-width: none !important;
  min-width: 0;
  padding: 0 !important;
  width: auto !important;
}

html body.jd-storefront-page #wrapper .product-teaser-wrap {
  background: #ffffff !important;
  border: 1px solid var(--jd-shop-border) !important;
  border-left: 4px solid var(--jd-shop-violet) !important;
  border-radius: 16px !important;
  box-shadow: 0 8px 24px rgba(59, 10, 92, 0.08) !important;
  display: flex !important;
  height: 100% !important;
  margin: 0 !important;
  min-height: 100%;
  overflow: hidden !important;
  padding: 0 !important;
  transform: none !important;
  transition: border-color 150ms ease, box-shadow 150ms ease, transform 150ms ease !important;
  width: 100% !important;
  max-width: none !important;
}

html body.jd-storefront-page #wrapper .product-teaser-wrap:hover {
  border-color: var(--jd-shop-mid) !important;
  border-left-color: var(--jd-shop-violet) !important;
  box-shadow: var(--jd-shop-shadow-hover) !important;
  transform: translateY(-2px) !important;
}

html body.jd-storefront-page #wrapper .product-teaser {
  background: #ffffff !important;
  display: flex !important;
  flex: 1 1 auto;
  flex-direction: column !important;
  height: auto !important;
  margin: 0 !important;
  min-height: 100%;
  padding: 0 !important;
  width: 100% !important;
}

html body.jd-storefront-page #wrapper .product-teaser-bg,
html body.jd-storefront-page #wrapper .product-teaser-wrap::before {
  display: none !important;
}

html body.jd-storefront-page #wrapper .product-teaser-container {
  background: #ffffff !important;
  display: flex !important;
  flex: 1 1 auto;
  flex-direction: column !important;
  min-height: 100%;
  width: 100% !important;
}

html body.jd-storefront-page #wrapper .product-teaser-image,
html body.jd-storefront-page #wrapper .product-image {
  align-items: center !important;
  background: white !important;
  border: 0 !important;
  border-bottom: 1px solid var(--jd-shop-border) !important;
  display: flex !important;
  flex: 0 0 220px !important;
  height: 220px !important;
  justify-content: center !important;
  margin: 0 !important;
  overflow: hidden !important;
  padding: 0.8rem !important;
  position: relative;
  width: 100% !important;
}

html body.jd-storefront-page #wrapper .product-image :is(.field, .field-items, .field-item, a, picture) {
  align-items: center !important;
  display: flex !important;
  height: 100% !important;
  justify-content: center !important;
  margin: 0 !important;
  width: 100% !important;
}

html body.jd-storefront-page #wrapper .product-image .field-item:not(:first-child) {
  display: none !important;
}

html body.jd-storefront-page #wrapper .product-image img {
  border: 0 !important;
  border-radius: 10px !important;
  display: block !important;
  height: 100% !important;
  margin: 0 auto !important;
  max-height: 196px !important;
  max-width: 100% !important;
  object-fit: contain !important;
  padding: 0 !important;
  transform: none !important;
  width: 100% !important;
}

html body.jd-storefront-page #wrapper .product-badge {
  left: 0.75rem !important;
  position: absolute !important;
  top: 0.75rem !important;
  z-index: 2;
}

html body.jd-storefront-page #wrapper .product-badge .badge-label {
  background: var(--jd-shop-deep) !important;
  border: 0 !important;
  border-radius: 999px !important;
  color: #ffffff !important;
  font-size: 0.72rem !important;
  font-weight: 800 !important;
  padding: 0.35rem 0.65rem !important;
}

html body.jd-storefront-page #wrapper .product-image .product-icon-wrap {
  bottom: 0.7rem !important;
  display: flex !important;
  gap: 0.45rem;
  left: 0.7rem !important;
  margin: 0 !important;
  opacity: 1 !important;
  position: absolute !important;
  transform: none !important;
  visibility: visible !important;
  z-index: 2;
}

html body.jd-storefront-page #wrapper .product-image .product-icon:not(.product-view):empty {
  display: none !important;
}

html body.jd-storefront-page #wrapper .product-image .product-view a {
  align-items: center;
  background: rgba(255, 255, 255, 0.95) !important;
  border: 1px solid var(--jd-shop-border) !important;
  border-radius: 999px !important;
  color: var(--jd-shop-purple) !important;
  display: inline-flex !important;
  font-size: 0.74rem !important;
  font-weight: 800 !important;
  gap: 0.35rem;
  min-height: 36px;
  padding: 0.45rem 0.7rem !important;
  text-decoration: none !important;
}

html body.jd-storefront-page #wrapper .product-image .product-view a > i {
  border: 2px solid currentColor;
  border-radius: 50%;
  display: inline-block !important;
  font-family: inherit !important;
  height: 12px;
  position: relative;
  width: 12px;
}

html body.jd-storefront-page #wrapper .product-image .product-view a > i::before {
  content: '' !important;
}

html body.jd-storefront-page #wrapper .product-image .product-view a > i::after {
  background: currentColor;
  bottom: -4px;
  content: '';
  height: 5px;
  position: absolute;
  right: -3px;
  transform: rotate(-45deg);
  width: 2px;
}

html body.jd-storefront-page #wrapper .product-meta-wrap {
  background: #ffffff !important;
  display: flex !important;
  flex: 1 1 auto;
  flex-direction: column !important;
  min-height: 0;
  padding: 1rem !important;
}

html body.jd-storefront-page #wrapper .product-meta {
  background: transparent !important;
  border: 0 !important;
  color: var(--jd-shop-ink) !important;
  margin: 0 !important;
  padding: 0 !important;
}

html body.jd-storefront-page #wrapper .product-title {
  margin: 0 !important;
}

html body.jd-storefront-page #wrapper .product-title a,
html body.jd-storefront-page #wrapper .product-title-link {
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  color: var(--jd-shop-ink) !important;
  display: -webkit-box !important;
  font-size: 1rem !important;
  font-weight: 820 !important;
  line-height: 1.35 !important;
  min-height: 2.7em;
  overflow: hidden;
  text-decoration: none !important;
}

html body.jd-storefront-page #wrapper .product-title a:hover,
html body.jd-storefront-page #wrapper .product-title-link:hover {
  color: var(--jd-shop-violet) !important;
}

html body.jd-storefront-page #wrapper .product-ratings {
  color: #d18400 !important;
  margin: 0.55rem 0 0 !important;
  min-height: 1.25rem;
}

html body.jd-storefront-page #wrapper .product-ratings .vote-form input[type='submit'] {
  display: none !important;
}

html body.jd-storefront-page #wrapper .product-price-wrap {
  align-items: baseline !important;
  display: flex !important;
  flex-wrap: wrap;
  gap: 0.45rem;
  margin: 0.55rem 0 0 !important;
  justify-content: center !important;
}

html body.jd-storefront-page #wrapper .product-price,
html body.jd-storefront-page #wrapper .field-price {
  color: var(--jd-shop-purple) !important;
  font-size: 1.12rem !important;
  font-weight: 900 !important;
  line-height: 1.25 !important;
  margin: 0 !important;
}

html body.jd-storefront-page #wrapper .product-price::first-line {
  color: var(--jd-shop-purple) !important;
}

html body.jd-storefront-page #wrapper .product-old-price {
  color: var(--jd-shop-muted) !important;
  font-size: 0.82rem !important;
}

html body.jd-storefront-page #wrapper .product-teaser-short-desc {
  border: 0 !important;
  margin: 0.7rem 0 0 !important;
  padding: 0 !important;
}

html body.jd-storefront-page #wrapper .product-teaser-short-desc .field-label {
  display: none !important;
}

html body.jd-storefront-page #wrapper .product-teaser-short-desc .field-item {
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  color: var(--jd-shop-muted) !important;
  display: -webkit-box !important;
  font-size: 0.8rem !important;
  line-height: 1.45 !important;
  margin: 0 !important;
  max-height: none !important;
  overflow: auto !important;
  padding-top: 0.5rem !important;
}

html body.jd-storefront-page #wrapper .product-variation-wrap {
  background: var(--jd-shop-mist) !important;
  border: 1px solid var(--jd-shop-border) !important;
  border-radius: 12px !important;
  margin: auto 0 0 !important;
  padding: 0.8rem !important;
}

html body.jd-storefront-page #wrapper .product-teaser .commerce-order-item-add-to-cart-form {
  align-items: end;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  display: grid !important;
  gap: 0.6rem;
  grid-template-columns: minmax(82px, 0.7fr) minmax(110px, 1.3fr);
  margin: 0 !important;
  padding: 0 !important;
}

html body.jd-storefront-page #wrapper .commerce-order-item-add-to-cart-form :is(.field--name-purchased-entity, .field--name-unit-price),
html body.jd-storefront-page #wrapper .product-add-cart > .field > .field-label,
html body.jd-storefront-page #wrapper .product-add-cart .field-variations > .field-label {
  display: none !important;
}

html body.jd-storefront-page #wrapper .product-teaser .field--name-quantity {
  margin: 0 !important;
}

html body.jd-storefront-page #wrapper .product-teaser .field--name-quantity label {
  color: var(--jd-shop-muted) !important;
  display: block !important;
  font-size: 0.72rem !important;
  font-weight: 800 !important;
  margin: 0 0 0.35rem !important;
}

html body.jd-storefront-page #wrapper .product-teaser .field--name-quantity input[type='number'] {
  background: #ffffff !important;
  border: 1px solid var(--jd-shop-border) !important;
  border-radius: 9px !important;
  color: var(--jd-shop-ink) !important;
  height: 44px !important;
  margin: 0 !important;
  padding: 0 2rem 0 0.7rem !important;
  width: 100% !important;
}

html body.jd-storefront-page #wrapper .product-teaser .quantity-nav {
  height: 44px !important;
  right: 0 !important;
}

html body.jd-storefront-page #wrapper .product-teaser .quantity-button {
  align-items: center;
  background: var(--jd-shop-lilac) !important;
  border-color: var(--jd-shop-border) !important;
  color: var(--jd-shop-purple) !important;
  display: flex !important;
  justify-content: center;
}

html body.jd-storefront-page #wrapper .product-teaser .form-actions {
  margin: 0 !important;
}

html body.jd-storefront-page #wrapper .product-teaser :is(.button--add-to-cart, .form-submit),
html body.jd-storefront-page #wrapper .product-teaser-actions a {
  align-items: center;
  border-radius: 10px !important;
  display: inline-flex !important;
  font-size: 0.82rem !important;
  font-weight: 850 !important;
  justify-content: center;
  line-height: 1.2 !important;
  min-height: 44px;
  padding: 0.7rem 0.8rem !important;
  text-decoration: none !important;
  text-transform: none !important;
  width: 100% !important;
}

html body.jd-storefront-page #wrapper .product-teaser :is(.button--add-to-cart, .form-submit) {
  background: var(--jd-shop-violet) !important;
  border: 1px solid var(--jd-shop-violet) !important;
  box-shadow: none !important;
  color: #ffffff !important;
  height: 44px !important;
}

html body.jd-storefront-page #wrapper .product-teaser :is(.button--add-to-cart, .form-submit):hover {
  background: var(--jd-shop-purple) !important;
  border-color: var(--jd-shop-purple) !important;
}

html body.jd-storefront-page #wrapper .product-teaser-actions {
  margin: auto 0 0 !important;
  padding-top: 0.7rem !important;
}

html body.jd-storefront-page #wrapper .product-teaser-actions a {
  background: #ffffff !important;
  border: 1px solid var(--jd-shop-violet) !important;
  color: var(--jd-shop-purple) !important;
}

html body.jd-storefront-page #wrapper .product-teaser-actions a:hover {
  background: var(--jd-shop-lilac) !important;
  color: var(--jd-shop-deep) !important;
}

/* List view toggled by the existing Martis switcher. */
html body.jd-storefront-page #wrapper .grid-item.list-grid {
  grid-column: 1 / -1;
}

html body.jd-storefront-page #wrapper .grid-item.list-grid .product-teaser-container {
  display: grid !important;
  grid-template-columns: minmax(200px, 28%) minmax(0, 1fr) !important;
}

html body.jd-storefront-page #wrapper .grid-item.list-grid .product-image {
  border-bottom: 0 !important;
  border-right: 1px solid var(--jd-shop-border) !important;
  height: 100% !important;
  min-height: 240px;
}

html body.jd-storefront-page #wrapper .pager {
  margin: 2rem 0 0 !important;
  padding: 0 !important;
}

html body.jd-storefront-page #wrapper .pager__items {
  align-items: center;
  display: flex !important;
  flex-wrap: wrap;
  gap: 0.45rem;
  justify-content: center;
  list-style: none;
  margin: 0 !important;
  padding: 0 !important;
}

html body.jd-storefront-page #wrapper .pager__item {
  margin: 0 !important;
  padding: 0 !important;
}

html body.jd-storefront-page #wrapper .pager__item a {
  align-items: center;
  background: #ffffff !important;
  border: 1px solid var(--jd-shop-border) !important;
  border-radius: 9px !important;
  color: var(--jd-shop-purple) !important;
  display: inline-flex;
  font-weight: 800 !important;
  justify-content: center;
  min-height: 42px;
  min-width: 42px;
  padding: 0.55rem 0.75rem !important;
  text-decoration: none !important;
}

html body.jd-storefront-page #wrapper .pager__item.is-active a,
html body.jd-storefront-page #wrapper .pager__item a:hover {
  background: var(--jd-shop-violet) !important;
  border-color: var(--jd-shop-violet) !important;
  color: #ffffff !important;
}

html body.jd-storefront-page #wrapper .view-empty {
  background: var(--jd-shop-mist) !important;
  border: 1px solid var(--jd-shop-border) !important;
  border-radius: var(--jd-shop-radius) !important;
  color: var(--jd-shop-muted) !important;
  margin: 1rem 0 !important;
  padding: 2rem !important;
  text-align: center;
}

/* Product detail -------------------------------------------------------- */

html body.jd-storefront-product #wrapper #page-wrapper-content {
  padding-block: clamp(1.5rem, 4vw, 3rem) !important;
}

html body.jd-storefront-product #wrapper .product-post {
  background: #ffffff !important;
  border: 1px solid var(--jd-shop-border) !important;
  border-radius: var(--jd-shop-radius) !important;
  box-shadow: var(--jd-shop-shadow) !important;
  margin: 0 auto !important;
  max-width: 78rem !important;
  overflow: hidden;
  padding: clamp(1rem, 2.6vw, 2rem) !important;
}

html body.jd-storefront-product #wrapper .product-post::after {
  display: none !important;
}

html body.jd-storefront-product #wrapper .product-post > .row {
  display: grid !important;
  gap: clamp(1.4rem, 3vw, 2.6rem);
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  margin: 0 !important;
}

html body.jd-storefront-product #wrapper .product-post > .row::before,
html body.jd-storefront-product #wrapper .product-post > .row::after {
  display: none !important;
}

html body.jd-storefront-product #wrapper :is(.product-image-wrap, .product-content-wrap) {
  float: none !important;
  margin: 0 !important;
  max-width: none !important;
  min-width: 0;
  padding: 0 !important;
  width: auto !important;
}

html body.jd-storefront-product #wrapper .product-gallery {
  display: grid;
  gap: 0.85rem;
}

html body.jd-storefront-product #wrapper .product-gallery-main {
  align-items: center;
  aspect-ratio: 1 / 1;
  display: flex !important;
  justify-content: center;
  min-height: 0 !important;
  overflow: hidden;
  padding: 1rem !important;
  border-radius: 16px !important;
}

html body.jd-storefront-product #wrapper .product-gallery-main-img {
  border: 0 !important;
  border-radius: 12px !important;
  display: block !important;
  height: 100% !important;
  max-height: 31rem !important;
  max-width: 100% !important;
  object-fit: contain !important;
  padding: 0 !important;
  width: 100% !important;
}

html body.jd-storefront-product #wrapper .product-gallery-thumbs {
  gap: 0.65rem !important;
  margin: 0 !important;
  padding: 0.15rem !important;
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(68px, 80px)) !important;
  overflow-x: visible !important;
  justify-content: center !important;
  max-width: 100% !important;
  width: 100% !important;
}

html body.jd-storefront-product #wrapper .product-gallery-thumb {
  align-items: center;
  aspect-ratio: 1;
  background: #ffffff !important;
  border: 1px solid var(--jd-shop-border) !important;
  border-radius: 10px !important;
  display: flex !important;
  justify-content: center;
  min-height: 54px;
  overflow: hidden;
  padding: 0.3rem !important;
  width: 100% !important;
  height: auto !important;
  max-width: 100% !important;
}

html body.jd-storefront-product #wrapper .product-gallery-thumb:is(:hover, :focus-visible, [aria-current='true']) {
  border-color: var(--jd-shop-violet) !important;
  box-shadow: 0 0 0 3px rgba(157, 78, 221, 0.15) !important;
  outline: 2px solid transparent !important;
}

html body.jd-storefront-product #wrapper .product-gallery-thumb img {
  height: 100% !important;
  object-fit: contain !important;
  width: 100% !important;
}

html body.jd-storefront-product #wrapper .product-content-wrap {
  align-self: start;
  background: #ffffff !important;
  color: var(--jd-shop-ink) !important;
}

html body.jd-storefront-product #wrapper h1.commerce-product-h1 {
  border: 0 !important;
  color: var(--jd-shop-deep) !important;
  font-size: clamp(1.7rem, 3.2vw, 2.35rem) !important;
  margin: 0 0 1rem !important;
  padding: 0 !important;
}

html body.jd-storefront-product #wrapper .product-stock {
  align-items: center;
  background: var(--jd-shop-mist) !important;
  border: 1px solid var(--jd-shop-border) !important;
  border-radius: 12px !important;
  color: var(--jd-shop-ink) !important;
  display: flex !important;
  flex-wrap: wrap;
  gap: 0.45rem 0.7rem;
  margin: 0 0 1rem !important;
  padding: 0.85rem 1rem !important;
}

html body.jd-storefront-product #wrapper .product-stock .field-label {
  color: var(--jd-shop-muted) !important;
  font-size: 0.78rem !important;
  font-weight: 800 !important;
  margin: 0 !important;
}

html body.jd-storefront-product #wrapper .stock-value {
  border-radius: 999px !important;
  font-size: 0.75rem !important;
  font-weight: 850 !important;
  padding: 0.3rem 0.6rem !important;
}

html body.jd-storefront-product #wrapper .in-stock .available-stock {
  background: var(--jd-shop-lilac) !important;
  color: var(--jd-shop-purple) !important;
}

html body.jd-storefront-product #wrapper .out-of-stock .out-of-stock {
  background: #fff0f1 !important;
  color: var(--jd-shop-danger) !important;
}

html body.jd-storefront-product #wrapper .product-stock .product-price {
  color: var(--jd-shop-purple) !important;
  font-size: 1.35rem !important;
  font-weight: 900 !important;
  margin: 0 0 0 auto !important;
}

html body.jd-storefront-product #wrapper .product-short-description {
  background: #ffffff !important;
  border: 0 !important;
  color: var(--jd-shop-muted) !important;
  font-size: 0.98rem !important;
  line-height: 1.65 !important;
  margin: 0 0 1rem !important;
  padding: 0 !important;
}

html body.jd-storefront-product #wrapper .product-short-description .field-label {
  display: none !important;
}

html body.jd-storefront-product #wrapper .product-meta {
  background: var(--jd-shop-mist) !important;
  border: 1px solid var(--jd-shop-border) !important;
  border-radius: 12px !important;
  display: grid !important;
  gap: 0 !important;
  margin: 0 0 1rem !important;
  padding: 0.3rem 1rem !important;
}

html body.jd-storefront-product #wrapper .product-meta:has(.product-icon-wrap:empty),
html body.jd-storefront-product #wrapper .product-meta:has(.product-icon:empty) {
  display: none !important;
}

html body.jd-storefront-product #wrapper .product-meta-item {
  border-bottom: 1px solid #dfece4 !important;
  color: var(--jd-shop-ink) !important;
  display: grid !important;
  font-size: 0.84rem !important;
  gap: 0.7rem;
  grid-template-columns: minmax(72px, 0.32fr) minmax(0, 1fr);
  margin: 0 !important;
  padding: 0.7rem 0 !important;
}

html body.jd-storefront-product #wrapper .product-meta-item :is(.field-label, .field-item) {
  margin: 0 !important;
  padding: 0 !important;
}

html body.jd-storefront-product #wrapper .product-meta-item .field-label {
  color: var(--jd-shop-muted) !important;
  font-size: 0.75rem !important;
  font-weight: 800 !important;
}

html body.jd-storefront-product #wrapper .product-meta-item a {
  color: var(--jd-shop-purple) !important;
  font-weight: 750 !important;
  text-decoration: none !important;
}

html body.jd-storefront-product #wrapper .product-variation-wrap {
  margin: 0 !important;
  background: linear-gradient(145deg, #fdfaff 0%, var(--jd-shop-mist) 100%) !important;
  border: 1px solid var(--jd-shop-border) !important;
  border-radius: 16px !important;
  box-shadow: 0 12px 28px rgba(59, 10, 92, .09) !important;
  padding: clamp(.9rem, 2vw, 1.2rem) !important;
  overflow: visible !important;
}

html body.jd-storefront-product #wrapper .product-variation-selector {
  margin: 0 0 0.8rem !important;
}

html body.jd-storefront-product #wrapper .product-variation-selector label,
html body.jd-storefront-product #wrapper .product-add-cart .field--name-quantity label {
  color: var(--jd-shop-ink) !important;
  display: block !important;
  font-size: 0.78rem !important;
  font-weight: 800 !important;
  margin: 0 0 0.4rem !important;
}

html body.jd-storefront-product #wrapper .variation-switcher {
  background: #ffffff !important;
  border: 1px solid var(--jd-shop-border) !important;
  border-radius: 10px !important;
  color: var(--jd-shop-ink) !important;
  height: 48px !important;
  padding: 0 0.85rem !important;
  width: 100% !important;
}

html body.jd-storefront-product #wrapper .commerce-order-item-add-to-cart-form {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  display: grid !important;
  margin: 0 !important;
  padding: 0 !important;
  align-items: end !important;
  gap: .8rem !important;
  grid-template-columns: minmax(6.5rem, .55fr) minmax(9rem, 1.45fr) !important;
}

html body.jd-storefront-product #wrapper .product-add-cart .field--name-quantity {
  margin: 0 !important;
}

html body.jd-storefront-product #wrapper .product-add-cart .field--name-quantity .form-item {
  margin: 0 !important;
}

html body.jd-storefront-product #wrapper .product-add-cart input[type='number'] {
  background: #ffffff !important;
  border: 1px solid var(--jd-shop-border) !important;
  border-radius: 10px !important;
  color: var(--jd-shop-ink) !important;
  height: 48px !important;
  margin: 0 !important;
  padding: 0 2.2rem 0 0.8rem !important;
  width: 100% !important;
}

html body.jd-storefront-product #wrapper .product-add-cart .form-actions {
  margin: 0 !important;
}

html body.jd-storefront-product #wrapper .button--add-to-cart {
  align-items: center;
  background: var(--jd-shop-violet) !important;
  border: 1px solid var(--jd-shop-violet) !important;
  border-radius: 10px !important;
  box-shadow: 0 8px 18px rgba(14, 108, 62, 0.2) !important;
  color: #ffffff !important;
  display: inline-flex !important;
  font-size: 0.95rem !important;
  font-weight: 850 !important;
  height: 48px !important;
  justify-content: center;
  margin: 0 !important;
  padding: 0 1.2rem !important;
  text-transform: none !important;
  width: 100% !important;
}

html body.jd-storefront-product #wrapper .button--add-to-cart:hover {
  background: var(--jd-shop-purple) !important;
  border-color: var(--jd-shop-purple) !important;
}

html body.jd-storefront-product #wrapper .margin-top-50.product-info {
  margin: clamp(1.5rem, 4vw, 2.5rem) 0 0 !important;
}

html body.jd-storefront-product #wrapper .product-info .nav-tabs {
  border: 0 !important;
  display: flex !important;
  gap: 0.55rem;
  list-style: none !important;
  margin: 0 0 0.8rem !important;
  padding: 0 !important;
}

html body.jd-storefront-product #wrapper .product-info .nav-tabs li {
  margin: 0 !important;
}

html body.jd-storefront-product #wrapper .product-info .nav-tabs a {
  background: #ffffff !important;
  border: 1px solid var(--jd-shop-border) !important;
  border-radius: 10px !important;
  color: var(--jd-shop-purple) !important;
  display: inline-flex !important;
  font-size: 0.86rem !important;
  font-weight: 800 !important;
  min-height: 44px;
  padding: 0.7rem 1rem !important;
}

html body.jd-storefront-product #wrapper .product-info .nav-tabs :is(li.active a, a.active, a:hover) {
  background: var(--jd-shop-violet) !important;
  border-color: var(--jd-shop-violet) !important;
  color: #ffffff !important;
}

html body.jd-storefront-product #wrapper .product-info .tab-content {
  background: var(--jd-shop-mist) !important;
  border: 1px solid var(--jd-shop-border) !important;
  border-radius: 14px !important;
  color: var(--jd-shop-ink) !important;
  padding: clamp(1rem, 2.8vw, 1.8rem) !important;
}

html body.jd-storefront-product #wrapper .product-info .tab-pane {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: var(--jd-shop-ink) !important;
  padding: 0 !important;
  border-top-left-radius: 10px !important;
}

html body.jd-storefront-product #wrapper .product-info .tab-pane::before {
  display: none !important;
}

html body.jd-storefront-product #wrapper .product-tab-item,
html body.jd-storefront-product #wrapper .product-tab-item * {
  color: var(--jd-shop-ink) !important;
}

html body.jd-storefront-product #wrapper .product-tab-item :is(h2, h3, h4) {
  border: 0 !important;
  color: var(--jd-shop-deep) !important;
  font-weight: 850 !important;
  letter-spacing: -0.015em !important;
  line-height: 1.3 !important;
  margin: 1.4rem 0 0.6rem !important;
  padding: 0 !important;
}

html body.jd-storefront-product #wrapper .product-tab-item > h2:first-child {
  margin-top: 0 !important;
}

html body.jd-storefront-product #wrapper .product-tab-item :is(p, li) {
  color: var(--jd-shop-muted) !important;
  font-size: 0.96rem !important;
  line-height: 1.7 !important;
}

html body.jd-storefront-product #wrapper .product-tab-item a {
  color: var(--jd-shop-purple) !important;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

html body.jd-storefront-product #wrapper .comment-form {
  background: #ffffff !important;
  border: 1px solid var(--jd-shop-border) !important;
  border-radius: 12px !important;
  box-shadow: none !important;
  padding: 1rem !important;
}

html body.jd-storefront-product #wrapper #block-martis-related-products-pdp {
  margin: clamp(2rem, 5vw, 4rem) auto 0 !important;
  max-width: 78rem;
}

/* Related products keep one frame and the native linked card metadata. */
html body.jd-storefront-product #wrapper #main-content .related-grid--products {
  border: 0 !important;
  box-shadow: 0 16px 38px rgba(59, 10, 92, .09) !important;
}
html body.jd-storefront-product #wrapper #main-content .related-grid--products .related-grid__items { border-left: 0 !important; box-shadow: none !important; }
html body.jd-storefront-product #wrapper #main-content .related-grid--products :is(.product-meta-wrap, .product-meta, .product-title, .product-title a, .product-title-link, .product-old-price) { align-items: center !important; justify-content: center !important; text-align: center !important; }
html body.jd-storefront-product #wrapper #main-content .related-grid--products :is(.product-title a, .product-title-link) {
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 2 !important;
  -webkit-text-fill-color: var(--jd-shop-ink) !important;
  color: var(--jd-shop-ink) !important;
  display: -webkit-box !important;
  min-height: 2.7em !important;
  overflow: hidden !important;
}
html body.jd-storefront-product #wrapper #main-content .related-grid--products :is(.product-price-wrap, .product-price, .product-price .field, .product-price .field-item, .price) { align-items: baseline !important; justify-content: center !important; text-align: center !important; width: 100% !important; }

/* Shared controls and accessibility ------------------------------------ */

html body.jd-storefront-page #wrapper :is(a, button, input, select, textarea):focus-visible {
  outline: 3px solid rgba(157, 78, 221, 0.24) !important;
  outline-offset: 2px !important;
}

html body.jd-storefront-page #wrapper :is(button, input[type='submit'], .button)[disabled],
html body.jd-storefront-page #wrapper :is(button, input[type='submit'], .button).is-disabled {
  cursor: not-allowed !important;
  opacity: 0.55 !important;
  transform: none !important;
}

@media (max-width: 1199px) {
  html body.jd-storefront-page #wrapper .view-product-catalog .grid-wrapper,
html body.jd-storefront-page #wrapper .product-catalog .grid-wrapper,
html body.jd-storefront-page #wrapper .product-search-page .grid-wrapper,
html body.jd-storefront-page #wrapper .view-brand-product-listings .grid-wrapper,
html body.jd-storefront-page #wrapper .view-product-category-listings .grid-wrapper {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 991px) {

  html body.jd-storefront-product #wrapper .product-post > .row {
    grid-template-columns: 1fr !important;
  }

  html body.jd-storefront-product #wrapper .product-gallery-main {
    max-height: 35rem;
    border-radius: 16px !important;
  }
}

@media (max-width: 767px) {
  html body.jd-storefront-page #wrapper .jd-storefront-intro {
    padding: 1rem 0 0 !important;
  }

  html body.jd-storefront-page #wrapper .commerce-content-header {
    border-left-width: 4px !important;
    border-radius: 14px !important;
    margin-bottom: 1rem !important;
    padding: 1.1rem !important;
  }

  html body.jd-storefront-page #wrapper .commerce-content-header::after {
    inset: 0 0 0 48%;
  }

  html body.jd-storefront-page #wrapper .view-product-catalog .grid-wrapper,
html body.jd-storefront-page #wrapper .product-catalog .grid-wrapper,
html body.jd-storefront-page #wrapper .product-search-page .grid-wrapper,
html body.jd-storefront-page #wrapper .view-brand-product-listings .grid-wrapper,
html body.jd-storefront-page #wrapper .view-product-category-listings .grid-wrapper {
    grid-template-columns: 1fr !important;
  }

  html body.jd-storefront-page #wrapper #page-wrapper,
  html body.jd-storefront-product #wrapper #page-wrapper-content {
    padding-block: 1.4rem 2.2rem !important;
  }

  html body.jd-storefront-page #wrapper .product-teaser-image,
  html body.jd-storefront-page #wrapper .product-image {
    flex-basis: 240px !important;
    height: 240px !important;
  }

  html body.jd-storefront-page #wrapper .grid-item.list-grid .product-teaser-container {
    display: flex !important;
  }

  html body.jd-storefront-page #wrapper .grid-item.list-grid .product-image {
    border-bottom: 1px solid var(--jd-shop-border) !important;
    border-right: 0 !important;
    min-height: 0;
  }

  html body.jd-storefront-product #wrapper .product-post {
    border-radius: 14px !important;
    padding: 1rem !important;
  }

  html body.jd-storefront-product #wrapper .product-gallery-thumbs {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(62px, 72px)) !important;
    overflow-x: visible !important;
    justify-content: center !important;
    max-width: 100% !important;
    width: 100% !important;
  }

  html body.jd-storefront-product #wrapper .product-stock .product-price {
    flex-basis: 100%;
    margin: 0.35rem 0 0 !important;
  }

  html body.jd-storefront-product #wrapper .commerce-order-item-add-to-cart-form {
    align-items: end !important;
    gap: .65rem !important;
    grid-template-columns: minmax(6.5rem, .58fr) minmax(8rem, 1.42fr) !important;
  }

  html body.jd-storefront-product #wrapper .product-info .nav-tabs {
    display: grid !important;
    grid-template-columns: 1fr 1fr;
  }

  html body.jd-storefront-product #wrapper .product-info .nav-tabs a {
    justify-content: center;
    width: 100%;
  }

  html body.jd-storefront-page.jd-storefront-listing #wrapper .product-catalog > .row.grid-wrapper,
  html body.path-products.jd-storefront-landing #wrapper .product-catalog > .row.grid-wrapper {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  html body.jd-storefront-page.jd-storefront-listing #wrapper .product-catalog > .row.grid-wrapper > .grid-item,
  html body.path-products.jd-storefront-landing #wrapper .product-catalog > .row.grid-wrapper > .grid-item {
    flex: 0 0 auto !important;
    grid-column: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    width: 100% !important;
  }

  html body.path-products.jd-storefront-landing #wrapper .product-catalog .product-teaser-actions a {
    font-size: 0.78rem !important;
    letter-spacing: 0 !important;
    overflow-wrap: normal !important;
    padding-inline: 0.4rem !important;
    white-space: nowrap !important;
    word-break: normal !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  html body.jd-storefront-page #wrapper *,
  html body.jd-storefront-page #wrapper *::before,
  html body.jd-storefront-page #wrapper *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
  }
}

@media (max-width: 767.98px) {
  html body.jd-storefront-page #wrapper .product-catalog .grid-wrapper.row,
  html body.jd-storefront-page #wrapper .product-search-page .grid-wrapper.row,
  html body.jd-storefront-page #wrapper .view-brand-product-listings .grid-wrapper.row,
  html body.jd-storefront-page #wrapper .view-product-category-listings .grid-wrapper.row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
  }

  html body.jd-storefront-page #wrapper .product-catalog .grid-wrapper > .grid-item,
  html body.jd-storefront-page #wrapper .product-search-page .grid-wrapper > .grid-item,
  html body.jd-storefront-page #wrapper .view-brand-product-listings .grid-wrapper > .grid-item,
  html body.jd-storefront-page #wrapper .view-product-category-listings .grid-wrapper > .grid-item {
    flex: 0 0 100% !important;
    grid-column: 1 / -1 !important;
    max-width: 100% !important;
    width: 100% !important;
  }
}

/* High-specificity resets for legacy storefront/PDP selectors. */
html body.path-products.jd-storefront-page #wrapper .product-catalog > form#views-exposed-form-product-catalog-product-catalog {
  align-items: end !important;
  clear: both !important;
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  gap: 0.75rem !important;
  justify-content: center !important;
  margin: 0.35rem 0rem 1.15rem !important;
  max-width: 44rem !important;
  padding: 0.9rem 1.1rem 0.95rem !important;
  width: min(100%, 30rem) !important;
  margin-top: 0rem !important;
  margin-bottom: 2.5rem !important;
}

html body.path-products.jd-storefront-page #wrapper .product-catalog > form#views-exposed-form-product-catalog-product-catalog .form-item {
  flex: 1 1 18rem !important;
  margin: 0 !important;
  min-width: 0 !important;
}

html body.path-products.jd-storefront-page #wrapper .product-catalog > form#views-exposed-form-product-catalog-product-catalog .form-actions {
  flex: 0 1 9rem !important;
  margin: 0 !important;
}

html body.path-product.jd-storefront-product #wrapper .product-post .product-variation-wrap {
  background: linear-gradient(145deg, #fdfaff 0%, var(--jd-shop-mist) 100%) !important;
  border: 1px solid var(--jd-shop-border) !important;
  border-radius: 16px !important;
  box-shadow: 0 12px 28px rgba(59, 10, 92, .09) !important;
  padding: clamp(.9rem, 2vw, 1.2rem) !important;
  overflow: visible !important;
}

html body.path-product.jd-storefront-product #wrapper .product-post .product-gallery-thumbs {
  align-items: center !important;
  overflow: visible !important;
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(68px, 80px)) !important;
  overflow-x: visible !important;
  justify-content: center !important;
  max-width: 100% !important;
  width: 100% !important;
}

html body.path-product.jd-storefront-product #wrapper .product-post .product-gallery-thumbs .product-gallery-thumb {
  min-height: 0 !important;
  width: 100% !important;
  height: auto !important;
  max-width: 100% !important;
}

html body.path-product.jd-storefront-product #wrapper .product-post .product-add-cart .button--add-to-cart {
  margin: 0 !important;
}

@media (max-width: 767.98px) {
  html body.path-products.jd-storefront-page #wrapper .product-catalog > form#views-exposed-form-product-catalog-product-catalog {
    display: grid !important;
    flex-direction: initial !important;
    gap: 0.7rem !important;
    grid-template-columns: 1fr !important;
    margin: 1.15rem auto -1rem !important;
    width: 100% !important;
  }

  html body.path-products.jd-storefront-page #wrapper .product-catalog > form#views-exposed-form-product-catalog-product-catalog :is(.form-item, .form-actions) {
    flex: none !important;
    width: 100% !important;
  }

  html body.path-product.jd-storefront-product #wrapper .product-post .product-gallery-thumbs .product-gallery-thumb {
    justify-content: center !important;
    width: 100% !important;
    height: auto !important;
    max-width: 100% !important;
  }
}

/* 2026-08 storefront/PDP responsive polish ------------------------------- */

@media (max-width: 991.98px) {
  
  html body.jd-storefront-page #wrapper .product-catalog > .view-header, html body.jd-storefront-page #wrapper .product-search-page > .view-header {
    margin: 1rem 0rem auto !important;
    justify-content: left !important;
  }
}

html body.jd-storefront-page #wrapper .featured-products-embed__title {
  border-bottom: 0 !important;
  padding-bottom: 0 !important;
}

html body.jd-storefront-page #wrapper .featured-products-embed__title::after {
  content: none !important;
  display: none !important;
}

html body.jd-storefront-page #wrapper #views-exposed-form-product-catalog-product-catalog {
  align-items: end !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 0.75rem !important;
  justify-content: center !important;
  margin: 0.35rem auto 1.15rem !important;
  max-width: 44rem !important;
  width: min(100%, 44rem) !important;
}

html body.jd-storefront-page #wrapper #views-exposed-form-product-catalog-product-catalog .form-item {
  flex: 1 1 18rem !important;
  margin: 0 !important;
  min-width: 0 !important;
}

html body.jd-storefront-page #wrapper #views-exposed-form-product-catalog-product-catalog .form-actions {
  flex: 0 1 9rem !important;
  margin: 0 !important;
}

html body.jd-storefront-page #wrapper #views-exposed-form-product-catalog-product-catalog .form-submit {
  margin: 0 !important;
  min-height: 48px !important;
  width: 100% !important;
}

html body.jd-storefront-page #wrapper .product-title,
html body.jd-storefront-page #wrapper .product-title a,
html body.jd-storefront-page #wrapper .product-title-link {
  color: var(--jd-shop-deep) !important;
  -webkit-text-fill-color: var(--jd-shop-deep) !important;
  text-align: center !important;
}

html body.jd-storefront-page #wrapper .grid-item.list-grid .product-price-wrap,
html body.jd-storefront-page #wrapper .grid-item.list-grid .product-price {
  justify-content: center !important;
  text-align: center !important;
  width: 100% !important;
}

html body.jd-storefront-page #wrapper .product-catalog > .pagerer-container,
html body.jd-storefront-page #wrapper :is(.view-brand-product-listings, .view-product-category-listings) > .pagerer-container {
  clear: both !important;
  display: flex !important;
  margin: 1.5rem auto 2rem !important;
  padding: 0 !important;
  position: static !important;
  width: 100% !important;
}

html body.path-taxonomy #wrapper .pagerer-container .pagerer-panes {
  margin-bottom: -5rem !important;
}

html body.jd-storefront-page #wrapper .pagerer-container .pagerer-panes {
  align-items: center !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 0.75rem !important;
  margin: 0 auto !important;
  padding: 0 !important;
  position: static !important;
  width: 100% !important;
}

html body.jd-storefront-page #wrapper .pagerer-container :is(.pagerer-left-pane, .pagerer-center-pane, .pagerer-right-pane) {
  align-items: center !important;
  display: flex !important;
  justify-content: center !important;
  margin: 0 !important;
  padding: 0 !important;
  position: static !important;
  width: 100% !important;
}

html body.jd-storefront-page #wrapper .pagerer-container .pagerer-center-pane:empty {
  display: none !important;
}

html body.jd-storefront-product #wrapper .product-gallery-thumbs {
  align-items: center !important;
  overflow: visible !important;
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(68px, 80px)) !important;
  overflow-x: visible !important;
  justify-content: center !important;
  max-width: 100% !important;
  width: 100% !important;
}

html body.jd-storefront-product #wrapper .product-gallery-thumb {
  width: 100% !important;
  height: auto !important;
  max-width: 100% !important;
}

html body.jd-storefront-product #wrapper .product-variation-wrap {
  border-color: rgba(103, 22, 170, 0.22) !important;
  background: linear-gradient(145deg, #fdfaff 0%, var(--jd-shop-mist) 100%) !important;
  border: 1px solid var(--jd-shop-border) !important;
  border-radius: 16px !important;
  box-shadow: 0 12px 28px rgba(59, 10, 92, .09) !important;
  padding: clamp(.9rem, 2vw, 1.2rem) !important;
  overflow: visible !important;
}

html body.jd-storefront-product #wrapper .commerce-order-item-add-to-cart-form {
  display: grid !important;
  align-items: end !important;
  gap: .8rem !important;
  grid-template-columns: minmax(6.5rem, .55fr) minmax(9rem, 1.45fr) !important;
}

html body.jd-storefront-product #wrapper .product-add-cart :is(input[type='number'], .button--add-to-cart) {
  height: 48px !important;
  min-height: 48px !important;
}

html body.jd-storefront-product #wrapper .product-add-cart .button--add-to-cart {
  margin-top: 0 !important;
}

html body.jd-storefront-product #wrapper .product-add-cart .commerce-order-item-add-to-cart-form .form-actions {
  align-self: end !important;
  margin: 0 !important;
}

html body.jd-storefront-product #wrapper .product-info .tab-content {
  background: #ffffff !important;
  border-color: rgba(103, 22, 170, 0.18) !important;
  box-shadow: 0 16px 38px -30px rgba(59, 10, 92, 0.55) !important;
}

html body.path-product.jd-storefront-product #wrapper .product-post #product-detail .product-tab-item > h2.margin-bottom-20 {
  -webkit-text-fill-color: var(--jd-shop-deep) !important;
  background: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: var(--jd-shop-deep) !important;
  display: block !important;
  font-size: clamp(1.35rem, 2.5vw, 1.8rem) !important;
  letter-spacing: normal !important;
  line-height: 1.3 !important;
  margin: 0 0 1rem !important;
  padding: 0 !important;
  text-align: center !important;
  text-transform: none !important;
  text-shadow: none !important;
}

html body.jd-storefront-product #wrapper .pdp-body-content {
  background: transparent !important;
  color: var(--jd-shop-ink) !important;
  display: grid !important;
  gap: .85rem !important;
  margin: 0 !important;
  padding: 0 !important;
}

html body.jd-storefront-product #wrapper .product-post .pdp-section {
  background: #fff !important;
  border: 1px solid var(--jd-shop-border) !important;
  border-radius: 13px !important;
  box-shadow: 0 7px 18px rgba(59, 10, 92, .06) !important;
  margin: 0 !important;
  overflow: hidden !important;
}

html body.jd-storefront-product #wrapper .product-post .pdp-section__toggle {
  align-items: center !important;
  appearance: none !important;
  background: linear-gradient(125deg, var(--jd-shop-deep), var(--jd-shop-violet)) !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: #fff !important;
  cursor: pointer !important;
  display: flex !important;
  font-size: clamp(.95rem, 2vw, 1.05rem) !important;
  font-weight: 850 !important;
  justify-content: space-between !important;
  letter-spacing: 0 !important;
  line-height: 1.3 !important;
  margin: 0 !important;
  min-height: 50px !important;
  padding: .78rem 3rem .78rem 1rem !important;
  position: relative !important;
  text-align: left !important;
  text-transform: none !important;
  width: 100% !important;
  -webkit-text-fill-color: #fff !important;
}

html body.jd-storefront-product #wrapper .product-post .pdp-section__toggle::after {
  background: none !important;
  border-bottom: 2px solid currentColor !important;
  border-right: 2px solid currentColor !important;
  border-radius: 0 !important;
  color: #fff !important;
  content: '' !important;
  display: block !important;
  height: .55rem !important;
  position: absolute !important;
  right: 1.15rem !important;
  top: 50% !important;
  transform: translateY(-65%) rotate(45deg) !important;
  transition: transform 160ms ease !important;
  width: .55rem !important;
  -webkit-text-fill-color: #fff !important;
}

html body.jd-storefront-product #wrapper .product-post .pdp-section__toggle[aria-expanded='true']::after {
  transform: translateY(-30%) rotate(225deg) !important;
}

html body.jd-storefront-product #wrapper .product-post .pdp-section__toggle:focus-visible {
  box-shadow: inset 0 0 0 3px rgba(157, 78, 221, 0.32) !important;
  outline: 3px solid rgba(59, 10, 92, 0.35) !important;
  outline-offset: 2px !important;
}

html body.jd-storefront-product #wrapper .product-post .pdp-section__body {
  background: #fff !important;
  border-top: 0 !important;
  color: var(--jd-shop-ink) !important;
  line-height: 1.68 !important;
  margin-bottom: 0 !important;
  padding: clamp(.9rem, 2vw, 1.2rem) !important;
}

html body.jd-storefront-product #wrapper .product-post .pdp-section__body > p,
html body.jd-storefront-product #wrapper .product-post #product-detail .product-tab-item p {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  margin: 0 0 0.9rem !important;
  padding: 0 !important;
}

@media (max-width: 767.98px) {
  /* 2026-10-01 product categories top padding (mobile) */

  html body.jd-storefront-page #wrapper .product-catalog > .pagerer-container,
  html body.jd-storefront-page #wrapper :is(.view-brand-product-listings, .view-product-category-listings) > .pagerer-container {
    margin: 1.5rem auto 4rem !important;
  }

  html body.jd-storefront-page #wrapper #views-exposed-form-product-catalog-product-catalog {
    display: grid !important;
    grid-template-columns: 1fr !important;
    margin: 0.15rem auto 1rem !important;
    width: 100% !important;
  }

  html body.jd-storefront-page #wrapper #views-exposed-form-product-catalog-product-catalog .form-actions {
    width: 100% !important;
  }

  html body.jd-storefront-page #wrapper .pagerer-container .pagerer-panes {
    gap: 0.6rem !important;
  }

  html body.jd-storefront-product #wrapper .commerce-order-item-add-to-cart-form {
    align-items: end !important;
    gap: .65rem !important;
    grid-template-columns: minmax(6.5rem, .58fr) minmax(8rem, 1.42fr) !important;
  }

  html body.jd-storefront-product #wrapper .product-add-cart .commerce-order-item-add-to-cart-form .form-actions {
    transform: none !important;
    align-self: end !important;
    margin: 0 !important;
  }

  html body.path-product.jd-storefront-product #wrapper .product-post .product-add-cart .commerce-order-item-add-to-cart-form input.button.button--primary.button--add-to-cart.form-submit {
    align-self: end !important;
    margin: 0 !important;
  }

  html body.jd-storefront-product #wrapper .product-post .pdp-section__body {
    background: #fff !important;
    border-top: 0 !important;
    color: var(--jd-shop-ink) !important;
    line-height: 1.68 !important;
    margin-bottom: 0 !important;
    padding: clamp(.9rem, 2vw, 1.2rem) !important;
  }

  html body.jd-storefront-product #wrapper .product-post #product-detail .product-tab-item p {
    font-size: 0.94rem !important;
    padding: 0 !important;
  }
}

@keyframes jd-shop-accent-slide {
  0% { background-position: 0% 0; }
  100% { background-position: 200% 0; }
}

/* Blog pager spacing (2026-10-01). */
html body.path-blog.page-blog #wrapper .region-content .pagerer-container {
  margin-top: 0.5rem !important;
  margin-bottom: -3.5rem !important;
}
@media (max-width: 767px) {
  html body.path-blog.page-blog #wrapper .region-content .pagerer-container {
    margin-top: 0.5rem !important;
    margin-bottom: -1.25rem !important;
  }
}

/* Shared public shopping area: one native component before page content. */
html body.jd-storefront-page #wrapper .jd-storefront-area {
  background: linear-gradient(180deg, #faf5ff 0, #fff 29rem) !important;
  display: block !important;
  margin: 0 !important;
  overflow: clip;
  padding: 1.25rem 0 1.75rem !important;
  position: relative !important;
  top: auto !important;
}
html body.jd-storefront-page #wrapper .jd-storefront-shell[data-jd-storefront-shell] {
  box-sizing: border-box;
  display: grid;
  gap: 1.15rem;
  margin-inline: auto;
  max-width: 1220px;
  min-width: 0;
  padding-inline: 24px;
  width: 100%;
}
html body.jd-storefront-page #wrapper .jd-storefront-area .block {
  background: transparent !important;
  border: 0 !important;
  clear: none !important;
  display: block !important;
  float: none !important;
  margin: 0 !important;
  max-width: 100% !important;
  min-width: 0 !important;
  padding: 0 !important;
  position: relative !important;
  top: auto !important;
  width: 100% !important;
}
html body.jd-storefront-page #wrapper .jd-storefront-area .block > .container-wrap,
html body.jd-storefront-page #wrapper .jd-storefront-area .block > .container-wrap > .block-content,
html body.jd-storefront-page #wrapper .jd-storefront-area .views-element-container,
html body.jd-storefront-page #wrapper .jd-storefront-area .view-item {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  display: block !important;
  margin: 0 !important;
  max-width: 100% !important;
  min-width: 0 !important;
  overflow: visible !important;
  padding: 0 !important;
  top: auto !important;
  width: 100% !important;
}
html body.jd-storefront-page #wrapper .jd-storefront-area .block :is(.block-title-wrap, .view-header) {
  margin: 0 !important;
  padding: 0 !important;
}
html body.jd-storefront-page #wrapper .jd-storefront-area .block :is(.block-title, .product-categories-block__title) {
  -webkit-text-fill-color: var(--jd-shop-deep) !important;
  background: none !important;
  border: 0 !important;
  color: var(--jd-shop-deep) !important;
  font-size: clamp(1.15rem, 2vw, 1.5rem) !important;
  font-weight: 800 !important;
  line-height: 1.25 !important;
  margin: 0 !important;
  padding: 0 !important;
  text-align: left !important;
}
html body.jd-storefront-page #wrapper .jd-storefront-area .block :is(.block-title, .product-categories-block__title)::before,
html body.jd-storefront-page #wrapper .jd-storefront-area .block :is(.block-title, .product-categories-block__title)::after {
  content: none !important;
  display: none !important;
}
/* Search is always the first shared control. */
html body.jd-storefront-page #wrapper .jd-storefront-area .jd-storefront-search {
  min-width: 0;
}
html body.jd-storefront-page #wrapper .jd-storefront-area .jd-storefront-search .block-title-wrap {
  margin-bottom: .6rem !important;
}
html body.jd-storefront-page #wrapper .jd-storefront-area #views-exposed-form-product-catalog-product-catalog-search {
  align-items: end !important;
  display: grid !important;
  gap: .6rem !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  margin: 0 !important;
  max-width: none !important;
  padding: 0 !important;
  width: 100% !important;
}
html body.jd-storefront-page #wrapper .jd-storefront-area #views-exposed-form-product-catalog-product-catalog-search :is(.form-item, .form-actions) {
  margin: 0 !important;
  min-width: 0 !important;
}
html body.jd-storefront-page #wrapper .jd-storefront-area #views-exposed-form-product-catalog-product-catalog-search label {
  -webkit-text-fill-color: var(--jd-shop-ink) !important;
  color: var(--jd-shop-ink) !important;
  font-size: .85rem !important;
  margin: 0 0 .25rem !important;
}
html body.jd-storefront-page #wrapper .jd-storefront-area #views-exposed-form-product-catalog-product-catalog-search :is(input[type='text'], .form-submit) {
  height: 46px !important;
  margin: 0 !important;
  min-height: 46px !important;
  min-width: 0 !important;
  position: static !important;
  top: auto !important;
}
html body.jd-storefront-page #wrapper .jd-storefront-area #views-exposed-form-product-catalog-product-catalog-search .form-submit {
  -webkit-text-fill-color: #fff !important;
  color: #fff !important;
  padding-inline: 1.25rem !important;
  width: auto !important;
}
/* Compact benefits and gift-card band, identical on every shop route. */
html body.jd-storefront-page #wrapper .jd-storefront-value-row {
  align-items: stretch;
  display: grid;
  gap: 1rem;
  grid-template-columns: minmax(0, 1.65fr) minmax(0, 1fr);
  min-width: 0;
}
/* Keep the native Layout Builder carriers out of the benefits-card grid. */
html body.jd-storefront-page #wrapper .jd-storefront-area #block-martis-shopiconbox :is(.layout.layout--onecol, .layout__region--content, .block-field-blockblock-contentbasicbody, .container-wrap, .block-content, .field-body, .box-icon-section, .box-icon-items),
html body.jd-storefront-page #wrapper .jd-storefront-area #block-martis-shopiconbox .container.box-icon-section > .row {
  box-sizing: border-box;
  margin: 0 !important;
  max-width: 100% !important;
  min-width: 0 !important;
  padding: 0 !important;
  width: 100% !important;
}
html body.jd-storefront-page #wrapper .jd-storefront-area #block-martis-shopiconbox .layout.layout--onecol {
  display: block !important;
  gap: 0 !important;
  grid-template-columns: none !important;
  height: auto !important;
}
html body.jd-storefront-page #wrapper .jd-storefront-area #block-martis-shopiconbox .container.box-icon-section > .row {
  display: grid !important;
  gap: .65rem !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  height: auto;
}
html body.jd-storefront-page #wrapper .jd-storefront-area #block-martis-shopiconbox .box-icon-items {
  display: flex !important;
}
html body.jd-storefront-page #wrapper .jd-storefront-area #block-martis-shopiconbox .box-icon-item {
  align-items: start !important;
  background: #fff !important;
  border: 1px solid var(--jd-shop-border) !important;
  border-radius: 12px !important;
  box-shadow: none !important;
  display: grid !important;
  gap: .65rem !important;
  grid-template-columns: 34px minmax(0, 1fr) !important;
  margin: 0 !important;
  min-height: 0 !important;
  overflow: visible !important;
  padding: .8rem !important;
  text-align: left !important;
  transform: none !important;
  width: 100% !important;
}
html body.jd-storefront-page #wrapper .jd-storefront-area #block-martis-shopiconbox .box-icon-item::before,
html body.jd-storefront-page #wrapper .jd-storefront-area #block-martis-shopiconbox .box-icon-item::after { display: none !important; }
html body.jd-storefront-page #wrapper .jd-storefront-area #block-martis-shopiconbox .box-icon {
  align-items: center !important;
  background: var(--jd-shop-lilac) !important;
  border: 0 !important;
  border-radius: 10px !important;
  display: flex !important;
  height: 34px !important;
  justify-content: center !important;
  margin: 0 !important;
  width: 34px !important;
}
html body.jd-storefront-page #wrapper .jd-storefront-area #block-martis-shopiconbox .material-icons {
  -webkit-text-fill-color: var(--jd-shop-purple) !important;
  color: var(--jd-shop-purple) !important;
  font-size: 21px !important;
}
html body.jd-storefront-page #wrapper .jd-storefront-area #block-martis-shopiconbox .box-desc { display: block !important; }
html body.jd-storefront-page #wrapper .jd-storefront-area #block-martis-shopiconbox .box-desc :is(p, .box-icon-title) {
  -webkit-text-fill-color: var(--jd-shop-muted) !important;
  background: none !important;
  border: 0 !important;
  color: var(--jd-shop-muted) !important;
  display: block !important;
  font-size: .78rem !important;
  line-height: 1.45 !important;
  margin: 0 !important;
  min-height: 0 !important;
  padding: 0 !important;
  text-align: left !important;
}
html body.jd-storefront-page #wrapper .jd-storefront-area #block-martis-shopiconbox .box-desc .box-icon-title {
  -webkit-text-fill-color: var(--jd-shop-deep) !important;
  color: var(--jd-shop-deep) !important;
  font-size: .84rem !important;
  font-weight: 800 !important;
  margin-bottom: .25rem !important;
}
html body.jd-storefront-page #wrapper .jd-storefront-area #block-martis-gift-cards .gift-card-promo {
  align-content: center !important;
  align-items: start !important;
  background: linear-gradient(135deg, #f3e8ff, #fdfaff) !important;
  border: 1px solid var(--jd-shop-border) !important;
  border-radius: 14px !important;
  box-shadow: none !important;
  display: grid !important;
  gap: .65rem !important;
  grid-template-columns: 1fr !important;
  height: 100% !important;
  margin: 0 !important;
  max-width: 100% !important;
  padding: 1rem !important;
  width: 100% !important;
}
html body.jd-storefront-page #wrapper .jd-storefront-area #block-martis-gift-cards .gift-card-promo :is(p, h2) {
  -webkit-text-fill-color: var(--jd-shop-ink) !important;
  color: var(--jd-shop-ink) !important;
  font-size: .8rem !important;
  line-height: 1.5 !important;
  margin: .2rem 0 0 !important;
  padding: 0 !important;
}
html body.jd-storefront-page #wrapper .jd-storefront-area #block-martis-gift-cards .gift-card-promo h2 {
  -webkit-text-fill-color: var(--jd-shop-deep) !important;
  color: var(--jd-shop-deep) !important;
  font-size: 1.1rem !important;
  font-weight: 800 !important;
}
html body.jd-storefront-page #wrapper .jd-storefront-area #block-martis-gift-cards .gift-card-promo__eyebrow {
  font-size: .7rem !important;
  font-weight: 750 !important;
  letter-spacing: .05em !important;
  text-transform: uppercase;
}
html body.jd-storefront-page #wrapper .jd-storefront-area #block-martis-gift-cards .gift-card-promo__actions {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  gap: .5rem !important;
  margin: 0 !important;
}
html body.jd-storefront-page #wrapper .jd-storefront-area #block-martis-gift-cards .gift-card-promo__actions a {
  align-items: center !important;
  border: 1px solid var(--jd-shop-purple) !important;
  border-radius: 9px !important;
  display: inline-flex !important;
  flex: 1 1 auto !important;
  font-size: .8rem !important;
  font-weight: 750 !important;
  justify-content: center !important;
  line-height: 1.3 !important;
  min-height: 44px !important;
  padding: .6rem .8rem !important;
  text-align: center !important;
}
html body.jd-storefront-page #wrapper .jd-storefront-area #block-martis-gift-cards .gift-card-promo__buy {
  -webkit-text-fill-color: #fff !important;
  background: var(--jd-shop-purple) !important;
  color: #fff !important;
}
html body.jd-storefront-page #wrapper .jd-storefront-area #block-martis-gift-cards .gift-card-promo__wallet {
  -webkit-text-fill-color: var(--jd-shop-purple) !important;
  background: #fff !important;
  color: var(--jd-shop-purple) !important;
}
@media (min-width: 768px) {
  html body.jd-storefront-page #wrapper .jd-storefront-area .jd-storefront-value-row > :is(.jd-storefront-benefits, .jd-storefront-gift),
  html body.jd-storefront-page #wrapper .jd-storefront-area :is(#block-martis-shopiconbox, #block-martis-gift-cards),
  html body.jd-storefront-page #wrapper .jd-storefront-area :is(#block-martis-shopiconbox, #block-martis-gift-cards) > .container-wrap,
  html body.jd-storefront-page #wrapper .jd-storefront-area :is(#block-martis-shopiconbox, #block-martis-gift-cards) > .container-wrap > .block-content,
  html body.jd-storefront-page #wrapper .jd-storefront-area #block-martis-shopiconbox :is(.layout.layout--onecol, .layout__region--content, .block-field-blockblock-contentbasicbody, .container-wrap, .block-content, .field-body, .box-icon-section) {
    display: flex !important;
    flex: 1 0 auto !important;
    flex-direction: column !important;
  }
  html body.jd-storefront-page #wrapper .jd-storefront-area #block-martis-shopiconbox .container.box-icon-section > .row,
  html body.jd-storefront-page #wrapper .jd-storefront-area #block-martis-gift-cards .gift-card-promo {
    flex: 1 0 auto !important;
    height: auto !important;
  }
}
/* Card rails use no legacy list/grid classes. */
html body.jd-storefront-page #wrapper .jd-catalog-navigation {
  display: grid;
  gap: 1.6rem;
  min-width: 0;
}
html body.jd-storefront-page #wrapper .jd-catalog-rail { min-width: 0; }
html body.jd-storefront-page #wrapper .jd-catalog-rail[hidden] { display: none !important; }
html body.jd-storefront-page #wrapper .jd-catalog-rail__heading {
  align-items: center;
  display: flex;
  gap: 1rem;
  justify-content: space-between;
  min-height: 44px;
}
html body.jd-storefront-page #wrapper .jd-catalog-departments > .jd-catalog-rail__heading {
  flex-wrap: wrap;
}
html body.jd-storefront-page #wrapper .jd-catalog-department-tools {
  align-items: center;
  display: flex;
  flex: 0 1 auto;
  flex-wrap: wrap;
  gap: .5rem;
  justify-content: flex-end;
  margin-left: auto;
  max-width: 100%;
  min-width: 0;
}
html body.jd-storefront-page #wrapper .jd-storefront-area button.jd-catalog-motion-toggle[type='button'] {
  -webkit-text-fill-color: var(--jd-shop-purple) !important;
  align-items: center !important;
  background: #fff !important;
  border: 1px solid var(--jd-shop-border) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
  color: var(--jd-shop-purple) !important;
  cursor: pointer;
  display: inline-flex !important;
  flex: 0 1 auto;
  font-size: .8rem !important;
  font-weight: 700 !important;
  justify-content: center !important;
  line-height: 1.3 !important;
  margin: 0 !important;
  max-width: 100% !important;
  min-height: 44px !important;
  min-width: 0 !important;
  padding: .55rem .8rem !important;
  position: static !important;
  text-align: center !important;
  text-transform: none !important;
  transform: none !important;
  width: auto !important;
}
html body.jd-storefront-page #wrapper .jd-storefront-area button.jd-catalog-motion-toggle[type='button'][hidden] {
  display: none !important;
}
html body.jd-storefront-page #wrapper .jd-catalog-rail__hint {
  -webkit-text-fill-color: var(--jd-shop-muted) !important;
  color: var(--jd-shop-muted) !important;
  font-size: .85rem !important;
  line-height: 1.4 !important;
  margin: .35rem 0 !important;
}
html body.jd-storefront-page #wrapper .jd-catalog-rail__title {
  -webkit-text-fill-color: var(--jd-shop-deep) !important;
  color: var(--jd-shop-deep) !important;
  font-size: 1rem !important;
  font-weight: 800 !important;
  line-height: 1.35 !important;
  margin: 0 !important;
  padding: 0 !important;
}
html body.jd-storefront-page #wrapper .jd-catalog-rail__controls {
  align-items: center;
  display: flex;
  flex: 0 0 auto;
  gap: .4rem;
}
html body.jd-storefront-page #wrapper .jd-catalog-rail__controls[hidden] { display: none !important; }
html body.jd-storefront-page #wrapper .jd-catalog-rail__controls button {
  -webkit-text-fill-color: var(--jd-shop-purple) !important;
  align-items: center !important;
  background: #fff !important;
  border: 1px solid var(--jd-shop-border) !important;
  border-radius: 50% !important;
  color: var(--jd-shop-purple) !important;
  cursor: pointer;
  display: inline-flex !important;
  font-size: 1.25rem !important;
  height: 44px !important;
  justify-content: center !important;
  line-height: 1 !important;
  margin: 0 !important;
  min-width: 44px !important;
  padding: 0 !important;
  width: 44px !important;
}
html body.jd-storefront-page #wrapper .jd-catalog-rail__track {
  align-items: stretch;
  display: flex !important;
  gap: 12px;
  margin: 0 !important;
  max-width: 100%;
  min-width: 0;
  overflow-x: auto;
  overflow-y: hidden;
  overscroll-behavior-x: contain;
  padding: 6px 2px 12px !important;
  scroll-padding-inline: 2px;
  scroll-snap-type: x proximity;
  scrollbar-color: #d0b4e3 transparent;
  scrollbar-width: thin;
  -webkit-overflow-scrolling: touch;
}
html body.jd-storefront-page #wrapper .jd-catalog-card {
  background: #fff;
  border: 1px solid var(--jd-shop-border);
  border-radius: 14px;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  flex: 0 0 calc((100% - 60px) / 6);
  margin: 0;
  min-width: 0;
  overflow: visible;
  padding: 8px;
  position: relative;
  scroll-snap-align: start;
  transition: border-color .18s ease, box-shadow .18s ease;
}
html body.jd-storefront-page #wrapper .jd-catalog-card:is(:hover, :focus-within) {
  border-color: var(--jd-shop-violet);
  box-shadow: 0 3px 12px rgba(59, 10, 92, .09);
}
html body.jd-storefront-page #wrapper .jd-catalog-card:is(.is-active, .is-active-ancestor) {
  border-color: var(--jd-shop-purple);
  box-shadow: inset 0 0 0 1px var(--jd-shop-purple);
}
html body.jd-storefront-page #wrapper .jd-catalog-card__link {
  -webkit-text-fill-color: var(--jd-shop-ink) !important;
  color: var(--jd-shop-ink) !important;
  display: block;
  flex: 1 1 auto;
  text-decoration: none !important;
}
html body.jd-storefront-page #wrapper .jd-catalog-card__art {
  aspect-ratio: 1;
  background: #fff;
  border-radius: 10px;
  display: block;
  overflow: hidden;
  position: relative;
}
html body.jd-storefront-page #wrapper .jd-catalog-card__art img {
  border: 0 !important;
  border-radius: 0 !important;
  display: block;
  height: 100% !important;
  margin: 0 !important;
  object-fit: contain;
  width: 100% !important;
}
html body.jd-storefront-page #wrapper .jd-catalog-motion {
  bottom: 2px;
  height: 44%;
  opacity: 1;
  pointer-events: none;
  position: absolute;
  right: 2px;
  width: 66%;
}
/* Keep the reference-sized disc visible independently of player readiness. */
html body.jd-storefront-page #wrapper .jd-catalog-card--department .jd-catalog-motion::before {
  aspect-ratio: 1;
  background: #f3e8ff;
  border: 0;
  border-radius: 50%;
  content: '';
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 48.333333%;
  z-index: 0;
}
html body.jd-storefront-page #wrapper .jd-catalog-motion [data-jd-catalog-motion-fallback],
html body.jd-storefront-page #wrapper [data-jd-catalog-motion-stage] {
  display: block;
  height: 100%;
  inset: 0;
  position: absolute;
  width: 100%;
  z-index: 1;
}
html body.jd-storefront-page #wrapper .jd-catalog-motion [data-jd-catalog-motion-fallback] {
  opacity: 1;
  visibility: visible;
}
html body.jd-storefront-page #wrapper [data-jd-catalog-motion-stage] {
  opacity: 0;
  visibility: hidden;
}
html body.jd-storefront-page #wrapper .jd-catalog-motion.is-motion-ready [data-jd-catalog-motion-fallback] {
  opacity: 0;
  visibility: hidden;
}
html body.jd-storefront-page #wrapper .jd-catalog-motion.is-motion-ready [data-jd-catalog-motion-stage] {
  opacity: 1;
  visibility: visible;
}
html body.jd-storefront-page #wrapper .jd-catalog-motion svg { height: 100%; width: 100%; }
html body.jd-storefront-page #wrapper .jd-catalog-card__name {
  display: block;
  font-size: .88rem;
  font-weight: 800;
  line-height: 1.4;
  min-height: calc(2.8em + .65rem);
  overflow-wrap: anywhere;
  padding: .65rem 2.6rem 0 .15rem;
}
html body.jd-storefront-page #wrapper .jd-catalog-department-select {
  -webkit-text-fill-color: var(--jd-shop-purple) !important;
  background: #fff !important;
  border: 1px solid var(--jd-shop-border) !important;
  border-radius: 8px !important;
  color: var(--jd-shop-purple) !important;
  display: flex;
  font-size: .72rem !important;
  font-weight: 750;
  gap: .3rem;
  justify-content: space-between;
  line-height: 1.35;
  margin: .5rem 0 0 !important;
  min-height: 44px;
  padding: .45rem .5rem !important;
  text-align: left;
  width: 100%;
}
html body.jd-storefront-page #wrapper .jd-catalog-department-select[hidden] { display: none !important; }
html body.jd-storefront-page #wrapper .jd-catalog-department-select[aria-pressed='true'] {
  background: var(--jd-shop-lilac) !important;
  border-color: var(--jd-shop-purple) !important;
}
html body.jd-storefront-page #wrapper .jd-catalog-subcategories {
  background: #faf5ff;
  border: 1px solid #e5d8ee;
  border-radius: 14px;
  margin-top: .65rem;
  padding: .7rem .85rem .15rem;
}
html body.jd-storefront-page #wrapper .jd-catalog-subcategories .jd-catalog-rail__track { gap: 10px; }
html body.jd-storefront-page #wrapper .jd-catalog-card--subcategory {
  flex-basis: 160px;
  padding: 6px;
}
html body.jd-storefront-page #wrapper .jd-catalog-card--subcategory .jd-catalog-card__name {
  font-size: .8rem;
  min-height: calc(2.8em + .65rem);
}
html body.jd-storefront-page #wrapper .jd-catalog-brand {
  flex: 0 0 155px;
  scroll-snap-align: start;
}
html body.jd-storefront-page #wrapper .jd-catalog-brand {
  background: #fff;
  border: 1px solid var(--jd-shop-border);
  border-radius: 12px;
  box-sizing: border-box;
  height: 100%;
  padding: .65rem;
  position: relative;
}
html body.jd-storefront-page #wrapper .jd-catalog-brand__image {
  align-items: center;
  display: flex;
  height: 68px;
  justify-content: center;
  overflow: hidden;
}
html body.jd-storefront-page #wrapper .jd-catalog-brand__image :is(div, .field-item) { height: 100%; width: 100%; }
html body.jd-storefront-page #wrapper .jd-catalog-brand__image img {
  display: block !important;
  height: 100% !important;
  margin: 0 auto !important;
  max-width: 100% !important;
  object-fit: contain !important;
  padding: .3rem !important;
  width: 100% !important;
}
html body.jd-storefront-page #wrapper .jd-catalog-brand__image .field-label { display: none; }
html body.jd-storefront-page #wrapper .jd-catalog-brand .jd-catalog-card__name {
  min-height: 54px;
  padding: .65rem 2.6rem .1rem .1rem;
}
html body.jd-storefront-page #wrapper .jd-catalog-brand .jd-catalog-card__link {
  -webkit-text-fill-color: var(--jd-shop-ink) !important;
  color: var(--jd-shop-ink) !important;
  font-size: .85rem !important;
  font-weight: 800 !important;
  line-height: 1.4 !important;
  text-decoration: none;
}

/* Keep the existing linked artwork and complete native descriptions. */
html body.jd-storefront-page #wrapper [data-jd-storefront-shell] *,
html body.jd-storefront-page #wrapper [data-jd-storefront-shell] *::before,
html body.jd-storefront-page #wrapper [data-jd-storefront-shell] *::after { box-sizing: border-box; }
html body.jd-storefront-page #wrapper [data-jd-storefront-shell] [hidden] { display: none !important; }
html body.jd-storefront-page #wrapper .jd-storefront-shell > *,
html body.jd-storefront-page #wrapper .jd-storefront-value-row > *,
html body.jd-storefront-page #wrapper .jd-catalog-navigation > * { min-width: 0; }
html body.jd-storefront-page #wrapper .jd-catalog-navigation :is(.view-product-categories-block, .view-header) {
  background: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  margin: 0 !important;
  max-width: 100% !important;
  padding: 0 !important;
  transform: none !important;
  width: 100% !important;
}
html body.jd-storefront-page #wrapper .jd-catalog-navigation .view-header::before,
html body.jd-storefront-page #wrapper .jd-catalog-navigation .view-header::after { content: none !important; }
html body.jd-storefront-page #wrapper .jd-catalog-card__image-link {
  background: none !important;
  border: 0 !important;
  display: block;
  padding: 0 !important;
  text-decoration: none !important;
}
html body.jd-storefront-page #wrapper .jd-catalog-card__art { width: 100%; }
html body.jd-storefront-page #wrapper .jd-catalog-card__art picture { display: block; height: 100%; width: 100%; }
html body.jd-storefront-page #wrapper .jd-catalog-card__link {
  background: none !important;
  border: 0 !important;
  min-width: 0;
  padding: 0 !important;
  transform: none !important;
}
html body.jd-storefront-page #wrapper .jd-catalog-card__link:hover .jd-catalog-card__name { text-decoration: underline; text-underline-offset: .15em; }
html body.jd-storefront-page #wrapper .jd-catalog-card__name { margin: 0; }
html body.jd-storefront-page #wrapper .jd-catalog-card__actions { display: contents; }
html body.jd-storefront-page #wrapper .jd-catalog-brand .jd-catalog-card__link { flex: 0 0 auto; }
html body.jd-storefront-page #wrapper .jd-catalog-brand .jd-catalog-card__name {
  display: block;
  font-size: .85rem;
  font-weight: 800;
  line-height: 1.4;
  min-height: 54px;
  overflow-wrap: anywhere;
  padding: .65rem 2.6rem .1rem .1rem;
}
html body.jd-storefront-page #wrapper .jd-catalog-brand .jd-catalog-brand__image :is(.field, .field-items, .field-item, .field-content) {
  align-items: center;
  background: none !important;
  border: 0 !important;
  display: flex;
  height: 100%;
  margin: 0 !important;
  min-width: 0;
  padding: 0 !important;
  width: 100%;
}

/* Center the existing static glyph inside the persistent department disc. */
html body.jd-storefront-page #wrapper [data-jd-catalog-motion-fallback]::after {
  aspect-ratio: 1;
  background: #6716aa;
  content: '';
  left: 50%;
  mask: var(--jd-catalog-motion-mask) center / contain no-repeat;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 38.666667%;
}
html body.jd-storefront-page #wrapper [data-jd-catalog-motion='automotive'] { --jd-catalog-motion-mask: url('/files/drupal-detailing-icons-complete/automotive/automotive-products-and-supplies.svg'); }
html body.jd-storefront-page #wrapper [data-jd-catalog-motion='marine'] { --jd-catalog-motion-mask: url('/files/drupal-detailing-icons-complete/boat-rv/boat-and-rv-products-and-supplies.svg'); }
html body.jd-storefront-page #wrapper [data-jd-catalog-motion='aviation'] { --jd-catalog-motion-mask: url('/files/drupal-detailing-icons-complete/aviation/aviation-products-and-supplies.svg'); }
html body.jd-storefront-page #wrapper [data-jd-catalog-motion='accessories'] { --jd-catalog-motion-mask: url('/files/drupal-detailing-icons-complete/accessories/accessories-and-tools.svg'); }

/* Native details remains a usable full-text fallback until a dialog mounts. */
html body.jd-storefront-page #wrapper .jd-catalog-info { margin: .35rem 0 0; }
/* Preserve the native disclosure row when its summary overlays the card. */
html body.jd-storefront-page #wrapper .jd-catalog-info:not(.is-enhanced) { padding-top: 44px; }
html body.jd-storefront-page #wrapper .jd-catalog-info__trigger {
  -webkit-text-fill-color: var(--jd-shop-purple) !important;
  align-items: center;
  background: transparent;
  border: 0;
  border-radius: 50%;
  bottom: auto;
  box-sizing: border-box;
  color: var(--jd-shop-purple) !important;
  cursor: pointer;
  display: inline-flex;
  font-family: Georgia, serif;
  font-size: 1rem;
  font-weight: 700;
  height: 44px;
  justify-content: center;
  line-height: 1;
  list-style: none;
  margin: 0;
  padding: 0;
  position: absolute;
  right: 4px;
  top: 4px;
  width: 44px;
  z-index: 2;
}
/* Draw a smaller circle while retaining the full touch and keyboard target. */
html body.jd-storefront-page #wrapper .jd-catalog-info__trigger > span[aria-hidden='true'] {
  align-items: center;
  background: #fff;
  border: 1px solid #c6a7d8;
  border-radius: 50%;
  box-sizing: border-box;
  display: inline-flex;
  flex: 0 0 36px;
  height: 36px;
  justify-content: center;
  width: 36px;
}
html body.jd-storefront-page #wrapper .jd-catalog-info__trigger::-webkit-details-marker { display: none; }
html body.jd-storefront-page #wrapper .jd-catalog-info__trigger::marker { content: ''; }
html body.jd-storefront-page #wrapper [data-jd-info-content] {
  color: var(--jd-shop-ink);
  font-size: .9rem;
  line-height: 1.65;
  overflow-wrap: anywhere;
  padding: .7rem .2rem .3rem;
}
html body.jd-storefront-page #wrapper .jd-catalog-info.is-enhanced { height: 0; margin: 0; }
html body.jd-storefront-page #wrapper .jd-catalog-info.is-enhanced > [data-jd-info-content] { display: none; }

/* The dialog is body hosted; it preserves and returns the original content. */
html body.jd-storefront-page .jd-catalog-dialog {
  -webkit-text-fill-color: #1a0a24 !important;
  background: #fff;
  border: 1px solid #e9d5ff;
  border-radius: 20px;
  box-shadow: 0 24px 90px #24143840;
  box-sizing: border-box;
  color: #1a0a24 !important;
  inset: 0;
  margin: auto;
  max-height: min(80dvh, 720px);
  max-width: calc(100vw - 48px);
  overflow-y: auto;
  padding: 0;
  position: fixed;
  width: 620px;
}
html body.jd-storefront-page .jd-catalog-dialog:not([open]) { display: none; }
html body.jd-storefront-page .jd-catalog-dialog::backdrop { background: #2414389e; backdrop-filter: blur(3px); }
html body.jd-storefront-page .jd-catalog-dialog__panel {
  align-items: center;
  display: grid;
  gap: 1rem;
  grid-template-columns: minmax(0, 1fr) 44px;
  min-width: 0;
  padding: 2rem;
}
html body.jd-storefront-page .jd-catalog-dialog__title {
  -webkit-text-fill-color: #3b0a5c !important;
  background: none !important;
  border: 0 !important;
  box-shadow: none !important;
  color: #3b0a5c !important;
  font-size: 1.5rem !important;
  font-weight: 800;
  grid-column: 1;
  line-height: 1.3;
  margin: 0 !important;
  min-width: 0;
  overflow-wrap: anywhere;
  padding: 0 !important;
}
html body.jd-storefront-page .jd-catalog-dialog button.jd-catalog-dialog__close[type='button'] {
  -webkit-text-fill-color: #6716aa !important;
  align-items: center !important;
  background: #f3e8ff !important;
  border: 1px solid #e9d5ff !important;
  border-radius: 50% !important;
  box-shadow: none !important;
  color: #6716aa !important;
  cursor: pointer;
  display: grid !important;
  grid-column: 2;
  grid-row: 1;
  height: 44px !important;
  line-height: 1 !important;
  margin: 0 !important;
  max-height: 44px !important;
  max-width: 44px !important;
  min-height: 44px !important;
  min-width: 44px !important;
  padding: 0 !important;
  place-items: center !important;
  position: static !important;
  transform: none !important;
  width: 44px !important;
}
html body.jd-storefront-page .jd-catalog-dialog__close > svg { display: block; height: 20px; margin: 0; width: 20px; }
html body.jd-storefront-page .jd-catalog-dialog__content {
  color: #1a0a24;
  font-size: 1rem;
  grid-column: 1 / -1;
  line-height: 1.75;
  min-width: 0;
  overflow-wrap: anywhere;
  padding: 0;
}
html body.jd-storefront-page .jd-catalog-dialog__content :is(p, ul, ol) {
  -webkit-text-fill-color: inherit !important;
  background: none !important;
  border: 0 !important;
  box-shadow: none !important;
  color: inherit !important;
  font-size: inherit !important;
  line-height: inherit;
  margin: 0 0 1rem;
  padding-block: 0 !important;
}
html body.jd-storefront-page .jd-catalog-dialog__content :last-child { margin-bottom: 0; }
html body.jd-storefront-page .jd-catalog-dialog__content a { color: #6716aa; text-decoration: underline; text-underline-offset: .15em; }
html body.jd-storefront-page.jd-catalog-dialog-open { overflow: hidden; }
html body.jd-storefront-page #wrapper [data-jd-storefront-shell] :is(a, button, input, summary, [data-jd-rail-track]):focus-visible,
html body.jd-storefront-page .jd-catalog-dialog :is(a, button, [tabindex]):focus-visible { outline: 3px solid #6716aa !important; outline-offset: 3px; }

/* Reset offsets and inset panels at their native owners, on every shop route. */
html body.jd-storefront-page #wrapper .jd-storefront-area #block-martis-exposedformproduct-catalogproduct-catalog-search {
  background: #fff !important;
  border: 1px solid var(--jd-shop-border) !important;
  border-radius: 16px !important;
  bottom: auto !important;
  box-shadow: 0 5px 20px #3b0a5c0f !important;
  left: auto !important;
  margin: 0 !important;
  max-width: 100% !important;
  padding: 1rem 1.15rem !important;
  right: auto !important;
  top: auto !important;
  transform: none !important;
  width: 100% !important;
}
html body.jd-storefront-page #wrapper .jd-storefront-area #block-martis-exposedformproduct-catalogproduct-catalog-search > .container-wrap,
html body.jd-storefront-page #wrapper .jd-storefront-area #views-exposed-form-product-catalog-product-catalog-search {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
html body.jd-storefront-page #wrapper .jd-storefront-area #views-exposed-form-product-catalog-product-catalog-search :is(.form-item, .form-actions) {
  background: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  float: none !important;
  padding: 0 !important;
  width: auto !important;
}
html body.jd-storefront-page #wrapper #main-content > :is(#page-wrapper, #page-wrapper-content) { margin-top: 0 !important; }
html:not(.js) body.jd-storefront-page > #jd-preloader { display: none !important; }

@media (max-width: 1199px) {
  html body.jd-storefront-page #wrapper .jd-catalog-card { flex-basis: 175px; }
  html body.jd-storefront-page #wrapper .jd-catalog-card--subcategory { flex-basis: 150px; }
}
@media (max-width: 767px) {
  html body.jd-storefront-page #wrapper .jd-storefront-area { padding-block: 1rem 1.25rem !important; }
  html body.jd-storefront-page #wrapper .jd-storefront-shell[data-jd-storefront-shell] { gap: 1rem; padding-inline: 16px; }
  html body.jd-storefront-page #wrapper .jd-storefront-value-row { gap: .8rem; grid-template-columns: 1fr; }
  html body.jd-storefront-page #wrapper .jd-storefront-area #block-martis-shopiconbox .box-icon-item { display: block !important; padding: .7rem !important; }
  html body.jd-storefront-page #wrapper .jd-storefront-area #block-martis-shopiconbox .box-icon { margin-bottom: .5rem !important; }
  html body.jd-storefront-page #wrapper .jd-storefront-area #block-martis-gift-cards .gift-card-promo { padding: .9rem !important; }
  html body.jd-storefront-page #wrapper .jd-storefront-area #block-martis-exposedformproduct-catalogproduct-catalog-search { padding: .85rem !important; }
  html body.jd-storefront-page #wrapper .jd-catalog-card { flex-basis: 163px; }
  html body.jd-storefront-page #wrapper .jd-catalog-card--subcategory { flex-basis: 140px; }
  html body.jd-storefront-page #wrapper .jd-catalog-card__name { font-size: .82rem; }
  html body.jd-storefront-page #wrapper .jd-catalog-brand { flex-basis: 138px; }
  html body.jd-storefront-page #wrapper .jd-catalog-brand__image { height: 60px; }
  html body.jd-storefront-page #wrapper .jd-catalog-subcategories { padding-inline: .65rem; }
  html body.jd-storefront-page #wrapper .jd-catalog-rail__hint { font-size: .78rem !important; }
  html body.jd-storefront-page .jd-catalog-dialog {
    border-bottom: 0;
    border-radius: 20px 20px 0 0;
    inset: auto 0 0;
    margin: 0;
    max-height: 85dvh;
    max-width: 100%;
    width: 100%;
  }
  html body.jd-storefront-page .jd-catalog-dialog__panel { padding: 1.2rem 1.2rem calc(1.2rem + env(safe-area-inset-bottom, 0px)); }
  html body.jd-storefront-page .jd-catalog-dialog__title { font-size: 1.25rem !important; }
}
@media (prefers-reduced-motion: reduce) {
  html body.jd-storefront-page #wrapper [data-jd-storefront-shell] *,
  html body.jd-storefront-page .jd-catalog-dialog { animation: none !important; scroll-behavior: auto !important; transition: none !important; }
  html body.jd-storefront-page #wrapper .jd-catalog-motion [data-jd-catalog-motion-fallback] { opacity: 1 !important; visibility: visible !important; }
  html body.jd-storefront-page #wrapper .jd-catalog-motion [data-jd-catalog-motion-stage] { opacity: 0 !important; visibility: hidden !important; }
}
@media print {
  html body.jd-storefront-page #wrapper [data-jd-storefront-shell] [data-jd-rail-track] { display: flex !important; flex-wrap: wrap; overflow: visible; }
  html body.jd-storefront-page #wrapper [data-jd-storefront-shell] :is([data-jd-rail-controls], .jd-catalog-motion-toggle, .jd-catalog-motion) { display: none !important; }
}

/* assets/css/commerce-ui-refinements.css */
/**
 * Storefront and product-page refinements loaded after legacy commerce CSS.
 */

/* Shop icon copy uses one consistent left-aligned text column. */
html body.path-products #wrapper #block-martis-shopiconbox .box-desc,
html body.path-products #wrapper #block-martis-shopiconbox .box-icon-title,
html body.path-products #wrapper #block-martis-shopiconbox .box-desc p:not(.box-icon-title),
html body.path-taxonomy #wrapper #block-martis-shopiconbox .box-desc,
html body.path-taxonomy #wrapper #block-martis-shopiconbox .box-icon-title,
html body.path-taxonomy #wrapper #block-martis-shopiconbox .box-desc p:not(.box-icon-title),
html body.path-store #wrapper #block-martis-shopiconbox .box-desc,
html body.path-store #wrapper #block-martis-shopiconbox .box-icon-title,
html body.path-store #wrapper #block-martis-shopiconbox .box-desc p:not(.box-icon-title) {
  text-align: left !important;
}

html body.path-products #wrapper #block-martis-shopiconbox .box-desc,
html body.path-taxonomy #wrapper #block-martis-shopiconbox .box-desc,
html body.path-store #wrapper #block-martis-shopiconbox .box-desc {
  align-items: flex-start !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  min-width: 0 !important;
}

/* Description and Reviews tabs: hover adds an underline without repainting. */
html body.path-product.jd-storefront-product #wrapper .product-post .product-info > .nav.nav-tabs > li > a,
html body.path-product.jd-storefront-product #wrapper .product-post .pdp-tabs > li > a {
  text-decoration: none !important;
  text-decoration-thickness: 2px !important;
  text-underline-offset: 4px !important;
}

html body.path-product.jd-storefront-product #wrapper .product-post .product-info > .nav.nav-tabs > li:not(.active) > a:is(:hover, :focus-visible),
html body.path-product.jd-storefront-product #wrapper .product-post .pdp-tabs > li:not(.active) > a:is(:hover, :focus-visible) {
  background: #ffffff !important;
  border-color: #e9d5ff !important;
  color: #6716aa !important;
  -webkit-text-fill-color: #6716aa !important;
  text-decoration: underline !important;
}

html body.path-product.jd-storefront-product #wrapper .product-post .product-info > .nav.nav-tabs > li.active > a:is(:hover, :focus-visible),
html body.path-product.jd-storefront-product #wrapper .product-post .pdp-tabs > li.active > a:is(:hover, :focus-visible) {
  background: linear-gradient(135deg, #7b2cbf 0%, #6716aa 100%) !important;
  border-color: #000000 !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  text-decoration: underline !important;
}

/* Generated in-page PDP navigation follows the same non-repainting rule. */
html body.path-product.jd-storefront-product #wrapper .product-post .pdp-jump-nav a {
  background: #f3e8ff !important;
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  text-decoration: none !important;
  text-decoration-thickness: 2px !important;
  text-underline-offset: 3px !important;
}

html body.path-product.jd-storefront-product #wrapper .product-post .pdp-jump-nav a:is(:hover, :focus-visible) {
  background: #f3e8ff !important;
  border-color: #6716aa !important;
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  text-decoration: underline !important;
}

/* Square heading/review treatment and remove inherited decorative rules. */
html body.path-product.jd-storefront-product #wrapper .product-post #product-detail .product-tab-item > h2,
html body.path-product.jd-storefront-product #wrapper .product-post .product-tab-item > h2.margin-bottom-20 {
  border-radius: 10px !important;
  text-decoration: none !important;
}

html body.path-product.jd-storefront-product #wrapper .product-post #product-detail .product-tab-item > h2::before,
html body.path-product.jd-storefront-product #wrapper .product-post #product-detail .product-tab-item > h2::after,
html body.path-product.jd-storefront-product #wrapper .product-post .product-tab-item > h2.margin-bottom-20::before,
html body.path-product.jd-storefront-product #wrapper .product-post .product-tab-item > h2.margin-bottom-20::after {
  content: none !important;
  display: none !important;
}

html body.path-product.jd-storefront-product #wrapper .product-post #product-review,
html body.path-product.jd-storefront-product #wrapper .product-post #product-review > section,
html body.path-product.jd-storefront-product #wrapper .product-post #product-review .field--name-field-product-review {
  border-radius: 0 !important;
  max-width: 100% !important;
  overflow: visible !important;
}

html body.path-product.jd-storefront-product #wrapper .product-post #product-review {
  box-sizing: border-box !important;
  min-height: 7rem !important;
  padding: 0.35rem 0.1rem 0.1rem !important;
}

html body.path-product.jd-storefront-product #wrapper .product-post #product-review :is(h2, h3) {
  border-radius: 0 !important;
  box-sizing: border-box !important;
  line-height: 1.3 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  max-width: 100% !important;
  overflow: visible !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Cyberlytics-style compact round product thumbnails. */
html body.path-product.jd-storefront-product #wrapper .product-post .product-gallery-thumbs {
  align-items: center !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 0.65rem !important;
  justify-content: center !important;
  margin: 0 !important;
  overflow: visible !important;
  padding: 0.25rem 0.15rem 0.45rem !important;
  width: 100% !important;
  justify-content: center !important;
}

html body.path-product.jd-storefront-product #wrapper .product-post .product-gallery-thumb {
  align-items: center !important;
  aspect-ratio: 1 !important;
  background: #ffffff !important;
  border: 2px solid #e5d5f2 !important;
  border-radius: 50% !important;
  box-shadow: none !important;
  display: inline-flex !important;
  flex: 0 0 3.35rem !important;
  height: 3.35rem !important;
  justify-content: center !important;
  margin: 0 !important;
  max-width: 3.35rem !important;
  min-height: 0 !important;
  overflow: hidden !important;
  padding: 0 !important;
  scroll-snap-align: start;
  transform: none !important;
  transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease !important;
  width: 3.35rem !important;
}

html body.path-product.jd-storefront-product #wrapper .product-post .product-gallery-thumb img {
  border: 0 !important;
  border-radius: 50% !important;
  display: block !important;
  height: 100% !important;
  margin: 0 !important;
  object-fit: cover !important;
  padding: 0 !important;
  width: 100% !important;
}

html body.path-product.jd-storefront-product #wrapper .product-post .product-gallery-thumb:is(:hover, :focus-visible) {
  border-color: #9d4edd !important;
  box-shadow: 0 0 0 3px rgba(157, 78, 221, 0.16) !important;
  transform: scale(1.05) !important;
}

html body.path-product.jd-storefront-product #wrapper .product-post .product-gallery-thumb:is(.is-main-thumb, [aria-current='true']) {
  border-color: #6716aa !important;
  box-shadow: 0 0 0 3px rgba(103, 22, 170, 0.2) !important;
}

html body.path-product.jd-storefront-product #wrapper .product-post .product-gallery-thumb.is-main-thumb:hover {
  transform: none !important;
}

@media (max-width: 767.98px) {
  html body.path-product.jd-storefront-product #wrapper .product-post .product-gallery-thumbs {
    flex-wrap: nowrap !important;
    justify-content: center !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    overscroll-behavior-inline: contain;
    scroll-snap-type: x mandatory;
    scrollbar-width: thin;
    -webkit-overflow-scrolling: touch;
  }

  html body.path-product.jd-storefront-product #wrapper .product-post .product-gallery-thumb {
    flex-basis: 3.1rem !important;
    height: 3.1rem !important;
    max-width: 3.1rem !important;
    width: 3.1rem !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  html body.path-product.jd-storefront-product #wrapper .product-gallery-thumb {
    transition: none !important;
  }
}

/* assets/css/header-menu-route-parity.css */
/**
 * Main-menu parity for the homepage, products landing page, and service cities.
 * City pages use separate Drupal menu blocks, so target the shared menu shell.
 */

@media (max-width: 767.98px) {
  html body:is(.path-frontpage, .path-products, .page-service-city) #wrapper .header #main-menu.show,
  html body:is(.path-frontpage, .path-products, .page-service-city) #wrapper .header #main-menu.collapse.show {
    background: #3b0a5c !important;
    box-sizing: border-box !important;
    margin-top: 0 !important;
    padding: 0.5rem 0.75rem 0.75rem !important;
  }

  html body.path-frontpage #wrapper .header #main-menu.show,
  html body.path-frontpage #wrapper .header #main-menu.collapse.show {
    left: auto !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    max-width: 100% !important;
    min-width: 100% !important;
    right: auto !important;
    transform: none !important;
    width: 100% !important;
  }

  html body:is(.path-products, .page-service-city) #wrapper .header #main-menu.show,
  html body:is(.path-products, .page-service-city) #wrapper .header #main-menu.collapse.show {
    left: auto !important;
    margin-left: -1rem !important;
    margin-right: -1rem !important;
    max-width: none !important;
    min-width: calc(100% + 2rem) !important;
    right: auto !important;
    transform: none !important;
    width: calc(100% + 2rem) !important;
  }

  html body:is(.path-frontpage, .path-products, .page-service-city) #wrapper .header #main-menu.show ul.menu.menu-parent,
  html body:is(.path-frontpage, .path-products, .page-service-city) #wrapper .header #main-menu.collapse.show ul.menu.menu-parent {
    background: transparent !important;
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
  }

  html body:is(.path-frontpage, .path-products, .page-service-city) #wrapper .header #main-menu.show li.menu-item,
  html body:is(.path-frontpage, .path-products, .page-service-city) #wrapper .header #main-menu.collapse.show li.menu-item {
    background: transparent !important;
    border: 0 !important;
    list-style: none !important;
    margin: 0 0 0.4rem !important;
    padding: 0 !important;
    width: 100% !important;
  }

  html body:is(.path-frontpage, .path-products, .page-service-city) #wrapper .header #main-menu.show li.menu-item:last-child,
  html body:is(.path-frontpage, .path-products, .page-service-city) #wrapper .header #main-menu.collapse.show li.menu-item:last-child {
    margin-bottom: 0 !important;
  }

  html body:is(.path-frontpage, .path-products, .page-service-city) #wrapper .header #main-menu.show li.menu-item > a,
  html body:is(.path-frontpage, .path-products, .page-service-city) #wrapper .header #main-menu.collapse.show li.menu-item > a {
    align-items: center !important;
    background: #b781e3 !important;
    border: 2px solid #000 !important;
    border-radius: 10px !important;
    box-sizing: border-box !important;
    color: #fff !important;
    display: flex !important;
    font-size: 0.95rem !important;
    font-weight: 600 !important;
    justify-content: center !important;
    line-height: 1.35 !important;
    margin: 0 !important;
    min-height: 2.75rem !important;
    padding: 0.65rem 1rem !important;
    text-align: center !important;
    text-decoration: none !important;
    width: 100% !important;
  }

  html body:is(.path-frontpage, .path-products, .page-service-city) #wrapper .header #main-menu.show li.menu-item--active-trail > a,
  html body:is(.path-frontpage, .path-products, .page-service-city) #wrapper .header #main-menu.show a.is-active {
    background: #c9a0e8 !important;
    color: #fff !important;
    font-weight: 700 !important;
  }

  html body:is(.path-frontpage, .path-products, .page-service-city) #wrapper .header #main-menu.show li.menu-item > a:hover,
  html body:is(.path-frontpage, .path-products, .page-service-city) #wrapper .header #main-menu.show li.menu-item > a:focus-visible {
    background: #c9a0e8 !important;
    color: #fff !important;
  }
}

@media (min-width: 768.01px) {
  html body:is(.path-frontpage, .path-products, .page-service-city) #wrapper .header #main-menu,
  html body:is(.path-frontpage, .path-products, .page-service-city) #wrapper .header #main-menu .region-main-menu,
  html body:is(.path-frontpage, .path-products, .page-service-city) #wrapper .header #main-menu nav,
  html body:is(.path-frontpage, .path-products, .page-service-city) #wrapper .header #main-menu .menu-wrap,
  html body:is(.path-frontpage, .path-products, .page-service-city) #wrapper .header #main-menu .main-menu-wrap {
    max-width: 100% !important;
    width: 100% !important;
  }

  html body:is(.path-frontpage, .path-products, .page-service-city) #wrapper .header #main-menu ul.menu.menu-parent {
    align-items: stretch !important;
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 0.4rem !important;
    justify-content: center !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  html body:is(.path-frontpage, .path-products, .page-service-city) #wrapper .header #main-menu li.menu-item {
    border: 0 !important;
    display: flex !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  html body:is(.path-frontpage, .path-products, .page-service-city) #wrapper .header #main-menu li.menu-item > a {
    align-items: center !important;
    background: #b781e3 !important;
    border: 2px solid #000 !important;
    border-radius: 10px !important;
    box-sizing: border-box !important;
    color: #fff !important;
    display: inline-flex !important;
    font-size: 0.95rem !important;
    font-weight: 600 !important;
    justify-content: center !important;
    line-height: 1.25 !important;
    margin: 0 !important;
    min-height: 2.75rem !important;
    padding: 0.7rem 1.15rem !important;
    text-align: center !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    width: auto !important;
  }

  html body:is(.path-frontpage, .path-products, .page-service-city) #wrapper .header #main-menu li.menu-item--active-trail > a,
  html body:is(.path-frontpage, .path-products, .page-service-city) #wrapper .header #main-menu a.is-active,
  html body:is(.path-frontpage, .path-products, .page-service-city) #wrapper .header #main-menu li.menu-item > a:hover,
  html body:is(.path-frontpage, .path-products, .page-service-city) #wrapper .header #main-menu li.menu-item > a:focus-visible {
    background: #c9a0e8 !important;
    color: #fff !important;
  }
}

/*
 * Canonical public-menu geometry.
 *
 * The theme Custom CSS gives every block inside .primary-menu 1.75rem of
 * padding.  That made the main menu taller on ordinary routes and narrowed
 * city-specific menu blocks on mobile.  Keep this late override global to the
 * public header so every route uses the same shell, regardless of which
 * Drupal menu block is placed in the region.
 */
html body:not(.path-admin) #wrapper .header #main-menu,
html body:not(.path-admin) #wrapper .header #main-menu .region-main-menu,
html body:not(.path-admin) #wrapper .header #main-menu nav.block {
  box-sizing: border-box !important;
  margin: 0 !important;
  max-width: 100% !important;
  padding: 0 !important;
  width: 100% !important;
}

@media (min-width: 768.01px) {
  html body:not(.path-admin) #wrapper .header #main-menu,
  html body:not(.path-admin) #wrapper .header #main-menu .region-main-menu {
    align-items: center !important;
    display: block !important;
    justify-content: initial !important;
  }

  html body:not(.path-admin) #wrapper .header #main-menu nav.block {
    display: inline-block !important;
  }

  html body:not(.path-admin) #wrapper .header #main-menu :is(.main-menu-wrap, .menu-wrap) {
    align-items: center !important;
    box-sizing: border-box !important;
    display: flex !important;
    justify-content: center !important;
    margin: 0 !important;
    max-width: 100% !important;
    padding: 0.5rem 0.85rem !important;
    width: 100% !important;
  }

  html body:not(.path-admin) #wrapper .header #main-menu ul.menu.menu-parent {
    align-items: center !important;
    box-sizing: border-box !important;
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 0.45rem 0.55rem !important;
    justify-content: center !important;
    margin: 0 !important;
    padding: 0.5rem 0.85rem !important;
    width: 100% !important;
  }

  html body:not(.path-admin) #wrapper .header #main-menu li.menu-item {
    align-items: center !important;
    border: 0 !important;
    display: flex !important;
    justify-content: center !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  html body:not(.path-admin) #wrapper .header #main-menu li.menu-item > a {
    align-items: center !important;
    box-sizing: border-box !important;
    display: flex !important;
    font-size: 0.95rem !important;
    font-weight: 700 !important;
    justify-content: center !important;
    line-height: 1.25 !important;
    margin: 0 !important;
    min-height: 2.75rem !important;
    padding: 0.7rem 1.15rem !important;
    text-align: center !important;
    white-space: nowrap !important;
    width: auto !important;
  }
}

@media (max-width: 768px) {
  html body:not(.gin--navigation):not(.path-admin) #wrapper .header #main-menu.collapse:not(.show) {
    display: none !important;
  }

  html body:not(.gin--navigation):not(.path-admin) #wrapper .header #main-menu.show,
  html body:not(.gin--navigation):not(.path-admin) #wrapper .header #main-menu.collapse.show {
    left: auto !important;
    margin-bottom: 0 !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    margin-top: 0 !important;
    max-width: 100vw !important;
    min-width: 100vw !important;
    padding: 0.5rem 0.75rem 0.85rem !important;
    right: auto !important;
    transform: none !important;
    width: 100vw !important;
  }

  html body:not(.gin--navigation):not(.path-admin) #wrapper .header #main-menu.show :is(.main-menu-wrap, .menu-wrap),
  html body:not(.gin--navigation):not(.path-admin) #wrapper .header #main-menu.show nav.block,
  html body:not(.gin--navigation):not(.path-admin) #wrapper .header #main-menu.show ul.menu.menu-parent {
    box-sizing: border-box !important;
    display: block !important;
    margin: 0 !important;
    max-width: 100% !important;
    padding: 0 !important;
    width: 100% !important;
  }

  html body:not(.gin--navigation):not(.path-admin) #wrapper .header #main-menu.show nav.block {
    margin-top: 0.5rem !important;
  }

  html body:not(.gin--navigation):not(.path-admin) #wrapper .header #main-menu.show li.menu-item {
    background: transparent !important;
    border: 0 !important;
    display: list-item !important;
    list-style: none !important;
    margin: 0 0 0.4rem !important;
    padding: 0 !important;
    width: 100% !important;
  }

  html body:not(.gin--navigation):not(.path-admin) #wrapper .header #main-menu.show li.menu-item:last-child {
    margin-bottom: 0.4rem !important;
  }

  html body:not(.gin--navigation):not(.path-admin) #wrapper .header #main-menu.show li.menu-item > a {
    align-items: center !important;
    box-sizing: border-box !important;
    display: flex !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    justify-content: center !important;
    line-height: 1.35 !important;
    margin: 0 !important;
    min-height: 0 !important;
    padding: 0.65rem 1rem !important;
    text-align: center !important;
    width: 100% !important;
  }
}

/* Cyberlytics keeps the compact, full-width item treatment through tablet. */
@media (min-width: 768.01px) and (max-width: 991.98px) {
  html body:not(.gin--navigation):not(.path-admin) #wrapper .header #main-menu {
    align-items: center !important;
    display: flex !important;
    flex-direction: column !important;
    padding: 0 0 0 15px !important;
  }

  html body:not(.gin--navigation):not(.path-admin) #wrapper .header #main-menu .region-main-menu,
  html body:not(.gin--navigation):not(.path-admin) #wrapper .header #main-menu nav.block,
  html body:not(.gin--navigation):not(.path-admin) #wrapper .header #main-menu :is(.main-menu-wrap, .menu-wrap) {
    box-sizing: border-box !important;
    display: block !important;
    margin: 0 !important;
    max-width: 100% !important;
    padding: 0 !important;
    width: 100% !important;
  }

  html body:not(.gin--navigation):not(.path-admin) #wrapper .header #main-menu nav.block {
    display: inline-block !important;
    margin: 8px -15px 0 0 !important;
    max-width: none !important;
    padding: 15px 0 0 !important;
    width: calc(100% + 15px) !important;
  }

  html body:not(.gin--navigation):not(.path-admin) #wrapper .header #main-menu ul.menu.menu-parent {
    align-items: stretch !important;
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
    margin: 0.5rem 0 0 !important;
    padding: 0.35rem 1.25rem 0.35rem 0.75rem !important;
    width: 100% !important;
  }

  html body:not(.gin--navigation):not(.path-admin) #wrapper .header #main-menu li.menu-item {
    display: list-item !important;
    margin: 0 0 0.4rem !important;
    padding: 0 !important;
    width: 100% !important;
  }

  html body:not(.gin--navigation):not(.path-admin) #wrapper .header #main-menu li.menu-item > a {
    display: flex !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1.35 !important;
    min-height: 0 !important;
    padding: 0.65rem 1rem !important;
    white-space: normal !important;
    width: 100% !important;
  }
}

/* At exactly 768px the Bootstrap toggle is still active on the reference. */
@media (min-width: 768px) and (max-width: 768px) {
  html body:not(.gin--navigation):not(.path-admin) #wrapper .header #main-menu.show,
  html body:not(.gin--navigation):not(.path-admin) #wrapper .header #main-menu.collapse.show {
    display: block !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    max-width: 100% !important;
    min-width: 100% !important;
    width: 100% !important;
  }
}

/* assets/css/header-sale-banner-consistency.css */
/**
 * Canonical placement for the new-customer sale message in the header strip.
 *
 * Override stored route-specific margins with the reviewed shared geometry.
 * The desktop sale uses a wider first region; phones use the centered stack.
 */
html body #wrapper .header .header-top {
  margin: 0 !important;
}

html body #wrapper .header .header-top .header-top-first,
html body #wrapper .header .header-top .region-header-top-first,
html body #wrapper .header .header-top #block-clearance-sales,
html body #wrapper .header .header-top #block-clearance-sales .container-wrap,
html body #wrapper .header .header-top #block-clearance-sales .block-content,
html body #wrapper .header .header-top #block-clearance-sales .layout,
html body #wrapper .header .header-top #block-clearance-sales .layout__region,
html body #wrapper .header .header-top #block-clearance-sales .block-layout-builder,
html body #wrapper .header .header-top #block-clearance-sales .field-item {
  box-sizing: border-box !important;
  display: block !important;
  float: none !important;
  left: auto !important;
  margin-bottom: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  margin-top: 0 !important;
  max-width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  position: static !important;
  right: auto !important;
  transform: none !important;
  width: 100% !important;
}

/* An inactive cookie shell must not create an empty line above the sale. */
html body #wrapper .header .header-top #block-martis-cookiesui:not(:has(.cookiesjsr-banner.active)) {
  display: none !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

html body #wrapper .header .header-top #block-clearance-sales p {
  box-sizing: border-box !important;
  margin: 1.5rem 0 0.25rem !important;
  max-width: 100% !important;
  padding: 0 !important;
  position: static !important;
  text-align: center !important;
  transform: none !important;
  width: 100% !important;
}

html body[class*="path-"] #wrapper header.header .header-top #block-clearance-sales p,
html body[class*="path-"] #wrapper header.header .header-top #block-clearance-sales p * {
  font-size: 0.875rem !important;
  line-height: 1.2 !important;
}

/* Match the reviewed desktop sale slot without moving neighboring regions. */
@media (min-width: 1200px) {
  html body[class*="path-"] #wrapper header.header .header-top .region-header-top-first {
    margin-top: -5px !important;
    max-width: none !important;
    width: 125% !important;
  }

  html body[class*="path-"] #wrapper header.header .header-top #block-clearance-sales {
    display: inline-block !important;
    position: relative !important;
    top: 2px !important;
  }

  html body[class*="path-"] #wrapper header.header .header-top #block-clearance-sales p {
    margin: 1rem 0 15px !important;
  }

  html body[class*="path-"] #wrapper header.header .header-top #block-clearance-sales p,
  html body[class*="path-"] #wrapper header.header .header-top #block-clearance-sales p * {
    font-size: 1rem !important;
  }
}

html body[class*="path-"] #wrapper header.header .header-top #block-clearance-sales .jd-sale-mobile-break {
  display: none;
}

/* Match the reference's inclusive mobile breakpoint on every route. */
@media (max-width: 768px) {
  html body #wrapper .header .header-top,
  html body.path-frontpage #wrapper .header .header-top,
  html body.path-taxonomy #wrapper .header .header-top {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  html body #wrapper .header .header-top > .container {
    box-sizing: border-box !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    max-width: 100% !important;
    padding-left: 12px !important;
    padding-right: 12px !important;
    width: 100% !important;
  }

  html body #wrapper .header .header-top > .container > .row,
  html body #wrapper .header .header-top .col-md-6 {
    box-sizing: border-box !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    max-width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    width: 100% !important;
  }

  html body[class*="path-"] #wrapper header.header .header-top #block-clearance-sales p {
    inline-size: 100% !important;
    margin: 0 !important;
    max-inline-size: 100% !important;
    min-inline-size: 0 !important;
    padding: 0 !important;
    text-align: center !important;
  }

  html body[class*="path-"] #wrapper header.header .header-top #block-clearance-sales p,
  html body[class*="path-"] #wrapper header.header .header-top #block-clearance-sales p * {
    font-size: 0.82rem !important;
    line-height: 1.35 !important;
  }

  html body #wrapper .header .header-top #block-clearance-sales .field-item {
    inline-size: 100% !important;
    max-inline-size: 100% !important;
    min-inline-size: 0 !important;
  }
}

/* The shorter JD copy follows the reference's two-line range. */
@media (max-width: 585px) {
  html body[class*="path-"] #wrapper header.header .header-top #block-clearance-sales .jd-sale-mobile-break {
    display: inline;
  }
}

/* Landscape tablets use the requested left-aligned placement. */
@media (orientation: landscape) and (min-width: 768px) and (max-width: 1180px),
  (orientation: landscape) and (min-width: 1181px) and (max-width: 1366px) and (pointer: coarse) {
  html body #wrapper .header .header-top .header-top-first,
  html body #wrapper .header .header-top .region-header-top-first,
  html body #wrapper .header .header-top #block-clearance-sales,
  html body #wrapper .header .header-top #block-clearance-sales .field-item,
  html body #wrapper .header .header-top #block-clearance-sales p {
    text-align: left !important;
  }
}

/* assets/css/home-testimonials-width-parity.css */
/**
 * Homepage testimonial width parity with the service-city presentation.
 *
 * Stored Custom CSS narrows the homepage slideshow main to 75.5% and its
 * slides/controls to 57.5%. Reset the inner track and controls here;
 * city-taxonomy-testimonials.css owns the shared wrapper and card sizing.
 */
html body.path-frontpage #wrapper #block-martis-views-block-testimonials-block-1 .views-slideshow-controls-top,
html body.path-frontpage #wrapper #block-martis-views-block-testimonials-block-1 #views_slideshow_cycle_main_testimonials-block_1,
html body.path-frontpage #wrapper #block-martis-views-block-testimonials-block-1 #views_slideshow_cycle_teaser_section_testimonials-block_1 {
  box-sizing: border-box !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  max-width: 100% !important;
  width: 100% !important;
}

/* assets/css/simplenews-pages.css */
/**
 * Johnny Detail Simplenews journeys: signed public flows and account settings.
 */
html body.page-simplenews-flow #wrapper #page-title {
  display: none !important;
}

/* Signed preference URLs must never be repeated in visible breadcrumbs. */
html body.page-simplenews-flow #wrapper #content-wide-top {
  display: none !important;
}

html body.page-simplenews-flow #wrapper #page-wrapper {
  background:
    radial-gradient(circle at 8% 12%, rgba(183, 129, 227, 0.22), transparent 25rem),
    radial-gradient(circle at 94% 88%, rgba(103, 22, 170, 0.12), transparent 25rem),
    #faf5ff !important;
  min-height: 56vh;
  padding: clamp(3rem, 7vw, 6.5rem) 0 !important;
}

html body.page-simplenews-flow #wrapper #page-wrapper > .container {
  max-width: 900px;
}

html body.page-simplenews-flow #wrapper #page-wrapper .content-layout {
  display: block !important;
  margin: 0 !important;
}

html body.page-simplenews-flow #wrapper #page-wrapper .main-content {
  float: none !important;
  max-width: none !important;
  padding: 0 15px !important;
  width: 100% !important;
}

html body.page-simplenews-flow #wrapper #page-wrapper .sidebar {
  display: none !important;
}

html body.page-simplenews-flow #wrapper .jd-simplenews-card,
html body.page-simplenews-flow #wrapper .jd-newsletter-status {
  background: #fff !important;
  border: 2px solid #b781e3 !important;
  border-radius: 22px !important;
  box-shadow: 0 24px 60px rgba(59, 10, 92, 0.14) !important;
  box-sizing: border-box;
  margin: 0 auto !important;
  max-width: 780px;
  overflow: hidden;
  padding: clamp(2rem, 5vw, 4rem) !important;
  position: relative;
  width: 100%;
}

/* The signed form is compact; the logged-in account form can show more lists. */
html body.page-simplenews-account #wrapper .jd-simplenews-card--preferences {
  max-width: 840px;
}

html body.page-simplenews-flow #wrapper .jd-simplenews-card::before,
html body.page-simplenews-flow #wrapper .jd-newsletter-status::before {
  background: linear-gradient(90deg, #3b0a5c, #9d4edd, #6716aa);
  content: "";
  height: 7px;
  inset: 0 0 auto;
  position: absolute;
}

html body.page-simplenews-flow #wrapper .jd-simplenews__eyebrow {
  background: transparent !important;
  border: 0 !important;
  color: #6716aa !important;
  display: block;
  font-size: 0.8rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.1em;
  margin: 0 0 0.65rem !important;
  padding: 0 !important;
  text-transform: uppercase;
  width: auto !important;
}

html body.page-simplenews-flow #wrapper :is(.jd-simplenews__title, .jd-subscription-access__title, .jd-newsletter-status h1) {
  color: #3b0a5c !important;
  font-size: clamp(2rem, 5vw, 3.15rem) !important;
  font-weight: 800 !important;
  letter-spacing: -0.035em;
  line-height: 1.08 !important;
  margin: 0 0 0.9rem !important;
  text-align: left !important;
}

html body.page-simplenews-flow #wrapper :is(.jd-simplenews__help, .jd-newsletter-status > p) {
  background: transparent !important;
  border: 0 !important;
  color: #55465d !important;
  font-size: 1.06rem !important;
  line-height: 1.65 !important;
  margin: 0 0 1.75rem !important;
  max-width: 60ch;
  padding: 0 !important;
  text-align: left !important;
}

html body.page-simplenews-flow #wrapper .jd-simplenews-card > .form-item,
html body.page-simplenews-flow #wrapper .jd-simplenews-card > .field--type-entity-reference,
html body.page-simplenews-flow #wrapper .jd-simplenews-card fieldset {
  margin: 0 0 1.5rem !important;
}

html body.page-simplenews-flow #wrapper .jd-simplenews-card fieldset {
  background: #faf5ff;
  border: 1px solid #dcc7eb !important;
  border-radius: 14px;
  padding: 1.2rem !important;
}

html body.page-simplenews-flow #wrapper .jd-simplenews-card legend,
html body.page-simplenews-flow #wrapper .jd-simplenews-card label:not(.option) {
  color: #3b0a5c !important;
  font-weight: 800 !important;
}

html body.page-simplenews-flow #wrapper .jd-simplenews-card input[type="email"] {
  background: #fff !important;
  border: 2px solid #cdb3dc !important;
  border-radius: 11px !important;
  box-sizing: border-box;
  color: #24102f !important;
  min-height: 54px;
  padding: 0.8rem 1rem !important;
  width: 100%;
}

html body.page-simplenews-flow #wrapper .jd-simplenews-card input[type="email"]:focus {
  border-color: #6716aa !important;
  box-shadow: 0 0 0 4px rgba(103, 22, 170, 0.16) !important;
  outline: 2px solid transparent;
}

html body.page-simplenews-flow #wrapper .jd-simplenews-card .form-type-checkbox {
  align-items: flex-start;
  display: flex;
  gap: 0.65rem;
  margin: 0.65rem 0 !important;
}

html body.page-simplenews-flow #wrapper .jd-simplenews-card input[type="checkbox"] {
  accent-color: #6716aa;
  flex: 0 0 22px;
  height: 22px;
  margin: 0.1rem 0 0 !important;
  width: 22px;
}

html body.page-simplenews-flow #wrapper .jd-simplenews-card label.option {
  color: #302438 !important;
  line-height: 1.5;
  margin: 0 !important;
  text-align: left !important;
}

html body.page-simplenews-flow #wrapper .jd-simplenews-card .description {
  color: #685a70 !important;
  font-size: 0.86rem;
  line-height: 1.5;
}

html body.page-simplenews-flow #wrapper .jd-simplenews-card .form-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem 1rem;
  margin: 1.7rem 0 0 !important;
}

html body.page-simplenews-flow #wrapper :is(.jd-simplenews-card .form-submit, .jd-newsletter-status__primary) {
  align-items: center;
  background: linear-gradient(135deg, #6716aa, #7929b8) !important;
  border: 2px solid #6716aa !important;
  border-radius: 11px !important;
  box-shadow: 0 10px 22px rgba(103, 22, 170, 0.24) !important;
  color: #fff !important;
  display: inline-flex;
  font-size: 1rem !important;
  font-weight: 800 !important;
  justify-content: center;
  min-height: 50px;
  padding: 0.75rem 1.45rem !important;
  text-decoration: none !important;
}

html body.page-simplenews-flow #wrapper .jd-simplenews-card--remove .form-submit {
  background: #8f2040 !important;
  border-color: #8f2040 !important;
}

html body.page-simplenews-flow #wrapper :is(.jd-simplenews-card .form-submit, .jd-newsletter-status__primary):hover {
  background: #3b0a5c !important;
  border-color: #3b0a5c !important;
  transform: translateY(-1px);
}

html body.page-simplenews-flow #wrapper .jd-simplenews-card .form-actions a,
html body.page-simplenews-flow #wrapper .jd-newsletter-status__secondary {
  align-items: center;
  color: #5e347e !important;
  display: inline-flex;
  font-weight: 800;
  min-height: 46px;
  padding: 0.4rem 0.25rem;
  text-decoration: underline;
  text-underline-offset: 0.2em;
}

html body.page-simplenews-flow #wrapper :is(a, button, input):focus-visible {
  outline: 3px solid #9d4edd !important;
  outline-offset: 3px !important;
}

html body.page-simplenews-flow #wrapper .jd-newsletter-status {
  text-align: left;
}

html body.page-simplenews-flow #wrapper .jd-newsletter-status__icon {
  align-items: center;
  background: #f3e8ff;
  border: 2px solid #b781e3;
  border-radius: 50%;
  color: #6716aa;
  display: flex;
  font-size: 1.7rem;
  font-weight: 900;
  height: 64px;
  justify-content: center;
  margin: 0 0 1.25rem;
  width: 64px;
}

html body.page-simplenews-flow #wrapper .jd-newsletter-status__primary {
  margin-right: 1rem;
}

@media (max-width: 767.98px) {
  html body.page-simplenews-flow #wrapper #page-wrapper {
    padding: 2.25rem 0 !important;
  }

  html body.page-simplenews-flow #wrapper #page-wrapper > .container {
    padding-left: 0.75rem;
    padding-right: 0.75rem;
  }

  html body.page-simplenews-flow #wrapper #page-wrapper .main-content {
    padding: 0 !important;
  }

  html body.page-simplenews-flow #wrapper .jd-simplenews-card,
  html body.page-simplenews-flow #wrapper .jd-newsletter-status {
    border-radius: 16px !important;
    padding: 2.25rem 1.2rem 1.4rem !important;
  }

  html body.page-simplenews-flow #wrapper .jd-simplenews-card .form-actions,
  html body.page-simplenews-flow #wrapper .jd-simplenews-card .form-submit,
  html body.page-simplenews-flow #wrapper .jd-newsletter-status__primary,
  html body.page-simplenews-flow #wrapper .jd-newsletter-status__secondary {
    width: 100%;
  }

  html body.page-simplenews-flow #wrapper .jd-newsletter-status__primary {
    margin: 0.5rem 0 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  html body.page-simplenews-flow #wrapper * {
    scroll-behavior: auto !important;
    transition: none !important;
  }
}

/* assets/css/maintenance-page.css */
/**
 * Johnny Detail maintenance page.
 * Loaded late and isolated from regular frontend routes by its wrapper.
 */

html body[class*="path-"] #wrapper.jd-maintenance-page {
  --jd-maintenance-purple-950: #25033d;
  --jd-maintenance-purple-900: #3b0a5c;
  --jd-maintenance-purple-700: #6716aa;
  --jd-maintenance-purple-500: #9d4edd;
  --jd-maintenance-purple-100: #f3e8ff;
  --jd-maintenance-ink: #2b1738;
  --jd-maintenance-muted: #6c5d74;
  --jd-maintenance-border: rgba(103, 22, 170, 0.15);
  min-height: 100vh;
  min-height: 100svh;
  padding: clamp(1.5rem, 4vw, 3.5rem);
  background:
    radial-gradient(circle at 12% 18%, rgba(157, 78, 221, 0.17), transparent 30%),
    radial-gradient(circle at 88% 82%, rgba(103, 22, 170, 0.12), transparent 32%),
    linear-gradient(145deg, #fcf9ff 0%, var(--jd-maintenance-purple-100) 52%, #fdfbff 100%);
  color: var(--jd-maintenance-ink);
  font-family: var(--jd-font-text);
}

html body[class*="path-"] #wrapper.jd-maintenance-page,
html body[class*="path-"] #wrapper.jd-maintenance-page * {
  box-sizing: border-box;
}

html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance {
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: min(100%, 70rem);
  min-height: calc(100vh - clamp(3rem, 8vw, 7rem));
  min-height: calc(100svh - clamp(3rem, 8vw, 7rem));
  margin: 0 auto;
  outline: none;
}

html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__card {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(19rem, 0.85fr);
  overflow: hidden;
  border: 1px solid var(--jd-maintenance-border);
  border-radius: 1.75rem;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 1.75rem 5rem rgba(59, 10, 92, 0.17);
}

html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__content {
  position: relative;
  z-index: 2;
  align-self: center;
  min-width: 0;
  padding: clamp(2.25rem, 4vw, 3.5rem);
}

html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__brand {
  display: flex;
  align-items: center;
  margin: 0 0 clamp(2rem, 3vw, 2.625rem);
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
  gap: 0.85rem;
  text-align: left;
}

html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__logo {
  display: block;
  flex: 0 0 auto;
  width: 3.75rem;
  height: 3.75rem;
  padding: 0.2rem;
  border: 1px solid rgba(103, 22, 170, 0.13);
  border-radius: 1rem;
  background: #fff;
  box-shadow: 0 0.65rem 1.5rem rgba(59, 10, 92, 0.1);
  object-fit: contain;
}

html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__brand-copy {
  display: grid;
  min-width: 0;
  gap: 0.1rem;
}

html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__site-name,
html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__slogan {
  margin: 0;
  padding: 0;
  background: transparent;
}

html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__site-name {
  color: var(--jd-maintenance-purple-950);
  font-size: 1.18rem;
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1.25;
}

html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__slogan {
  color: var(--jd-maintenance-muted);
  font-size: 0.78rem;
  font-weight: 600;
  line-height: 1.4;
}

html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__status {
  display: inline-flex;
  align-items: center;
  min-height: 2rem;
  margin: 0 0 1.25rem;
  padding: 0.45rem 0.8rem;
  border: 1px solid rgba(103, 22, 170, 0.2);
  border-radius: 999px;
  background: var(--jd-maintenance-purple-100);
  color: var(--jd-maintenance-purple-700);
  font-size: 0.74rem;
  font-weight: 800;
  gap: 0.55rem;
  letter-spacing: 0.09em;
  line-height: 1;
  text-transform: uppercase;
}

html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__status-dot {
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 50%;
  background: var(--jd-maintenance-purple-500);
  box-shadow: 0 0 0 0.3rem rgba(157, 78, 221, 0.13);
  animation: jd-maintenance-pulse 2.2s ease-in-out infinite;
}

html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__title {
  max-width: 39rem;
  margin: 0 0 1.25rem;
  color: var(--jd-maintenance-purple-950);
  font-size: clamp(2.35rem, 5vw, 4.3rem);
  font-weight: 800;
  letter-spacing: -0.055em;
  line-height: 0.98;
  text-wrap: balance;
}

html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__highlighted {
  margin: 0 0 1.25rem;
}

html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__message {
  max-width: 39rem;
  margin: 0;
  color: var(--jd-maintenance-muted);
  font-size: clamp(1rem, 1.5vw, 1.08rem);
  line-height: 1.7;
  text-align: left;
}

html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__message > :first-child {
  margin-top: 0;
}

html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__message > :last-child {
  margin-bottom: 0;
}

html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__contact {
  margin: 1.75rem 0 0;
  padding-top: 1.35rem;
  border-top: 1px solid rgba(59, 10, 92, 0.12);
  text-align: left;
}

html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__contact-heading {
  margin: 0 0 0.8rem;
  padding: 0;
  color: var(--jd-maintenance-ink);
  font-size: 0.88rem;
  font-weight: 700;
  line-height: 1.4;
}

html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__actions {
  display: flex;
  align-items: stretch;
  margin: 0;
  font-style: normal;
  gap: 0.7rem;
}

html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  min-height: 3rem;
  padding: 0.75rem 1rem;
  border: 2px solid var(--jd-maintenance-purple-700);
  border-radius: 0.75rem;
  font-size: 0.86rem;
  font-weight: 800;
  gap: 0.5rem;
  line-height: 1.25;
  text-decoration: none;
  transition: background-color 160ms ease, border-color 160ms ease, box-shadow 160ms ease, color 160ms ease, transform 160ms ease;
}

html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__action svg {
  flex: 0 0 auto;
  width: 1.1rem;
  height: 1.1rem;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2;
}

html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__action span {
  min-width: 0;
  overflow-wrap: anywhere;
}

html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__action--primary {
  background: var(--jd-maintenance-purple-700);
  box-shadow: 0 0.7rem 1.5rem rgba(103, 22, 170, 0.2);
  color: #fff;
}

html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__action--secondary {
  background: #fff;
  color: var(--jd-maintenance-purple-700);
}

html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__action:hover {
  border-color: var(--jd-maintenance-purple-950);
  box-shadow: 0 0.9rem 1.8rem rgba(59, 10, 92, 0.22);
  color: #fff;
  text-decoration: none;
  transform: translateY(-2px);
}

html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__action--primary:hover {
  background: var(--jd-maintenance-purple-950);
}

html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__action--secondary:hover {
  background: var(--jd-maintenance-purple-700);
}

html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__action:focus-visible {
  outline: 3px solid #fff;
  outline-offset: 3px;
  box-shadow: 0 0 0 6px rgba(157, 78, 221, 0.55);
}

html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__visual {
  position: relative;
  display: grid;
  min-height: 34rem;
  overflow: hidden;
  background: linear-gradient(145deg, var(--jd-maintenance-purple-950), var(--jd-maintenance-purple-700));
  color: #fff;
  place-items: center;
}

html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__visual::before,
html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__visual::after {
  position: absolute;
  border: 1px solid rgba(255, 255, 255, 0.13);
  border-radius: 50%;
  content: "";
}

html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__visual::before {
  top: -7rem;
  right: -6.25rem;
  width: 18.75rem;
  height: 18.75rem;
}

html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__visual::after {
  bottom: -9rem;
  left: -6.5rem;
  width: 22.5rem;
  height: 22.5rem;
}

html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__glow {
  position: absolute;
  width: 20rem;
  height: 20rem;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.1);
  filter: blur(0.25rem);
}

html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__illustration {
  position: relative;
  z-index: 1;
  width: min(82%, 22rem);
  height: auto;
  overflow: visible;
}

html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__orbit,
html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__connection,
html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__vehicle,
html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__vehicle-detail,
html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__sparkle {
  fill: none;
  stroke: rgba(255, 255, 255, 0.82);
  stroke-linecap: round;
  stroke-linejoin: round;
}

html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__orbit--outer {
  stroke-dasharray: 4 11;
  stroke-width: 1.5;
}

html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__orbit--inner {
  stroke: rgba(255, 255, 255, 0.14);
  stroke-width: 24;
}

html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__connection {
  stroke-width: 2;
}

html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__node {
  fill: #fff;
  stroke: rgba(255, 255, 255, 0.3);
  stroke-width: 8;
}

html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__vehicle {
  fill: rgba(255, 255, 255, 0.1);
  stroke: #fff;
  stroke-width: 2.75;
}

html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__vehicle-detail {
  stroke: #fff;
  stroke-width: 3;
}

html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__sparkle {
  fill: rgba(255, 255, 255, 0.1);
  stroke: #fff;
  stroke-width: 2.5;
}

html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__sparkle--two {
  opacity: 0.8;
}

html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__visual-label {
  position: absolute;
  right: 1.5rem;
  bottom: 1.5rem;
  left: 1.5rem;
  z-index: 2;
  color: rgba(255, 255, 255, 0.84);
  font-size: 0.7rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  line-height: 1.4;
  text-align: center;
  text-transform: uppercase;
}

@keyframes jd-maintenance-pulse {
  0%, 100% {
    box-shadow: 0 0 0 0.25rem rgba(157, 78, 221, 0.1);
  }
  50% {
    box-shadow: 0 0 0 0.5rem rgba(157, 78, 221, 0.18);
  }
}

@media (max-width: 820px) {
  html body[class*="path-"] #wrapper.jd-maintenance-page {
    padding: 1.5rem;
  }

  html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance {
    min-height: calc(100vh - 3rem);
    min-height: calc(100svh - 3rem);
  }

  html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__card {
    grid-template-columns: 1fr;
  }

  html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__content {
    padding: clamp(2rem, 8vw, 3.25rem);
  }

  html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__brand {
    margin-bottom: 2.25rem;
  }

  html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__visual {
    min-height: 16rem;
  }

  html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__illustration {
    width: min(58%, 15rem);
  }
}

@media (max-width: 575.98px) {
  html body[class*="path-"] #wrapper.jd-maintenance-page {
    padding: max(0.875rem, env(safe-area-inset-top)) max(0.875rem, env(safe-area-inset-right)) max(0.875rem, env(safe-area-inset-bottom)) max(0.875rem, env(safe-area-inset-left));
  }

  html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance {
    min-height: calc(100vh - 1.75rem);
    min-height: calc(100svh - 1.75rem);
  }

  html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__card {
    border-radius: 1.25rem;
  }

  html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__content {
    padding: 1.75rem 1.5rem 2rem;
  }

  html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__brand {
    margin-bottom: 1.875rem;
    gap: 0.75rem;
  }

  html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__logo {
    width: 3.125rem;
    height: 3.125rem;
    border-radius: 0.875rem;
  }

  html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__site-name {
    font-size: 1.05rem;
  }

  html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__title {
    font-size: clamp(2.15rem, 12vw, 3rem);
    line-height: 1.02;
  }

  html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__message {
    font-size: 0.96rem;
    line-height: 1.65;
  }

  html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__actions {
    flex-direction: column;
  }

  html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__action {
    width: 100%;
    min-height: 3.15rem;
  }

  html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__visual {
    min-height: 14rem;
  }

  html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__illustration {
    width: 12.5rem;
  }
}

@media (max-height: 700px) and (min-width: 821px) {
  html body[class*="path-"] #wrapper.jd-maintenance-page {
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
  }

  html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__content {
    padding-top: 2.25rem;
    padding-bottom: 2.25rem;
  }

  html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__brand {
    margin-bottom: 1.75rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__status-dot {
    animation: none;
  }

  html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__action {
    transition: none;
  }
}

@media (forced-colors: active) {
  html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__card,
  html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__action,
  html body[class*="path-"] #wrapper.jd-maintenance-page .jd-maintenance__status {
    border: 2px solid CanvasText;
  }
}

/* assets/css/forum-community.css */
/**
 * Johnny Detail Community forum UI (Cyberlytics forum-ui.css, JD tokens).
 * Loaded late and scoped so legacy theme rules cannot leak in.
 */

:is(html body.path-forum, html body.page-node-type-forum, html body.path-node-add-forum) #wrapper {
  --jd-forum-purple: #3b0a5c;
  --jd-forum-violet: #6716aa;
  --jd-forum-accent: #9d4edd;
  --jd-forum-soft: #faf5ff;
  --jd-forum-mid: #c9a0e8;
  --jd-forum-ink: #25162f;
  --jd-forum-muted: #6b5b75;
  --jd-forum-border: #e7d9ef;
  --jd-forum-wash: #f3e8ff;
}

:is(html body.path-forum, html body.path-forum.path-taxonomy, html body.page-node-type-forum, html body.path-node-add-forum) #wrapper .main-content,
:is(html body.path-forum, html body.path-forum.path-taxonomy, html body.page-node-type-forum, html body.path-node-add-forum) #wrapper .region-content {
  min-width: 0;
  width: 100%;
}

/* Restore the Cyberlytics canvas: 1220px page container, 15px Bootstrap gutters,
   then the 1120px forum shell. Beat path-taxonomy storefront width rules. */
:is(html body.path-forum, html body.path-forum.path-taxonomy, html body.page-node-type-forum, html body.path-node-add-forum) #wrapper #page-wrapper,
:is(html body.path-forum, html body.path-forum.path-taxonomy, html body.page-node-type-forum, html body.path-node-add-forum) #wrapper .page-wrapper {
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: visible !important;
}

:is(html body.path-forum, html body.path-forum.path-taxonomy, html body.page-node-type-forum, html body.path-node-add-forum) #wrapper #page-wrapper > .container,
:is(html body.path-forum, html body.path-forum.path-taxonomy, html body.page-node-type-forum, html body.path-node-add-forum) #wrapper .page-wrapper > .container {
  box-sizing: border-box !important;
  margin-left: auto !important;
  margin-right: auto !important;
  max-width: 1220px !important;
  padding-left: 15px !important;
  padding-right: 15px !important;
  width: 100% !important;
}

:is(html body.path-forum, html body.path-forum.path-taxonomy, html body.page-node-type-forum, html body.path-node-add-forum) #wrapper .row.content-layout {
  margin-left: -15px !important;
  margin-right: -15px !important;
  max-width: none !important;
  width: auto !important;
}

:is(html body.path-forum, html body.path-forum.path-taxonomy, html body.page-node-type-forum, html body.path-node-add-forum) #wrapper .jd-forum-main,
:is(html body.path-forum, html body.path-forum.path-taxonomy, html body.page-node-type-forum, html body.path-node-add-forum) #wrapper .main-content.jd-forum-main,
:is(html body.path-forum, html body.path-forum.path-taxonomy, html body.page-node-type-forum, html body.path-node-add-forum) #wrapper [class*="col-"].jd-forum-main {
  box-sizing: border-box !important;
  flex: 0 0 100% !important;
  max-width: 100% !important;
  padding-left: 15px !important;
  padding-right: 15px !important;
  width: 100% !important;
}

:is(html body.path-forum, html body.path-forum.path-taxonomy, html body.page-node-type-forum, html body.path-node-add-forum) #wrapper .jd-forum-main .container-wrap,
:is(html body.path-forum, html body.path-forum.path-taxonomy, html body.page-node-type-forum, html body.path-node-add-forum) #wrapper .jd-forum-main .block > .container-wrap {
  box-sizing: border-box !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  max-width: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  width: 100% !important;
}

:is(html body.path-forum, html body.path-forum.path-taxonomy, html body.page-node-type-forum, html body.path-node-add-forum) #wrapper .jd-forum-main > .region-content > .block-system-main-block {
  margin-bottom: 40px;
  padding-top: 30px;
}

/* Beat chrome-layout-fix path-taxonomy storefront gutters on pretty board aliases. */
html body.path-forum.path-taxonomy #wrapper .page-wrapper > .container > .row.content-layout,
html body.path-forum.path-taxonomy #wrapper .row.content-layout {
  margin-left: -15px !important;
  margin-right: -15px !important;
  max-width: none !important;
  width: auto !important;
}

html body.path-forum.path-taxonomy #wrapper .page-wrapper > .container > .row > [class*="col-"].jd-forum-main,
html body.path-forum.path-taxonomy #wrapper .row.content-layout > [class*="col-"].jd-forum-main,
html body.path-forum.path-taxonomy #wrapper .page-wrapper > .container > .row > .jd-forum-main {
  box-sizing: border-box !important;
  flex: 0 0 100% !important;
  max-width: 100% !important;
  padding-left: 15px !important;
  padding-right: 15px !important;
  width: 100% !important;
  margin-bottom: 3rem !important;
}

html body.path-forum.path-taxonomy #wrapper .region-content,
html body.path-forum.path-taxonomy #wrapper .jd-forum-main .region-content,
html body.path-forum.path-taxonomy #wrapper .region.region-content {
  overflow: visible !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

html body.path-forum #wrapper [id^="block-martis-forum-active-topics"],
html body.path-forum #wrapper [id^="block-martis-forum-new-topics"],
html body.path-forum #wrapper [id^="block-martis-forum-tools"],
html body.page-node-type-forum #wrapper [id^="block-martis-forum-active-topics"],
html body.page-node-type-forum #wrapper [id^="block-martis-forum-new-topics"],
html body.page-node-type-forum #wrapper [id^="block-martis-forum-tools"] {
  display: none !important;
}

html body.path-forum #wrapper .jd-forum,
html body.page-node-type-forum #wrapper .jd-forum-topic,
html body.path-forum #wrapper .jd-forum-search-results,
html body.path-node-add-forum #wrapper .node-forum-form {
  color: var(--jd-forum-ink);
  margin: 0 auto clamp(2rem, 5vw, 4rem);
  max-width: 1120px;
  width: 100%;
}

.jd-forum-topic__discussion {
  margin-top: -1rem !important;
}

html body.path-forum #wrapper .jd-forum {
  margin-bottom: -4rem !important;
}

html body.path-forum #wrapper .action-links {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  list-style: none;
  margin: 0 auto 1.25rem;
  max-width: 1120px;
  padding: 0;
  width: 100%;
}

html body.path-forum #wrapper .action-links li {
  list-style: none;
  margin: 0;
  padding: 0;
}

html body.path-forum #wrapper .action-links a {
  align-items: center;
  background: var(--jd-forum-violet) !important;
  border: 2px solid var(--jd-forum-violet) !important;
  border-radius: 10px !important;
  color: #fff !important;
  display: inline-flex;
  font-size: 0.92rem;
  font-weight: 800;
  justify-content: center;
  line-height: 1.25;
  min-height: 44px;
  padding: 0.65rem 1rem !important;
  text-decoration: none !important;
  -webkit-text-fill-color: #fff !important;
}

html body.path-forum #wrapper .action-links a:is(:hover, :focus-visible) {
  background: var(--jd-forum-purple) !important;
  border-color: var(--jd-forum-purple) !important;
  box-shadow: 0 0 0 4px rgba(157, 78, 221, 0.2);
}

html body.path-forum #wrapper .jd-forum__intro {
  background: linear-gradient(135deg, var(--jd-forum-purple), var(--jd-forum-violet) 68%, var(--jd-forum-accent));
  border: 1px solid #2a0642;
  border-radius: 18px;
  box-shadow: 0 14px 34px rgba(59, 10, 92, 0.16);
  color: #fff;
  margin-bottom: clamp(1.5rem, 4vw, 2.5rem);
  overflow: hidden;
  padding: clamp(1.25rem, 4vw, 2.25rem);
  position: relative;
}

html body.path-forum #wrapper .jd-forum__intro::after {
  background: radial-gradient(circle, rgba(255, 255, 255, 0.14), transparent 68%);
  content: "";
  height: 220px;
  pointer-events: none;
  position: absolute;
  right: -70px;
  top: -90px;
  width: 220px;
}

html body.path-forum #wrapper .jd-forum__intro p {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: #fff !important;
  font-size: clamp(1rem, 2vw, 1.1rem);
  line-height: 1.7;
  margin: 0;
  max-width: 760px;
  padding: 0 !important;
  -webkit-text-fill-color: #fff;
}

html body.path-forum #wrapper .jd-forum__intro .jd-forum__eyebrow {
  font-size: 0.78rem;
  font-weight: 850;
  letter-spacing: 0.12em;
  margin-bottom: 0.65rem;
  text-transform: uppercase;
}

html body.path-forum #wrapper .jd-forum__intro h1 {
  color: #fff !important;
  font-size: clamp(1.7rem, 4vw, 2.5rem);
  line-height: 1.15;
  margin: 0 0 0.8rem;
  max-width: 820px;
  position: relative;
  z-index: 1;
  -webkit-text-fill-color: #fff !important;
}

html body.path-forum #wrapper .jd-forum__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.7rem;
  margin-top: 1.25rem;
  position: relative;
  z-index: 1;
}

html body.path-forum #wrapper .jd-forum-search,
html body.path-forum #wrapper .jd-forum-search-form {
  background: #fff;
  border: 1px solid var(--jd-forum-border);
  border-radius: 14px;
  box-shadow: 0 8px 24px rgba(59, 10, 92, 0.08);
  margin: 0 0 clamp(1rem, 3vw, 1.5rem);
  padding: clamp(0.9rem, 2.5vw, 1.25rem);
}

html body.path-forum #wrapper .jd-forum-search label,
html body.path-forum #wrapper .jd-forum-search-form label {
  color: var(--jd-forum-purple) !important;
  display: block;
  font-size: 1rem;
  font-weight: 850;
  margin: 0 0 0.55rem;
  -webkit-text-fill-color: var(--jd-forum-purple) !important;
}

html body.path-forum #wrapper .jd-forum-search__controls,
html body.path-forum #wrapper .jd-forum-search-form__controls {
  display: grid;
  gap: 0.65rem;
  grid-template-columns: minmax(0, 1fr) auto;
}

html body.path-forum #wrapper .jd-forum-search input[type="search"],
html body.path-forum #wrapper .jd-forum-search-form input[type="search"] {
  background: #fff !important;
  border: 2px solid #d4b6e8 !important;
  border-radius: 9px !important;
  color: var(--jd-forum-ink) !important;
  font-size: 1rem;
  min-height: 46px;
  min-width: 0;
  padding: 0.65rem 0.8rem !important;
  width: 100%;
  -webkit-text-fill-color: var(--jd-forum-ink) !important;
}

html body.path-forum #wrapper .jd-forum-search input[type="search"]:focus-visible,
html body.path-forum #wrapper .jd-forum-search-form input[type="search"]:focus-visible {
  border-color: var(--jd-forum-accent) !important;
  box-shadow: 0 0 0 4px rgba(157, 78, 221, 0.16) !important;
  outline: 0;
}

html body.path-forum #wrapper .jd-forum-search button,
html body.path-forum #wrapper .jd-forum-search-form button {
  align-items: center;
  background: var(--jd-forum-violet) !important;
  border: 2px solid var(--jd-forum-violet) !important;
  border-radius: 9px !important;
  color: #fff !important;
  display: inline-flex;
  font-weight: 850;
  justify-content: center;
  min-height: 46px;
  padding: 0.65rem 1.1rem !important;
  -webkit-text-fill-color: #fff !important;
}

html body.path-forum #wrapper .jd-forum-search button:is(:hover, :focus-visible),
html body.path-forum #wrapper .jd-forum-search-form button:is(:hover, :focus-visible) {
  background: var(--jd-forum-purple) !important;
  border-color: var(--jd-forum-purple) !important;
  box-shadow: 0 0 0 4px rgba(157, 78, 221, 0.2) !important;
}

html body.path-forum #wrapper .jd-forum-highlights {
  display: grid;
  gap: clamp(0.55rem, 2vw, 1rem);
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 0 0 clamp(1.5rem, 4vw, 2.5rem);
}

html body.path-forum #wrapper .jd-forum-highlight {
  background: linear-gradient(180deg, #fff, var(--jd-forum-soft));
  border: 1px solid var(--jd-forum-border);
  border-radius: 14px;
  box-shadow: 0 8px 24px rgba(59, 10, 92, 0.08);
  min-width: 0;
  padding: clamp(0.75rem, 2vw, 1.15rem);
}

html body.path-forum #wrapper .jd-forum-highlight h2 {
  color: var(--jd-forum-purple) !important;
  font-size: clamp(0.95rem, 2.4vw, 1.3rem);
  line-height: 1.25;
  margin: 0 0 0.7rem;
  overflow-wrap: anywhere;
  -webkit-text-fill-color: var(--jd-forum-purple) !important;
}

html body.path-forum #wrapper .jd-forum-highlight ul {
  display: grid;
  gap: 0.5rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

html body.path-forum #wrapper .jd-forum-highlight li {
  border-bottom: 1px solid var(--jd-forum-border);
  line-height: 1.35;
  margin: 0;
  min-width: 0;
  padding: 0 0 0.5rem;
}

html body.path-forum #wrapper .jd-forum-highlight li:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}

html body.path-forum #wrapper .jd-forum-highlight a {
  color: var(--jd-forum-violet) !important;
  font-size: clamp(0.76rem, 2vw, 0.93rem);
  font-weight: 750;
  overflow-wrap: anywhere;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
  -webkit-text-fill-color: var(--jd-forum-violet) !important;
}

html body.path-forum #wrapper .jd-forum-highlight__description {
  display: -webkit-box;
  overflow: hidden;
  margin: 0.2rem 0 0;
  color: var(--jd-forum-muted);
  font-size: 0.76rem;
  line-height: 1.4;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

html body.path-forum #wrapper .jd-forum-highlight .more-link {
  margin-top: 0.8rem;
  text-align: left;
}

html body.path-forum #wrapper .jd-forum-highlight .more-link a,
html body.path-forum #wrapper .jd-forum-highlight__empty {
  color: var(--jd-forum-muted) !important;
  font-size: 0.82rem;
  font-weight: 750;
  margin: 0;
  -webkit-text-fill-color: var(--jd-forum-muted) !important;
}

:is(html body.path-forum, html body.page-node-type-forum) #wrapper .jd-forum__button,
:is(html body.path-forum, html body.page-node-type-forum) #wrapper a.jd-forum__button {
  align-items: center;
  background: #fff !important;
  border: 2px solid #fff !important;
  border-radius: 10px !important;
  color: var(--jd-forum-purple) !important;
  display: inline-flex;
  font-size: 0.94rem;
  font-weight: 800;
  justify-content: center;
  line-height: 1.25;
  min-height: 44px;
  padding: 0.65rem 1rem !important;
  text-decoration: none !important;
  -webkit-text-fill-color: var(--jd-forum-purple) !important;
}

:is(html body.path-forum, html body.page-node-type-forum) #wrapper .jd-forum__button--secondary,
:is(html body.path-forum, html body.page-node-type-forum) #wrapper a.jd-forum__button--secondary {
  background: transparent !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

:is(html body.path-forum, html body.page-node-type-forum) #wrapper .jd-forum__button:is(:hover, :focus-visible) {
  box-shadow: 0 0 0 4px rgba(243, 232, 255, 0.45) !important;
  transform: translateY(-1px);
}

html body.path-forum #wrapper :is(.jd-forum__directory, .jd-forum__topics) > h2,
html body.page-node-type-forum #wrapper .jd-forum-replies > h2,
html body.page-node-type-forum #wrapper .jd-forum-reply-form > h2 {
  color: var(--jd-forum-purple) !important;
  font-size: clamp(1.25rem, 3vw, 1.65rem);
  margin: 0 0 0.9rem;
  -webkit-text-fill-color: var(--jd-forum-purple) !important;
}

html body.path-forum #wrapper .jd-forum__topics {
  margin-top: clamp(1.5rem, 4vw, 2.5rem);
}

html body.path-forum #wrapper .jd-forum-table-wrap,
html body.path-forum #wrapper .jd-forum-topic-table-wrap {
  background: #fff;
  border: 1px solid var(--jd-forum-border);
  border-radius: 14px;
  box-shadow: 0 8px 24px rgba(59, 10, 92, 0.08);
  overflow: hidden;
  width: 100%;
}

html body.path-forum #wrapper .jd-forum-table-wrap:focus-visible {
  box-shadow: 0 0 0 4px rgba(157, 78, 221, 0.2);
  outline: 2px solid var(--jd-forum-accent);
}

html body.path-forum #wrapper table.jd-forum-table,
html body.path-forum #wrapper table.jd-forum-topic-table {
  border: 0 !important;
  border-collapse: collapse;
  margin: 0 !important;
  width: 100% !important;
}

html body.path-forum #wrapper table.jd-forum-table {
  table-layout: auto;
}

html body.path-forum #wrapper table.jd-forum-topic-table {
  table-layout: fixed;
}

html body.path-forum #wrapper .jd-forum-topic-table th:nth-child(1),
html body.path-forum #wrapper .jd-forum-topic-table td:nth-child(1) {
  width: auto;
}

html body.path-forum #wrapper .jd-forum-topic-table th:nth-child(2),
html body.path-forum #wrapper .jd-forum-topic-table td:nth-child(2) {
  text-align: center;
  width: 6.5rem;
}

html body.path-forum #wrapper .jd-forum-topic-table th:nth-child(3),
html body.path-forum #wrapper .jd-forum-topic-table td:nth-child(3) {
  overflow-wrap: anywhere;
  width: 16rem;
}

html body.path-forum #wrapper :is(.jd-forum-table, .jd-forum-topic-table) thead,
html body.path-forum #wrapper :is(.jd-forum-table, .jd-forum-topic-table) thead:is(:hover, :active, :focus-within),
html body.path-forum #wrapper :is(.jd-forum-table, .jd-forum-topic-table) thead tr,
html body.path-forum #wrapper :is(.jd-forum-table, .jd-forum-topic-table) thead tr:is(:hover, :active, :focus-within) {
  background: var(--jd-forum-purple) !important;
}

html body.path-forum #wrapper :is(.jd-forum-table, .jd-forum-topic-table) th,
html body.path-forum #wrapper :is(.jd-forum-table, .jd-forum-topic-table) th:is(:hover, :active, :focus, :focus-visible, :focus-within) {
  background: var(--jd-forum-purple) !important;
  border: 0 !important;
  color: #fff !important;
  font-size: 0.76rem;
  font-weight: 850;
  letter-spacing: 0.06em;
  padding: 0.85rem 1rem !important;
  text-transform: uppercase;
  -webkit-text-fill-color: #fff !important;
}

html body.path-forum #wrapper :is(.jd-forum-table, .jd-forum-topic-table) th a,
html body.path-forum #wrapper :is(.jd-forum-table, .jd-forum-topic-table) th a:is(:visited, :hover, :focus-visible),
html body.path-forum #wrapper :is(.jd-forum-table, .jd-forum-topic-table) th .tablesort,
html body.path-forum #wrapper :is(.jd-forum-table, .jd-forum-topic-table) th .visually-hidden {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

html body.path-forum #wrapper :is(.jd-forum-table, .jd-forum-topic-table) td {
  background: #fff !important;
  border: 0 !important;
  border-bottom: 1px solid var(--jd-forum-border) !important;
  color: var(--jd-forum-ink) !important;
  padding: 1rem !important;
  vertical-align: middle;
  -webkit-text-fill-color: var(--jd-forum-ink) !important;
}

html body.path-forum #wrapper :is(.jd-forum-table, .jd-forum-topic-table) tbody tr:last-child td {
  border-bottom: 0 !important;
}

html body.path-forum #wrapper :is(.jd-forum-table, .jd-forum-topic-table) tbody tr:not(.jd-forum-table__container):is(:hover, :active, :focus-within) td {
  background: var(--jd-forum-soft) !important;
}

html body.path-forum #wrapper .jd-forum-table__container,
html body.path-forum #wrapper .jd-forum-table__container:is(:hover, :active, :focus-within),
html body.path-forum #wrapper .jd-forum-table__container td,
html body.path-forum #wrapper .jd-forum-table__container:is(:hover, :active, :focus-within) td {
  background: linear-gradient(90deg, var(--jd-forum-purple), var(--jd-forum-violet)) !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

html body.path-forum #wrapper .jd-forum-table__container td {
  padding: 0.85rem 1rem !important;
}

html body.path-forum #wrapper .jd-forum-table__container h2 {
  color: #fff !important;
  font-size: 1.1rem;
  margin: 0;
  -webkit-text-fill-color: #fff !important;
}

html body.path-forum #wrapper .jd-forum-table__container p {
  background: transparent !important;
  border: 0 !important;
  color: #eadcf2 !important;
  font-size: 0.9rem;
  margin: 0.25rem 0 0;
  padding: 0 !important;
  -webkit-text-fill-color: #eadcf2 !important;
}

html body.path-forum #wrapper .jd-forum-table__forum-main {
  align-items: flex-start;
  display: flex;
  gap: 0.85rem;
}

html body.path-forum #wrapper .jd-forum-table__status {
  background: var(--jd-forum-wash);
  border: 2px solid var(--jd-forum-mid);
  border-radius: 50%;
  flex: 0 0 14px;
  height: 14px;
  margin-top: 0.4rem;
  width: 14px;
}

html body.path-forum #wrapper .jd-forum-table__status--new {
  background: var(--jd-forum-accent);
  box-shadow: 0 0 0 4px rgba(157, 78, 221, 0.14);
}

html body.path-forum #wrapper .jd-forum-table__title,
html body.path-forum #wrapper .jd-forum-topic-title__link a {
  color: var(--jd-forum-violet) !important;
  font-size: 1rem;
  font-weight: 850;
  line-height: 1.35;
  overflow-wrap: anywhere;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
  -webkit-text-fill-color: var(--jd-forum-violet) !important;
}

html body.path-forum #wrapper .jd-forum-table__description,
html body.path-forum #wrapper .jd-forum-table__row td p,
html body.path-forum #wrapper .jd-forum-topic-title__description,
html body.path-forum #wrapper .jd-forum-topic-title__meta {
  background: transparent !important;
  border: 0 !important;
  color: var(--jd-forum-muted) !important;
  font-size: 0.88rem;
  line-height: 1.55;
  margin-top: 0.25rem;
  padding: 0 !important;
  -webkit-text-fill-color: var(--jd-forum-muted) !important;
}

html body.path-forum #wrapper .jd-forum-topic-title__description {
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

html body.path-forum #wrapper .jd-forum-table__new {
  display: block;
  font-size: 0.78rem;
  margin-top: 0.25rem;
}

html body.path-forum #wrapper .forum__icon,
html body.path-forum #wrapper .jd-forum-topic-icon {
  background: var(--jd-forum-wash);
  border: 2px solid var(--jd-forum-mid);
  border-radius: 50%;
  display: inline-block;
  float: none;
  height: 16px;
  margin: 0.2rem 0.75rem 0 0;
  vertical-align: top;
  width: 16px;
}

html body.path-forum #wrapper .jd-forum-topic-title {
  display: inline-block;
  min-width: 0;
  max-width: calc(100% - 2rem);
  vertical-align: top;
}

html body.path-forum #wrapper .forum__icon.new,
html body.path-forum #wrapper .forum__icon.hot-new,
html body.path-forum #wrapper .jd-forum-topic-icon:is(.jd-forum-topic-icon--new, .jd-forum-topic-icon--hot-new) {
  background: var(--jd-forum-accent);
  border-color: var(--jd-forum-accent);
}

html body.path-forum #wrapper .jd-forum__empty {
  background: var(--jd-forum-soft);
  border: 1px solid var(--jd-forum-border);
  border-radius: 14px;
  padding: 1.25rem;
}

html body.page-node-type-forum #wrapper .jd-forum-topic {
  background: #fff;
  border: 1px solid var(--jd-forum-border);
  border-top: 5px solid var(--jd-forum-accent);
  border-radius: 16px;
  box-shadow: 0 10px 30px rgba(59, 10, 92, 0.09);
  overflow: hidden;
  padding: clamp(1rem, 4vw, 2rem);
}

html body.page-node-type-forum #wrapper .jd-forum-topic--sticky,
html body.page-node-type-forum #wrapper .node--sticky.jd-forum-topic {
  border-top-color: var(--jd-forum-accent);
}

html body.page-node-type-forum #wrapper .jd-forum-topic__title {
  color: var(--jd-forum-purple) !important;
  font-size: clamp(1.6rem, 4vw, 2.35rem);
  line-height: 1.2;
  margin: 0 0 1rem;
  overflow-wrap: anywhere;
  -webkit-text-fill-color: var(--jd-forum-purple) !important;
}

html body.page-node-type-forum #wrapper .jd-forum-topic__navigation {
  margin: 0 0 1rem;
}

html body.page-node-type-forum #wrapper .jd-forum-topic__back,
html body.path-forum #wrapper .jd-forum-topic__back {
  align-items: center;
  background: var(--jd-forum-soft) !important;
  border: 1px solid var(--jd-forum-border);
  border-radius: 9px;
  color: var(--jd-forum-violet) !important;
  display: inline-flex;
  font-size: 0.88rem;
  font-weight: 800;
  min-height: 42px;
  padding: 0.55rem 0.8rem;
  text-decoration: none;
  -webkit-text-fill-color: var(--jd-forum-violet) !important;
}

html body.page-node-type-forum #wrapper .jd-forum-topic__back::before,
html body.path-forum #wrapper .jd-forum-topic__back::before {
  content: "\2190";
  margin-right: 0.45rem;
}

html body.page-node-type-forum #wrapper .jd-forum-topic__back:is(:hover, :focus-visible),
html body.path-forum #wrapper .jd-forum-topic__back:is(:hover, :focus-visible) {
  border-color: var(--jd-forum-accent);
  box-shadow: 0 0 0 4px rgba(157, 78, 221, 0.16);
}

html body.page-node-type-forum #wrapper .jd-forum-topic__meta,
html body.page-node-type-forum #wrapper .jd-forum-topic__meta * {
  color: var(--jd-forum-muted) !important;
  font-size: 0.88rem;
  -webkit-text-fill-color: var(--jd-forum-muted) !important;
}

html body.page-node-type-forum #wrapper .jd-forum-topic__category {
  margin: 0.8rem 0 1.15rem;
}

html body.page-node-type-forum #wrapper .jd-forum-topic__category a,
html body.page-node-type-forum #wrapper .field--name-taxonomy-forums a {
  background: var(--jd-forum-wash) !important;
  border: 1px solid var(--jd-forum-border);
  border-radius: 999px;
  color: var(--jd-forum-violet) !important;
  display: inline-flex;
  font-size: 0.8rem;
  font-weight: 800;
  min-height: 34px;
  padding: 0.42rem 0.75rem;
  text-decoration: none;
  -webkit-text-fill-color: var(--jd-forum-violet) !important;
}

html body.page-node-type-forum #wrapper .jd-forum-topic__content {
  color: var(--jd-forum-ink);
  font-size: 1rem;
  line-height: 1.75;
  max-width: 100%;
}

html body.page-node-type-forum #wrapper .jd-forum-topic__content :is(h2, h3, h4) {
  color: var(--jd-forum-purple) !important;
  margin-top: 1.4em;
  -webkit-text-fill-color: var(--jd-forum-purple) !important;
}

html body.page-node-type-forum #wrapper .field--name-field-forum-images {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
  margin-top: 1.3rem;
}

html body.page-node-type-forum #wrapper .field--name-field-forum-images img {
  width: 100%;
  height: auto;
  border-radius: 12px;
}

html body.page-node-type-forum #wrapper .jd-forum-topic__links,
html body.page-node-type-forum #wrapper .comment .links {
  margin-top: 1rem;
}

html body.page-node-type-forum #wrapper :is(.jd-forum-topic__links, .comment .links) ul {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

html body.page-node-type-forum #wrapper :is(.jd-forum-topic__links, .comment .links) a {
  align-items: center;
  border: 1px solid var(--jd-forum-border);
  border-radius: 8px;
  color: var(--jd-forum-violet) !important;
  display: inline-flex;
  font-size: 0.8rem;
  font-weight: 750;
  min-height: 38px;
  padding: 0.45rem 0.7rem;
  text-decoration: none;
  -webkit-text-fill-color: var(--jd-forum-violet) !important;
}

html body.page-node-type-forum #wrapper .jd-forum-replies {
  border-top: 1px solid var(--jd-forum-border);
  margin-top: 2rem;
  padding-top: 1.5rem;
}

html body.page-node-type-forum #wrapper .indented {
  margin-left: clamp(1rem, 5vw, 3rem);
}

html body.page-node-type-forum #wrapper .comment,
html body.page-node-type-forum #wrapper .jd-forum-reply {
  background: var(--jd-forum-soft);
  border: 1px solid var(--jd-forum-border);
  border-left: 4px solid var(--jd-forum-mid);
  border-radius: 12px;
  margin: 0 0 0.9rem;
  padding: 1rem;
}

html body.page-node-type-forum #wrapper .jd-forum-reply.by-topic-author {
  border-left-color: var(--jd-forum-accent);
}

html body.page-node-type-forum #wrapper .jd-forum-reply__header {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  margin-bottom: 0.55rem;
}

html body.page-node-type-forum #wrapper .jd-forum-reply__avatar {
  align-items: center;
  background: var(--jd-forum-wash);
  border: 2px solid var(--jd-forum-border);
  border-radius: 50%;
  color: var(--jd-forum-violet);
  display: inline-flex;
  flex: 0 0 48px;
  font-size: 1.05rem;
  font-weight: 850;
  height: 48px;
  justify-content: center;
  letter-spacing: 0;
  line-height: 1;
  text-transform: uppercase;
  width: 48px;
}

html body.page-node-type-forum #wrapper .jd-forum-reply__header strong {
  color: var(--jd-forum-purple);
}

html body.page-node-type-forum #wrapper .jd-forum-reply__header span,
html body.page-node-type-forum #wrapper .comment .comment-submitted,
html body.page-node-type-forum #wrapper .comment .comment-submitted * {
  color: var(--jd-forum-muted) !important;
  font-size: 0.82rem;
  -webkit-text-fill-color: var(--jd-forum-muted) !important;
}

html body.page-node-type-forum #wrapper .comment-forbidden {
  display: none;
}

html body.page-node-type-forum #wrapper :is(.jd-forum-reply-form, .jd-forum-signin-prompt) {
  background: linear-gradient(180deg, #fff, var(--jd-forum-soft));
  border: 1px solid var(--jd-forum-border);
  border-radius: 14px;
  margin-top: 1.5rem;
  padding: clamp(1rem, 3vw, 1.5rem);
}

html body.page-node-type-forum #wrapper .jd-forum-signin-prompt .jd-forum__button--secondary {
  border-color: var(--jd-forum-accent) !important;
  color: var(--jd-forum-violet) !important;
  -webkit-text-fill-color: var(--jd-forum-violet) !important;
}

html body.path-forum #wrapper .jd-forum-search-intro {
  align-items: center;
  background: linear-gradient(135deg, var(--jd-forum-purple), var(--jd-forum-violet)) !important;
  border: 1px solid #2a0642;
  border-radius: 14px;
  color: #fff !important;
  display: flex;
  gap: 1rem;
  justify-content: space-between;
  margin: 0 0 1rem;
  padding: clamp(1rem, 3vw, 1.5rem);
  -webkit-text-fill-color: #fff !important;
}

html body.path-forum #wrapper .jd-forum-search-intro :is(h1, p) {
  background: transparent !important;
  border: 0 !important;
  color: #fff !important;
  margin: 0;
  padding: 0 !important;
  -webkit-text-fill-color: #fff !important;
}

html body.path-forum #wrapper .jd-forum-search-intro h1 {
  font-size: clamp(1.5rem, 3.5vw, 2.2rem);
  line-height: 1.2;
  margin: 0.25rem 0 0.4rem;
}

html body.path-forum #wrapper .jd-forum-search-intro__eyebrow {
  font-size: 0.75rem;
  font-weight: 850;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

html body.path-forum #wrapper .jd-forum-search-intro .jd-forum-topic__back {
  background: transparent !important;
  border: 2px solid #fff !important;
  color: #fff !important;
  flex: 0 0 auto;
  white-space: nowrap;
  -webkit-text-fill-color: #fff !important;
}

html body.path-forum #wrapper .jd-forum-search-intro .jd-forum-topic__back:is(:hover, :focus-visible) {
  background: #fff !important;
  color: var(--jd-forum-purple) !important;
  outline: 0;
  -webkit-text-fill-color: var(--jd-forum-purple) !important;
}

html body.path-forum #wrapper .jd-forum-search-state,
html body.path-forum #wrapper .jd-forum-search-summary {
  margin: 1rem 0;
  padding: 1rem;
  border: 1px solid var(--jd-forum-border);
  border-radius: 12px;
  background: var(--jd-forum-soft);
  color: var(--jd-forum-muted);
}

html body.path-forum #wrapper .jd-forum-search-list {
  display: grid;
  gap: 0.8rem;
  margin: 1rem 0;
  padding: 0;
  list-style: none;
}

html body.path-forum #wrapper .jd-forum-search-result {
  background: #fff;
  border: 1px solid var(--jd-forum-border);
  border-left: 4px solid var(--jd-forum-mid);
  border-radius: 12px;
  box-shadow: 0 8px 22px rgba(59, 10, 92, 0.07);
  margin: 0;
  padding: clamp(0.9rem, 2.5vw, 1.25rem);
}

html body.path-forum #wrapper .jd-forum-search-result__type {
  display: inline-flex;
  padding: 0.25rem 0.55rem;
  border-radius: 999px;
  background: var(--jd-forum-wash);
  color: var(--jd-forum-violet);
  font-size: 0.7rem;
  font-weight: 850;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

html body.path-forum #wrapper .jd-forum-search-result h2 {
  margin: 0.55rem 0 0.35rem;
  font-size: clamp(1.05rem, 2.5vw, 1.35rem);
  line-height: 1.35;
}

html body.path-forum #wrapper .jd-forum-search-result h2 a {
  color: var(--jd-forum-purple) !important;
  text-decoration: none;
  -webkit-text-fill-color: var(--jd-forum-purple) !important;
}

html body.path-forum #wrapper .jd-forum-search-result p,
html body.path-forum #wrapper .jd-forum-search-result p:last-child {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: var(--jd-forum-ink) !important;
  font-size: 0.95rem;
  line-height: 1.6;
  margin: 0;
  padding: 0 !important;
  -webkit-text-fill-color: var(--jd-forum-ink) !important;
}

html body.path-forum #wrapper .jd-forum-search-result__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem 0.8rem;
  margin-top: 0.75rem;
  color: var(--jd-forum-muted);
  font-size: 0.76rem;
}

html body.path-forum #wrapper .pager {
  margin: 1.5rem 0 0 !important;
}

html body.path-forum #wrapper .pager__items {
  display: flex !important;
  flex-wrap: wrap;
  gap: 0.5rem;
  justify-content: center;
  margin: 0 !important;
  padding: 0;
}

html body.path-forum #wrapper .pager__item a,
html body.path-forum #wrapper .pager__item.is-active > * {
  align-items: center;
  background: #fff !important;
  border: 1px solid var(--jd-forum-border) !important;
  border-radius: 8px !important;
  color: var(--jd-forum-violet) !important;
  display: inline-flex;
  font-weight: 800;
  justify-content: center;
  min-height: 42px;
  min-width: 42px;
  padding: 0.5rem 0.7rem !important;
  -webkit-text-fill-color: var(--jd-forum-violet) !important;
}

html body.path-forum #wrapper .pager__item.is-active > *,
html body.path-forum #wrapper .pager__item a:is(:hover, :focus-visible) {
  background: var(--jd-forum-violet) !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

:is(html body.path-forum, html body.page-node-type-forum, html body.path-node-add-forum) #wrapper :is(.node-forum-form, .comment-comment-forum-form) {
  background: #fff;
  border: 1px solid var(--jd-forum-border);
  border-radius: 14px;
  box-shadow: 0 8px 24px rgba(59, 10, 92, 0.07);
  padding: clamp(1rem, 3vw, 1.5rem);
}

:is(html body.path-forum, html body.page-node-type-forum, html body.path-node-add-forum) #wrapper :is(.node-forum-form, .comment-comment-forum-form) :is(input[type="text"], textarea, select) {
  background: #fff !important;
  border: 2px solid #d4b6e8 !important;
  border-radius: 8px !important;
  color: var(--jd-forum-ink) !important;
  min-height: 44px;
  width: 100%;
  -webkit-text-fill-color: var(--jd-forum-ink) !important;
}

:is(html body.path-forum, html body.page-node-type-forum, html body.path-node-add-forum) #wrapper :is(.node-forum-form, .comment-comment-forum-form) :is(input, textarea, select):focus-visible {
  border-color: var(--jd-forum-accent) !important;
  box-shadow: 0 0 0 4px rgba(157, 78, 221, 0.16) !important;
  outline: 0;
}

:is(html body.path-forum, html body.page-node-type-forum, html body.path-node-add-forum) #wrapper :is(.node-forum-form, .comment-comment-forum-form) .form-actions .button,
:is(html body.path-forum, html body.page-node-type-forum, html body.path-node-add-forum) #wrapper input.form-submit {
  background: var(--jd-forum-violet) !important;
  border: 2px solid var(--jd-forum-violet) !important;
  border-radius: 9px !important;
  color: #fff !important;
  min-height: 44px;
  padding: 0.65rem 1rem !important;
  -webkit-text-fill-color: #fff !important;
}

:is(html body.path-forum, html body.path-forum.path-taxonomy, html body.page-node-type-forum, html body.path-node-add-forum) #wrapper .jd-forum-main, :is(html body.path-forum, html body.path-forum.path-taxonomy, html body.page-node-type-forum, html body.path-node-add-forum) #wrapper .main-content.jd-forum-main, :is(html body.path-forum, html body.path-forum.path-taxonomy, html body.page-node-type-forum, html body.path-node-add-forum) #wrapper [class*="col-"].jd-forum-main {
  margin-top: -1.5rem !important;
  margin-bottom: 3.5rem !important;
}

.node.node--type-forum.jd-forum-topic.node--sticky.jd-forum-topic--sticky.node--view-mode-full {
  margin-bottom: -4rem !important;
}

.node.node--type-forum.jd-forum-topic.node--view-mode-full {
  margin-bottom: -4rem !important;
}

html body.path-forum.path-taxonomy #wrapper .region-content, html body.path-forum.path-taxonomy #wrapper .jd-forum-main .region-content, html body.path-forum.path-taxonomy #wrapper .region.region-content {
  margin-bottom: 3rem !important;
}

@media (max-width: 767.98px) {
  :is(html body.path-forum, html body.path-forum.path-taxonomy, html body.page-node-type-forum, html body.path-node-add-forum) #wrapper #page-wrapper > .container,
  :is(html body.path-forum, html body.path-forum.path-taxonomy, html body.page-node-type-forum, html body.path-node-add-forum) #wrapper .page-wrapper > .container {
    max-width: 100% !important;
    padding-left: 15px !important;
    padding-right: 15px !important;
  }

  .node.node--type-forum.jd-forum-topic.node--sticky.jd-forum-topic--sticky.node--view-mode-full {
    margin-bottom: -5.5rem !important;
  }
  .node.node--type-forum.jd-forum-topic.node--view-mode-full {
  margin-bottom: -5.5rem !important;
}

  html body.path-forum #wrapper .jd-forum {
    margin-bottom: -5.5rem !important;
  }
  html body.path-forum.path-taxonomy #wrapper .page-wrapper > .container > .row > [class*="col-"].jd-forum-main, html body.path-forum.path-taxonomy #wrapper .row.content-layout > [class*="col-"].jd-forum-main {
    margin-bottom: 4rem !important;
  }

   html body.path-forum.path-taxonomy #wrapper .page-wrapper > .container > .row > [class*="col-"].jd-forum-main, html body.path-forum.path-taxonomy #wrapper .row.content-layout > [class*="col-"].jd-forum-main {
    margin-top: -2rem !important;
  }

  :is(html body.path-forum, html body.path-forum.path-taxonomy, html body.page-node-type-forum, html body.path-node-add-forum) #wrapper .jd-forum-main .container-wrap, :is(html body.path-forum, html body.path-forum.path-taxonomy, html body.page-node-type-forum, html body.path-node-add-forum) #wrapper .jd-forum-main .block > .container-wrap {
    margin-top: 0rem;
    margin-bottom: 4rem !important;
  }

  :is(html body.path-forum, html body.path-forum.path-taxonomy, html body.page-node-type-forum, html body.path-node-add-forum) #wrapper .row.content-layout {
    margin-left: -15px !important;
    margin-right: -15px !important;
    width: auto !important;
  }

  :is(html body.path-forum, html body.path-forum.path-taxonomy, html body.page-node-type-forum, html body.path-node-add-forum) #wrapper .jd-forum-main,
  :is(html body.path-forum, html body.path-forum.path-taxonomy, html body.page-node-type-forum, html body.path-node-add-forum) #wrapper .main-content.jd-forum-main,
  :is(html body.path-forum, html body.path-forum.path-taxonomy, html body.page-node-type-forum, html body.path-node-add-forum) #wrapper [class*="col-"].jd-forum-main {
    padding-left: 15px !important;
    padding-right: 15px !important;
  }

  html body.path-forum.path-taxonomy #wrapper .page-wrapper > .container > .row.content-layout,
  html body.path-forum.path-taxonomy #wrapper .row.content-layout {
    margin-left: -15px !important;
    margin-right: -15px !important;
    max-width: none !important;
    width: auto !important;
  }

  html body.path-forum.path-taxonomy #wrapper .page-wrapper > .container > .row > [class*="col-"].jd-forum-main,
  html body.path-forum.path-taxonomy #wrapper .row.content-layout > [class*="col-"].jd-forum-main {
    padding-left: 15px !important;
    padding-right: 15px !important;
    max-width: 100% !important;
  }

  html body.path-forum.path-taxonomy #wrapper .region-content,
  html body.path-forum.path-taxonomy #wrapper .jd-forum-main .region-content,
  html body.path-forum.path-taxonomy #wrapper .region.region-content {
    overflow: visible !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  html body.path-forum #wrapper .jd-forum-search-intro {
    align-items: stretch;
    flex-direction: column;
  }

  html body.path-forum #wrapper .jd-forum-search-intro .jd-forum-topic__back {
    justify-content: center;
    white-space: normal;
    width: 100%;
  }

  html body.path-forum #wrapper .jd-forum-search__controls,
  html body.path-forum #wrapper .jd-forum-search-form__controls {
    grid-template-columns: minmax(0, 1fr);
  }

  html body.path-forum #wrapper .jd-forum-search button,
  html body.path-forum #wrapper .jd-forum-search-form button {
    width: 100%;
    margin-left: 0 !important;
  }

  html body.path-forum #wrapper .jd-forum-highlights {
    grid-template-columns: 1fr;
  }

  html body.path-forum #wrapper .jd-forum-highlight {
    padding: 0.85rem 1rem;
  }

  html body.path-forum #wrapper .jd-forum-highlight .more-link {
    margin-top: 0.6rem;
  }

  html body.path-forum #wrapper .jd-forum__actions,
  html body.page-node-type-forum #wrapper .jd-forum-signin-prompt {
    align-items: stretch;
  }

  html body.path-forum #wrapper .jd-forum__actions .jd-forum__button,
  html body.page-node-type-forum #wrapper .jd-forum-signin-prompt .jd-forum__button {
    flex: 1 1 100%;
  }

  html body.path-forum #wrapper .jd-forum-table-wrap {
    overflow: visible;
  }

  html body.path-forum #wrapper .jd-forum-table--directory thead {
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    height: 1px;
    overflow: hidden;
    position: absolute;
    white-space: nowrap;
    width: 1px;
  }

  html body.path-forum #wrapper .jd-forum-table--directory tbody {
    display: block;
    width: 100%;
  }

  html body.path-forum #wrapper .jd-forum-table--directory tr.jd-forum-table__forum {
    border-bottom: 1px solid var(--jd-forum-border);
    display: grid;
    gap: 0.35rem 0.85rem;
    grid-template-columns: 1fr 1fr;
    padding: 0.95rem 0.9rem;
    width: 100%;
  }

  html body.path-forum #wrapper .jd-forum-table--directory tr.jd-forum-table__forum:last-child {
    border-bottom: 0;
  }

  html body.path-forum #wrapper .jd-forum-table--directory tr.jd-forum-table__forum td {
    border: 0 !important;
    min-width: 0;
    padding: 0 !important;
  }

  html body.path-forum #wrapper .jd-forum-table--directory tr.jd-forum-table__forum td::before {
    color: var(--jd-forum-muted);
    content: attr(data-label);
    display: block;
    font-size: 0.68rem;
    font-weight: 850;
    letter-spacing: 0.05em;
    margin-bottom: 0.15rem;
    text-transform: uppercase;
  }

  html body.path-forum #wrapper .jd-forum-table--directory tr.jd-forum-table__forum td:first-child {
    grid-column: 1 / -1;
    padding-bottom: 0.45rem !important;
  }

  html body.path-forum #wrapper .jd-forum-table--directory tr.jd-forum-table__forum td:first-child::before {
    content: none;
  }

  html body.path-forum #wrapper .jd-forum-table--directory tr.jd-forum-table__forum td:nth-child(4) {
    grid-column: 1 / -1;
  }

  html body.path-forum #wrapper .jd-forum-table--directory tr.jd-forum-table__container {
    border-bottom: 0;
    display: block;
    padding: 0;
    width: 100%;
  }

  html body.path-forum #wrapper .jd-forum-table--directory tr.jd-forum-table__container td,
  html body.path-forum #wrapper .jd-forum-table--directory tr.jd-forum-table__container td:first-child,
  html body.path-forum #wrapper .jd-forum-table--directory tr.jd-forum-table__container:is(:hover, :active, :focus-within) td {
    background: linear-gradient(90deg, var(--jd-forum-purple), var(--jd-forum-violet)) !important;
    display: block;
    padding: 0.85rem 1rem !important;
    width: 100%;
  }

  html body.path-forum #wrapper .jd-forum-table--directory tr.jd-forum-table__container td::before,
  html body.path-forum #wrapper .jd-forum-table--directory tr.jd-forum-table__container td:first-child::before {
    content: none;
  }

  html body.path-forum #wrapper .jd-forum-table--directory td:first-child::before {
    content: none;
  }

  html body.path-forum #wrapper .jd-forum-topic-table-wrap {
    overflow: visible;
  }

  html body.path-forum #wrapper .jd-forum-topic-table thead {
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    height: 1px;
    overflow: hidden;
    position: absolute;
    white-space: nowrap;
    width: 1px;
  }

  html body.path-forum #wrapper .jd-forum-topic-table tbody {
    display: block;
    width: 100%;
  }

  html body.path-forum #wrapper .jd-forum-topic-table tr {
    border-bottom: 1px solid var(--jd-forum-border);
    display: grid;
    gap: 0.35rem 0.85rem;
    grid-template-columns: 1fr 1fr;
    padding: 0.95rem 0.9rem;
    width: 100%;
  }

  html body.path-forum #wrapper .jd-forum-topic-table tr:last-child {
    border-bottom: 0;
  }

  html body.path-forum #wrapper .jd-forum-topic-table td {
    border: 0 !important;
    min-width: 0;
    padding: 0 !important;
    text-align: left;
    width: auto;
  }

  html body.path-forum #wrapper .jd-forum-topic-table td::before {
    color: var(--jd-forum-muted);
    content: attr(data-label);
    display: block;
    font-size: 0.68rem;
    font-weight: 850;
    letter-spacing: 0.05em;
    margin-bottom: 0.15rem;
    text-transform: uppercase;
  }

  html body.path-forum #wrapper .jd-forum-topic-table td:first-child {
    grid-column: 1 / -1;
    padding-bottom: 0.45rem !important;
  }

  html body.path-forum #wrapper .jd-forum-topic-table td:first-child::before {
    content: none;
  }

  html body.path-forum #wrapper .jd-forum-topic-table th:nth-child(2),
  html body.path-forum #wrapper .jd-forum-topic-table td:nth-child(2),
  html body.path-forum #wrapper .jd-forum-topic-table th:nth-child(3),
  html body.path-forum #wrapper .jd-forum-topic-table td:nth-child(3) {
    text-align: left;
    width: auto;
  }

  html body.path-forum #wrapper .jd-forum-topic-title {
    display: block;
    max-width: none;
  }

  html body.page-node-type-forum #wrapper .field--name-field-forum-images {
    grid-template-columns: 1fr;
  }

  html body.page-node-type-forum #wrapper .indented {
    margin-left: 0.75rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  :is(html body.path-forum, html body.page-node-type-forum) #wrapper .jd-forum__button {
    transition: none !important;
  }
}

/* assets/css/portfolio-page.css */
/**
 * Portfolio index introduction.
 *
 * Loaded after Custom CSS so legacy global heading/paragraph rules cannot
 * obscure or reorder the page's semantic introduction.
 */

html body.path-portfolio #wrapper .jd-portfolio-intro {
  display: grid !important;
  gap: 0.65rem;
  width: min(100% - 2rem, 74rem);
  margin: 1.5rem auto 2rem;
  padding: clamp(1.25rem, 3vw, 2rem);
  border: 1px solid rgba(103, 22, 170, 0.22);
  border-radius: 1rem;
  background: linear-gradient(135deg, #faf5ff 0%, #f3e8ff 100%);
  box-shadow: 0 0.75rem 2rem rgba(59, 10, 92, 0.09);
  color: #3b0a5c;
}

html body.path-portfolio #wrapper .jd-portfolio-intro__eyebrow,
html body.path-portfolio #wrapper .jd-portfolio-intro h1,
html body.path-portfolio #wrapper .jd-portfolio-intro p {
  position: static !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #3b0a5c !important;
  text-align: left !important;
  transform: none !important;
}

html body.path-portfolio #wrapper .jd-portfolio-intro__eyebrow {
  color: #6716aa !important;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.09em;
  line-height: 1.4;
  text-transform: uppercase;
}

html body.path-portfolio #wrapper .jd-portfolio-intro h1 {
  font-size: clamp(1.8rem, 4vw, 3rem);
  line-height: 1.12;
  text-transform: none;
}

html body.path-portfolio #wrapper .jd-portfolio-intro p:not(.jd-portfolio-intro__eyebrow) {
  max-width: 68ch;
  color: #3f2a4d !important;
  font-size: 1rem;
  line-height: 1.65;
}

@media (max-width: 480px) {
  html body.path-portfolio #wrapper .jd-portfolio-intro {
    width: calc(100% - 1.5rem);
    margin-block: 1rem 1.5rem;
    padding: 1.1rem;
  }
}

/* assets/css/klaro-consent-theme.css */
/**
 * Johnny Detail Klaro consent UI.
 *
 * Klaro renders outside #wrapper. Scope to its host and theme class so these
 * rules override library defaults without affecting normal page components.
 */
html body #klaro {
  position: relative;
  z-index: 2147483647;
}

html body #klaro .klaro.klaro-theme-martis {
  --jd-purple-dark: #3b0a5c;
  --jd-purple-primary: #6716aa;
  --jd-purple-accent: #9d4edd;
  --jd-purple-light: #f3e8ff;
  --jd-purple-soft: #faf5ff;
  --jd-text-dark: #1f2937;
  --jd-text-muted: #4b5563;
  --jd-border-color: #e9d5ff;
  font-size: 16px;
  line-height: 1.5;
  position: relative;
  z-index: 2147483647;
}

/* Initial consent notice: mobile bottom sheet, desktop corner card. */
html body #klaro .klaro.klaro-theme-martis .cookie-notice:not(.cookie-modal-notice) {
  left: 50% !important;
  right: auto !important;
  bottom: max(1rem, env(safe-area-inset-bottom)) !important;
  width: min(calc(100% - 2rem), 72rem) !important;
  max-width: 72rem !important;
  max-height: min(78vh, 42rem);
  margin: 0;
  overflow: auto;
  overscroll-behavior: contain;
  transform: translateX(-50%);
  border: 2px solid var(--jd-purple-primary);
  border-radius: 14px;
  background: #ffffff;
  color: var(--jd-text-dark);
  box-shadow: 0 18px 48px rgba(59, 10, 92, 0.28);
  -webkit-overflow-scrolling: touch;
}

html body #klaro .klaro.klaro-theme-martis .cookie-notice .cn-body {
  display: block;
  padding: 1rem 1rem max(1rem, env(safe-area-inset-bottom));
}

html body #klaro .klaro.klaro-theme-martis .cookie-notice .cn-body h1,
html body #klaro .klaro.klaro-theme-martis .cookie-notice .cn-body h2,
html body #klaro .klaro.klaro-theme-martis .cookie-notice .cn-body h3,
html body #klaro .klaro.klaro-theme-martis .cookie-notice .cn-body .cn-title {
  display: block;
  margin: 0;
  color: var(--jd-purple-dark);
  font-size: 1.35rem;
  font-weight: 700;
  line-height: 1.25;
}

html body #klaro .klaro.klaro-theme-martis .cookie-notice .cn-body p {
  max-width: 68ch;
  margin: 0.5rem 0 0;
  color: var(--jd-text-muted);
  font-size: 0.9375rem;
  line-height: 1.55;
}

html body #klaro .klaro.klaro-theme-martis .cookie-notice .cn-body a {
  color: var(--jd-purple-primary);
  font-weight: 700;
  text-underline-offset: 2px;
}

html body #klaro .klaro.klaro-theme-martis .cookie-notice .cn-body .cn-ok {
  display: grid;
  grid-template-columns: 1fr;
  width: 100%;
  gap: 0.6rem;
  margin: 0.85rem 0 0;
}

html body #klaro .klaro.klaro-theme-martis .cookie-notice .cn-body .cn-buttons {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  width: 100%;
  gap: 0.6rem;
  margin: 0;
}

html body #klaro .klaro.klaro-theme-martis .cookie-notice .cn-body .cn-ok > *,
html body #klaro .klaro.klaro-theme-martis .cookie-notice .cn-learn-more {
  margin: 0;
}

/* Shared Klaro buttons. */
html body #klaro .klaro.klaro-theme-martis .cm-btn,
html body #klaro .klaro.klaro-theme-martis .cn-learn-more {
  display: inline-flex;
  width: 100% !important;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  margin: 0 !important;
  padding: 0.65rem 1rem !important;
  border: 2px solid var(--jd-purple-primary) !important;
  border-radius: 9px !important;
  font-size: 0.9375rem;
  font-weight: 700;
  line-height: 1.2;
  text-align: center;
  text-decoration: none !important;
  cursor: pointer;
  transition: background-color 160ms ease, border-color 160ms ease,
    color 160ms ease, box-shadow 160ms ease;
}

html body #klaro .klaro.klaro-theme-martis .cm-btn.cm-btn-success,
html body #klaro .klaro.klaro-theme-martis .cm-btn.cm-btn-success-var {
  background: var(--jd-purple-primary) !important;
  color: #ffffff !important;
}

html body #klaro .klaro.klaro-theme-martis .cm-btn.cm-btn-decline,
html body #klaro .klaro.klaro-theme-martis .cm-btn.cm-btn-danger {
  background: #ffffff !important;
  color: var(--jd-purple-dark) !important;
}

html body #klaro .klaro.klaro-theme-martis .cm-btn.cm-btn-info,
html body #klaro .klaro.klaro-theme-martis .cn-learn-more {
  background: var(--jd-purple-light) !important;
  color: var(--jd-purple-dark) !important;
}

html body #klaro .klaro.klaro-theme-martis .cm-btn:hover,
html body #klaro .klaro.klaro-theme-martis .cn-learn-more:hover {
  border-color: var(--jd-purple-dark) !important;
  box-shadow: 0 4px 12px rgba(103, 22, 170, 0.24);
}

html body #klaro .klaro.klaro-theme-martis a:focus-visible,
html body #klaro .klaro.klaro-theme-martis button:focus-visible,
html body #klaro .klaro.klaro-theme-martis input:focus-visible + .cm-list-label .slider,
html body #klaro .klaro.klaro-theme-martis .cm-modal:focus-visible {
  outline: 3px solid var(--jd-purple-accent) !important;
  outline-offset: 3px !important;
  box-shadow: 0 0 0 2px var(--jd-purple-dark) !important;
}

/* Preferences modal. */
html body #klaro .klaro.klaro-theme-martis .cookie-modal .cm-bg {
  background: rgba(30, 10, 50, 0.72);
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
}

html body #klaro .klaro.klaro-theme-martis .cookie-modal .cm-modal.cm-klaro {
  display: flex;
  flex-direction: column;
  width: min(calc(100% - 2rem), 48rem);
  max-width: 48rem;
  max-height: min(90vh, 52rem);
  border: 2px solid var(--jd-purple-primary);
  border-radius: 14px;
  background: #ffffff;
  color: var(--jd-text-dark);
  box-shadow: 0 24px 64px rgba(30, 10, 50, 0.4);
  overflow: hidden;
}

html body #klaro .klaro.klaro-theme-martis .cookie-modal .cm-header {
  flex: 0 0 auto;
  padding: 1.15rem 3.75rem 1rem 1.25rem;
  border-bottom: 1px solid var(--jd-border-color);
  background: var(--jd-purple-soft);
}

html body #klaro .klaro.klaro-theme-martis .cookie-modal .cm-header h1,
html body #klaro .klaro.klaro-theme-martis .cookie-modal .cm-header h2 {
  margin: 0;
  color: var(--jd-purple-dark);
  font-size: clamp(1.4rem, 3vw, 1.85rem);
  line-height: 1.2;
}

html body #klaro .klaro.klaro-theme-martis .cookie-modal .cm-body {
  flex: 1 1 auto;
  padding: 1rem 1.25rem;
  overflow: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}

html body #klaro .klaro.klaro-theme-martis .cookie-modal .cm-modal p,
html body #klaro .klaro.klaro-theme-martis .cookie-modal .cm-modal strong,
html body #klaro .klaro.klaro-theme-martis .cookie-modal .cm-modal li {
  color: var(--jd-text-dark);
}

html body #klaro .klaro.klaro-theme-martis .cookie-modal .cm-list-description,
html body #klaro .klaro.klaro-theme-martis .cookie-modal p.purposes {
  color: var(--jd-text-muted);
}

html body #klaro .klaro.klaro-theme-martis .cookie-modal .cm-switch-container,
html body #klaro .klaro.klaro-theme-martis .cookie-modal li.cm-purpose,
html body #klaro .klaro.klaro-theme-martis .cookie-modal li.cm-service {
  margin-top: 0.65rem;
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
  border-color: var(--jd-border-color);
  border-radius: 8px;
}

html body #klaro .klaro.klaro-theme-martis .cookie-modal .cm-footer {
  flex: 0 0 auto;
  padding: 0.9rem 1.25rem max(0.9rem, env(safe-area-inset-bottom));
  border-top: 1px solid var(--jd-border-color);
  background: var(--jd-purple-soft);
}

html body #klaro .klaro.klaro-theme-martis .cookie-modal .cm-footer-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
  justify-content: flex-end;
}

html body #klaro .klaro.klaro-theme-martis .cookie-modal .cm-footer-buttons .cm-btn {
  width: auto !important;
}

html body #klaro .klaro.klaro-theme-martis .cookie-modal .hide {
  top: 0.9rem;
  right: 0.9rem;
  display: inline-flex;
  width: 44px;
  height: 44px;
  align-items: center;
  justify-content: center;
  border: 2px solid transparent;
  border-radius: 50%;
  background: #ffffff;
}

html body #klaro .klaro.klaro-theme-martis .cookie-modal .hide svg {
  stroke: var(--jd-text-dark);
}

html body #klaro .klaro.klaro-theme-martis .cm-list-input:checked + .cm-list-label .slider,
html body #klaro .klaro.klaro-theme-martis .cm-list-input.required:checked + .cm-list-label .slider,
html body #klaro .klaro.klaro-theme-martis .cm-list-input.only-required + .cm-list-label .slider {
  background-color: var(--jd-purple-primary) !important;
}

/* Persistent privacy preferences control. */
html body #klaro_toggle_dialog,
html body button.klaro_toggle_dialog {
  position: fixed !important;
  right: max(1.25rem, env(safe-area-inset-right)) !important;
  bottom: max(1.25rem, env(safe-area-inset-bottom)) !important;
  left: auto !important;
  display: inline-flex !important;
  box-sizing: border-box !important;
  width: 48px !important;
  height: 48px !important;
  min-width: 48px !important;
  min-height: 48px !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 2px solid #ffffff !important;
  border-radius: 50% !important;
  background: var(--jd-purple-primary, #6716aa) !important;
  color: #ffffff !important;
  box-shadow: 0 4px 14px rgba(59, 10, 92, 0.35) !important;
  cursor: pointer !important;
  z-index: 2147483646 !important;
  transform: none !important;
  transition: background-color 160ms ease, transform 160ms ease,
    box-shadow 160ms ease !important;
}

html body #klaro_toggle_dialog::after,
html body button.klaro_toggle_dialog::after {
  content: "";
  display: block;
  flex: 0 0 28px;
  width: 28px;
  height: 28px;
  background-color: currentColor;
  -webkit-mask: url("/themes/martis/assets/icons/cookie-settings.svg") center / contain no-repeat;
  mask: url("/themes/martis/assets/icons/cookie-settings.svg") center / contain no-repeat;
  pointer-events: none;
}

html body #klaro_toggle_dialog:hover,
html body button.klaro_toggle_dialog:hover {
  background: var(--jd-purple-dark, #3b0a5c) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 6px 18px rgba(59, 10, 92, 0.45) !important;
}

html body #klaro_toggle_dialog:focus:not(:hover),
html body button.klaro_toggle_dialog:focus:not(:hover) {
  transform: none !important;
}

html body #klaro_toggle_dialog:focus-visible,
html body button.klaro_toggle_dialog:focus-visible {
  outline: 3px solid var(--jd-purple-accent, #9d4edd) !important;
  outline-offset: 3px !important;
}

html body #gt_float_wrapper,
html body .gtranslate_wrapper {
  z-index: 2147483645 !important;
}

@media (min-width: 768px) {
  html body #klaro .klaro.klaro-theme-martis .cookie-notice:not(.cookie-modal-notice) {
    left: auto !important;
    right: max(1.25rem, env(safe-area-inset-right)) !important;
    bottom: max(1.25rem, env(safe-area-inset-bottom)) !important;
    width: min(calc(100% - 2.5rem), 30rem) !important;
    max-width: 30rem !important;
    transform: none;
    border-width: 1px;
    border-radius: 16px;
    box-shadow: 0 22px 56px rgba(59, 10, 92, 0.24),
      0 4px 14px rgba(103, 22, 170, 0.12);
  }

  html body #klaro .klaro.klaro-theme-martis .cookie-notice .cn-body {
    padding: 1.35rem;
  }

  html body #klaro .klaro.klaro-theme-martis .cookie-notice .cn-body h2 {
    padding-right: 2.25rem;
    font-size: 1.5rem;
  }

  html body #klaro .klaro.klaro-theme-martis .cookie-notice .cn-body p {
    max-width: none;
    margin-top: 0.55rem;
  }

  html body #klaro .klaro.klaro-theme-martis .cookie-notice .cn-body .cn-ok {
    gap: 0.65rem;
    margin-top: 1rem;
  }

  html body #klaro .klaro.klaro-theme-martis .cookie-notice .cn-body .cn-buttons {
    gap: 0.65rem;
  }
}

@media (max-width: 767.98px) {
  html body #klaro .klaro.klaro-theme-martis .cookie-notice:not(.cookie-modal-notice) {
    bottom: 0 !important;
    width: 100% !important;
    max-width: none !important;
    border-width: 2px 0 0;
    border-radius: 14px 14px 0 0;
  }

  html body #klaro .klaro.klaro-theme-martis .cookie-modal .cm-modal.cm-klaro {
    top: 0;
    width: 100%;
    max-width: none;
    height: 100dvh;
    max-height: 100dvh;
    border-width: 0;
    border-radius: 0;
    transform: none;
  }

  html body #klaro .klaro.klaro-theme-martis .cookie-modal .cm-header,
  html body #klaro .klaro.klaro-theme-martis .cookie-modal .cm-body,
  html body #klaro .klaro.klaro-theme-martis .cookie-modal .cm-footer {
    padding-left: 1rem;
    padding-right: 1rem;
  }

  html body #klaro .klaro.klaro-theme-martis .cookie-modal .cm-footer-buttons {
    display: grid;
    grid-template-columns: 1fr;
  }

  html body #klaro .klaro.klaro-theme-martis .cookie-modal .cm-footer-buttons .cm-btn {
    width: 100% !important;
  }

  html body #klaro_toggle_dialog,
  html body button.klaro_toggle_dialog {
    right: max(1rem, env(safe-area-inset-right)) !important;
    bottom: max(1rem, env(safe-area-inset-bottom)) !important;
  }
}

@media (max-width: 339.98px) {
  html body #klaro .klaro.klaro-theme-martis .cookie-notice .cn-body .cn-buttons {
    grid-template-columns: 1fr;
  }
}

@media (prefers-reduced-motion: reduce) {
  html body #klaro .klaro.klaro-theme-martis *,
  html body #klaro .klaro.klaro-theme-martis *::before,
  html body #klaro .klaro.klaro-theme-martis *::after,
  html body #klaro_toggle_dialog,
  html body button.klaro_toggle_dialog,
  html body #klaro_toggle_dialog::after,
  html body button.klaro_toggle_dialog::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }
}

/* The privacy trigger is hidden while Klaro itself is open. */
html body #klaro_toggle_dialog[hidden] {
  display: none !important;
}

/* Native Klaro fresh-choice close uses a separate class from modal .hide. */
html body #klaro .klaro.klaro-theme-martis .klaro-close {
  display: inline-flex !important;
  position: absolute;
  top: 0.5rem;
  right: 0.5rem;
  width: 44px !important;
  height: 44px !important;
  min-width: 44px;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  padding: 0 !important;
  border: 2px solid #6716aa !important;
  border-radius: 50% !important;
  background: #f3e8ff !important;
  background-image: none !important;
  color: #3b0a5c !important;
  cursor: pointer;
}
html body #klaro .klaro.klaro-theme-martis .klaro-close::before {
  content: "\00d7";
  font: 28px/1 sans-serif;
}
html body #klaro .klaro.klaro-theme-martis .klaro-close::after {
  content: none;
}
html body #klaro .klaro.klaro-theme-martis .klaro-close:hover {
  background: #6716aa !important;
  color: #ffffff !important;
}
html body #klaro .klaro.klaro-theme-martis .klaro-close:focus-visible {
  outline: 3px solid #9d4edd;
  outline-offset: 3px;
}
html body #klaro .klaro.klaro-theme-martis.klaro-close-enabled .cookie-notice .cn-body {
  padding-top: 3.5rem;
}

/* Always offer the same three explicit choices, including on a return visit. */
html body #klaro .klaro.klaro-theme-martis .cookie-modal .cm-footer-buttons {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

html body #klaro .klaro.klaro-theme-martis .cookie-modal .cm-footer-buttons .cm-btn {
  width: 100% !important;
  white-space: normal;
  overflow-wrap: anywhere;
}

html body #klaro .klaro.klaro-theme-martis .cookie-modal .cm-footer-buttons [data-jd-consent-action="save"] {
  order: 0;
}

html body #klaro .klaro.klaro-theme-martis .cookie-modal .cm-footer-buttons [data-jd-consent-action="reject"] {
  order: 1;
}

html body #klaro .klaro.klaro-theme-martis .cookie-modal .cm-footer-buttons [data-jd-consent-action="accept"] {
  order: 2;
}

/* A site-wide, verified inventory with explicit activation conditions. */
html body #klaro .klaro.klaro-theme-martis .jd-consent-inventory {
  margin: 1.25rem 0 0;
  border: 1px solid var(--jd-border-color);
  border-radius: 10px;
  background: #ffffff;
  overflow-wrap: anywhere;
}

html body #klaro .klaro.klaro-theme-martis .jd-consent-inventory > summary {
  display: list-item;
  min-height: 44px;
  box-sizing: border-box;
  padding: 0.75rem 1rem;
  border-radius: 9px;
  background: var(--jd-purple-light);
  color: var(--jd-purple-dark);
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.4;
  cursor: pointer;
}

html body #klaro .klaro.klaro-theme-martis .jd-consent-inventory > summary:focus-visible {
  outline: 3px solid var(--jd-purple-accent);
  outline-offset: 2px;
}

html body #klaro .klaro.klaro-theme-martis .jd-consent-inventory > p {
  margin: 1rem;
  font-size: 0.9375rem;
  line-height: 1.55;
}

html body #klaro .klaro.klaro-theme-martis .jd-consent-storage-list {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.75rem;
  margin: 1rem;
  padding: 0;
  list-style: none;
}

html body #klaro .klaro.klaro-theme-martis .jd-consent-storage-list > li {
  min-width: 0;
  margin: 0;
  padding: 1rem;
  border: 1px solid var(--jd-border-color);
  border-radius: 8px;
  background: var(--jd-purple-soft);
}

html body #klaro .klaro.klaro-theme-martis .jd-consent-storage-list h3 {
  margin: 0;
  color: var(--jd-purple-dark);
  font-size: 1rem;
  line-height: 1.4;
}

html body #klaro .klaro.klaro-theme-martis .jd-consent-storage-list code {
  padding: 0;
  background: transparent;
  color: inherit;
  font-size: 0.9375rem;
  white-space: normal;
}

html body #klaro .klaro.klaro-theme-martis .jd-consent-storage-list .jd-consent-storage-kind {
  margin: 0.4rem 0 0.75rem;
  color: var(--jd-purple-primary);
  font-size: 0.8125rem;
  font-weight: 700;
}

html body #klaro .klaro.klaro-theme-martis .jd-consent-storage-list dl {
  display: grid;
  grid-template-columns: 6.5rem minmax(0, 1fr);
  gap: 0.35rem 0.75rem;
  margin: 0;
  font-size: 0.875rem;
  line-height: 1.5;
}

html body #klaro .klaro.klaro-theme-martis .jd-consent-storage-list dt {
  margin: 0;
  font-weight: 700;
}

html body #klaro .klaro.klaro-theme-martis .jd-consent-storage-list dd {
  min-width: 0;
  margin: 0;
}

html body #klaro .klaro.klaro-theme-martis .jd-consent-storage-status {
  margin: 0.75rem 0 0;
  padding: 0.75rem;
  border: 1px solid var(--jd-purple-primary);
  border-radius: 8px;
  background: #ffffff;
  color: var(--jd-purple-dark);
  font-size: 0.875rem;
  line-height: 1.5;
}

html body #klaro .klaro.klaro-theme-martis .jd-consent-storage-status[hidden] {
  display: none !important;
}

@media (max-width: 767.98px) {
  html body #klaro .klaro.klaro-theme-martis .cookie-modal .cm-footer-buttons {
    grid-template-columns: 1fr;
    gap: 0.5rem;
  }

  html body #klaro .klaro.klaro-theme-martis .jd-consent-storage-list {
    margin: 0.75rem;
  }

  html body #klaro .klaro.klaro-theme-martis .jd-consent-storage-list > li {
    padding: 0.75rem;
  }

  html body #klaro .klaro.klaro-theme-martis .jd-consent-storage-list dl {
    grid-template-columns: 5.25rem minmax(0, 1fr);
    column-gap: 0.5rem;
  }
}

/* A failed persistence warning remains readable after the dialog closes. */
html body .jd-consent-persistence-notice {
  position: fixed;
  right: max(1rem, env(safe-area-inset-right));
  bottom: calc(max(1rem, env(safe-area-inset-bottom)) + 4rem);
  z-index: 2147483646;
  width: min(24rem, calc(100% - 2rem));
  box-sizing: border-box;
  padding: 1rem;
  border: 2px solid #6716aa;
  border-radius: 12px;
  background: #faf5ff;
  color: #241438;
  box-shadow: 0 8px 24px #24143830;
  font-size: 0.9375rem;
  line-height: 1.5;
}

html body .jd-consent-persistence-notice[hidden] {
  display: none !important;
}

html body .jd-consent-persistence-notice p {
  margin: 0 0 0.75rem;
  color: #241438;
}

html body .jd-consent-persistence-notice button,
html body.path-product #wrapper #disqus_thread .disqus-consent-button {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  padding: 0.6rem 1rem;
  border: 2px solid #6716aa;
  border-radius: 8px;
  background: #6716aa;
  color: #ffffff;
  font-size: 0.9375rem;
  font-weight: 700;
  line-height: 1.35;
  white-space: normal;
  cursor: pointer;
}

html body .jd-consent-persistence-notice button:focus-visible,
html body.path-product #wrapper #disqus_thread .disqus-consent-button:focus-visible {
  outline: 3px solid #9d4edd;
  outline-offset: 3px;
}

html body #klaro .klaro.klaro-theme-martis .cookie-modal .cm-modal a {
  color: var(--jd-purple-primary);
  text-underline-offset: 2px;
}

html body #klaro .klaro.klaro-theme-martis .cookie-modal .cm-modal a:hover {
  color: var(--jd-purple-dark);
}

/* Shared close controls: the notice rejects optional services; the preferences
 * control keeps its native draft-discard behavior. Both stay outside page chrome.
 */
html body #klaro .klaro.klaro-theme-martis .jd-consent-notice-close,
html body #klaro .klaro.klaro-theme-martis .cookie-modal .hide {
  position: absolute;
  z-index: 2;
  display: inline-flex !important;
  width: 44px !important;
  height: 44px !important;
  min-width: 44px;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  margin: 0 !important;
  padding: 0 !important;
  border: 2px solid #6716aa !important;
  border-radius: 50% !important;
  background: #f3e8ff !important;
  background-image: none !important;
  color: #3b0a5c !important;
  line-height: 1;
  cursor: pointer;
  transition: background-color 160ms ease, color 160ms ease;
}

html body #klaro .klaro.klaro-theme-martis .jd-consent-notice-close {
  top: 1rem;
  right: 1rem;
}

html body #klaro .klaro.klaro-theme-martis .jd-consent-notice-close::before,
html body #klaro .klaro.klaro-theme-martis .jd-consent-notice-close::after,
html body #klaro .klaro.klaro-theme-martis .cookie-modal .hide::before,
html body #klaro .klaro.klaro-theme-martis .cookie-modal .hide::after {
  content: none;
}

html body #klaro .klaro.klaro-theme-martis .jd-consent-notice-close .jd-consent-close-icon,
html body #klaro .klaro.klaro-theme-martis .cookie-modal .hide .jd-consent-close-icon {
  display: block;
  flex: 0 0 22px;
  width: 22px;
  height: 22px;
  margin: 0;
  fill: none;
  stroke: currentColor;
  pointer-events: none;
}

html body #klaro .klaro.klaro-theme-martis .jd-consent-notice-close:hover,
html body #klaro .klaro.klaro-theme-martis .cookie-modal .hide:hover {
  background: #6716aa !important;
  color: #ffffff !important;
}

html body #klaro .klaro.klaro-theme-martis .jd-consent-notice-close:focus-visible,
html body #klaro .klaro.klaro-theme-martis .cookie-modal .hide:focus-visible {
  outline: 3px solid #9d4edd !important;
  outline-offset: 3px !important;
  box-shadow: 0 0 0 2px #3b0a5c !important;
}

/* Reserve a real title row, rather than moving all notice copy below the X. */
html body #klaro .klaro.klaro-theme-martis .jd-consent-has-close .cn-body > h2,
html body #klaro .klaro.klaro-theme-martis .jd-consent-has-close .cn-body > .cn-title {
  display: flex;
  min-height: 44px;
  align-items: center;
  box-sizing: border-box;
  padding-right: calc(44px + 0.75rem);
  overflow-wrap: anywhere;
}

/* Maintain this clearance on phones too; the shared mobile padding otherwise
 * leaves the preferences title underneath the native close button.
 */
html body #klaro .klaro.klaro-theme-martis .cookie-modal .cm-header {
  padding-right: calc(44px + 2rem);
}

/* Successful saves are announced without moving focus or covering the toggle. */
html body .jd-consent-feedback {
  position: fixed;
  right: max(1rem, env(safe-area-inset-right));
  bottom: calc(max(1rem, env(safe-area-inset-bottom)) + 48px + 12px);
  z-index: 2147483646;
  width: max-content;
  max-width: min(24rem, calc(100vw - max(1rem, env(safe-area-inset-left)) - max(1rem, env(safe-area-inset-right))));
  box-sizing: border-box;
  margin: 0;
  padding: 0.875rem 1rem;
  border: 2px solid #6716aa;
  border-radius: 12px;
  background: #f3e8ff;
  color: #3b0a5c;
  box-shadow: 0 8px 24px #24143830;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.5;
  overflow-wrap: anywhere;
}

html body .jd-consent-feedback[hidden] {
  display: none !important;
}

@media (min-width: 768px) {
  html body #klaro .klaro.klaro-theme-martis .jd-consent-notice-close {
    top: 1.35rem;
    right: 1.35rem;
  }

  html body .jd-consent-feedback {
    right: max(1.25rem, env(safe-area-inset-right));
    bottom: calc(max(1.25rem, env(safe-area-inset-bottom)) + 48px + 12px);
  }
}

/* Enlarged text and short screens must leave independently scrollable space
 * for the explanation, service choices and every action. At ordinary sizes
 * these limits do not change the header or footer's natural height.
 */
html body #klaro .klaro.klaro-theme-martis .cookie-modal .cm-header,
html body #klaro .klaro.klaro-theme-martis .cookie-modal .cm-footer {
  flex: 0 0 auto;
  min-height: 0;
  box-sizing: border-box;
  overflow: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}

html body #klaro .klaro.klaro-theme-martis .cookie-modal .cm-header {
  max-height: min(35dvh, 18rem);
}

html body #klaro .klaro.klaro-theme-martis .cookie-modal .cm-footer {
  max-height: min(40dvh, 21rem);
}

html body #klaro .klaro.klaro-theme-martis .cookie-modal .cm-body {
  min-height: min(3rem, 10dvh);
  box-sizing: border-box;
  padding-top: min(1rem, 2dvh);
  padding-bottom: min(1rem, 2dvh);
}

@media (max-width: 767.98px) {
  html body #klaro .klaro.klaro-theme-martis .cookie-modal .cm-header {
    max-height: min(40dvh, 24rem);
  }

  html body #klaro .klaro.klaro-theme-martis .cookie-modal .cm-footer {
    max-height: min(45dvh, 24rem);
  }
}

/* assets/css/social-sharing.css */
/* Shared cards: full content and public career applications only. */
html body:is(.path-node, .path-product, .path-webform) #wrapper .jd-sharing { container: jd-sharing / inline-size; clear: both; box-sizing: border-box; width: 100%; max-width: 100%; margin: 24px 0; padding: 16px; border: 1px solid #e1c9f1; border-radius: 16px; background: #faf5ff; font-size: 14px; text-align: left; }
html body:is(.path-node, .path-product, .path-webform) #wrapper .jd-sharing-title { margin: 0 0 12px; padding: 0; border: 0; background: none; color: #3b0a5c; font: inherit; font-size: 16px; font-weight: 750; line-height: 1.4; text-transform: none; }
html body:is(.path-node, .path-product, .path-webform) #wrapper .jd-sharing .rrssb-buttons { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; width: 100%; height: auto; margin: 0; padding: 0; list-style: none; }
html body:is(.path-node, .path-product, .path-webform) #wrapper .jd-sharing .rrssb-buttons li { display: block; float: none; width: auto; min-width: 0; height: auto; margin: 0; padding: 0; border: 0; background: none; list-style: none; }
html body:is(.path-node, .path-product, .path-webform) #wrapper .jd-sharing li::before, html body:is(.path-node, .path-product, .path-webform) #wrapper .jd-sharing li::after { content: none; }
html body:is(.path-node, .path-product, .path-webform) #wrapper .jd-sharing .rrssb-copy { grid-column: 1 / -1; }
html body:is(.path-node, .path-product, .path-webform) #wrapper .jd-sharing .jd-share-action { display: flex; align-items: center; justify-content: center; gap: 6px; box-sizing: border-box; width: 100%; min-width: 0; min-height: 48px; height: auto; margin: 0; padding: 10px 4px; border: 1px solid #d8b4ed; border-radius: 10px; background: #fff; color: #3b0a5c; box-shadow: none; font: inherit; font-size: 14px; font-weight: 700; line-height: 1.4; text-transform: none; text-decoration: none; letter-spacing: 0; cursor: pointer; transition: background-color .15s ease; }
html body:is(.path-node, .path-product, .path-webform) #wrapper .jd-sharing .jd-share-copy { background: #6716aa; border-color: #6716aa; color: #fff; }
html body:is(.path-node, .path-product, .path-webform) #wrapper .jd-sharing .jd-share-action:hover { background: #f3e8ff; border-color: #6716aa; }
html body:is(.path-node, .path-product, .path-webform) #wrapper .jd-sharing .jd-share-copy:hover { background: #3b0a5c; }
html body:is(.path-node, .path-product, .path-webform) #wrapper .jd-sharing .jd-share-action:focus-visible { outline: 3px solid #9d4edd; outline-offset: 3px; }
html body:is(.path-node, .path-product, .path-webform) #wrapper .jd-sharing .rrssb-icon { position: static; display: block; flex: 0 0 18px; width: 18px; height: 18px; margin: 0; padding: 0; }
html body:is(.path-node, .path-product, .path-webform) #wrapper .jd-sharing span.rrssb-icon { background: currentColor; mask: var(--jd-share-icon) center / contain no-repeat; }
html body:is(.path-node, .path-product, .path-webform) #wrapper .jd-sharing .rrssb-text { position: static; display: inline; width: auto; height: auto; padding: 0; overflow: visible; clip: auto; color: inherit; font: inherit; line-height: 1.4; white-space: nowrap; }
html body:is(.path-node, .path-product, .path-webform) #wrapper .jd-sharing-status { margin: 10px 0 0; color: #3b0a5c; overflow-wrap: anywhere; }
html body:is(.path-node, .path-product, .path-webform) #wrapper .jd-sharing-status:empty, html body:is(.path-node, .path-product, .path-webform) #wrapper .jd-sharing-fallback[hidden] { display: none; }
html body:is(.path-node, .path-product, .path-webform) #wrapper .jd-sharing-fallback { display: block; margin-top: 12px; color: #3b0a5c; }
html body:is(.path-node, .path-product, .path-webform) #wrapper .jd-sharing-fallback input { box-sizing: border-box; width: 100%; min-height: 48px; margin-top: 6px; border: 1px solid #6716aa; border-radius: 8px; background: white; color: #3b0a5c; }
@container jd-sharing (min-width: 600px) {
  html body:is(.path-node, .path-product, .path-webform) #wrapper .jd-sharing .rrssb-buttons { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  html body:is(.path-node, .path-product, .path-webform) #wrapper .jd-sharing .rrssb-copy { grid-column: auto; }
}
@container jd-sharing (max-width: 200px) {
  html body:is(.path-node, .path-product, .path-webform) #wrapper .jd-sharing .rrssb-buttons { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 575px) {
  html body:is(.path-node, .path-product, .path-webform) #wrapper .jd-sharing { padding: 12px; border-radius: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  html body:is(.path-node, .path-product, .path-webform) #wrapper .jd-sharing .jd-share-action { transition: none; }
}

html body.path-submission-review #wrapper .jd-review-answers td { white-space: pre-wrap; overflow-wrap: anywhere; }

/* Reset inherited theme text effects inside the sharing card. */
html body:is(.path-node, .path-product, .path-webform) #wrapper .jd-sharing,
html body:is(.path-node, .path-product, .path-webform) #wrapper .jd-sharing * { text-shadow: none !important; -webkit-text-stroke: 0; -webkit-text-fill-color: currentColor; }

/* assets/css/protected-reviews.css */
html body.path-submission-review { margin: 0; background: #faf5ff; color: #24132f; font: 16px/1.6 system-ui, sans-serif; }
html body.path-submission-review #wrapper { box-sizing: border-box; max-width: 1100px; margin: 24px auto; padding: 28px; background: #fff; border: 1px solid #f3e8ff; border-radius: 18px; overflow-wrap: anywhere; }
html body.path-submission-review #wrapper h1,
html body.path-submission-review #wrapper h2,
html body.path-submission-review #wrapper .jd-review-brand { color: #3b0a5c; }
html body.path-submission-review #wrapper .jd-review-brand { font-weight: 700; }
html body.path-submission-review #wrapper .form-item { margin: 16px 0; }
html body.path-submission-review #wrapper input[type=password],
html body.path-submission-review #wrapper textarea,
html body.path-submission-review #wrapper select { box-sizing: border-box; width: 100%; max-width: 600px; padding: 12px; border: 1px solid #9d4edd; border-radius: 8px; font: inherit; }
html body.path-submission-review #wrapper input[type=submit] { min-height: 44px; margin: 16px 0; padding: 12px 24px; background: #6716aa; border: 0; border-radius: 8px; color: white; font: inherit; cursor: pointer; }
html body.path-submission-review #wrapper a { color: #6716aa; }
html body.path-submission-review #wrapper :focus-visible { outline: 3px solid #9d4edd; outline-offset: 3px; }
html body.path-submission-review #wrapper td { padding: 12px; white-space: pre-wrap; vertical-align: top; border-bottom: 1px solid #f3e8ff; }
html body.path-submission-review #wrapper table { border-collapse: collapse; width: 100%; table-layout: fixed; }
html body.path-submission-review #wrapper label { display: inline-block; padding: 5px 0; }
html body.path-submission-review #wrapper .messages--error { padding: 16px; background: #fff1f2; color: #8b142f; }
@media(max-width: 480px) {
 html body.path-submission-review #wrapper { margin: 0; padding: 16px; border-radius: 0; }
 html body.path-submission-review #wrapper table thead { display: none; }
 html body.path-submission-review #wrapper table td { display: block; }
 html body.path-submission-review #wrapper table td:first-child { font-weight: 700; border-bottom: 0; }
}

/* assets/css/jd-fonts.css */
/**
 * Storefront type tokens. Font Display has no !important; late CSS uses these
 * variables so Martis stacks actually change.
 */

html body.fontyourface {
  --jd-font-text: "Source Sans 3", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --jd-font-display: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  font-family: var(--jd-font-text);
}

html body.fontyourface :is(h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6) {
  font-family: var(--jd-font-display);
}

/* assets/css/vehicle-intro-db.css */
/* Extracted from vehicle form markup; preserve its original emphasis. */
html body.path-webform #wrapper .jd-vehicle-photos-intro .jd-vehicle-photos-kicker { color: black !important; }
html body.path-webform #wrapper .jd-vehicle-photos-intro .jd-vehicle-photos-description { color: white !important; }

/* assets/css/preheading-watermark-sot.css */
/**
 * Johnny Detail — second pre-heading .field-item watermark (TRAVEL/ESCAPE)
 * Match Cyberlytics.dev SoT geometry: giant outline watermark, NOT a pill chip.
 *
 * Brand: white fill + black stroke/shadow only. Do NOT purple-tint this watermark.
 * JD purple/gold stays on CTAs/chrome elsewhere.
 *
 * Registered via martis_get_late_theme_css() immediately before breadcrumb-premium.css
 * so these rules win over earlier late/custom forks.
 */

/* -------------------------------------------------------------------------- */
/* Desktop / default — CYB live: fixed, 10rem, weight 600, opacity 0.35      */
/* -------------------------------------------------------------------------- */
html body:is(.path-frontpage, .path-taxonomy, .page-service-city) #wrapper .slide-carousel .owl-item.active
  .field.field-field-pre-heading-text.field-type-string.field-label-hidden.field-items
  > .field-item:nth-child(2),
html body:is(.path-frontpage, .path-taxonomy, .page-service-city) #wrapper .slide-carousel .owl-item.active
  .field.field-field-pre-heading-text.field-type-string.field-label-hidden.field-items
  > div:nth-child(2),
html body:is(.path-frontpage, .path-taxonomy, .page-service-city) #wrapper .slide-carousel .owl-item.active
  .pre-heading-text .field-item.animate__jello,
html body:is(.path-frontpage, .path-taxonomy, .page-service-city) #wrapper .slide-carousel .owl-item.active
  .field-field-pre-heading-text .animate__jello,
html body:is(.path-frontpage, .path-taxonomy, .page-service-city) #wrapper .hero.slide-carousel:not(.owl-loaded)
  > .node--type-slide:first-child
  .field.field-field-pre-heading-text .field-items > .field-item:nth-child(2),
html body:is(.path-frontpage, .path-taxonomy, .page-service-city) #wrapper .hero.slide-carousel:not(.owl-loaded)
  > .node--type-slide:first-child
  .field.field-field-pre-heading-text .field-items > div:nth-child(2) {
  position: fixed !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  bottom: auto !important;
  z-index: -1 !important;
  display: block !important;
  width: max-content !important;
  max-width: none !important;
  margin-top: -7rem !important;
  margin-left: -0.5rem !important;
  margin-right: 0 !important;
  margin-bottom: 0 !important;
  padding: 0 !important;
  font-family: "Source Sans 3", system-ui, sans-serif !important;
  font-size: 10rem !important;
  font-weight: 600 !important;
  line-height: 1.1 !important;
  letter-spacing: 0.5rem !important;
  text-transform: none !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  -webkit-text-stroke: 2px #000000 !important;
  paint-order: stroke fill !important;
  opacity: 0.35 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  text-shadow:
    -5px 3px 3px black,
    0 1px 0 black,
    1px 0 0 black,
    -1px 0 0 black,
    0 0 1px black !important;
  white-space: nowrap !important;
  pointer-events: none !important;
  transform: none !important;
  float: none !important;
  visibility: visible !important;
}

/* Hide watermark on non-active owl items (preserve JD behavior) */
html body:is(.path-frontpage, .path-taxonomy, .page-service-city) #wrapper .slide-carousel .owl-item:not(.active)
  .field.field-field-pre-heading-text .field-items > .field-item:nth-child(2),
html body:is(.path-frontpage, .path-taxonomy, .page-service-city) #wrapper .slide-carousel .owl-item:not(.active)
  .field.field-field-pre-heading-text .field-items > div:nth-child(2),
html body:is(.path-frontpage, .path-taxonomy, .page-service-city) #wrapper .slide-carousel .owl-item:not(.active)
  .pre-heading-text .field-item.animate__jello {
  display: none !important;
  visibility: hidden !important;
  animation: none !important;
  pointer-events: none !important;
}

/* -------------------------------------------------------------------------- */
/* Neutralize ≤1000px 3rem / thin-stroke forks (retire JD tablet shrink)     */
/* -------------------------------------------------------------------------- */
@media (max-width: 1000px) {
  html body:is(.path-frontpage, .path-taxonomy, .page-service-city) #wrapper .slide-carousel .owl-item.active
    .field.field-field-pre-heading-text .field-items > .field-item:nth-child(2),
  html body:is(.path-frontpage, .path-taxonomy, .page-service-city) #wrapper .slide-carousel .owl-item.active
    .field.field-field-pre-heading-text .field-items > div:nth-child(2),
  html body:is(.path-frontpage, .path-taxonomy, .page-service-city) #wrapper .slide-carousel .owl-item.active
    .pre-heading-text .field-item.animate__jello,
  html body:is(.path-frontpage, .path-taxonomy, .page-service-city) #wrapper .slide-carousel .owl-item.active
    .field-field-pre-heading-text .animate__jello {
    font-size: 10rem !important;
    font-weight: 600 !important;
    letter-spacing: 0.5rem !important;
    -webkit-text-stroke: 2px #000000 !important;
    opacity: 0.35 !important;
    position: fixed !important;
    top: auto !important;
    margin-top: -7rem !important;
    margin-left: -0.5rem !important;
    margin-right: 0 !important;
    margin-bottom: 0 !important;
    z-index: -1 !important;
  }
}

/* -------------------------------------------------------------------------- */
/* Mobile ≤767.98 — CYB carousel-mobile-ui: 2rem / weight 600 / opacity 0.5  */
/* Neutralize font-weight 800, stroke 0/0.4px, top 0.75rem label forks        */
/* -------------------------------------------------------------------------- */
@media (max-width: 767.98px) {
  html body:is(.path-frontpage, .path-taxonomy) #wrapper .slide-carousel
    .field.field-field-pre-heading-text.field-type-string.field-label-hidden.field-items
    .field-item:nth-child(2),
  html body:is(.path-frontpage, .path-taxonomy) #wrapper .slide-carousel
    .field.field-field-pre-heading-text.field-type-string.field-label-hidden.field-items
    div:nth-child(2),
  html body:is(.path-frontpage, .path-taxonomy, .page-service-city) #wrapper
    .slide-carousel .owl-item.active
    .field.field-field-pre-heading-text .field-items > .field-item:nth-child(2),
  html body:is(.path-frontpage, .path-taxonomy, .page-service-city) #wrapper
    .slide-carousel .owl-item.active
    .field.field-field-pre-heading-text .field-items > div:nth-child(2),
  html body:is(.path-frontpage, .path-taxonomy, .page-service-city) #wrapper
    .slide-carousel .owl-item.active .pre-heading-text .field-item.animate__jello,
  html body:is(.path-frontpage, .path-taxonomy, .page-service-city) #wrapper
    .slide-carousel .owl-item.active .field-field-pre-heading-text .animate__jello,
  html body:is(.path-frontpage, .path-taxonomy, .page-service-city) #wrapper #content-wide-top .block.slide-block .owl-item
    .pre-heading-text .field-items > .field-item:nth-child(2),
  html body:is(.path-frontpage, .path-taxonomy, .page-service-city) #wrapper #content-wide-top .block.slide-block .owl-item
    .pre-heading-text .field-items > div:nth-child(2),
  html body #wrapper .slide-carousel .pre-heading-text--carousel .field-item:nth-child(2),
  html body #wrapper .slide-carousel .pre-heading-text--carousel .field-items > div:nth-child(2),
  html body #wrapper .slide-carousel .pre-heading-text .field-item:nth-child(2),
  html body #wrapper .slide-carousel .pre-heading-text .field-items > div:nth-child(2),
  html body:is(.path-frontpage, .page-service-city) #wrapper .slide-block .owl-item.active
    .field-field-pre-heading-text .field-item:nth-child(2),
  html body:is(.path-frontpage, .page-service-city) #wrapper .slide-block .owl-item.active
    .field-field-pre-heading-text .field-items > div:nth-child(2),
  html body:is(.path-frontpage, .page-service-city) #wrapper .slide-block .owl-item.active
    .pre-heading-text .animate__jello {
    font-size: 2rem !important;
    font-weight: 600 !important;
    letter-spacing: normal !important;
    line-height: 1.25 !important;
    opacity: 0.5 !important;
    margin: 0 !important;
    -webkit-text-stroke: 2px #000000 !important;
    -webkit-text-fill-color: #ffffff !important;
    color: #ffffff !important;
    text-shadow:
      -5px 3px 3px black,
      0 1px 0 black,
      1px 0 0 black,
      -1px 0 0 black,
      0 0 1px black !important;
    top: auto !important;
    position: fixed !important;
    z-index: -1 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    transform: none !important;
  }
}

/* -------------------------------------------------------------------------- */
/* Kill legacy custom margin-left forks on the same selector                   */
/* (custom-*.css: -45rem / 4rem / 3rem / -1rem) — late file loads after       */
/* -------------------------------------------------------------------------- */
html body #wrapper
  .field.field-field-pre-heading-text.field-type-string.field-label-hidden.field-items
  div:nth-child(2),
html body #wrapper
  .field.field-field-pre-heading-text.field-type-string.field-label-hidden.field-items
  .field-item:nth-child(2) {
  margin-left: -0.5rem !important;
}

@media (max-width: 767.98px) {
  html body #wrapper
    .field.field-field-pre-heading-text.field-type-string.field-label-hidden.field-items
    div:nth-child(2),
  html body #wrapper
    .field.field-field-pre-heading-text.field-type-string.field-label-hidden.field-items
    .field-item:nth-child(2) {
    margin-left: 0 !important;
  }
}

/* assets/css/slide-additional-nav-sot.css */
/**
 * Johnny Detail — slide-additional Previous/Next
 * Geometry = Cyberlytics.dev SoT (slide-additional-content.css §3 + mobile §16)
 * Color = JD purple/gold (not green)
 *
 * SPEC ONLY — Critiquito does not apply. Requires MARKUP.md Twig restore first.
 */

/* Tokens (JD brand) */
html body .node--type-slide,
html body .slide-carousel .node--type-slide {
  --jd-nav-deep: #3b0a5c;
  --jd-nav-mid: #6716aa;
  --jd-nav-bright: #8d3bd1;
  --jd-nav-hot: #a855f7;
  --jd-nav-ink: #1a0a24;
  --jd-nav-gold: #f2b84b;
  --jd-nav-radius-bar: 24px;
}

/* Hide on standalone slide pages */
html body .node--type-slide .slide-additional-nav {
  display: none !important;
}

/* Bar: top of additional content, space-between */
html body .slide-carousel .node--type-slide .slide-additional-nav,
html body .hero.slide-carousel .node--type-slide .slide-additional-nav,
html body .slide-carousel .slide-additional-content > .slide-additional-nav,
html body .slide-carousel .slide-additional-content--bleed > .slide-additional-nav {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  width: 100% !important;
  max-width: 100% !important;
  gap: 0.85rem !important;
  margin: 0 !important;
  padding: 0.95rem clamp(1rem, 2.5vw, 1.4rem) !important;
  background: #ffffff !important;
  border: 0 !important;
  border-radius: var(--jd-nav-radius-bar) var(--jd-nav-radius-bar) 0 0 !important;
  box-sizing: border-box !important;
  position: relative !important;
  z-index: 5 !important;
  pointer-events: auto !important;
}

/* Shared pill button — CYB size/hit target, JD purple */
html body .slide-carousel .slide-additional-nav__btn,
html body .hero.slide-carousel .slide-additional-nav__btn {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.55rem !important;
  min-width: 132px !important;
  min-height: 46px !important;
  margin: 0 !important;
  padding: 0.66rem 1rem !important;
  overflow: hidden !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  background: linear-gradient(
    180deg,
    var(--jd-nav-bright) 0%,
    var(--jd-nav-mid) 52%,
    var(--jd-nav-deep) 100%
  ) !important;
  border: 2px solid var(--jd-nav-ink) !important;
  border-radius: 999px !important;
  box-shadow:
    0 4px 0 var(--jd-nav-ink),
    0 10px 22px rgba(59, 10, 92, 0.28),
    inset 0 1px 0 rgba(255, 255, 255, 0.24) !important;
  font-family: "Plus Jakarta Sans", "Segoe UI", Roboto, Helvetica, Arial, sans-serif !important;
  font-size: 0.86rem !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  letter-spacing: 0.01em !important;
  text-transform: none !important;
  text-decoration: none !important;
  cursor: pointer !important;
  transition:
    transform 150ms ease,
    box-shadow 150ms ease,
    background 150ms ease,
    border-color 150ms ease !important;
}

html body .slide-carousel .slide-additional-nav__prev,
html body .hero.slide-carousel .slide-additional-nav__prev {
  justify-content: flex-start !important;
  padding-left: 0.72rem !important;
  padding-right: 1.05rem !important;
}

html body .slide-carousel .slide-additional-nav__next,
html body .hero.slide-carousel .slide-additional-nav__next {
  justify-content: flex-end !important;
  padding-left: 1.05rem !important;
  padding-right: 0.72rem !important;
}

/* Circular arrow medallion */
html body .slide-carousel .slide-additional-nav__icon,
html body .hero.slide-carousel .slide-additional-nav__icon {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 30px !important;
  width: 30px !important;
  height: 30px !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  background: rgba(255, 255, 255, 0.13) !important;
  border: 1px solid rgba(255, 255, 255, 0.38) !important;
  border-radius: 50% !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.16) !important;
  font-size: 1.55rem !important;
  font-weight: 500 !important;
  line-height: 1 !important;
}

html body .slide-carousel .slide-additional-nav__label,
html body .hero.slide-carousel .slide-additional-nav__label {
  display: inline-block !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-size: 0.86rem !important;
  font-weight: 800 !important;
  line-height: 1 !important;
}

/* Gloss sweep */
html body .slide-carousel .slide-additional-nav__btn::after,
html body .hero.slide-carousel .slide-additional-nav__btn::after {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: -65% !important;
  width: 48% !important;
  height: 100% !important;
  pointer-events: none !important;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(255, 255, 255, 0.18),
    transparent
  ) !important;
  transform: skewX(-18deg) !important;
  transition: left 320ms ease !important;
}

/* Hover */
html body .slide-carousel .slide-additional-nav__btn:hover,
html body .hero.slide-carousel .slide-additional-nav__btn:hover {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  background: linear-gradient(
    180deg,
    var(--jd-nav-hot) 0%,
    var(--jd-nav-bright) 52%,
    var(--jd-nav-mid) 100%
  ) !important;
  border-color: var(--jd-nav-ink) !important;
  box-shadow:
    0 5px 0 var(--jd-nav-ink),
    0 14px 28px rgba(59, 10, 92, 0.34),
    inset 0 1px 0 rgba(255, 255, 255, 0.28) !important;
  transform: translateY(-2px) !important;
}

html body .slide-carousel .slide-additional-nav__btn:hover::after,
html body .hero.slide-carousel .slide-additional-nav__btn:hover::after {
  left: 120% !important;
}

/* Active / pressed */
html body .slide-carousel .slide-additional-nav__btn:active,
html body .hero.slide-carousel .slide-additional-nav__btn:active {
  box-shadow:
    0 2px 0 var(--jd-nav-ink),
    0 7px 15px rgba(59, 10, 92, 0.24),
    inset 0 1px 0 rgba(255, 255, 255, 0.18) !important;
  transform: translateY(1px) !important;
}

/* Focus — JD gold (same token CYB already uses) */
html body .slide-carousel .slide-additional-nav__btn:focus-visible,
html body .hero.slide-carousel .slide-additional-nav__btn:focus-visible {
  outline: 3px solid var(--jd-nav-gold) !important;
  outline-offset: 4px !important;
}

/* Disabled */
html body .slide-carousel .slide-additional-nav__btn:disabled,
html body .hero.slide-carousel .slide-additional-nav__btn:disabled {
  opacity: 0.48 !important;
  cursor: not-allowed !important;
  box-shadow: 0 2px 0 rgba(26, 10, 36, 0.65) !important;
  transform: none !important;
}

/* Hide legacy Owl on-image arrows */
html body .slide-carousel .owl-nav,
html body .slide-carousel .owl-nav button,
html body .slide-carousel .owl-prev,
html body .slide-carousel .owl-next {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

/* Mobile ≤767.98 — match CYB hit targets */
@media (max-width: 767.98px) {
  html body .slide-carousel .node--type-slide .slide-additional-nav,
  html body .hero.slide-carousel .node--type-slide .slide-additional-nav,
  html body .slide-carousel .slide-additional-content > .slide-additional-nav,
  html body .slide-carousel .slide-additional-content--bleed > .slide-additional-nav {
    gap: 0.55rem !important;
    padding: 0.72rem 0.78rem !important;
  }

  html body .slide-carousel .slide-additional-nav__btn,
  html body .hero.slide-carousel .slide-additional-nav__btn {
    /* DELETED width-v2: flex: 1 1 0 !important; */
    /* DELETED width-v2: width: calc(50% - 0.275rem) !important; */
    min-width: 0 !important;
    min-height: 44px !important; /* ≥44px hit target */
    padding: 0.55rem 0.62rem !important;
    border-radius: 999px !important;
  }

  html body .slide-carousel .slide-additional-nav__icon,
  html body .hero.slide-carousel .slide-additional-nav__icon {
    flex-basis: 28px !important;
    width: 28px !important;
    height: 28px !important;
    font-size: 1.4rem !important;
  }

  html body .slide-carousel .slide-additional-nav__label,
  html body .hero.slide-carousel .slide-additional-nav__label {
    font-size: 0.78rem !important;
  }
}

/**
 * Engineer notes:
 * 1) Neutralize older JD martis-custom / late rules that use flat #6716aa/#3b0a5c,
 *    smaller min-height 2.5rem, city-page white/8px-radius forks, and ≤576 compact
 *    circular overrides — load this later or delete those forks for carousel nav.
 * 2) Do not keep green leftovers if any custom sheet still paints emerald on these
 *    selectors.
 * 3) Wire buttons to existing carousel prev/next JS (CYB script.js pattern).
 */

/**
 * Johnny Detail — mobile-only corrective overrides for slide-additional nav.
 * Load AFTER late forks / library. Purple fill + CYB §16 geometry.
 * SPEC ONLY — Critiquito does not apply.
 */

/* Kill frontpage white/8px chip treatment */
html body.path-frontpage .slide-carousel .slide-additional-nav__btn,
html body.path-frontpage .hero.slide-carousel .slide-additional-nav__btn {
  background: linear-gradient(
    180deg,
    #8d3bd1 0%,
    #6716aa 52%,
    #3b0a5c 100%
  ) !important;
  background-color: transparent !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border: 2px solid #1a0a24 !important;
  border-radius: 999px !important;
  font-weight: 800 !important;
}

/* Kill ≤576 compact square treatment */
@media (max-width: 576px) {
  html body .slide-carousel .slide-additional-nav__btn,
  html body .hero.slide-carousel .slide-additional-nav__btn {
    min-width: 0 !important;
    min-height: 44px !important;
    /* DELETED width-v2: width: calc(50% - 0.275rem) !important; */
    /* DELETED width-v2: flex: 1 1 0 !important; */
    padding: 0.55rem 0.62rem !important;
    gap: 0.55rem !important;
    border-radius: 999px !important;
  }
}

@media (max-width: 767.98px) {
  html body .slide-carousel .slide-additional-nav__btn,
  html body .hero.slide-carousel .slide-additional-nav__btn,
  html body .slide-carousel .slide-additional-nav__label,
  html body .hero.slide-carousel .slide-additional-nav__label {
    white-space: nowrap !important;
  }
}

/* City taxonomy / service city — same kill as frontpage white chip */
html body:is(.path-taxonomy, .page-service-city) .slide-carousel .slide-additional-nav__btn,
html body:is(.path-taxonomy, .page-service-city) .hero.slide-carousel .slide-additional-nav__btn {
  background: linear-gradient(180deg, #8d3bd1 0%, #6716aa 52%, #3b0a5c 100%) !important;
  background-color: transparent !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border: 2px solid #1a0a24 !important;
  border-radius: 999px !important;
  font-weight: 800 !important;
}

/* Re-assert §16 mobile half-width pills for frontpage + city */
@media (max-width: 767.98px) {
  html body:is(.path-frontpage, .path-taxonomy, .page-service-city) .slide-carousel .slide-additional-nav,
  html body:is(.path-frontpage, .path-taxonomy, .page-service-city) .hero.slide-carousel .slide-additional-nav {
    gap: 0.55rem !important;
    padding: 0.72rem 0.78rem !important;
  }
  html body:is(.path-frontpage, .path-taxonomy, .page-service-city) .slide-carousel .slide-additional-nav__btn,
  html body:is(.path-frontpage, .path-taxonomy, .page-service-city) .hero.slide-carousel .slide-additional-nav__btn {
    /* DELETED width-v2: flex: 1 1 0 !important; */
    /* DELETED width-v2: width: calc(50% - 0.275rem) !important; */
    min-width: 0 !important;
    min-height: 44px !important;
    padding: 0.55rem 0.62rem !important;
    border-radius: 999px !important;
    white-space: nowrap !important;
  }
}

/**
 * Johnny Detail — mobile nav WIDTH v2 (tighter)
 * v1 (10.5rem / 7.5rem / 22.5rem) still filled a 375px phone.
 * Match CYB compact pills (~140px) with a visible center gap.
 * SPEC ONLY.
 */

@media (max-width: 767.98px) {
  html body .slide-carousel .slide-additional-content--bleed > .slide-additional-nav,
  html body .slide-carousel .slide-additional-content > .slide-additional-nav,
  html body .slide-carousel .node--type-slide .slide-additional-nav,
  html body .hero.slide-carousel .node--type-slide .slide-additional-nav {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    width: 100% !important;
    max-width: 21.5rem !important;
    margin-left: auto !important;
    margin-right: auto !important;
    gap: 0.75rem !important;
    padding: 0.72rem 0.94rem !important;
    box-sizing: border-box !important;
  }

  html body .slide-carousel .slide-additional-nav__btn,
  html body .hero.slide-carousel .slide-additional-nav__btn,
  html body.path-frontpage .slide-carousel .slide-additional-nav__btn,
  html body:is(.path-frontpage, .path-taxonomy, .page-service-city)
    .slide-carousel .slide-additional-nav__btn,
  html body:is(.path-frontpage, .path-taxonomy, .page-service-city)
    .hero.slide-carousel .slide-additional-nav__btn {
    flex: 0 0 auto !important;
    flex-grow: 0 !important;
    flex-shrink: 0 !important;
    width: auto !important;
    max-width: 8.75rem !important;
    min-width: 0 !important;
    min-height: 44px !important;
    padding: 0.55rem 0.7rem !important;
    border-radius: 999px !important;
    white-space: nowrap !important;
  }
}

/* assets/css/johnnydetail-account.css */
/* Johnny Detail account pages. Form processing and permissions remain Drupal-owned. */
html body.jda-account-page[class*="path-"] #wrapper {
  --jda-deep: #3b0a5c;
  --jda-purple: #6716aa;
  --jda-accent: #9d4edd;
  --jda-border: #e5d6ef;
  --jda-soft: #faf5ff;
  --jda-text: #30253a;
}
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .jda-account-nav {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  margin: 0 0 1.5rem;
  padding: .75rem;
  border: 1px solid var(--jda-border);
  border-radius: 1rem;
  background: #fff;
}
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .jda-account-nav a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: .65rem 1rem;
  border-radius: .65rem;
  color: var(--jda-deep);
  font-size: 15px;
  font-weight: 700;
  line-height: 1.4;
  text-decoration: none;
}
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .jda-account-nav a:hover,
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .jda-account-nav a[aria-current="page"] {
  background: var(--jda-purple);
  color: #fff;
}
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .jda-profile,
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .jda-account-form,
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .jda-access-denied {
  width: 100%;
  max-width: 1120px;
  min-width: 0;
  margin: 0 auto 2rem;
  border: 1px solid var(--jda-border);
  border-radius: 1.25rem;
  background: #fff;
  box-shadow: 0 8px 30px rgb(59 10 92 / 6%);
  color: var(--jda-text);
  overflow-wrap: anywhere;
}
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .jda-profile__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 1.5rem;
  padding: clamp(1.25rem, 3vw, 2.5rem);
  background: linear-gradient(120deg, #faf5ff, #f3e8ff);
  border-radius: 1.25rem 1.25rem 0 0;
  border-bottom: 1px solid var(--jda-border);
}
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .jda-profile h2 {
  margin: .35rem 0 .5rem;
  color: var(--jda-deep);
  font-size: clamp(1.55rem, 3vw, 2.25rem);
  line-height: 1.2;
}
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .jda-eyebrow {
  color: var(--jda-purple);
  font-size: .75rem;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
  margin: 0;
}
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .jda-profile__since { margin: 0; color: #675570; }
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .jda-profile__actions,
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .jda-access-denied__actions { display: flex; flex-wrap: wrap; gap: .75rem; }
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .jda-button,
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .jda-access-denied__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: .75rem 1.2rem;
  border: 1px solid var(--jda-purple);
  border-radius: .75rem;
  background: var(--jda-purple);
  color: #fff;
  font-weight: 700;
  line-height: 1.4;
  text-decoration: none;
}
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .jda-button--secondary,
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .jda-access-denied__button:not(.jda-access-denied__button--primary) { color: var(--jda-purple); background: #fff; }
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .jda-profile__details,
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .jda-account-form,
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .jda-access-denied__card { padding: clamp(1.25rem, 3vw, 2.5rem); }
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .jda-profile__details h3 { margin: 0 0 1.5rem; color: var(--jda-deep); font-size: 1.25rem; }
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .jda-profile__fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem 2rem; }
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .jda-profile__fields .field { min-width: 0; margin: 0; }
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .jda-profile__fields .field__label { color: #675570; font-size: .8rem; font-weight: 700; margin-bottom: .35rem; }
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .jda-profile__fields img { max-width: 120px; height: auto; border-radius: .75rem; }
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .auth-user-form { max-width: none; padding: 0; margin: 0; background: transparent; box-shadow: none; }
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .auth-user-form .form-header:empty,
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .auth-user-form--footer:empty { display: none; }
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .jda-account-form .description { color: #675570; font-size: .875rem; line-height: 1.5; margin-top: .4rem; }
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper :is(.jda-account-nav, .jda-profile, .jda-account-form) :focus-visible:not(.vehicle-capture-react-shell *),
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .jda-account-form :focus-visible:not(.vehicle-capture-react-shell *),
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .jda-access-denied :focus-visible { outline: 3px solid var(--jda-accent); outline-offset: 3px; }
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .jda-account-form .password-strength,
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .jda-account-form .password-confirm { width: 100%; max-width: 100%; }
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .tfa-qr-code img { max-width: min(100%, 280px); height: auto; }
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .tfa-secret-key { font-family: monospace; letter-spacing: .1em; }
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .tfa-copy-secret { margin: .5rem 0; min-height: 44px; padding: .5rem 1rem; border: 1px solid var(--jda-purple); border-radius: .5rem; background: #fff; color: var(--jda-purple); }
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .jda-access-denied__mark { color: var(--jda-purple); font-size: 2rem; font-weight: 800; }
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .jda-access-denied h2 { color: var(--jda-deep); font-size: clamp(1.4rem, 3vw, 2rem); }
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .jda-access-denied__help { margin-top: 1.5rem; }
@media (max-width: 600px) {
  html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .jda-profile__fields { grid-template-columns: minmax(0, 1fr); }
  html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .jda-profile__actions { width: 100%; }
  html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .jda-profile__actions a { flex: 1 1 100%; }
  html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .jda-account-nav { padding: .5rem; gap: .25rem; }
  html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .jda-account-nav a { padding: .55rem .7rem; font-size: 14px; }
}

/* Override old generic /user paragraph cards only inside the new account UI. */
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper :is(.jda-profile, .jda-access-denied) p {
  background: transparent !important; border: 0 !important; box-shadow: none !important;
  padding: 0 !important; color: var(--jda-text); border-radius: 0;
}
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper :is(.jda-profile, .jda-access-denied) :is(h2,h3) {
  display: block !important; visibility: visible; background: none; color: var(--jda-deep);
}
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .jda-account-form select.chosen-original-select { width: 1px !important; max-width: 1px !important; min-width: 0 !important; }
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .jda-page-title {
  display: block !important; margin: 0 0 1.2rem; color: #3b0a5c !important;
  font-size: clamp(1.5rem, 3vw, 2.2rem); line-height: 1.2;
}
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .block-page-title-block { display: none; }
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .jda-profile__header { border: 0 !important; border-bottom: 1px solid #e5d6ef !important; }
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .jda-profile__header p,
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .jda-access-denied p { color: #594764 !important; background: none !important; border: 0 !important; padding: 0 !important; text-shadow: none !important; }
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .jda-profile__header .jda-eyebrow { color: #6716aa !important; }
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .jda-account-status {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .35rem .75rem;
  margin: 0 0 1.25rem;
  padding: .9rem 1rem;
  border: 1px solid #e5d6ef;
  border-radius: .8rem;
  background: #faf5ff;
  color: #3b0a5c;
}
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .jda-account-status strong { color: #3b0a5c; }
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .jda-account-status span { color: #594764; }
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .jda-account-status a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  margin-left: auto;
  color: #6716aa;
  font-weight: 700;
}
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jd-security-status {
  margin: 0 0 1rem;
  padding: .9rem 1rem;
  border: 1px solid #e5d6ef;
  border-radius: .8rem;
  background: #faf5ff;
  color: #3b0a5c;
  font-weight: 700;
}
@media (max-width: 767px) {
  html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .jda-account-status a { margin-left: 0; }
}
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .jda-profile__label { display: block; margin-bottom: .4rem; color: #675570; font-size: .85rem; font-weight: 700; }
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .jda-access-denied h1 { display: block !important; color: #3b0a5c; font-size: clamp(1.5rem, 3vw, 2rem); }
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .main-content .region-content table { max-width: 100%; border-collapse: collapse; border: 1px solid #e5d6ef; background: #fff; }
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .main-content .region-content :is(th,td) { padding: .85rem; text-align: left; overflow-wrap: anywhere; }
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .main-content .region-content th { background: #f3e8ff; color: #3b0a5c; }
@media (max-width: 600px) {
  html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .main-content .region-content table { display: block; overflow-x: auto; }
}
/* Gin's desktop navigation reduces the available canvas; avoid 100vw bleed. */
html body.gin--navigation.path-user #wrapper #content-wide-top #block-breadcrumbs,
html body.gin--navigation.path-dashboard #wrapper #content-wide-top #block-breadcrumbs {
  left: auto !important; margin-left: 0 !important; width: 100% !important;
  min-width: 0 !important; max-width: 100% !important;
}
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .jda-account-form p:not(.vehicle-capture-react-shell *) {
  background: transparent !important; border: 0 !important; border-radius: 0 !important;
  padding: 0 !important; color: #594764 !important; line-height: 1.6;
}
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .jda-tfa-form { max-width: 800px; }
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .jda-tfa-form :is(h2,h3) { font-size: 1.3rem; line-height: 1.4; }
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .jda-account-form { display: flow-root; }
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .jda-account-form .form-item:has(> .shwpd) { position: relative; }
html body.jda-account-page[class*="path-"] #wrapper #page-wrapper .jda-account-form .shwpd { position: absolute; top: 2rem; right: .5rem; float: none; margin: 0; width: 36px; height: 36px; background-position: center; }

/* Outer account/dashboard geometry belongs to dashboard-account-audit.css. */
html body.path-user.jda-account-workspace #wrapper #page-wrapper :is(.jda-profile,.jda-account-form) { max-width: 1440px; }
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-tfa-form { max-width: 800px; }
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-profile__identity { display: flex; align-items: center; gap: 1rem; min-width: 0; flex: 1 1 260px; }
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-profile__name { min-width: 0; }
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-profile__avatar {
  display: flex; align-items: center; justify-content: center; flex: 0 0 80px;
  width: 80px; height: 80px; overflow: hidden; border-radius: 50%;
  background: #6716aa; color: #fff; font-size: 1.6rem; font-weight: 750;
}
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-profile__avatar :is(.field,.field__item) { margin: 0; padding: 0; width: 100%; height: 100%; }
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-profile__avatar img { display: block; width: 100%; height: 100%; object-fit: cover; border-radius: 50%; }
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-profile__vehicles { padding: clamp(1.25rem,3vw,2.5rem); border-top: 1px solid #e5d6ef; scroll-margin-top: 8rem; }
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-vehicles__heading { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 1rem; margin-bottom: 1.25rem; }
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-vehicles__heading h3 { margin: 0; font-size: 1.25rem; }
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-vehicles__grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1.25rem; }
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-vehicle { min-width: 0; border: 1px solid #e5d6ef; border-radius: 1rem; overflow: hidden; background: #fff; }
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-vehicle__photo { display: block; width: 100%; aspect-ratio: 16/10; object-fit: cover; }
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-vehicle__body { padding: 1.25rem; }
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-vehicle h4 { margin: 0 0 .7rem; font-size: 1.15rem; line-height: 1.4; }
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-vehicle a { color: #6716aa; }
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-vehicle__type { display: inline-block; margin-bottom: .75rem; padding: .25rem .6rem; background: #f3e8ff; color: #3b0a5c; border-radius: .5rem; font-size: .85rem; }
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-vehicle__actions { display: flex; flex-wrap: wrap; gap: .5rem 1rem; margin-top: .75rem; }
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-vehicle__actions a { display: inline-flex; align-items: center; min-height: 44px; font-weight: 700; }
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-vehicles__archived { margin-top: 1.25rem; padding: 1rem; border: 1px solid #e5d6ef; border-radius: .75rem; }
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-vehicles__archived summary { cursor: pointer; color: #3b0a5c; font-weight: 700; }
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-vehicles__archived li { padding-block: .5rem; }
@media (max-width: 1100px) {
  html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-vehicles__grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 767px) {
  html body.path-user.jda-account-workspace #wrapper #page-wrapper :is(.jda-profile__header,.jda-profile__details,.jda-profile__vehicles,.jda-account-form) { padding: 1rem; }
  html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-profile__avatar { width: 64px; height: 64px; flex-basis: 64px; font-size: 1.3rem; }
  html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-profile__identity { gap: .75rem; flex-basis: 100%; }
  html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-profile__name h2 { font-size: 1.45rem; }
  html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-account-nav { padding: .5rem; gap: .25rem; }
  html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-account-nav a { padding-inline: .65rem; }
}
@media (max-width: 639px) {
  html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-vehicles__grid { grid-template-columns: minmax(0,1fr); }
}
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-profile__vehicles p { color: #594764 !important; line-height: 1.5; margin: .5rem 0 .75rem; }

/* Keep personal account values and guidance readable at phone widths. */
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-profile__address {
  display: block !important;
  visibility: visible !important;
  min-width: 0;
  margin: 0;
  font-style: normal;
  line-height: 1.6;
  word-break: normal;
  overflow-wrap: break-word;
}
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-profile__address > div {
  display: block !important;
  color: #30253a !important;
}
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-profile__text-action {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: .65rem .8rem;
  color: #6716aa !important;
  font-weight: 700;
  line-height: 1.4;
  text-decoration: underline;
  text-underline-offset: .15em;
}
html body.path-user.jda-account-workspace #wrapper #page-wrapper #email-preferences {
  padding: 1.25rem;
  background: #faf5ff;
  border: 1px solid #e5d6ef;
  border-radius: 1rem;
  color: #30253a;
  scroll-margin-top: 8rem;
}
html body.path-user.jda-account-workspace #wrapper #page-wrapper #email-preferences :is(.jdd-preferences-intro, .jdd-preferences-intro p),
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-account-form .description {
  display: block !important;
  max-height: none !important;
  overflow: visible !important;
  color: #594764 !important;
  -webkit-line-clamp: unset !important;
  line-clamp: unset !important;
  white-space: normal !important;
  text-overflow: clip !important;
  font-size: .9375rem;
  line-height: 1.6;
  text-shadow: none !important;
}
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-account-close {
  margin-top: 2rem;
  padding-top: 1.25rem;
  border-top: 1px solid #e5d6ef;
}
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-account-cancel {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: .6rem .75rem;
  color: #8b2538 !important;
  background: transparent;
  font-weight: 600;
}
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-empty-state {
  margin-block: 1.25rem;
  padding: 1.25rem;
  border: 1px solid #e5d6ef;
  border-radius: 1rem;
  background: #faf5ff;
  color: #30253a;
}
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-empty-state p {
  color: #594764 !important;
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
  line-height: 1.6;
}
html body.path-user.jda-account-page:not(.jda-account-builder) #wrapper #page-wrapper .main-content .contextual {
  display: none !important;
}
@media (max-width: 767px) {
  html body.path-user.jda-account-workspace #wrapper #page-wrapper #email-preferences { padding: 1rem; }
  html body.path-user.jda-account-workspace #wrapper #page-wrapper #email-preferences .form-actions > .button {
    width: 100%;
    min-height: 44px;
  }
  html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-profile__field {
    min-width: 0;
    word-break: normal;
    overflow-wrap: break-word;
  }
}

/* Account content uses the existing public chrome and purple workspace palette. */
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-summary {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 210px), 1fr));
  gap: 1rem;
  padding: 1.5rem clamp(1.25rem, 3vw, 2.5rem);
}
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-summary__card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  min-width: 0;
  padding: 1.15rem;
  border: 1px solid #e5d6ef;
  border-radius: 1rem;
  background: linear-gradient(145deg, #faf5ff, #fff);
}
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-summary__label {
  color: #594764;
  font-size: .9rem;
  font-weight: 700;
}
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-summary__value {
  color: #3b0a5c;
  font-size: 2.5rem;
  line-height: 1.15;
  margin-block: .55rem;
  font-variant-numeric: tabular-nums;
}
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-summary__card a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  color: #6716aa;
  font-size: .875rem;
  line-height: 1.45;
  text-decoration: underline;
  text-underline-offset: .15em;
}
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-summary__hint { color: #594764; font-size: .875rem; line-height: 1.5; }
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-next-service {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 1rem;
  margin-inline: clamp(1.25rem, 3vw, 2.5rem);
  padding: 1.25rem;
  border: 1px solid #e5d6ef;
  border-left: 4px solid #6716aa;
  border-radius: 1rem;
  background: #faf5ff;
}
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-next-service h3 { margin: .4rem 0 .55rem; font-size: 1.2rem; }
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-next-service p {
  margin: 0;
  line-height: 1.5;
  background: none !important;
  border: 0 !important;
  padding: 0 !important;
  box-shadow: none !important;
  color: #594764 !important;
  text-shadow: none !important;
}
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-next-service .jda-eyebrow { color: #6716aa !important; }
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-quick-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem .6rem;
  padding: 1rem clamp(1.25rem, 3vw, 2.5rem);
  border-bottom: 1px solid #e5d6ef;
}
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-quick-actions a {
  padding-inline: .8rem;
  background: #faf5ff;
  border: 1px solid #e5d6ef;
  border-radius: .65rem;
  text-decoration: none;
}
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-quick-actions a:hover { background: #f3e8ff; }
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-profile__content {
  display: grid;
  gap: 1.5rem;
  padding: clamp(1.25rem, 3vw, 2.5rem);
}
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-profile__content .jda-profile__details { min-width: 0; padding: 0; }
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-profile__content #email-preferences { align-self: start; min-width: 0; margin: 0; }
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-profile__fields { gap: 1.25rem; }
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-profile__field { padding-bottom: .8rem; border-bottom: 1px solid #eee4f3; }
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-vehicle-workspace {
  width: 100%;
  box-sizing: border-box;
  border: 1px solid #e5d6ef;
  border-radius: 1.25rem;
  background: #fff;
  box-shadow: 0 8px 30px rgb(59 10 92 / 6%);
  margin-bottom: 2rem;
}
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-vehicles__heading h2 { display: block; margin: 0 0 .4rem; color: #3b0a5c; font-size: 1.5rem; line-height: 1.3; }
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-vehicle h3 { display: block; margin: 0 0 .7rem; font-size: 1.2rem; line-height: 1.4; }
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-vehicle__placeholder {
  display: grid;
  place-items: center;
  box-sizing: border-box;
  min-height: 88px;
  padding: 1rem;
  gap: .25rem;
  color: #6716aa;
  background: linear-gradient(145deg, #f3e8ff, #faf5ff);
  font-size: 1rem;
  font-weight: 600;
}
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-vehicle__placeholder span:last-child { font-size: .875rem; font-weight: 400; }
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-vehicle__care { margin: 1rem 0; padding-top: .75rem; border-top: 1px solid #e5d6ef; }
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-vehicle__care > div + div { margin-top: .75rem; }
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-vehicle__care dt { color: #594764; font-size: .8rem; font-weight: 700; }
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-vehicle__care dd { margin: .2rem 0 0; color: #30253a; font-size: .9rem; line-height: 1.5; }
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-vehicle__care a { display: inline-flex; align-items: center; min-height: 44px; }
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-vehicles__archived summary { min-height: 44px; }
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-payments { display: grid; gap: 1.5rem; margin-bottom: 2rem; }
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-billing-nav { display: flex; flex-wrap: wrap; gap: .5rem; }
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-billing-nav a { display: inline-flex; align-items: center; min-height: 44px; padding: .5rem 1rem; border: 1px solid #e5d6ef; border-radius: .6rem; color: #6716aa; }
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-billing-nav a.is-active { background: #6716aa; color: #fff; }
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-billing-nav a:focus-visible { outline: 3px solid #6716aa; outline-offset: 3px; }
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-payment-panel {
  min-width: 0;
  padding: clamp(1rem, 3vw, 2rem);
  background: #fff;
  border: 1px solid #e5d6ef;
  border-radius: 1.25rem;
  box-shadow: 0 8px 30px rgb(59 10 92 / 6%);
  scroll-margin-top: 9rem;
}
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-payment-panel > h2 { display: block !important; margin: 0 0 .6rem; color: #3b0a5c; font-size: 1.4rem; }
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-payment-panel > p {
  margin: 0 0 1.25rem;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: #594764 !important;
  line-height: 1.6;
}
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-financial-filters {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1rem;
  padding: 1rem;
  margin-block: 1rem 1.25rem;
  background: #faf5ff;
  border: 1px solid #e5d6ef;
  border-radius: .8rem;
}
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-financial-filters .form-item { min-width: 0; margin: 0; }
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-financial-filters .form--inline {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1rem;
  min-width: 0;
}
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-financial-filters .form--inline::before,
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-financial-filters .form--inline::after { display: none; }
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-filter-reset { display: inline-flex; align-items: center; min-height: 44px; padding: .5rem .75rem; color: #6716aa; font-weight: 700; }
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-financial-count {
  color: #594764 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  text-shadow: none !important;
  font-size: .9rem;
  font-weight: 700;
  margin-block: .75rem;
}
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-order-number { font-weight: 750; color: #3b0a5c; }
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-order-checkout { display: inline-flex; align-items: center; min-height: 44px; margin-left: .5rem; padding: .5rem .65rem; border-radius: .5rem; color: #6716aa; background: #faf5ff; font-size: .85rem; font-weight: 700; }
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-account-form--customer:not(.jda-auth-form) { max-width: 1120px; }
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-tfa-form .jd-security-password { background: #faf5ff; }
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-tfa-form details {
  min-width: 0;
  margin-block: 1rem;
  border: 1px solid #e5d6ef;
  border-radius: .8rem;
  background: #fff;
  overflow: hidden;
}
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-tfa-form details > summary { min-height: 48px; padding: .85rem 1rem; color: #3b0a5c; font-weight: 700; background: #faf5ff; cursor: pointer; }
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-tfa-form details > .details-wrapper { padding: 1rem; }
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-tfa-form .jd-security-password .fieldset-wrapper > a { display: inline-flex; align-items: center; min-height: 44px; margin-left: .75rem; color: #6716aa; }
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-tfa-form .password-parent { width: 100%; }
html body.path-user.jda-account-workspace #wrapper #page-wrapper :is(.jda-payments, .jda-vehicle-workspace, .jda-quick-actions) :focus-visible { outline: 3px solid #9d4edd; outline-offset: 3px; }
@media (min-width: 992px) {
  html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-profile__content:has(#email-preferences) { grid-template-columns: 1.2fr 1fr; }
}
@media (max-width: 767px) {
  html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 1rem; gap: .75rem; }
  html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-summary__card { padding: .85rem; }
  html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-summary__value { font-size: 2rem; }
  html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-summary__card a { font-size: .8rem; }
  html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-next-service { margin-inline: 1rem; padding: 1rem; }
  html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-next-service .jda-button { width: 100%; }
  html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-quick-actions { padding: 1rem; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-quick-actions a { justify-content: center; padding: .6rem; text-align: center; font-size: .875rem; }
  html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-profile__content { padding: 1rem; }
  html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-vehicles__heading > .jda-button { width: 100%; }
  html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-tfa-form .jd-security-password .fieldset-wrapper > .button { width: 100%; }
  html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-tfa-form .jd-security-password .fieldset-wrapper > a { margin: .75rem 0 0; }
  html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-financial-filters,
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-financial-filters .form--inline { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .85rem; }
  html body.path-user.jda-account-workspace #wrapper #page-wrapper .main-content .region-content table.jda-financial-table {
    display: block;
    width: 100%;
    border: 0;
    background: transparent;
    overflow: visible;
  }
  html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-financial-table thead {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    clip-path: inset(50%);
    white-space: nowrap;
  }
  html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-financial-table thead:focus-within {
    display: block;
    position: static;
    width: 100%;
    height: auto;
    overflow: visible;
    clip: auto;
    clip-path: none;
    white-space: normal;
  }
  html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-financial-table thead:focus-within tr { display: flex; flex-wrap: wrap; width: 100%; }
  html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-financial-table thead:focus-within th { display: block; flex: 1 1 50%; min-width: 0; box-sizing: border-box; padding: .4rem .6rem; }
  html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-financial-table thead a { display: inline-flex; align-items: center; min-height: 44px; max-width: 100%; overflow-wrap: anywhere; }
  html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-financial-table tbody { display: block; width: 100%; }
  html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-financial-table tbody tr {
    display: block;
    width: 100%;
    box-sizing: border-box;
    padding: .3rem 1rem;
    margin-bottom: .85rem;
    border: 1px solid #e5d6ef;
    border-radius: .8rem;
    background: #fff;
  }
  html body.path-user.jda-account-workspace #wrapper #page-wrapper .main-content .region-content .jda-financial-table tbody td {
    display: grid;
    grid-template-columns: minmax(80px, 34%) minmax(0, 1fr);
    gap: .75rem;
    width: 100%;
    box-sizing: border-box;
    padding: .75rem 0;
    border: 0;
    border-bottom: 1px solid #eee4f3;
    color: #30253a;
    font-size: .9375rem;
    line-height: 1.5;
    overflow-wrap: break-word;
    word-break: normal;
  }
  html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-financial-table tbody td:last-child { border-bottom: 0; }
  html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-financial-table tbody td::before { content: attr(data-label); color: #594764; font-size: .8rem; font-weight: 700; }
  html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-financial-table tbody td > * { min-width: 0; }
  html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-financial-table .jda-order-checkout { margin-left: 0; }
}
@media (max-width: 479px) {
  html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-financial-filters,
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-financial-filters .form--inline { grid-template-columns: minmax(0, 1fr); }
}

/* Account-owned address guidance must retain readable native paragraph copy. */
html body.jda-account-page.path-user #wrapper #page-wrapper p.jda-address-guidance {
  color: #241438 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  text-shadow: none !important;
}

/* assets/css/address-suggestions.css */
/* Shared by Gin signup and Martis account/address forms. */
:is(html body.path-user #wrapper, html body.jda-account-page, html body.page-user-register) [data-jd-address] .form-item {
  position: relative;
}
:is(html body.path-user #wrapper, html body.jda-account-page, html body.page-user-register) .jd-address-suggestions {
  position: absolute;
  z-index: 20;
  left: 0;
  right: 0;
  max-height: 16rem;
  overflow-y: auto;
  margin: 0.25rem 0 0;
  padding: 0.3rem;
  list-style: none;
  color: #241438;
  background: #fff;
  border: 1px solid #d9c9e6;
  border-radius: 0.65rem;
  box-shadow: 0 0.5rem 1.5rem #24143824;
}
:is(html body.path-user #wrapper, html body.jda-account-page, html body.page-user-register) .jd-address-suggestions[hidden] { display: none; }
:is(html body.path-user #wrapper, html body.jda-account-page, html body.page-user-register) .jd-address-suggestions [role="option"] {
  padding: 0.75rem;
  border-radius: 0.35rem;
  cursor: pointer;
  line-height: 1.4;
}
:is(html body.path-user #wrapper, html body.jda-account-page, html body.page-user-register) .jd-address-suggestions [aria-selected="true"],
:is(html body.path-user #wrapper, html body.jda-account-page, html body.page-user-register) .jd-address-suggestions [role="option"]:hover { background: #f3e8ff; }
:is(html body.path-user #wrapper, html body.jda-account-page, html body.page-user-register) .jd-address-credit { display: block; margin-top: 0.4rem; font-size: 0.8rem; }

/* assets/css/registration-sections.css */
/* Gin renders registration without Martis's #wrapper. Keep this route-specific. */
html body.path-user.jda-account-route--userregister #user-register-form {
  --jd-section-space: 1.25rem;
  --jd-section-radius: 1rem;
  --jd-section-border: #dcc7eb;
}

html body.path-user.jda-account-route--userregister #user-register-form *,
html body.path-user.jda-account-route--userregister #user-register-form *::before,
html body.path-user.jda-account-route--userregister #user-register-form *::after {
  box-sizing: border-box;
}

html body.path-user.jda-account-route--userregister #user-register-form :is(.jda-account-section, .field--type-address fieldset, .field--name-field-profile-picture details, .jdd-registration-vehicles, .jdd-registration-vehicle, [data-drupal-selector="edit-legal"]) {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  margin: 0 0 1.25rem;
  padding: 0;
  border: 1px solid var(--jd-section-border);
  border-radius: var(--jd-section-radius);
  background: #faf5ff;
  box-shadow: 0 3px 12px #3b0a5c08;
  transition: border-color 180ms ease, box-shadow 180ms ease;
}

/* Nested sections remain distinct without multiplying the outer gutters. */
html body.path-user.jda-account-route--userregister #user-register-form :is(.field--type-address fieldset, .field--name-field-profile-picture details, .jdd-registration-vehicle) {
  --jd-section-space: 1rem;
  --jd-section-radius: .75rem;
  background: #fff;
}

html body.path-user.jda-account-route--userregister #user-register-form :is(.jda-account-section, .field--type-address fieldset, .jdd-registration-vehicle) > legend {
  display: contents;
  float: none;
  margin: 0;
  padding: 0;
}

html body.path-user.jda-account-route--userregister #user-register-form :is(.jda-account-section, .field--type-address fieldset, .jdd-registration-vehicle) > legend > .fieldset__label,
html body.path-user.jda-account-route--userregister #user-register-form :is(.field--name-field-profile-picture details, .jdd-registration-vehicles, [data-drupal-selector="edit-legal"]) > summary {
  display: block;
  width: 100%;
  margin: 0 !important;
  padding: 1rem var(--jd-section-space) !important;
  border: 0;
  border-radius: calc(var(--jd-section-radius) - 1px) calc(var(--jd-section-radius) - 1px) 0 0;
  background: linear-gradient(110deg, #f3e8ff, #faf5ff);
  color: #3b0a5c;
  font-size: 1.125rem;
  font-weight: 750;
  line-height: 1.45;
  overflow-wrap: anywhere;
}

html body.path-user.jda-account-route--userregister #user-register-form :is(.field--name-field-profile-picture details, .jdd-registration-vehicles, [data-drupal-selector="edit-legal"]) > summary {
  padding-left: calc(var(--jd-section-space) + 1.5rem) !important;
  min-height: 3rem;
}

html body.path-user.jda-account-route--userregister #user-register-form :is(.field--name-field-profile-picture details, .jdd-registration-vehicles, [data-drupal-selector="edit-legal"]):not([open]) > summary {
  border-radius: calc(var(--jd-section-radius) - 1px);
}

html body.path-user.jda-account-route--userregister #user-register-form :is(.field--name-field-profile-picture details, .jdd-registration-vehicles, [data-drupal-selector="edit-legal"]) > summary::before {
  left: var(--jd-section-space);
  inset-inline-start: var(--jd-section-space);
}

html body.path-user.jda-account-route--userregister #user-register-form :is(.jda-account-section, .field--type-address fieldset, .jdd-registration-vehicle) > .fieldset__wrapper,
html body.path-user.jda-account-route--userregister #user-register-form :is(.field--name-field-profile-picture details, .jdd-registration-vehicles, [data-drupal-selector="edit-legal"]) > .details-wrapper {
  width: 100%;
  min-width: 0;
  margin: 0 !important;
  padding: var(--jd-section-space) !important;
}

html body.path-user.jda-account-route--userregister #user-register-form :is(.fieldset__wrapper, .details-wrapper) > :first-child {
  margin-top: 0;
}

html body.path-user.jda-account-route--userregister #user-register-form :is(.fieldset__wrapper, .details-wrapper) > :last-child {
  margin-bottom: 0;
}

html body.path-user.jda-account-route--userregister #user-register-form :is(.form-wrapper, .form-item, .form-managed-file__main, .chosen-container) {
  min-width: 0;
  max-width: 100%;
}

/* Contain Chosen's menu instead of masking overflow or clipping suggestions. */
html body.path-user.jda-account-route--userregister #user-register-form .chosen-drop {
  left: 0;
  right: 0;
  width: 100%;
  max-width: 100%;
}

html body.path-user.jda-account-route--userregister #user-register-form select.chosen-original-select {
  width: 1px !important;
  max-width: 1px !important;
}

html body.path-user.jda-account-route--userregister #user-register-form :is(.form-item__description, .claro-details__description, .jdd-registration-vehicles__privacy, .form-item--legal-accept label) {
  overflow-wrap: anywhere;
}

html body.path-user.jda-account-route--userregister #user-register-form :is(input[type="checkbox"], input[type="radio"]) {
  width: auto;
  min-height: 0;
}

html body.path-user.jda-account-route--userregister #user-register-form .form-type--checkbox input {
  width: 1.25rem;
  height: 1.25rem;
}

html body.path-user.jda-account-route--userregister #user-register-form :is(.jda-account-section, .field--type-address fieldset, .field--name-field-profile-picture details, .jdd-registration-vehicles, .jdd-registration-vehicle, [data-drupal-selector="edit-legal"]):focus-within {
  border-color: #9d4edd;
  box-shadow: 0 0 0 3px #9d4edd1a;
}

@media (hover: hover) {
  html body.path-user.jda-account-route--userregister #user-register-form :is(.jda-account-section, .field--type-address fieldset, .field--name-field-profile-picture details, .jdd-registration-vehicles, .jdd-registration-vehicle, [data-drupal-selector="edit-legal"]):hover {
    border-color: #9d4edd;
    box-shadow: 0 4px 16px #6716aa12;
  }
}

@media (max-width: 799.98px) {
  html body.path-user.jda-account-route--userregister #user-register-form,
  html body.path-user.jda-account-route--userregister #user-register-form :is(.field--type-address fieldset, .field--name-field-profile-picture details, .jdd-registration-vehicle) {
    --jd-section-space: .75rem;
  }

  html body.path-user.jda-account-route--userregister #user-register-form .address-container-inline > .form-item {
    display: block;
    width: 100%;
    margin-inline: 0;
  }

  html body.path-user.jda-account-route--userregister #user-register-form .button {
    max-width: 100%;
    white-space: normal;
  }
}

@media (prefers-reduced-motion: reduce) {
  html body.path-user.jda-account-route--userregister #user-register-form :is(fieldset, details, summary) {
    transition: none !important;
  }
}

/* assets/css/gift-card-portal.css */
html body.path-products #wrapper #block-martis-gift-cards {
  padding-bottom: 3rem;
}

html body.path-products #wrapper .gift-card-promo {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 1.5rem;
  margin: 1.5rem auto;
  padding: clamp(1.25rem, 3vw, 2.5rem);
  border: 1px solid var(--gift-card-accent, #6716aa);
  border-radius: 1rem;
  background: var(--gift-card-tint, #faf5ff);
}

html body.path-products #wrapper .gift-card-promo h2,
html body.path-products #wrapper .gift-card-promo p {
  color: var(--gift-card-dark, #3b0a5c);
  -webkit-text-fill-color: var(--gift-card-dark, #3b0a5c);
}

html body.path-products #wrapper .gift-card-promo__eyebrow {
  margin-bottom: 0.5rem;
  font-size: 0.875rem;
  font-weight: 700;
}

html body.path-products #wrapper .gift-card-promo__actions {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

html body.path-products #wrapper .gift-card-promo__actions a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0.75rem 1.25rem;
  border: 1px solid var(--gift-card-accent, #6716aa);
  border-radius: 0.625rem;
  color: var(--gift-card-dark, #3b0a5c);
  -webkit-text-fill-color: var(--gift-card-dark, #3b0a5c);
  font-weight: 700;
  text-decoration: none;
}

html body.path-products #wrapper .gift-card-promo__actions a.gift-card-promo__buy {
  background: var(--gift-card-accent, #6716aa);
  color: #fff;
  -webkit-text-fill-color: #fff;
}

html body.path-products #wrapper .gift-card-promo__actions a:focus-visible {
  outline: 3px solid var(--gift-card-dark, #3b0a5c);
  outline-offset: 4px;
}

html body.path-dashboard #wrapper .gift-card-booking {
  max-width: 52rem;
  margin: 1.5rem auto;
  padding: 1.5rem;
  border: 1px solid #6716aa;
  border-radius: 1rem;
  background: #fff;
}

html body.path-dashboard #wrapper .gift-card-booking input,
html body.path-dashboard #wrapper .gift-card-booking select,
html body.path-dashboard #wrapper .gift-card-booking button {
  min-height: 44px;
  max-width: 100%;
  font-size: 1rem;
}

@media (max-width: 767px) {
  html body.path-products #wrapper .gift-card-promo {
    grid-template-columns: minmax(0, 1fr);
  }
}

html body[class*="path-product"] #wrapper .gift-card-product-art {
  display: grid;
  place-items: center;
  padding: clamp(1.5rem, 5vw, 3.5rem);
  background: var(--gift-card-art-tint, #faf5ff);
  border-radius: 1.25rem;
  min-height: 18rem;
  margin-bottom: 1.5rem;
}
html body[class*="path-product"] #wrapper .gift-card-product-art__card {
  width: 100%;
  max-width: 26rem;
  padding: 1.5rem;
  border-radius: 1.25rem;
  background: linear-gradient(135deg, var(--gift-card-art-color, #6716aa), var(--gift-card-art-dark, #3b0a5c));
  box-shadow: 0 1rem 2rem #3b0a5c26;
  color: #fff;
  -webkit-text-fill-color: #fff;
}
html body[class*="path-product"] #wrapper .gift-card-product-art__card p {
  color: #fff;
  -webkit-text-fill-color: #fff;
  margin: 0;
}
html body[class*="path-product"] #wrapper .gift-card-product-art__brand {
  font-size: 1.1rem;
  font-weight: 600;
}
html body[class*="path-product"] #wrapper .gift-card-product-art__icon {
  display: block;
  width: 6rem;
  height: 6rem;
  margin: 1rem auto;
}
html body[class*="path-product"] #wrapper .gift-card-product-art__label {
  font-size: clamp(1.2rem, 3vw, 1.7rem);
  font-weight: 700;
}
html body[class*="path-product"] #wrapper .gift-card-product-art__notice {
  padding-top: 0.25rem;
  font-size: 0.9rem;
}

html body[class*="path-product"] #wrapper .gift-card-product .gift-card-product-art__card p {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
  line-height: 1.5;
}
html body[class*="path-product"] #wrapper .gift-card-product .gift-card-product-art__notice {
  padding-top: 0.25rem !important;
}
html body[class*="path-product"] #wrapper .gift-card-product .product-ratings,
html body[class*="path-product"] #wrapper .gift-card-product .product-add-cart .field-label {
  display: none;
}
html body[class*="path-product"] #wrapper .gift-card-product .product-add-cart select,
html body[class*="path-product"] #wrapper .gift-card-product .product-add-cart input[type="number"] {
  min-height: 44px;
  max-width: 100%;
  font-size: 1rem;
}
html body.path-product.jd-storefront-product #wrapper .gift-card-product .commerce-order-item-add-to-cart-form .field--name-purchased-entity {
  display: block !important;
  grid-column: 1 / -1;
  margin: 0 !important;
}
html body.path-product.jd-storefront-product #wrapper .gift-card-product .product-add-cart .field--name-purchased-entity label {
  display: block !important;
  margin: 0 0 0.4rem !important;
  color: var(--jd-shop-ink) !important;
  font-size: 0.78rem !important;
  font-weight: 800 !important;
}
html body.path-product.jd-storefront-product #wrapper .gift-card-product .product-add-cart .field--name-purchased-entity select {
  width: 100%;
  height: 48px;
}
html body.path-product.jd-storefront-product #wrapper .gift-card-product .product-add-cart .commerce-order-item-add-to-cart-form .form-actions {
  align-self: end !important;
  margin: 0 !important;
  transform: none !important;
}
html body[class*="path-product"] #wrapper .gift-card-product .product-add-cart .button--add-to-cart:focus-visible {
  outline: 3px solid #3b0a5c;
  outline-offset: 3px;
}

html body[class*="path-"] #wrapper a.pricing-booking-react__gift-credit {
  border-color: #6716aa;
  background: #6716aa;
  color: #fff;
  -webkit-text-fill-color: #fff;
}

html body[class*="path-"] #wrapper a.pricing-booking-react__gift-credit:is(:hover, :focus-visible) {
  border-color: #3b0a5c;
  background: #3b0a5c;
  color: #fff;
  -webkit-text-fill-color: #fff;
}

html body[class*="path-"] #wrapper a.pricing-booking-react__gift-credit:focus-visible {
  outline: 3px solid #3b0a5c;
  outline-offset: 3px;
}

/* assets/css/dashboard-account-audit.css */
/* Presentation corrections confined to dashboard and personal account content. */
/* Match My Account's canvas on every dashboard page, without nested gutters. */
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper > .container {
  box-sizing: border-box;
  width: 100% !important;
  max-width: 1488px !important;
  margin-inline: auto !important;
  padding-inline: 24px !important;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper > .container > .content-layout {
  margin-inline: 0 !important;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .content-layout > .main-content {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  padding-inline: 0 !important;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .block-system-main-block > .container-wrap {
  width: 100%;
  max-width: none !important;
  margin-inline: 0 !important;
  padding-inline: 0 !important;
}
html body.path-dashboard #wrapper #page-wrapper :is(.jdd, .jdd-admin-workspace, .jdd-react, .jdd-entity-form, .jda-account-form, .jdd-email-form, .jdd-vehicle-detail, .giftcard-wallet, .giftcard-portal-form, .cyb-review-surface, .cyb-review-detail, .cyb-review-moderation) {
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  min-width: 0;
}
@media (max-width: 767px) {
  html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper > .container {
    padding-inline: 16px !important;
  }
}

/* The frame spans the header's inner border; copy and actions keep their inset. */
html body.path-dashboard #wrapper #page-wrapper .jdd-workspace-header {
  --jdd-workspace-header-inline-padding: clamp(1.15rem, 4vw, 3rem);
  padding-inline: var(--jdd-workspace-header-inline-padding);
}
html body.path-dashboard #wrapper #page-wrapper .jdd-workspace-header > .jdd-workspace-nav-frame {
  box-sizing: border-box;
  margin-inline: calc(-1 * var(--jdd-workspace-header-inline-padding));
  width: calc(100% + 2 * var(--jdd-workspace-header-inline-padding));
  max-width: none;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .jdd-workspace-nav-frame {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: minmax(0, 1fr);
  gap: 0;
  min-width: 0;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .jdd-workspace-nav {
  grid-column: 1 / -1;
  flex-wrap: nowrap;
  min-width: 0;
  overflow-x: auto;
  scrollbar-width: thin;
  scroll-padding-inline: .5rem;
  padding-bottom: .35rem;
  grid-row: 1;
  margin: 0;
  width: 100%;
  max-width: 100%;
  padding-inline: .5rem;
}
@media (min-width: 768px) {
  html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .jdd-workspace-nav-frame.has-overflow {
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: .4rem;
  }
  html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .jdd-workspace-nav-frame.has-overflow .jdd-workspace-nav {
    grid-column: 2;
  }
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .jdd-workspace-nav__link,
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .jdd-workspace-nav-scroll {
  align-items: center;
  display: inline-flex;
  justify-content: center;
  min-height: 44px;
  flex-shrink: 0;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .jdd-workspace-nav-scroll {
  background: #faf5ff;
  border: 1px solid #9d4edd;
  border-radius: .65rem;
  color: #3b0a5c;
  font-size: 1.7rem;
  width: 44px;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .jdd-workspace-nav-scroll[hidden],
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .jdd-workspace-nav-hint[hidden] { display: none; }
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .jdd-workspace-nav-hint {
  color: #53425d;
  font-size: .875rem;
  grid-column: 1 / -1;
  margin: 0;
  grid-row: 2;
}
html body.path-dashboard #wrapper #page-wrapper .jdd-section-nav {
  background: #fff;
  opacity: 1;
  position: static;
}
html body.path-dashboard #wrapper #page-wrapper .jdd-section-nav-disclosure {
  background: #fff;
  position: sticky;
  top: var(--jdd-section-nav-top, 6rem);
  z-index: 20;
}
html body.path-dashboard #wrapper #page-wrapper :is(.jdd-section, .jdd-kpi-board) {
  scroll-margin-top: var(--jdd-anchor-offset, 10rem);
}
html body.path-dashboard #wrapper #page-wrapper .jdd-section-nav-disclosure > summary { display: none; }
html body.path-dashboard #wrapper #page-wrapper .jdd-section-nav-disclosure:not([open]) > .jdd-section-nav { display: flex; }
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper :is(.description, .form-item__description, .jdd-workspace-header__description, .jdd-form-intro p, .jdd-muted) {
  color: #53425d;
  height: auto;
  max-height: none;
  overflow: visible;
  overflow-wrap: break-word;
  text-overflow: clip;
  white-space: normal;
  -webkit-line-clamp: unset;
  line-clamp: unset;
}
html body.path-dashboard #wrapper #page-wrapper :is(.jdd-stat__meta, .jdd-stat__hint, .jdd-kpi small, .jdd-react-kpi small, .jdd-chart-legend, .jdd-chart-data) {
  color: #53425d;
  font-size: .875rem;
  line-height: 1.5;
}
html body.path-dashboard #wrapper #page-wrapper .jdd-chart-data { margin-top: .75rem; }
html body.path-dashboard #wrapper #page-wrapper .jdd-chart-data > summary {
  cursor: pointer;
  font-weight: 600;
  min-height: 44px;
  padding: .6rem;
}
html body.path-dashboard #wrapper #page-wrapper .jdd-chart-data table { width: 100%; }
html body.path-dashboard #wrapper #page-wrapper .jdd-chart-data :is(th, td) { padding: .5rem; text-align: left; }
html body.path-dashboard #wrapper #page-wrapper .jdd-sort-controls { display: none; }
html body.path-dashboard #wrapper #page-wrapper .jdd-bulk-help { color: #53425d; font-size: .9rem; }
html body.path-dashboard #wrapper #page-wrapper .jdd-badge--overdue { background: #fff0f0; color: #9c2222; }
html body.path-dashboard #wrapper #page-wrapper .jdd-table-operations .jdd-operation {
  align-items: center;
  display: inline-flex;
  justify-content: center;
  min-height: 44px !important;
}
html body:is(.path-dashboard, .path-user) #wrapper #page-wrapper .jdd-language-slot { display: none; }
html body:is(.path-dashboard, .path-user) #wrapper #page-wrapper .jdd-language-slot[hidden] { display: none !important; }

@media (max-width: 767px) {
  html body.path-dashboard #wrapper #page-wrapper .jdd-section-nav-disclosure {
    background: #fff;
    border: 1px solid #d5b8ef;
    border-radius: .75rem;
    margin-block: 1rem;
    position: static;
  }
  html body.path-dashboard #wrapper #page-wrapper .jdd-section-nav-disclosure > summary {
    color: #3b0a5c;
    cursor: pointer;
    display: list-item;
    min-height: 44px;
    padding: .75rem 1rem;
  }
  html body.path-dashboard #wrapper #page-wrapper .jdd-section-nav-disclosure:not([open]) > .jdd-section-nav { display: none; }
  html body.path-dashboard #wrapper #page-wrapper .jdd-section-nav {
    flex-wrap: wrap;
    margin: 0;
    position: static;
  }
  html body.path-dashboard #wrapper #page-wrapper .jdd-section-nav a { min-height: 44px; padding: .7rem; }
  html body.path-dashboard #wrapper #page-wrapper .jdd-sort-controls {
    display: flex;
    flex: 1 1 100%;
    flex-wrap: wrap;
    gap: .75rem;
  }
  html body.path-dashboard #wrapper #page-wrapper .jdd-sort-controls > .form-item { flex: 1 1 9rem; min-width: 0; }
  html body:is(.path-dashboard, .path-user) #wrapper #page-wrapper .jdd-audit-table-wrap {
    overflow: visible;
    max-width: 100%;
  }
  html body:is(.path-dashboard, .path-user) #wrapper #page-wrapper .jdd-audit-table {
    display: block;
    min-width: 0 !important;
    width: 100% !important;
  }
  html body:is(.path-dashboard, .path-user) #wrapper #page-wrapper .jdd-audit-table > thead {
    clip-path: inset(50%);
    height: 1px;
    overflow: hidden;
    position: absolute;
    width: 1px;
  }
  html body:is(.path-dashboard, .path-user) #wrapper #page-wrapper .jdd-audit-table > tbody { display: block; width: 100%; }
  html body:is(.path-dashboard, .path-user) #wrapper #page-wrapper .jdd-audit-table > tbody > tr {
    background: #fff;
    border: 1px solid #d5b8ef;
    border-radius: .75rem;
    display: block !important;
    margin-block: .75rem;
    overflow: visible !important;
    padding: .75rem;
    width: auto !important;
  }
  html body:is(.path-dashboard, .path-user) #wrapper #page-wrapper .jdd-audit-table > tbody > tr > :is(td, th) {
    border: 0;
    border-bottom: 1px solid #eee5f2;
    clear: both !important;
    display: grid !important;
    float: none !important;
    gap: .3rem;
    grid-template-columns: 1fr !important;
    max-width: 100%;
    min-width: 0;
    overflow: visible !important;
    padding: .6rem 0;
    width: 100% !important;
    word-break: normal !important;
    overflow-wrap: break-word !important;
    box-sizing: border-box;
  }
  html body:is(.path-dashboard, .path-user) #wrapper #page-wrapper .jdd-audit-table td::before { display: none !important; content: none !important; }
  html body:is(.path-dashboard, .path-user) #wrapper #page-wrapper .jdd-audit-table td[data-label]:not(:has(.tablesaw-cell-label))::before {
    color: #53425d;
    content: attr(data-label) !important;
    display: block !important;
    font-size: .8rem;
    font-weight: 700;
  }
  html body:is(.path-dashboard, .path-user) #wrapper #page-wrapper .jdd-audit-table .tablesaw-cell-label {
    color: #53425d;
    display: block !important;
    float: none !important;
    font-size: .8rem;
    line-height: 1.4;
    max-width: 100%;
    min-width: 0;
    padding: 0;
    width: auto !important;
  }
  html body:is(.path-dashboard, .path-user) #wrapper #page-wrapper .jdd-audit-table .tablesaw-cell-content {
    display: block;
    float: none !important;
    margin: 0 !important;
    max-width: 100%;
    min-width: 0;
    overflow-wrap: break-word !important;
    white-space: normal;
    width: auto !important;
    word-break: normal !important;
  }
  html body:is(.path-dashboard, .path-user) #wrapper #page-wrapper .jdd-audit-table td.table-select::before,
html body:is(.path-dashboard, .path-user) #wrapper #page-wrapper .jdd-audit-table td.table-select .tablesaw-cell-label { display: none !important; content: none !important; }
  html body:is(.path-dashboard, .path-user) #wrapper #page-wrapper .jdd-audit-table td img {
    height: auto;
    max-width: min(100%, 120px);
    object-fit: contain;
  }
  html body:is(.path-dashboard, .path-user) #wrapper #page-wrapper .jdd-audit-table :is(a, button, input[type='submit']) { min-height: 44px; }
  html body:is(.path-dashboard, .path-user) #wrapper #page-wrapper .jdd-language-slot {
    background: #fff;
    border: 1px solid #d5b8ef;
    border-radius: .75rem;
    display: block;
    margin-block: 1.5rem;
    min-height: 64px;
    padding: .75rem;
    padding-bottom: max(.75rem, env(safe-area-inset-bottom));
  }
  html body:is(.path-dashboard, .path-user) #wrapper #page-wrapper .jdd-language-slot :is(#gt_float_wrapper, .gt_float_switcher, .gt_options) {
    float: none !important;
    inset: auto !important;
    max-width: 100%;
    position: relative !important;
    z-index: 100 !important; /* below admin toolbar */
    transform: none !important;
  }
  html body:is(.path-dashboard, .path-user) #wrapper #page-wrapper .jdd-language-slot .gt_options { max-height: 16rem; overflow-y: auto; }
}

/* Mobile navigation keeps native horizontal scrolling without arrows or hints. */
@media (max-width: 767.98px) {
  html body.path-dashboard #wrapper #page-wrapper .jdd-workspace-header {
    --jdd-workspace-header-inline-padding: 1rem;
  }
  html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .jdd-workspace-nav-hint,
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .jdd-workspace-nav-scroll {
    display: none !important;
  }
}

/* Bulk selection UX (2026-10-01): larger high-contrast row checkboxes,
   visible header select-all on the dark purple header, selected-row
   highlight, selected count, and disabled state for Apply. */
html body[class*="path-dashboard"] #wrapper #page-wrapper .jdd-admin-table tbody tr.is-selected {
  background: rgba(124, 58, 237, 0.08) !important;
}
html body[class*="path-dashboard"] #wrapper #page-wrapper .jdd-admin-table tbody tr.is-selected:hover {
  background: rgba(124, 58, 237, 0.14) !important;
}
/* Language selector moved into the tour launcher row at the top (2026-10-01):
   the widget sits at the far left of the row, "Show me around" at the far
   right; border and shadow removed from the selector. Desktop and mobile. */
html body:is(.path-dashboard, .path-user) #wrapper #page-wrapper .jd-guide-launcher.jdd-has-language {
  align-items: center;
  gap: 1rem;
  justify-content: space-between;
}
html body:is(.path-dashboard, .path-user) #wrapper #page-wrapper .jd-guide-launcher #gt_float_wrapper {
  border: none !important;
  box-shadow: none !important;
  float: none !important;
  inset: auto !important;
  max-width: 100%;
  position: relative !important;
  z-index: 100 !important; /* below admin toolbar */
  transform: none !important;
}
html body:is(.path-dashboard, .path-user) #wrapper #page-wrapper .jd-guide-launcher #gt_float_wrapper .gt_float_switcher {
  border: none !important;
  box-shadow: none !important;
}
/* Fallback slot (no visible tour launcher): keep it borderless too. */
html body:is(.path-dashboard, .path-user) #wrapper #page-wrapper .jdd-language-slot {
  background: transparent;
  border: none;
  margin-block: 1rem;
  min-height: 0;
  padding: 0;
}


/* Content below the approved workspace header. */
html body.path-dashboard #wrapper #page-wrapper .jdd-summary-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: .85rem;
  margin: 1.25rem 0;
  min-width: 0;
}
html body.path-dashboard #wrapper #page-wrapper .jdd-summary-card {
  background: linear-gradient(145deg, #fff, #faf5ff);
  border: 1px solid #d5b8ef;
  border-radius: 16px;
  box-shadow: 0 5px 18px #3b0a5c0a;
  color: #3b0a5c;
  display: flex;
  flex-direction: column;
  gap: .3rem;
  justify-content: center;
  min-height: 108px;
  min-width: 0;
  padding: 1rem 1.15rem;
  text-decoration: none;
  transition: border-color .15s ease, box-shadow .15s ease;
}
html body.path-dashboard #wrapper #page-wrapper .jdd-summary-card:hover {
  border-color: #6716aa;
  box-shadow: 0 7px 22px #3b0a5c16;
}
html body.path-dashboard #wrapper #page-wrapper .jdd-summary-card__value {
  color: inherit;
  font-size: clamp(1.65rem, 3vw, 2.2rem);
  font-variant-numeric: tabular-nums;
  font-weight: 800;
  line-height: 1.15;
}
html body.path-dashboard #wrapper #page-wrapper .jdd-summary-card__label {
  color: inherit;
  font-size: .9rem;
  font-weight: 650;
  line-height: 1.4;
  overflow-wrap: anywhere;
}
html body.path-dashboard #wrapper #page-wrapper .jdd-summary-card.is-active {
  background: #6716aa;
  border-color: #6716aa;
  color: #fff;
}
html body.path-dashboard #wrapper #page-wrapper .jdd-summary-card:focus-visible,
html body.path-dashboard #wrapper #page-wrapper .jdd-filter-chip__clear:focus-visible {
  outline: 3px solid #9d4edd;
  outline-offset: 3px;
}
html body.path-dashboard #wrapper #page-wrapper .jdd-admin-workspace .jdd-filter-chip {
  gap: .35rem;
  max-width: 100%;
}
html body.path-dashboard #wrapper #page-wrapper .jdd-admin-workspace .jdd-filter-chip__label {
  min-width: 0;
  overflow-wrap: anywhere;
  white-space: normal;
}
html body.path-dashboard #wrapper #page-wrapper .jdd-admin-workspace .jdd-filter-chip__clear {
  align-items: center;
  display: inline-flex;
  flex: 0 0 44px;
  height: 44px;
  justify-content: center;
  min-height: 44px;
  min-width: 44px;
}
html body.path-dashboard #wrapper #page-wrapper .jdd-admin-workspace .jdd-admin-table-wrap,
html body.path-dashboard #wrapper #page-wrapper .jdd-admin-workspace .jdd-responsive-table-wrap {
  max-width: 100%;
  min-width: 0;
}
html body.path-dashboard #wrapper #page-wrapper .jdd-admin-workspace :is(.jdd-admin-table, .jdd-responsive-table) td {
  line-height: 1.5;
  overflow-wrap: anywhere;
}
html body.path-dashboard #wrapper #page-wrapper .jdd-admin-workspace .jdd-table-operations {
  gap: .5rem;
}
html body.path-dashboard #wrapper #page-wrapper .jdd-confirm-summary {
  background: #faf5ff;
  border: 1px solid #d5b8ef;
  border-radius: 14px;
  line-height: 1.6;
  margin-block: 1rem;
  padding: 1rem 1.25rem;
}
@media (max-width: 767px) {
  html body.path-dashboard #wrapper #page-wrapper .jdd-summary-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .65rem;
  }
  html body.path-dashboard #wrapper #page-wrapper .jdd-summary-card {
    border-radius: 12px;
    min-height: 100px;
    padding: .85rem;
  }
}
@media (prefers-reduced-motion: reduce) {
  html body.path-dashboard #wrapper #page-wrapper .jdd-summary-card { transition: none; }
}

/* Shared dashboard/account content skin. Native Drupal form ownership, hidden
   controls, public chrome and the independently styled capture widget are retained. */
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper {
  --jdd-purple: #6716aa;
  --jdd-deep: #3b0a5c;
  --jdd-ink: #292331;
  --jdd-accent: #9d4edd;
  --jdd-lilac: #f3e8ff;
  --jdd-border: #d5b8ef;
  --jdd-muted: #53425d;
  container: jdd-canvas / inline-size;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper :is(.main-content, .region-content, .content-layout, .jdd-admin-workspace, .jdd, .jdd-grid, .jdd-detail-header, .jdd-card-body, .jda-profile, .jda-payments, .cyb-review-surface) {
  box-sizing: border-box;
  max-width: 100%;
  min-width: 0;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper :is(.jdd-workspace-header__content, .jdd-workspace-header__title, .jdd-workspace-header__meta) {
  min-width: 0;
  overflow-wrap: anywhere;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .jdd-workspace-header__description {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: #eee4f5 !important;
  display: block;
  font-size: clamp(.94rem, 1.5vw, 1.05rem);
  height: auto;
  line-height: 1.62;
  margin: .75rem 0 0;
  max-height: none;
  max-width: 720px;
  overflow: visible;
  padding: 0 !important;
  text-overflow: clip;
  white-space: normal;
  -webkit-line-clamp: unset;
  line-clamp: unset;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper :is(.jdd-entity-form, .jda-account-form, .cyb-review-form) {
  container: jdd-form / inline-size;
  display: flow-root;
}
html body.path-dashboard #wrapper #page-wrapper .jdd-entity-form:not(.jdd-admin-workspace) {
  background: #fff;
  border: 1px solid var(--jdd-border);
  border-radius: 18px;
  box-shadow: 0 8px 24px #3b0a5c0a;
  margin: 0 auto 3rem;
  max-width: 100%;
  padding: 24px;
}
html body.path-dashboard #wrapper #page-wrapper .jda-account-form {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  margin: 0 auto 2rem;
  padding: 24px;
  border: 1px solid var(--jdd-border);
  border-radius: 18px;
  background: #fff;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content form:not([id^="simplenews-subscriptions-block"]):not(.layout-builder-form) :is(.form-item, .form-wrapper:where(:not(.jdd-workspace-nav-frame)), .field--widget, .jdd-form-field):not(.vehicle-capture-react-shell *):not(.vehicle-capture-react-shell):not(.cyb-review-star-input *) {
  box-sizing: border-box;
  max-width: 100%;
  min-width: 0;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content form:not([id^="simplenews-subscriptions-block"]):not(.layout-builder-form) :is(.form-item, .jdd-form-field, .field--widget):not(fieldset, details):not(.vehicle-capture-react-shell *):not(.vehicle-capture-react-shell):not(.cyb-review-star-input *) {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  margin: 0 0 1rem;
  padding: 0 !important;
  text-align: left !important;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content form:not([id^="simplenews-subscriptions-block"]):not(.layout-builder-form) label:not(.sr-only, .visually-hidden, .jdd-select-all-label, [hidden]):not(.vehicle-capture-react-shell *):not(.cyb-review-star-input *) {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: var(--jdd-deep) !important;
  display: block;
  font-size: .9375rem;
  font-weight: 700;
  line-height: 1.45;
  margin: 0 0 .45rem;
  padding: 0 !important;
  text-align: left !important;
  white-space: normal;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content form:not([id^="simplenews-subscriptions-block"]):not(.layout-builder-form) :is(.description, .form-item__description, .help-block):not(.vehicle-capture-react-shell *):not(.cyb-review-star-input *) {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: var(--jdd-muted) !important;
  font-size: .875rem;
  height: auto;
  line-height: 1.55;
  margin-top: .45rem;
  max-height: none;
  overflow: visible;
  overflow-wrap: anywhere;
  padding: 0 !important;
  text-overflow: clip;
  white-space: normal;
  -webkit-line-clamp: unset;
  line-clamp: unset;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content form:not([id^="simplenews-subscriptions-block"]):not(.layout-builder-form) :is(input[type='text'], input[type='email'], input[type='tel'], input[type='number'], input[type='date'], input[type='time'], input[type='datetime-local'], input[type='month'], input[type='week'], input[type='password'], input[type='search'], input[type='url'], input[type='file'], select, textarea):not(.vehicle-capture-react-shell *):not(.sr-only, .visually-hidden, .chosen-original-select, .select2-hidden-accessible, .selectify-visually-hidden, [hidden]):not(.cyb-review-star-input *) {
  background-color: #fff !important;
  border: 1px solid #c9addd !important;
  border-radius: 10px !important;
  box-shadow: inset 0 1px 2px #3b0a5c06;
  box-sizing: border-box;
  color: var(--jdd-ink) !important;
  font: inherit;
  font-size: 16px !important;
  height: auto;
  line-height: 1.4;
  margin: 0;
  max-width: 100%;
  min-height: 48px;
  min-width: 0;
  padding: .7rem .85rem !important;
  transition: border-color .16s ease, box-shadow .16s ease;
  width: 100%;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content form:not([id^="simplenews-subscriptions-block"]):not(.layout-builder-form) select:not(.vehicle-capture-react-shell *):not(.sr-only, .visually-hidden, .chosen-original-select, .select2-hidden-accessible, .selectify-visually-hidden, [hidden]):not([multiple]):not(.cyb-review-star-input *) {
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%236716aa' d='M1.2 1.3 6 6.1 10.8 1.3 12 2.5 6 8.5 0 2.5z'/%3E%3C/svg%3E");
  background-position: right .9rem center;
  background-repeat: no-repeat;
  background-size: 12px 8px;
  padding-right: 2.5rem !important;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content form:not([id^="simplenews-subscriptions-block"]):not(.layout-builder-form) textarea:not(.vehicle-capture-react-shell *):not(.cyb-review-star-input *) {
  min-height: 140px;
  resize: vertical;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content form:not([id^="simplenews-subscriptions-block"]):not(.layout-builder-form) input[type='file']:not(.vehicle-capture-react-shell *)::file-selector-button {
  background: #f3e8ff;
  border: 1px solid #c9addd;
  border-radius: 6px;
  color: #3b0a5c;
  cursor: pointer;
  font: inherit;
  margin-right: .75rem;
  padding: .4rem .65rem;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content form:not([id^="simplenews-subscriptions-block"]):not(.layout-builder-form) :is(input, select, textarea):focus:not(.vehicle-capture-react-shell *):not([type='hidden'], .sr-only, .visually-hidden, .chosen-original-select, .select2-hidden-accessible, .selectify-visually-hidden):not(.table-select input[type='checkbox'], .select-all input[type='checkbox']):not(.cyb-review-star-input *) {
  border-color: #6716aa !important;
  box-shadow: 0 0 0 3px #6716aa24 !important;
  outline: 2px solid #6716aa;
  outline-offset: 2px;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content form:not([id^="simplenews-subscriptions-block"]):not(.layout-builder-form) :is(input, select, textarea):disabled:not(.vehicle-capture-react-shell *):not([type='hidden']):not(.table-select input[type='checkbox'], .select-all input[type='checkbox']):not(.cyb-review-star-input *) {
  background-color: #f3f0f5 !important;
  color: #675570 !important;
  cursor: not-allowed;
  opacity: .75;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content form:not([id^="simplenews-subscriptions-block"]):not(.layout-builder-form) :is(input, textarea)[readonly]:not(.vehicle-capture-react-shell *):not([type='hidden']):not(.cyb-review-star-input *) {
  background-color: #faf5ff !important;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content form:not([id^="simplenews-subscriptions-block"]):not(.layout-builder-form) :is(input, select, textarea):is([aria-invalid='true'], .error):not(.vehicle-capture-react-shell *):not([type='hidden']):not(.cyb-review-star-input *) {
  border-color: #a72c44 !important;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content form:not([id^="simplenews-subscriptions-block"]):not(.layout-builder-form) :is(.form-item--error-message, .form-item__error-message, .alert-danger):not(.vehicle-capture-react-shell *):not(.cyb-review-star-input *) {
  background: #fff0f3 !important;
  border: 1px solid #e9a9b2 !important;
  border-radius: 10px;
  color: #812030 !important;
  line-height: 1.5;
  margin-top: .5rem;
  padding: .75rem !important;
}
/* Enhanced selects keep their original native controls concealed. */
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content form:not([id^="simplenews-subscriptions-block"]):not(.layout-builder-form) :is(.chosen-container, .select2-container, .nice-select):not(.vehicle-capture-react-shell *):not(.cyb-review-star-input *) {
  box-sizing: border-box;
  max-width: 100%;
  min-width: 0;
  width: 100% !important;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content form:not([id^="simplenews-subscriptions-block"]):not(.layout-builder-form) :is(.chosen-single, .chosen-choices, .select2-selection, .nice-select):not(.vehicle-capture-react-shell *):not(.cyb-review-star-input *) {
  align-items: center;
  background: #fff;
  border: 1px solid #c9addd;
  border-radius: 10px;
  box-sizing: border-box;
  color: #292331;
  font-size: 16px;
  height: auto;
  line-height: 1.4;
  min-height: 48px;
  padding: .7rem .85rem;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content form:not([id^="simplenews-subscriptions-block"]):not(.layout-builder-form) :is(.chosen-drop, .nice-select .list):not(.vehicle-capture-react-shell *):not(.cyb-review-star-input *) {
  background: #fff;
  border: 1px solid #d5b8ef;
  border-radius: 10px;
  box-shadow: 0 8px 24px #3b0a5c18;
  max-width: 100%;
  width: 100%;
  z-index: 30;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content form:not([id^="simplenews-subscriptions-block"]):not(.layout-builder-form) :is(.chosen-container-active .chosen-single, .select2-container--focus .select2-selection, .nice-select:focus-visible):not(.vehicle-capture-react-shell *):not(.cyb-review-star-input *) {
  border-color: #6716aa;
  outline: 2px solid #6716aa;
  outline-offset: 2px;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content form:not([id^="simplenews-subscriptions-block"]):not(.layout-builder-form) :is(.form-type-checkbox, .form-type-radio):not(.vehicle-capture-react-shell *):not(.cyb-review-star-input *) {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: .35rem .65rem;
  min-height: 44px;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content form:not([id^="simplenews-subscriptions-block"]):not(.layout-builder-form) :is(.form-type-checkbox, .form-type-radio) > label:not(.sr-only, .visually-hidden, [hidden]):not(.vehicle-capture-react-shell *):not(.cyb-review-star-input *) {
  align-items: center;
  display: inline-flex;
  flex: 1 1 10rem;
  margin: 0;
  min-height: 44px;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content form:not([id^="simplenews-subscriptions-block"]):not(.layout-builder-form) :is(.form-type-checkbox, .form-type-radio) > .description:not(.vehicle-capture-react-shell *):not(.cyb-review-star-input *) {
  flex-basis: 100%;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content form:not([id^="simplenews-subscriptions-block"]):not(.layout-builder-form) :is(input[type='checkbox'], input[type='radio']):not(.vehicle-capture-react-shell *):not(.sr-only, .visually-hidden, [hidden]):not(.cyb-review-star-input *) {
  accent-color: #6716aa;
  box-sizing: border-box;
  cursor: pointer;
  flex: 0 0 22px;
  height: 22px;
  margin: 0;
  min-height: 22px;
  min-width: 22px;
  padding: 0;
  width: 22px;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content form:not([id^="simplenews-subscriptions-block"]):not(.layout-builder-form) :is(fieldset, details.jdd-form-panel):not(.vehicle-capture-react-shell *):not(.vehicle-capture-react-shell):not(.cyb-review-star-input *) {
  background: linear-gradient(145deg, #fff, #fdfaff);
  border: 1px solid #d5b8ef;
  border-radius: 16px;
  box-shadow: 0 5px 18px #3b0a5c08;
  box-sizing: border-box;
  margin: 0 0 1.25rem;
  min-width: 0;
  padding: 24px;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content form:not([id^="simplenews-subscriptions-block"]):not(.layout-builder-form) :is(fieldset, details.jdd-form-panel):not(.vehicle-capture-react-shell *):not(.vehicle-capture-react-shell) > legend:not(.cyb-review-star-input *) {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: #3b0a5c !important;
  float: none;
  font-size: 1.125rem;
  font-weight: 800;
  line-height: 1.4;
  margin: 0;
  max-width: 100%;
  padding: 0 .35rem;
  text-align: left !important;
  width: auto;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content form:not([id^="simplenews-subscriptions-block"]):not(.layout-builder-form) .fieldset-legend:not(.vehicle-capture-react-shell *):not(.cyb-review-star-input *) {
  color: #3b0a5c !important;
  font: inherit;
  overflow-wrap: anywhere;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper :is(.jdd-form-panel, .jda-account-section--identity) > .fieldset-wrapper {
  display: grid;
  gap: 1.25rem;
  grid-template-columns: minmax(0, 1fr);
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper :is(.jdd-form-panel, .jda-account-section--identity) > .fieldset-wrapper > * {
  min-width: 0;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper :is(.jdd-form-panel, .jda-account-section--identity) > .fieldset-wrapper > :is(.description, .jdd-form-field--wide, .jdd-form-field--customer-notes, .jdd-form-field--review, .field--type-address, .field--type-image, .vehicle-capture-react-shell, .jdd-photo-capture, :has(textarea), :has(.vehicle-capture-react-shell)) {
  grid-column: 1 / -1;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper :is(.jdd-form-panel, .jda-account-section--identity) > .fieldset-wrapper :is(.form-item, .jdd-form-field) {
  margin-bottom: 0;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content form:not([id^="simplenews-subscriptions-block"]):not(.layout-builder-form) :is(.jdd-form-field--service-date, .field--name-service-date) fieldset {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  margin: 0 !important;
  padding: 0 !important;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content form:not([id^="simplenews-subscriptions-block"]):not(.layout-builder-form) :is(.container-inline, .address-container-inline):not(.vehicle-capture-react-shell *):not(.cyb-review-star-input *) {
  display: grid;
  gap: 1rem;
  grid-template-columns: minmax(0, 1fr);
  min-width: 0;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content form:not([id^="simplenews-subscriptions-block"]):not(.layout-builder-form) :is(.container-inline, .address-container-inline) > .form-item:not(.vehicle-capture-react-shell *):not(.cyb-review-star-input *) {
  display: block;
  float: none;
  margin-right: 0;
  min-width: 0;
}
/* Actions preserve submit/link semantics and destination handling. */
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content form:not([id^="simplenews-subscriptions-block"]):not(.layout-builder-form) :is(.form-actions, [data-drupal-selector^='edit-actions']):not(.vehicle-capture-react-shell *):not(.cyb-review-star-input *) {
  align-items: center;
  background: linear-gradient(110deg, #f3e8ff, #faf5ff);
  border: 1px solid #d5b8ef;
  border-radius: 14px;
  box-sizing: border-box;
  clear: both;
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
  margin: 1.5rem 0 0;
  max-width: 100%;
  min-width: 0;
  padding: 1rem;
  position: static !important;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content form:not([id^="simplenews-subscriptions-block"]):not(.layout-builder-form) :is(input[type='submit'], input[type='button'], input[type='reset'], button.button, .form-actions > a, .jdd-form-cancel, .jdd-select-all, .jda-filter-reset):not(.vehicle-capture-react-shell *):not(.sr-only, .visually-hidden, [hidden]):not(.cyb-review-star-input *) {
  align-items: center;
  background: #6716aa !important;
  border: 1px solid #6716aa !important;
  border-radius: 10px !important;
  box-shadow: none !important;
  box-sizing: border-box;
  color: #fff !important;
  cursor: pointer;
  display: inline-flex;
  font: inherit;
  font-size: 16px;
  font-weight: 700;
  justify-content: center;
  line-height: 1.35;
  margin: 0 !important;
  max-width: 100%;
  min-height: 48px;
  min-width: 0;
  padding: .7rem 1rem !important;
  text-align: center;
  text-decoration: none !important;
  transform: none !important;
  transition: background-color .16s ease, border-color .16s ease;
  white-space: normal;
  width: auto;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content form:not([id^="simplenews-subscriptions-block"]):not(.layout-builder-form) :is(.jdd-form-cancel, .jdd-button-quiet, .jdd-select-all, .jda-filter-reset, .button--secondary, .form-actions > a:not(.button--primary, .button--danger)):not(.vehicle-capture-react-shell *):not(.cyb-review-star-input *):not(.sr-only, .visually-hidden, [hidden]) {
  background: #fff !important;
  border-color: #c9addd !important;
  color: #3b0a5c !important;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content form:not([id^="simplenews-subscriptions-block"]):not(.layout-builder-form) :is(.form-actions, [data-drupal-selector^="edit-actions"]) :is(.button--danger, .button--dangerous, .btn-danger, .jdd-link-danger, .jda-account-cancel, [data-drupal-selector="edit-delete"]):not(.vehicle-capture-react-shell *):not(.cyb-review-star-input *):not(.sr-only, .visually-hidden, [hidden]) {
  background: #fff0f3 !important;
  border-color: #c15b6f !important;
  color: #8b2538 !important;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content form:not([id^="simplenews-subscriptions-block"]):not(.layout-builder-form) :is(input[type='submit'], button.button, .form-actions > a, .jdd-form-cancel, .jdd-select-all, .jda-filter-reset):hover:not(:disabled):not(.vehicle-capture-react-shell *):not(.cyb-review-star-input *) {
  border-color: #3b0a5c !important;
  box-shadow: 0 3px 10px #3b0a5c14 !important;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content form:not([id^="simplenews-subscriptions-block"]):not(.layout-builder-form) :is(input[type='submit'], button.button, .form-actions > a, .jdd-form-cancel, .jdd-select-all, .jda-filter-reset):focus-visible:not(.vehicle-capture-react-shell *):not(.cyb-review-star-input *) {
  outline: 3px solid #6716aa !important;
  outline-offset: 3px;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content form:not([id^="simplenews-subscriptions-block"]):not(.layout-builder-form) :is(input[type='submit'], button.button):is(:disabled, [aria-disabled='true']):not(.vehicle-capture-react-shell *):not(.cyb-review-star-input *) {
  cursor: not-allowed;
  opacity: .55;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content form:not([id^="simplenews-subscriptions-block"]):not(.layout-builder-form) :is(input[type='submit'], button.button)[aria-busy='true']:not(.vehicle-capture-react-shell *):not(.cyb-review-star-input *) {
  cursor: progress;
  opacity: .75;
}
/* List filters retain their panel; confirmed bulk actions follow the table. */
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper :is(.jdd-filter-bar, fieldset[data-drupal-selector^='edit-bulk'], .jda-financial-filters) {
  align-items: end;
  background: #faf5ff;
  border: 1px solid #d5b8ef;
  border-radius: 16px;
  box-shadow: 0 5px 18px #3b0a5c08;
  box-sizing: border-box;
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  margin: 0 0 1.25rem;
  max-width: 100%;
  min-width: 0;
  padding: 24px;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper :is(.jdd-filter-bar, fieldset[data-drupal-selector^='edit-bulk']) > .form-item {
  flex: 1 1 12rem;
  margin: 0;
  max-width: 100%;
  min-width: 0;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper :is(.jdd-filter-bar, .jdd-bulk-actions, .jda-financial-filters) .form-actions {
  align-self: end;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  margin: 0 !important;
  padding: 0 !important;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper fieldset[data-drupal-selector^='edit-bulk'] > .fieldset-wrapper {
  align-items: end;
  display: flex;
  flex: 1 1 100%;
  flex-wrap: wrap;
  gap: 1rem;
  min-width: 0;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper fieldset[data-drupal-selector^='edit-bulk'] > .fieldset-wrapper > .form-item {
  flex: 1 1 12rem;
  margin: 0;
  min-width: 0;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .jdd-bulk-actions {
  align-items: center;
  background: #faf9fc;
  border: 1px solid #dfd5e8;
  border-radius: 12px;
  box-shadow: none;
  box-sizing: border-box;
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  margin: 1rem 0 0;
  max-width: 100%;
  min-width: 0;
  padding: 16px;
  position: static;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .jdd-bulk-actions .jdd-bulk-action-controls {
  align-items: end;
  display: flex;
  flex: 0 1 32rem;
  flex-wrap: wrap;
  gap: .75rem;
  min-width: 0;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .jdd-bulk-action-controls > .form-item {
  flex: 1 1 15rem;
  margin: 0 !important;
  max-width: 100%;
  min-width: 0;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .jdd-bulk-action-controls > .form-actions {
  display: flex;
  flex: 0 0 auto;
  gap: .75rem;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .jdd-selected-count {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0;
  box-shadow: none !important;
  color: #53425d !important;
  display: block;
  flex: 1 1 8rem;
  font-size: .9rem;
  font-weight: 700;
  line-height: 1.5;
  margin: 0 !important;
  min-width: 0;
  padding: 0 !important;
  position: static;
  text-shadow: none !important;
}
html body.path-dashboard #wrapper #page-wrapper .jdd-filter-bar .jdd-sort-controls { display: none; }
/* Native checkboxes paint a conventional 22px mark inside a 44px hit target. */
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper :is(.jdd-admin-table, .jdd-audit-table) :is(th.select-all, th.table-select, td.table-select) {
  cursor: pointer;
  text-align: start;
  vertical-align: middle;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper :is(.jdd-admin-table, .jdd-audit-table) th:is(.select-all, .jdd-selection-header) {
  background: #f3f1f6 !important;
  border-bottom: 1px solid #dfd5e8;
  color: #3b0a5c !important;
  font-size: .875rem;
  font-weight: 650;
  letter-spacing: normal;
  padding: .5rem .65rem;
  text-transform: none;
  white-space: nowrap;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper :is(.jdd-admin-table, .jdd-audit-table) .jdd-select-all-label {
  align-items: center;
  color: #3b0a5c;
  cursor: pointer;
  display: inline-flex;
  font-size: .875rem;
  font-weight: 650;
  line-height: 1.4;
  margin: 0;
  min-height: 44px;
  padding: 0 .25rem 0 0;
  vertical-align: middle;
  width: auto;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper :is(.jdd-admin-table, .jdd-audit-table) td.table-select {
  padding-inline: .65rem;
  white-space: nowrap;
}
/* Legacy catalog rules target Views' shared name class. Selection tables
   keep that field as a normal neutral cell with room for its leading input. */
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper :is(.jdd-admin-table, .jdd-audit-table):has(> thead th.select-all) :is(th, td).views-field-name {
  border-inline: 0 !important;
  box-shadow: none !important;
  padding: .9rem .85rem !important;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper :is(.jdd-admin-table, .jdd-audit-table):has(> thead th.select-all) td.views-field-name {
  background: transparent !important;
  border-bottom: 0 !important;
}
@media (min-width: 40em) {
  html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper :is(.jdd-admin-table, .jdd-audit-table):has(> thead th.select-all) :is(th, td).views-field-name {
    display: table-cell !important;
  }
  html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper :is(.jdd-admin-table, .jdd-audit-table):has(> thead th.select-all) th.views-field-operations,
  html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper :is(.jdd-admin-table, .jdd-audit-table):has(> thead th.select-all) .jdd-table-operations .jdd-operation {
    overflow-wrap: normal !important;
    white-space: nowrap !important;
    word-break: normal !important;
  }
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper :is(.jdd-admin-table, .jdd-audit-table) :is(th.select-all, th.table-select, td.table-select) input[type='checkbox'] {
  appearance: none;
  background-color: transparent;
  background-image: linear-gradient(#fff, #fff);
  background-origin: content-box;
  background-repeat: no-repeat;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  box-sizing: border-box;
  cursor: pointer;
  display: inline-block;
  flex: 0 0 44px;
  height: 44px !important;
  margin: 0 !important;
  max-height: none;
  min-height: 44px !important;
  min-width: 44px !important;
  outline: none;
  padding: 11px !important;
  position: relative;
  vertical-align: middle;
  width: 44px !important;
  -webkit-mask-image: none;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper :is(.jdd-admin-table, .jdd-audit-table) :is(th.select-all, th.table-select, td.table-select) input[type='checkbox']::before {
  border: 2px solid #6716aa;
  border-radius: 5px;
  box-sizing: border-box;
  content: '';
  height: 22px;
  left: 11px;
  position: absolute;
  top: 11px;
  width: 22px;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper :is(.jdd-admin-table, .jdd-audit-table) :is(th.select-all, th.table-select, td.table-select) input[type='checkbox']:focus-visible {
  border-radius: 8px;
  box-shadow: none;
  outline: 3px solid #9d4edd !important;
  outline-offset: 2px !important;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper :is(.jdd-admin-table, .jdd-audit-table) :is(th.select-all, th.table-select, td.table-select) input[type='checkbox']:disabled {
  cursor: not-allowed;
  opacity: .55;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper :is(.jdd-admin-table, .jdd-audit-table) :is(th.select-all, th.table-select, td.table-select) input[type='checkbox']:checked {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 22'%3E%3Crect width='22' height='22' rx='5' fill='%236716aa'/%3E%3Cpath d='m5 11 4 4 8-8' fill='none' stroke='white' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper :is(.jdd-admin-table, .jdd-audit-table) :is(th.select-all, th.table-select, td.table-select) input[type='checkbox']:indeterminate {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 22'%3E%3Crect width='22' height='22' rx='5' fill='%236716aa'/%3E%3Cpath d='M5 11h12' stroke='white' stroke-width='2.5' stroke-linecap='round'/%3E%3C/svg%3E");
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper :is(.jdd-admin-table, .jdd-audit-table) tbody tr:is(.is-selected, .selected) > td,
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper :is(.jdd-admin-table, .jdd-audit-table):has(> thead th.select-all) tbody tr:is(.is-selected, .selected) > td.views-field-name {
  background-color: #f3e8ff !important;
}
@container jdd-form (min-width: 768px) {
  html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper :is(.jdd-form-panel, .jda-account-section--identity) > .fieldset-wrapper {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content form:not([id^="simplenews-subscriptions-block"]):not(.layout-builder-form) :is(.container-inline, .address-container-inline):not(.vehicle-capture-react-shell *):not(.cyb-review-star-input *) {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@container jdd-canvas (max-width: 767px) {
  html body.path-dashboard #wrapper #page-wrapper .jdd-workspace-header {
    --jdd-workspace-header-inline-padding: 1rem;
  }
  html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .jdd-workspace-header {
    border-radius: 18px;
    gap: 1rem;
    grid-template-columns: minmax(0, 1fr);
    padding: 1.35rem 1rem 0;
  }
  html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .jdd-workspace-header__action {
    grid-column: 1;
    grid-row: 2;
    justify-self: stretch;
    width: 100%;
  }
  html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .jdd-workspace-header__meta {
    border-radius: 12px;
    font-size: .8125rem;
  }
  html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content form:not([id^="simplenews-subscriptions-block"]):not(.layout-builder-form) :is(fieldset, details.jdd-form-panel):not(.vehicle-capture-react-shell *):not(.vehicle-capture-react-shell):not(.cyb-review-star-input *),
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper :is(.jdd-filter-bar, .jda-financial-filters),
html body.path-dashboard #wrapper #page-wrapper :is(.jdd-entity-form:not(.jdd-admin-workspace), .jda-account-form) {
    padding: 16px;
  }
  html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content form:not([id^="simplenews-subscriptions-block"]):not(.layout-builder-form) :is(.form-actions, [data-drupal-selector^='edit-actions']):not(.vehicle-capture-react-shell *):not(.cyb-review-star-input *) {
    align-items: stretch;
    flex-direction: column;
  }
  html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content form:not([id^="simplenews-subscriptions-block"]):not(.layout-builder-form) :is(.form-actions, [data-drupal-selector^='edit-actions']) > :is(input[type='submit'], input[type='button'], input[type='reset'], button, a):not(.vehicle-capture-react-shell *):not(.cyb-review-star-input *),
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper :is(.jdd-filter-bar, .jdd-bulk-actions) > :is(input[type='submit'], button.button) {
    width: 100%;
  }
  html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper :is(.jdd-filter-bar, .jdd-bulk-actions, fieldset[data-drupal-selector^='edit-bulk']) {
    align-items: stretch;
    flex-direction: column;
  }
  html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper :is(.jdd-filter-bar, .jdd-bulk-actions, fieldset[data-drupal-selector^='edit-bulk']) > .form-item,
  html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper fieldset[data-drupal-selector^='edit-bulk'] > .fieldset-wrapper > .form-item {
    flex: 0 0 auto;
    width: 100%;
  }
  html body.path-dashboard #wrapper #page-wrapper .jdd-filter-bar .jdd-sort-controls {
    display: grid;
    gap: 1rem;
    grid-template-columns: minmax(0, 1fr);
    width: 100%;
  }
  html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .jdd-bulk-actions .jdd-bulk-action-controls {
    align-items: stretch;
    flex: 0 0 auto;
    flex-direction: column;
    width: 100%;
  }
  html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .jdd-bulk-action-controls > :is(.form-item, .form-actions),
  html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .jdd-selected-count {
    flex: 0 0 auto;
    width: 100%;
  }
}
/* The legacy audit skin stacks ordinary tables through 767px. Selection
   tables retain the native Tablesaw columns from 640px, including tablets. */
@media (min-width: 40em) and (max-width: 767px) {
  html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .jdd-audit-table-wrap:has(.jdd-audit-table > thead th.select-all) {
    overflow-x: auto;
    overflow-y: hidden;
  }
  html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper :is(.jdd-admin-table, .jdd-audit-table):has(> thead th.select-all) {
    display: table;
    min-width: 780px !important;
  }
  html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper :is(.jdd-admin-table, .jdd-audit-table):has(> thead th.select-all) > thead {
    clip: auto;
    clip-path: none;
    display: table-header-group;
    height: auto;
    overflow: visible;
    position: static;
    white-space: normal;
    width: auto;
  }
  html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper :is(.jdd-admin-table, .jdd-audit-table):has(> thead th.select-all) > tbody {
    display: table-row-group;
    width: auto;
  }
  html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper :is(.jdd-admin-table, .jdd-audit-table):has(> thead th.select-all) > tbody > tr {
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    display: table-row !important;
    margin: 0;
    padding: 0;
    width: auto !important;
  }
  html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper :is(.jdd-admin-table, .jdd-audit-table):has(> thead th.select-all) > tbody > tr > :is(td, th) {
    border-bottom: 1px solid #e9dfed;
    clear: none !important;
    display: table-cell !important;
    padding: .78rem .65rem;
    width: auto !important;
  }
  html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper :is(.jdd-admin-table, .jdd-audit-table):has(> thead th.select-all) td::before,
  html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper :is(.jdd-admin-table, .jdd-audit-table):has(> thead th.select-all) .tablesaw-cell-label {
    content: none !important;
    display: none !important;
  }
}
/* Tablesaw cards stack below 640px, with selection at the leading corner. */
@media (max-width: 39.9375em) {
  html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper :is(.jdd-admin-table, .jdd-audit-table) td.table-select {
    align-items: center;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none;
    display: flex !important;
    height: 44px;
    justify-content: center;
    max-width: 44px;
    padding: 0 !important;
    position: absolute;
    inset-inline-start: .65rem;
    inset-inline-end: auto;
    top: .55rem;
    width: 44px !important;
    z-index: 2;
  }
  html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper :is(.jdd-admin-table, .jdd-audit-table) tbody tr { position: relative; }
  html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper :is(.jdd-admin-table, .jdd-audit-table) td.table-select :is(.tablesaw-cell-content, .form-item) {
    align-items: center;
    display: flex;
    height: 44px;
    justify-content: center;
    margin: 0;
    padding: 0;
    width: 44px;
  }
  html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper :is(.jdd-admin-table, .jdd-audit-table) td.table-select::before,
  html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper :is(.jdd-admin-table, .jdd-audit-table) td.table-select .tablesaw-cell-label { display: none !important; content: none !important; }
  html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper :is(.jdd-admin-table, .jdd-audit-table):has(> thead th.select-all) td.views-field-name {
    border-bottom: 1px solid #eee5f2 !important;
    display: grid !important;
    padding: .6rem 0 !important;
  }
  html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper :is(.jdd-admin-table, .jdd-audit-table):has(> thead th.select-all) td.table-select + td,
  html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper :is(.jdd-admin-table, .jdd-audit-table):has(> thead th.select-all) td.table-select + td.views-field-name {
    min-height: 44px;
    padding-inline-start: 3.5rem !important;
    padding-inline-end: 0 !important;
  }
  /* Keep select-all reachable on phones without hiding its native semantics. */
  html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper :is(.jdd-admin-table, .jdd-audit-table) > thead:has(th.select-all) {
    clip: auto;
    clip-path: none;
    display: block;
    height: auto;
    overflow: visible;
    position: static;
    width: 100%;
  }
  html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper :is(.jdd-admin-table, .jdd-audit-table) > thead:has(th.select-all) tr {
    display: flex;
    justify-content: flex-start;
    width: 100%;
  }
  html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper :is(.jdd-admin-table, .jdd-audit-table) > thead:has(th.select-all) th:not(.select-all) {
    clip-path: inset(50%);
    height: 1px;
    overflow: hidden;
    position: absolute;
    width: 1px;
  }
  html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper :is(.jdd-admin-table, .jdd-audit-table) > thead th.select-all {
    align-items: center;
    background: transparent !important;
    border: 0;
    border-radius: 0;
    display: flex !important;
    margin: 0 0 .5rem;
    padding: 0 !important;
    width: auto !important;
    position: static !important;
    clip: auto !important;
    clip-path: none !important;
    overflow: visible !important;
    height: auto !important;
    min-height: 44px !important;
    max-width: 100% !important;
    white-space: normal !important;
    pointer-events: auto !important;
  }
}
@media (forced-colors: active) {
  html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper :is(.jdd-admin-table, .jdd-audit-table) :is(th.select-all, th.table-select, td.table-select) input[type='checkbox'] {
    appearance: auto;
    background: Canvas;
    forced-color-adjust: auto;
    padding: 0 !important;
  }
  html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper :is(.jdd-admin-table, .jdd-audit-table) input[type='checkbox']::before { content: none; }
}
@media (prefers-reduced-motion: reduce) {
  html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content form:not([id^="simplenews-subscriptions-block"]):not(.layout-builder-form) :is(input, select, textarea, button, a) { transition: none !important; }
}
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-account-form { padding: 24px; }
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-financial-filters .form--inline {
  display: grid;
  flex: 1 1 100%;
  gap: 1rem;
  grid-template-columns: minmax(0, 1fr);
  min-width: 0;
}
html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-financial-filters .form--inline .form-actions { grid-column: 1 / -1; }
@container jdd-canvas (min-width: 768px) {
  html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-financial-filters .form--inline { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@container jdd-canvas (max-width: 767px) {
  html body.path-user.jda-account-workspace #wrapper #page-wrapper .jda-account-form { padding: 16px; }
}
/* Record and section actions retain their destinations with comfortable targets. */
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper :is(.jdd-actions, .jdd-section-heading__actions, .jdd-back) > a:not(.vehicle-capture-react-shell *) {
  align-items: center;
  display: inline-flex;
  justify-content: center;
  min-height: 44px;
  min-width: 44px;
  overflow-wrap: anywhere;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper :is(.jdd-actions, .jdd-section-heading__actions, .jdd-back) > a:not(.jdd-button):not(.vehicle-capture-react-shell *) { padding: .6rem .75rem; }
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content form details.jdd-form-panel {
  padding: 0 !important;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content form details.jdd-form-panel > summary {
  background: #faf5ff;
  border-radius: 15px;
  color: #3b0a5c;
  cursor: pointer;
  display: list-item;
  font-size: 1.125rem;
  font-weight: 800;
  line-height: 1.4;
  min-height: 48px;
  padding: 24px;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content form details.jdd-form-panel[open] > summary { border-bottom: 1px solid #d5b8ef; border-radius: 15px 15px 0 0; }
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content form details.jdd-form-panel > .details-wrapper { min-width: 0; padding: 24px; }
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content form :is([data-drupal-selector$="-delete-form"], [data-drupal-selector="johnny-detail-dashboard-bulk-delete-confirm"]) { min-width: 0; }
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content form:is([data-drupal-selector$="-delete-form"], [data-drupal-selector="johnny-detail-dashboard-bulk-delete-confirm"]) .form-actions input[type='submit']:not(.vehicle-capture-react-shell *) {
  background: #9d2535 !important;
  border-color: #6f1522 !important;
  color: #fff !important;
}
@container jdd-form (min-width: 768px) {
  html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content form details.jdd-form-panel[open] > .details-wrapper { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem; }
  html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content form details.jdd-form-panel > .details-wrapper > :is(.field--type-address, .form-type-address, :has(.address-container-inline)) { grid-column: 1 / -1; }
}
@container jdd-canvas (max-width: 767px) {
  html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content form details.jdd-form-panel { padding: 0 !important; }
  html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content form details.jdd-form-panel > :is(summary, .details-wrapper) { padding: 16px; }
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .jdd-workspace-nav-scroll[data-jdd-nav-scroll='previous'] { grid-column: 1; grid-row: 1; }
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .jdd-workspace-nav-scroll[data-jdd-nav-scroll='next'] { grid-column: 3; grid-row: 1; }

/* Native disclosures share the workspace field treatment. The responsive
   section-navigation disclosure remains owned by the existing header. */
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content details:not(.jdd-section-nav-disclosure):not(.vehicle-capture-react-shell *) {
  background: #fff;
  border: 1px solid #d5b8ef;
  border-radius: 16px;
  box-shadow: 0 5px 18px #3b0a5c08;
  box-sizing: border-box;
  margin: 0 0 1.25rem;
  max-width: 100%;
  min-width: 0;
  padding: 0 !important;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content details:not(.jdd-section-nav-disclosure):not(.vehicle-capture-react-shell *) > summary {
  align-items: center;
  background: #faf5ff;
  border: 0;
  border-radius: 15px;
  box-sizing: border-box;
  color: #3b0a5c !important;
  cursor: pointer;
  display: flex;
  gap: .8rem;
  font-size: 1rem;
  font-weight: 800;
  line-height: 1.45;
  list-style: none;
  margin: 0;
  min-height: 48px;
  overflow-wrap: anywhere;
  padding: 20px;
  position: relative;
  transition: background-color .16s ease;
  white-space: normal;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content details:not(.jdd-section-nav-disclosure):not(.vehicle-capture-react-shell *) > summary::-webkit-details-marker { display: none; }
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content details:not(.jdd-section-nav-disclosure):not(.vehicle-capture-react-shell *) > summary::marker { content: ''; }
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content details:not(.jdd-section-nav-disclosure):not(.vehicle-capture-react-shell *) > summary::before {
  background: transparent;
  border: 0;
  border-right: 2px solid #6716aa;
  border-bottom: 2px solid #6716aa;
  content: '';
  flex: 0 0 9px;
  height: 9px;
  position: static;
  transform: rotate(-45deg);
  transition: transform .18s ease;
  width: 9px;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content details:not(.jdd-section-nav-disclosure):not(.vehicle-capture-react-shell *)[open] > summary {
  border-bottom: 1px solid #d5b8ef;
  border-radius: 15px 15px 0 0;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content details:not(.jdd-section-nav-disclosure):not(.vehicle-capture-react-shell *)[open] > summary::before { transform: rotate(45deg); }
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content details:not(.jdd-section-nav-disclosure):not(.vehicle-capture-react-shell *) > summary:hover { background: #f3e8ff; }
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content details:not(.jdd-section-nav-disclosure):not(.vehicle-capture-react-shell *) > summary:focus-visible {
  outline: 3px solid #6716aa;
  outline-offset: 3px;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content details:not(.jdd-section-nav-disclosure):not(.vehicle-capture-react-shell *) > .details-wrapper { min-width: 0; padding: 20px; }
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content details:not(.jdd-section-nav-disclosure):not(.vehicle-capture-react-shell *):not(.jdd-form-panel) > :not(summary, .details-wrapper) { margin: 20px; max-width: calc(100% - 40px); min-width: 0; }
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content form :is(input, textarea)::placeholder { color: #786480; opacity: 1; }
/* Preserve HTML5 calendar/time editing; suppress only the tiny spinner glyph,
   leaving valid values and keyboard increments under the browser's control. */
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content form :is(input[type='date'], input[type='time'], input[type='datetime-local']) {
  color-scheme: light;
  min-width: 0;
  overflow: visible;
  -webkit-appearance: none;
}
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content form :is(input[type='date'], input[type='time'], input[type='datetime-local'])::-webkit-inner-spin-button { display: none; }
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content form :is(input[type='date'], input[type='time'], input[type='datetime-local'])::-webkit-datetime-edit { min-width: 0; padding: 0; }
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content form :is(input[type='date'], input[type='time'], input[type='datetime-local'])::-webkit-datetime-edit-fields-wrapper { padding: 0; }
html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content form input[type='file']:not(.vehicle-capture-react-shell *)::file-selector-button { min-height: 44px; white-space: normal; }

/* Sort labels and icons inherit the white header foreground, even when a
   generic theme link rule has a more specific purple color. */
html body:is(.path-dashboard, .path-user) #wrapper #page-wrapper :is(.jdd-admin-table, .jdd-audit-table, .jdd-responsive-table) > thead :is(th, td):not(.select-all, .jdd-selection-header) {
  background: #3b0a5c !important;
  color: #fff !important;
  overflow-wrap: anywhere;
}
html body:is(.path-dashboard, .path-user) #wrapper #page-wrapper :is(.jdd-admin-table, .jdd-audit-table, .jdd-responsive-table) > thead :is(th, td):not(.select-all, .jdd-selection-header) :is(a, button, span, strong, label):not(.jd-selectify-widget *) { color: #fff !important; }
html body:is(.path-dashboard, .path-user) #wrapper #page-wrapper :is(.jdd-admin-table, .jdd-audit-table, .jdd-responsive-table) > thead .tablesort { filter: brightness(0) invert(1); }
html body:is(.path-dashboard, .path-user) #wrapper #page-wrapper :is(.jdd-admin-table, .jdd-audit-table, .jdd-responsive-table) > thead a:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }

@media (max-width: 767px) {
  html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content details:not(.jdd-section-nav-disclosure):not(.vehicle-capture-react-shell *) > :is(summary, .details-wrapper) { padding: 16px; }
  html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content details:not(.jdd-section-nav-disclosure):not(.vehicle-capture-react-shell *):not(.jdd-form-panel) > :not(summary, .details-wrapper) { margin: 16px; max-width: calc(100% - 32px); }
  html body:is(.path-dashboard, .path-user) #wrapper #page-wrapper .jdd-audit-table :is(.tablesaw-cell-label, .tablesaw-cell-label a) { color: #3b0a5c !important; }
  html body:is(.path-dashboard, .path-user) #wrapper #page-wrapper .jdd-audit-table td[data-label]:not(:has(.tablesaw-cell-label))::before { color: #3b0a5c; }
  html body:is(.path-dashboard, .path-user) #wrapper #page-wrapper .jdd-audit-table :is(input, select, textarea) { box-sizing: border-box; max-width: 100%; min-width: 0; }
}
@media (prefers-reduced-motion: reduce) {
  html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content details:not(.jdd-section-nav-disclosure):not(.vehicle-capture-react-shell *) > summary,
  html body:is(.path-dashboard, .path-user.jda-account-workspace) #wrapper #page-wrapper .main-content details:not(.jdd-section-nav-disclosure):not(.vehicle-capture-react-shell *) > summary::before { transition: none; }
}

/* assets/css/btcpay-payments.css */
/* Private account and checkout payment presentation; provider state stays native. */
:root {
  /* Also loaded by the Johnny Detail BTCPay store's cssUrl. */
  --btcpay-primary-100: #faf5ff;
  --btcpay-primary-200: #f3e8ff;
  --btcpay-primary-300: #e6ccff;
  --btcpay-primary-400: #c58bf4;
  --btcpay-primary-500: #9d4edd;
  --btcpay-primary-600: #6716aa;
  --btcpay-primary-700: #57138e;
  --btcpay-primary-800: #3b0a5c;
  --btcpay-primary-900: #241438;
  --btcpay-primary-rgb: 103, 22, 170;
  --btcpay-primary-accent-rgb: 59, 10, 92;
  --btcpay-primary: rgb(var(--btcpay-primary-rgb));
  --btcpay-primary-accent: rgb(var(--btcpay-primary-accent-rgb));
  --btcpay-primary-shadow: rgba(var(--btcpay-primary-rgb), .35);
}

html body.path-user #wrapper .jd-payments,
html body.path-dashboard #wrapper .jd-payments,
html body.path-checkout #wrapper .jd-bitcoin-payment {
  --jd-payment-purple: #6716aa;
  --jd-payment-ink: #241438;
  color: var(--jd-payment-ink);
}

html body.path-user #wrapper .jd-payments-table,
html body.path-dashboard #wrapper .jd-payments-table {
  width: 100%;
  margin-block: 1.5rem;
  border-collapse: collapse;
  background: #fff;
}

html body.path-user #wrapper .jd-payments-table th,
html body.path-dashboard #wrapper .jd-payments-table th {
  background: #f3f1f6;
  color: #241438;
}

html body.path-user #wrapper .jd-payments-table :is(th, td),
html body.path-dashboard #wrapper .jd-payments-table :is(th, td) {
  padding: .875rem;
  text-align: left;
  border-bottom: 1px solid #ddd4e8;
  overflow-wrap: anywhere;
}

html body.path-user #wrapper .jd-payments a,
html body.path-dashboard #wrapper .jd-payments a {
  color: var(--jd-payment-purple);
}

html body.path-user #wrapper .jd-payments :is(a, button, input, select, textarea):focus-visible,
html body.path-dashboard #wrapper .jd-payments :is(a, button, input, select, textarea):focus-visible,
html body.path-checkout #wrapper .jd-bitcoin-payment :is(a, button, input):focus-visible {
  outline: 3px solid #6716aa;
  outline-offset: 3px;
}

html body.path-user #wrapper .jd-payments .button,
html body.path-dashboard #wrapper .jd-payments .button,
html body.path-dashboard #wrapper .jd-payments-filters button,
html body.path-checkout #wrapper .jd-bitcoin-payment .button,
html body.path-checkout #wrapper .jd-bitcoin-payment input[type="submit"] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  margin: .5rem .75rem .5rem 0;
  padding: .65rem 1rem;
  border: 1px solid #6716aa;
  border-radius: .5rem;
  background: #6716aa;
  color: #fff;
  font-weight: 700;
  text-align: center;
  white-space: normal;
}

html body.path-user #wrapper .jd-payments .button:hover,
html body.path-dashboard #wrapper .jd-payments .button:hover,
html body.path-checkout #wrapper .jd-bitcoin-payment .button:hover {
  background: #3b0a5c;
  color: #fff;
}

html body.path-dashboard #wrapper .jd-payments-filters {
  display: flex;
  align-items: end;
  flex-wrap: wrap;
  gap: 1rem;
}

html body.path-dashboard #wrapper .jd-payments-filters select {
  min-height: 44px;
}

html body.path-user #wrapper .jd-payments :is(input[type="text"], textarea),
html body.path-dashboard #wrapper .jd-payments :is(input[type="text"], textarea) {
  max-width: 100%;
}

html body:is(.path-user, .path-dashboard) #wrapper #page-wrapper .main-content .jd-payments > p {
  padding: 0;
  border: 0 !important;
  border-radius: 0;
  background: transparent !important;
  box-shadow: none;
  color: #241438 !important;
  text-shadow: none;
}

html body:is(.path-user, .path-dashboard) #wrapper .jd-payment-details {
  display: grid;
  grid-template-columns: minmax(7rem, 1fr) minmax(0, 2fr);
  margin-block: 1.5rem;
  border: 1px solid #ddd4e8;
  border-radius: .75rem;
  overflow: hidden;
  background: #fff;
}

html body:is(.path-user, .path-dashboard) #wrapper .jd-payment-details :is(dt, dd) {
  min-width: 0;
  margin: 0;
  padding: .875rem;
  border-bottom: 1px solid #eee5f5;
  overflow-wrap: anywhere;
}

html body:is(.path-user, .path-dashboard) #wrapper .jd-payment-details dt {
  background: #faf5ff;
  font-weight: 700;
}

html body:is(.path-user, .path-dashboard) #wrapper .jd-payment-details :is(dt, dd):nth-last-child(-n+2) {
  border-bottom: 0;
}

html body:is(.path-user, .path-dashboard) #wrapper #page-wrapper .main-content form.jd-payments :is(.form-type-radio, .js-form-type-radio) {
  justify-content: flex-start;
  gap: .75rem;
}

html body:is(.path-user, .path-dashboard) #wrapper #page-wrapper .main-content form.jd-payments :is(.form-type-radio, .js-form-type-radio) > label {
  flex: 1;
  justify-content: flex-start;
  width: auto;
  text-align: left;
}

html body.path-checkout #wrapper .jd-bitcoin-payment {
  max-width: 48rem;
  margin-inline: auto;
  padding: clamp(1rem, 3vw, 2rem);
  border: 1px solid #ddd4e8;
  border-radius: 1rem;
  background: #faf5ff;
  box-shadow: 0 .5rem 1.5rem #2414380d;
}

html body.path-checkout #wrapper .jd-btcpay-status {
  margin-bottom: 1rem;
  padding: 1rem;
  border-left: 4px solid #6716aa;
  border-radius: .375rem;
  background: #f3f1f6;
}

html body.path-checkout #wrapper .jd-btcpay-status p {
  margin: 0;
}

html body.path-checkout #wrapper .jd-btcpay-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  margin-top: 1rem;
}

@media (max-width: 575px) {
  html body.path-user #wrapper .jd-payments-table,
  html body.path-dashboard #wrapper .jd-payments-table {
    font-size: .875rem;
  }

  html body.path-user #wrapper .jd-payments-table :is(th, td),
  html body.path-dashboard #wrapper .jd-payments-table :is(th, td) {
    padding: .625rem .375rem;
  }

  html body.path-dashboard #wrapper .jd-payments-filters > * {
    width: 100%;
  }

  html body:is(.path-user, .path-dashboard) #wrapper .jd-payment-details {
    grid-template-columns: minmax(6rem, .8fr) minmax(0, 1.2fr);
  }

  html body:is(.path-user, .path-dashboard) #wrapper .jd-payment-details :is(dt, dd) {
    padding: .75rem .625rem;
  }

  html body.path-checkout #wrapper .jd-bitcoin-payment .button,
  html body.path-checkout #wrapper .jd-btcpay-actions input[type="submit"] {
    width: 100%;
    margin-right: 0;
  }
}

/* assets/css/dashboard-selectify.css */
/* Selectify keeps native controls visible until initialization succeeds. */
html body .jd-selectify-control {
  --r-bg: #fff;
  --r-br: #d8c7e8;
  --r-tx: #241438;
  --selectify-select-color: #241438;
  --selectify-select-arrow-color: #6716aa;
  --selectify-select-border-color: #d8c7e8;
  --selectify-placeholder-color: #756380;
  position: relative;
  display: block;
  inline-size: 100%;
  min-inline-size: 0;
  max-inline-size: 100%;
  background: transparent;
}

/* Legacy form-label widths must not enlarge intentionally hidden row labels. */
html body label:is(.sr-only, .visually-hidden):has(+ .jd-selectify-control),
html body #wrapper label:is(.sr-only, .visually-hidden):has(+ .jd-selectify-control) {
  position: absolute !important;
  inline-size: 1px !important;
  block-size: 1px !important;
  min-inline-size: 0 !important;
  max-inline-size: 1px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
}

html body .jd-selectify-control:not(.jd-selectify-ready) .jd-selectify-widget {
  display: none !important;
}

html body .jd-selectify-control > select:not(.selectify-visually-hidden) {
  inline-size: 100%;
  max-inline-size: 100%;
  min-block-size: 48px;
  border: 1px solid #d8c7e8;
  border-radius: 12px;
  padding: .625rem .875rem;
  background: #fff;
  color: #241438;
}

html body .jd-selectify-ready > select.selectify-visually-hidden {
  position: absolute !important;
  inline-size: 1px !important;
  block-size: 1px !important;
  min-inline-size: 0 !important;
  min-block-size: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  clip-path: inset(50%) !important;
}

html body .jd-selectify-ready .jd-selectify-widget {
  position: relative;
  display: block;
  inline-size: 100%;
  min-inline-size: 0;
  max-inline-size: 100%;
  font: inherit;
  color: #241438;
  cursor: pointer;
}

html body .jd-selectify-widget.selectify-select-dropdowns .selectify-selected-display {
  display: flex;
  inline-size: 100%;
  min-inline-size: 0;
  min-block-size: 48px;
  gap: .625rem;
  padding: .625rem .875rem;
  border: 1px solid #d8c7e8;
  border-radius: 12px !important;
  background: #fff;
  color: #241438;
  align-items: center;
  justify-content: space-between;
  transition: border-color 180ms ease, box-shadow 180ms ease;
}

html body .jd-selectify-widget .jd-selectify-value {
  display: block;
  min-inline-size: 0;
  overflow-wrap: anywhere;
  white-space: normal;
  text-align: start;
  line-height: 1.45;
  font-size: 1rem;
}

html body .jd-selectify-widget .selectify-dorpdown-arrow {
  flex: 0 0 20px;
  inline-size: 20px;
  color: #6716aa;
}

html body .jd-selectify-widget .selectify-dorpdown-arrow svg {
  display: block;
  inline-size: 20px;
  block-size: 20px;
}

html body .jd-selectify-widget:hover .selectify-selected-display {
  border-color: #9d4edd;
}

html body .jd-selectify-widget:focus-visible,
html body .jd-selectify-widget .selectify-available-one-option:focus-visible,
html body .jd-selectify-widget .selectify-clear-all:focus-visible {
  outline: 3px solid #9d4edd;
  outline-offset: 3px;
  border-radius: 12px;
}

html body .jd-selectify-widget[aria-expanded="true"] .selectify-selected-display {
  border-color: #6716aa;
  box-shadow: 0 0 0 3px #f3e8ff;
}

html body .jd-selectify-widget[aria-disabled="true"] {
  cursor: not-allowed;
}

html body .jd-selectify-widget[aria-disabled="true"] .selectify-selected-display {
  background: #f3f1f6;
  border-color: #e1d8e8;
  color: #756380;
}

html body .jd-selectify-widget[aria-invalid="true"] .selectify-selected-display {
  border-color: #b42332;
}

html body .jd-selectify-control .jd-selectify-error {
  margin: .375rem 0 0;
  color: #b42332;
  font-size: .875rem;
  line-height: 1.4;
  white-space: normal;
  overflow-wrap: anywhere;
}

html body .jd-selectify-widget.selectify-select-dropdowns .jd-selectify-panel {
  position: fixed !important;
  inset: auto !important;
  top: var(--jd-selectify-top, 0) !important;
  left: var(--jd-selectify-left, 0) !important;
  inline-size: var(--jd-selectify-width, 100%) !important;
  min-inline-size: 0 !important;
  max-inline-size: calc(100vw - 16px);
  max-block-size: var(--jd-selectify-height, 352px) !important;
  margin: 0 !important;
  padding: 4px !important;
  overflow: auto;
  overscroll-behavior: contain;
  border: 1px solid #d8c7e8;
  border-radius: 12px !important;
  background: #fff;
  color: #241438;
  box-shadow: 0 8px 28px #24143826;
  z-index: 10000;
}

html body .jd-selectify-widget .jd-selectify-panel:not(.toggled) {
  display: none !important;
}

html body .jd-selectify-widget .jd-selectify-panel.toggled {
  display: block !important;
}

html body .jd-selectify-panel::backdrop {
  background: transparent;
}

html body .jd-selectify-widget .selectify-available-one-option {
  display: flex;
  min-block-size: 44px;
  padding: .625rem .75rem;
  border-radius: 8px;
  background: #fff;
  color: #241438;
  font-size: 1rem;
  line-height: 1.4;
  white-space: normal;
  overflow-wrap: anywhere;
  align-items: center;
}

html body .jd-selectify-widget .selectify-available-one-option .option-label {
  white-space: normal;
  line-height: 1.4;
}

html body .jd-selectify-widget .selectify-available-one-option:hover,
html body .jd-selectify-widget .selectify-available-one-option:focus {
  background: #f3e8ff;
  color: #3b0a5c;
}

html body .jd-selectify-widget .selectify-available-one-option[aria-selected="true"] {
  background: #6716aa;
  color: #fff;
}

html body .jd-selectify-widget .selectify-available-one-option[aria-disabled="true"] {
  opacity: .55;
  cursor: not-allowed;
}

html body .jd-selectify-widget .search-input {
  position: sticky;
  top: 0;
  z-index: 1;
  padding: 4px;
  background: #fff;
}

html body .jd-selectify-widget .search-input input.multi-search-input {
  min-block-size: 44px;
  inline-size: 100%;
  margin: 0;
  padding: .625rem .75rem;
  border: 1px solid #d8c7e8;
  border-radius: 8px;
  background: #fff;
  color: #241438;
  font-size: 16px;
}

html body .jd-selectify-widget .selectify-select-footer {
  position: static;
  padding: 4px;
  background: #fff;
}

html body .jd-selectify-widget .selectify-clear-all {
  min-block-size: 44px;
  padding: .5rem .875rem;
  border: 1px solid #d8c7e8;
  border-radius: 8px;
  background: #f3e8ff;
  color: #6716aa;
  font-size: .875rem;
}

html body .jd-selectify-widget .selectify-clear-all[hidden] {
  display: none !important;
}

html body .jd-selectify-group-label {
  padding: .5rem .75rem;
  color: #6716aa;
  font-size: .875rem;
  font-weight: 700;
}

html body .jd-selectify-widget .jd-selectify-panel .jd-selectify-optgroup {
  border-block-start: 1px solid #f3e8ff;
}

/* Extlink's decorative SVG adds no text and preserves destinations/targets. */
html body a.ext > svg.ext,
html body #wrapper a.ext > svg.ext {
  display: inline-block;
  inline-size: .8em;
  block-size: .8em;
  margin-inline-start: .25em;
  padding: 0;
  color: #6716aa !important;
  fill: currentColor !important;
  vertical-align: -.05em;
}

html body a.ext > svg.ext path,
html body #wrapper a.ext > svg.ext path {
  fill: currentColor !important;
  stroke: currentColor !important;
  stroke-width: 2;
}

html body .social_footer_ul a.ext,
html body footer a.ext:has(> i),
html body .jd-site-footer a.ext:has(> i) {
  position: relative;
}

html body .social_footer_ul a.ext > svg.ext,
html body footer a.ext:has(> i) > svg.ext,
html body .jd-site-footer a.ext:has(> i) > svg.ext {
  position: absolute;
  inset-block-start: 2px;
  inset-inline-end: 2px;
  inline-size: 10px;
  block-size: 10px;
  margin: 0;
  color: #6716aa;
  padding: 1px;
  border-radius: 2px;
  background: #fff;
}

html body :is(.jdd-workspace-header, .jdd-button--primary, .jdd-primary-actions) a.ext > svg.ext,
html body #wrapper :is(.jdd-workspace-header, .jdd-button--primary, .jdd-primary-actions) a.ext > svg.ext,
html body a.ext.button--primary > svg.ext,
html body #wrapper a.ext.button--primary > svg.ext {
  color: #fff !important;
}

@media (prefers-reduced-motion: reduce) {
  html body .jd-selectify-widget *,
  html body .jd-selectify-panel * {
    transition: none !important;
  }
}

/* assets/css/account-giftcards.css */
/* Account wallet and booking payments; shared workspace headers stay unchanged. */
html body.path-dashboard #wrapper .jd-account-hub__nav.jdd-account-nav {
  background: #fff;
  border: 1px solid #e5d6ef;
  border-radius: 16px;
  box-shadow: none;
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
  justify-content: flex-start;
  height: auto;
  max-height: none;
  overflow: visible;
  padding: .65rem;
}
html body.path-dashboard #wrapper .jd-account-hub__nav.jdd-account-nav a {
  border-radius: 10px;
  color: #3b0a5c;
  min-height: 44px;
  padding: .65rem .8rem;
  white-space: normal;
}
html body.path-dashboard #wrapper .jd-account-hub__nav.jdd-account-nav a:is(.is-active, :hover, :focus-visible) {
  background: #6716aa;
  border-color: #6716aa;
  color: #fff;
  transform: none;
}
html body.path-dashboard #wrapper .giftcard-wallet {
  margin: 0 auto 3rem;
  max-width: 100%;
  min-width: 0;
}
html body.path-dashboard #wrapper .giftcard-portal,
html body.path-dashboard #wrapper .giftcard-portal-form {
  border-color: #d8c9e3;
  border-radius: 20px;
  box-shadow: 0 8px 24px rgb(59 10 92 / 7%);
  color: #292331;
  min-width: 0;
  padding: clamp(1rem, 2.5vw, 1.75rem);
}
html body.path-dashboard #wrapper .giftcard-portal__heading h2,
html body.path-dashboard #wrapper .giftcard-portal > h2 {
  color: #3b0a5c;
  font-size: clamp(1.3rem, 2vw, 1.65rem);
  line-height: 1.25;
  margin-bottom: .5rem;
}
html body.path-dashboard #wrapper .giftcard-portal__heading p,
html body.path-dashboard #wrapper .giftcard-portal > p,
html body.path-dashboard #wrapper .giftcard-portal__deposits > p {
  color: #62596b !important;
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
  box-shadow: none !important;
  text-shadow: none !important;
  line-height: 1.6;
  margin: 0;
}
html body.path-dashboard #wrapper .giftcard-portal__summary {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr));
  margin: 1.25rem 0;
  scroll-margin-top: 10rem;
}
html body.path-dashboard #wrapper .giftcard-portal__total {
  background: linear-gradient(135deg, #3b0a5c, #6716aa);
  border: 1px solid #3b0a5c;
  border-radius: 16px;
  color: #fff;
  display: grid;
  gap: .4rem;
  padding: 1.25rem;
}
html body.path-dashboard #wrapper .giftcard-portal__total span {
  color: #f3e8ff;
  font-size: .9rem;
  line-height: 1.5;
}
html body.path-dashboard #wrapper .giftcard-portal__total strong {
  color: #fff;
  font-size: clamp(1.65rem, 3vw, 2.4rem);
  font-variant-numeric: tabular-nums;
  line-height: 1.2;
}
html body.path-dashboard #wrapper .giftcard-portal__total--count {
  background: #faf5ff;
  border-color: #d8c9e3;
}
html body.path-dashboard #wrapper .giftcard-portal__total--count :is(span, strong) { color: #3b0a5c; }
html body.path-dashboard #wrapper .giftcard-portal__help { font-size: .92rem; line-height: 1.65; margin-bottom: 1.25rem; }
html body.path-dashboard #wrapper .giftcard-deposits-workspace > .giftcard-portal__help {
  background: #faf5ff !important;
  border: 1px solid #d8c9e3 !important;
  border-radius: 12px;
  box-shadow: none !important;
  color: #62596b !important;
  padding: 1rem !important;
  text-shadow: none !important;
}
html body.path-dashboard #wrapper .giftcard-portal__cards { margin-top: 1.5rem; }
html body.path-dashboard #wrapper .giftcard-portal__card {
  background: #fff;
  border-color: #d8c9e3;
  border-radius: 16px;
  display: flex;
  flex-direction: column;
}
html body.path-dashboard #wrapper .giftcard-portal__card-heading { align-items: flex-start; display: flex; flex-wrap: wrap; gap: .75rem; justify-content: space-between; }
html body.path-dashboard #wrapper .giftcard-portal__card-heading h3 { color: #3b0a5c; line-height: 1.4; margin: 0; }
html body.path-dashboard #wrapper .giftcard-portal__available {
  background: #faf5ff !important;
  border: 0 !important;
  border-radius: 12px;
  box-shadow: none !important;
  display: grid;
  gap: .3rem;
  margin: 1rem 0;
  padding: 1rem !important;
  text-shadow: none !important;
}
html body.path-dashboard #wrapper .giftcard-portal__available span { color: #62596b !important; font-size: .85rem; }
html body.path-dashboard #wrapper .giftcard-portal__available strong { color: #3b0a5c !important; font-size: 1.7rem; font-variant-numeric: tabular-nums; line-height: 1.2; }
html body.path-dashboard #wrapper .giftcard-portal dl > div { gap: .4rem 1rem; margin: .5rem 0; }
html body.path-dashboard #wrapper .giftcard-portal__status {
  background: #f3e8ff;
  border: 1px solid #d8c9e3;
  border-radius: 999px;
  color: #3b0a5c;
  display: inline-block;
  font-size: .78rem;
  font-weight: 750;
  line-height: 1.4;
  padding: .35rem .65rem;
}
html body.path-dashboard #wrapper .giftcard-portal__actions { align-items: center; display: flex; flex-wrap: wrap; gap: .65rem; }
html body.path-dashboard #wrapper .giftcard-portal__card > .giftcard-portal__actions { margin-top: auto; padding-top: .75rem; }
html body.path-dashboard #wrapper a.giftcard-portal__action,
html body.path-dashboard #wrapper .giftcard-portal-form .form-actions a {
  align-items: center;
  background: #f3e8ff;
  border: 1px solid #d8c9e3;
  border-radius: 10px;
  color: #3b0a5c;
  display: inline-flex;
  font-size: .88rem;
  font-weight: 750;
  justify-content: center;
  line-height: 1.4;
  min-height: 44px;
  padding: .65rem .8rem;
  text-align: center;
  text-decoration: none;
  -webkit-text-fill-color: #3b0a5c;
}
html body.path-dashboard #wrapper a.giftcard-portal__action:hover,
html body.path-dashboard #wrapper .giftcard-portal-form .form-actions a:hover { background: #ead8fc; }
html body.path-dashboard #wrapper :is(.giftcard-wallet, .giftcard-portal-form, .giftcard-deposits-workspace, .giftcard-refund-workspace) :focus-visible { outline: 3px solid #6716aa; outline-offset: 3px; }
html body.path-dashboard #wrapper .giftcard-portal__empty { background: #faf5ff; border: 1px dashed #c9addd; border-radius: 14px; line-height: 1.65; margin-top: 1rem; padding: 1.25rem; }
html body.path-dashboard #wrapper .giftcard-portal__empty p { margin-bottom: 0; }
html body.path-dashboard #wrapper .giftcard-portal__table-wrap { margin-top: 1.25rem; }
html body.path-dashboard #wrapper .giftcard-portal__table { margin: 0; width: 100%; }
html body.path-dashboard #wrapper .giftcard-portal__table th { color: #3b0a5c; font-size: .8rem; font-weight: 800; }
html body.path-dashboard #wrapper .giftcard-portal__table :is(th, td) { overflow-wrap: anywhere; vertical-align: middle; }
html body.path-dashboard #wrapper .giftcard-deposits-workspace .jdd-admin-table th { color: #fff; }
html body.path-dashboard #wrapper .giftcard-deposits-workspace .jdd-admin-table td { max-width: 260px; }
html body.path-dashboard #wrapper .giftcard-deposits-workspace .giftcard-deposits-filters { grid-template-columns: repeat(4, minmax(0, 1fr)); }
html body.path-dashboard #wrapper .giftcard-deposits-filters input[type=number] { min-height: 44px; width: 100%; }
html body.path-dashboard #wrapper .giftcard-deposits-filters > .form-actions { grid-column: 1 / -1; }
html body.path-dashboard #wrapper .giftcard-portal-form { max-width: 100%; }
html body.path-dashboard #wrapper .giftcard-portal-form .form-item { margin: 0 0 1.25rem; min-width: 0; }
html body.path-dashboard #wrapper .giftcard-portal-form :is(input:not([type=checkbox], [type=radio], [type=submit], [type=hidden]), select, textarea) {
  background: #fff;
  border: 1px solid #c9addd;
  border-radius: 10px;
  color: #292331;
  font-size: 1rem;
  max-width: 100%;
  min-height: 46px;
  padding: .7rem .8rem;
  width: 100%;
}
html body.path-dashboard #wrapper .giftcard-portal-form label { color: #3b0a5c; font-weight: 750; }
html body.path-dashboard #wrapper .giftcard-portal-form .description { color: #62596b; font-size: .85rem; line-height: 1.6; margin-top: .45rem; }
html body.path-dashboard #wrapper .giftcard-portal-form .form-actions { border-top: 1px solid #e9e3ee; margin-top: 1.25rem; padding-top: 1.25rem; }
html body.path-dashboard #wrapper .giftcard-portal-form input[type=submit] { background: #6716aa; border: 1px solid #3b0a5c; border-radius: 10px; color: #fff; font-weight: 750; min-height: 46px; padding: .75rem 1rem; }
html body.path-dashboard #wrapper .giftcard-portal-form input[type=submit]:disabled { cursor: not-allowed; opacity: .6; }
html body.path-dashboard #wrapper .giftcard-portal-form fieldset { border: 1px solid #d8c9e3; border-radius: 14px; margin: 1rem 0; min-width: 0; padding: 1.25rem; }
html body.path-dashboard #wrapper .gift-card-booking :is(.form-radios, .form-checkboxes) { display: grid; gap: .65rem; }
html body.path-dashboard #wrapper .gift-card-booking :is(.form-type-radio, .form-type-checkbox) { align-items: center; background: #faf5ff; border: 1px solid #d8c9e3; border-radius: 10px; display: flex; gap: .65rem; margin: 0; min-height: 48px; padding: .65rem; }
html body.path-dashboard #wrapper .gift-card-booking :is(input[type=radio], input[type=checkbox]) { accent-color: #6716aa; flex: 0 0 auto; height: 20px; margin: 0; width: 20px; }
html body.path-dashboard #wrapper .gift-card-booking :is(.form-type-radio, .form-type-checkbox) label { flex: 1 1 auto; margin: 0; }
html body.path-dashboard #wrapper .giftcard-refund-summary { display: grid; gap: 1rem 2rem; grid-template-columns: repeat(2, minmax(0, 1fr)); }
html body.path-dashboard #wrapper .giftcard-refund-summary .form-item { margin: 0; }
html body.path-dashboard #wrapper .giftcard-refund-summary .form-item label { display: block; margin-bottom: .5rem; }
html body.path-dashboard #wrapper .giftcard-portal__revealed-code { background: #faf5ff; border: 1px solid #d8c9e3; border-radius: 10px; padding: 1rem; user-select: all; }
html body.path-dashboard #wrapper #booking-payments { scroll-margin-top: 10rem; }
@media (max-width: 767px) {
  html body.path-dashboard #wrapper .giftcard-portal__table:not(.jdd-admin-table) :is(tbody, tr, td) { display: block; min-width: 0; width: 100%; }
  html body.path-dashboard #wrapper .giftcard-portal__table:not(.jdd-admin-table) thead { clip-path: inset(50%); height: 1px; overflow: hidden; position: absolute; width: 1px; }
  html body.path-dashboard #wrapper .giftcard-portal__table:not(.jdd-admin-table) tbody tr { background: #fff; border: 1px solid #d8c9e3; border-radius: 12px; margin-bottom: .85rem; padding: .5rem .85rem; }
  html body.path-dashboard #wrapper .giftcard-portal__table:not(.jdd-admin-table) td { display: grid; gap: .5rem; grid-template-columns: minmax(90px, 34%) minmax(0, 1fr); padding: .65rem 0; }
  html body.path-dashboard #wrapper .giftcard-portal__table:not(.jdd-admin-table) td::before { color: #62596b; content: attr(data-label); font-size: .75rem; font-weight: 750; }
  html body.path-dashboard #wrapper .giftcard-portal__table:not(.jdd-admin-table) td[colspan] { display: block; }
  html body.path-dashboard #wrapper .giftcard-portal__table:not(.jdd-admin-table) td[colspan]::before { content: none; }
  html body.path-dashboard #wrapper .giftcard-deposits-workspace .jdd-admin-table td { max-width: none; }
  html body.path-dashboard #wrapper .giftcard-deposits-workspace .giftcard-deposits-filters,
  html body.path-dashboard #wrapper .giftcard-refund-summary { grid-template-columns: minmax(0, 1fr); }
  html body.path-dashboard #wrapper .giftcard-portal-form .form-actions { align-items: stretch; flex-direction: column; }
  html body.path-dashboard #wrapper .giftcard-portal-form .form-actions > * { width: 100%; }
  html body.path-dashboard #wrapper .giftcard-portal__cards { grid-template-columns: minmax(0, 1fr); }
}

/* assets/css/jd-phone-links.css */
/**
 * Shared header and all location footers: compact white phone links.
 * Loaded late to override legacy full-row links; footer text inherits its shadow.
 */
html body[class*="path-"] #wrapper header.header #block-call-to-order a.call-phone-link,
html body[class*="path-"] #wrapper #footer .jd-footer__col--about a[href^="tel:"] {
  display: inline !important;
  width: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: #ffffff !important;
  -webkit-text-fill-color: currentColor !important;
  -webkit-text-stroke-width: 0 !important;
  text-decoration: none !important;
  white-space: nowrap;
}

html body[class*="path-"] #wrapper header.header #block-call-to-order a.call-phone-link {
  margin: 0 auto !important;
  font-family: var(--jd-font-display, "Plus Jakarta Sans", sans-serif);
  font-size: 1.2rem !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  letter-spacing: 0.01em !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.45) !important;
}

html body[class*="path-"] #wrapper header.header #block-call-to-order .text-sm {
  line-height: 1.2 !important;
}

html body[class*="path-"] #wrapper #footer .jd-footer__col--about a[href^="tel:"] {
  margin: 0 !important;
  font-family: var(--jd-font-text, "Source Sans 3", sans-serif);
  font-size: 12px !important;
  font-weight: 550 !important;
  line-height: 1.5 !important;
  letter-spacing: normal !important;
  text-shadow: inherit !important;
}

html body[class*="path-"] #wrapper header.header #block-call-to-order a.call-phone-link:focus-visible,
html body[class*="path-"] #wrapper #footer .jd-footer__col--about a[href^="tel:"]:focus-visible {
  outline: 2px solid #ffffff !important;
  outline-offset: 2px !important;
}

@media (max-width: 991.98px) {
  html body[class*="path-"] #wrapper #footer .jd-footer__col--about a[href^="tel:"] {
    font-size: 10px !important;
  }
}

@media (max-width: 767.98px) {
  html body[class*="path-"] #wrapper header.header #block-call-to-order a.call-phone-link {
    font-size: 1.15rem !important;
    letter-spacing: normal !important;
  }
}

/* assets/css/city-redesign.css */
/* Shared city families: one geometry, one purple Johnny Detail palette. */
html body[class*="path-"] #wrapper.jd-city-redesign { --jd-city-purple:#6716aa; --jd-city-deep:#3b0a5c; --jd-city-ink:#241438; --jd-city-soft:#faf5ff; background:#f3f1f6!important; color:var(--jd-city-ink); }
/* Paint the homepage's collapsed title margin without moving its layout. */
@media (min-width:992px) {
  html body.path-frontpage #wrapper.jd-city-redesign > .layout-wrap {
    background-color:#f3f1f6;
  }
}
html body[class*="path-"] #wrapper.jd-city-redesign * { box-sizing:border-box; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-container { width:calc(100% - 32px); max-width:1220px; margin-inline:auto; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-button { display:inline-flex; min-height:44px; padding:12px 22px; border:1px solid #6716aa; border-radius:8px; background:#6716aa; box-shadow:0 3px 0 #3b0a5c; color:#fff!important; -webkit-text-fill-color:#fff!important; font-size:15px; font-weight:750; line-height:1.3; text-align:center; align-items:center; justify-content:center; text-decoration:none; text-shadow:none; gap:8px; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-button:hover { background:#3b0a5c; color:#fff!important; -webkit-text-fill-color:#fff!important; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-button--light { background:#fff; color:#3b0a5c!important; -webkit-text-fill-color:#3b0a5c!important; border-color:#fff; }
html body[class*="path-"] #wrapper.jd-city-redesign #main-content.jd-city-main { padding:0; margin:0; background:#f3f1f6!important; -webkit-text-fill-color:currentColor; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-page--partners * { -webkit-text-fill-color:currentColor; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-hero-wrap { padding:28px 0 0; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-hero { display:block; margin:0 0 32px; border:0; padding:0; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-hero--detail { display:grid; grid-template-columns:1fr 1fr; gap:28px; align-items:stretch; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-page--service>.jd-city-hero-wrap,html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-page--service>.jd-city-sections { max-width:1158px; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-page--service>.jd-city-hero-wrap { padding-top:23.375px; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-hero--detail { gap:20px; margin-bottom:28px; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-hero--detail .jd-city-hero-visual { min-height:0; aspect-ratio:3 / 2; align-self:start; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-hero--detail .jd-city-hero-visual:after { display:none; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-service-title,html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-overview-title { background:#6716aa; border:2px solid #3b0a5c; border-radius:8px; box-shadow:0 4px 9px #24143824; color:#fff!important; -webkit-text-fill-color:#fff!important; font-size:26.4px; line-height:1.3; font-weight:800; text-align:center; padding:12px 16px; margin:0 0 24px; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-overview-title { max-width:920px; margin:24px auto; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-hero--brand { display:grid; grid-template-columns:238px 1fr; gap:50px; max-width:1090px; margin-inline:auto; align-items:center; background:#fff; border:2px solid #241438; border-radius:14px; padding:28px; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-page--partner>.jd-city-sections { max-width:1090px; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-brand-logo { width:238px; height:181px; border:2px solid #3b0a5c; border-radius:12px; padding:24px; background:#fff; display:flex; align-items:center; justify-content:center; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-brand-logo img { width:100%; height:100%; object-fit:contain; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-brand-copy h1 { color:#3b0a5c; font-size:32px; line-height:1.25; font-weight:800; margin:12px 0 20px; text-align:left; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-brand-copy>p:not(.jd-city-eyebrow) { color:#51435e; font-size:17px; line-height:1.8; margin-bottom:24px; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-hero-visual { min-height:460px; position:relative; overflow:hidden; border-radius:14px; background:#241438; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-hero-visual>img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; margin:0; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-hero-visual:after { content:''; position:absolute; inset:0; background:linear-gradient(0deg,#15071fee 5%,#241438a8 50%,#24143820 100%); pointer-events:none; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-page--hub .jd-service-card-media {
  position:relative; display:block; overflow:clip; aspect-ratio:3 / 2;
}
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-page--hub .jd-service-card-media>img {
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
}
/* Original artwork fills the frame; slogans align with its baked left labels. */
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-page--service .jd-service-image-overlay,
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-page--hub .jd-service-card-media .jd-service-image-overlay {
  position:absolute; top:50%; left:4.1666667%; transform:translateY(-50%); z-index:2;
  display:flex; flex-direction:column; gap:0;
  box-sizing:border-box; width:max-content; max-width:calc(100% - 32px); margin:0; padding:6px 8px;
  background:rgba(59,10,92,.88); border:1px solid rgba(243,232,255,.45); border-radius:8px;
  box-shadow:0 4px 12px rgba(36,20,56,.24); pointer-events:none; user-select:none; text-align:left;
}
html body[class*="path-"] #wrapper.jd-city-redesign .jd-service-image-overlay>span {
  display:block; margin:0; padding:0; color:#fff; -webkit-text-fill-color:transparent;
  -webkit-text-stroke:1px #fff; font-family:var(--jd-font-text,"Source Sans 3",sans-serif);
  font-size:32px; font-weight:800; line-height:1.15; letter-spacing:.03em;
  text-shadow:0 1px 3px rgba(0,0,0,.5); white-space:nowrap;
}
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-page--hub .jd-service-card-media .jd-service-image-overlay {
  padding:1px 6px;
}
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-page--hub .jd-service-image-overlay>span {
  font-size:32px; -webkit-text-stroke:1px #fff;
}
@media (max-width:767.98px) {
  html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-page--service .jd-service-image-overlay,
  html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-page--hub .jd-service-card-media .jd-service-image-overlay {
    max-width:calc(100% - 24px); padding:3px 6px;
  }
  html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-page--service .jd-service-image-overlay {
    padding:4px 8px;
  }
  html body[class*="path-"] #wrapper.jd-city-redesign .jd-service-image-overlay>span {
    font-size:24px; -webkit-text-stroke:.8px #fff;
  }
  html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-page--hub .jd-service-image-overlay>span {
    font-size:24px; -webkit-text-stroke:.8px #fff;
  }
}
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-hero-copy { position:relative; z-index:1; min-height:460px; display:flex; flex-direction:column; justify-content:flex-end; padding:42px; color:#fff; max-width:900px; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-hero-copy h1 { color:#fff; font-size:clamp(28px,3.3vw,45px); line-height:1.15; font-weight:800; margin:12px 0 18px; padding:0; text-align:left; text-shadow:none; letter-spacing:-.8px; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-hero-copy>p:not(.jd-city-eyebrow) { font-size:17px; line-height:1.7; color:#fff; margin:0 0 22px; text-shadow:none; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-eyebrow { color:#6716aa; font-size:12px; font-weight:800; letter-spacing:1.4px; line-height:1.4; text-transform:uppercase; margin:0; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-hero-copy .jd-city-eyebrow { color:#f3e8ff; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-hero-actions { display:flex; flex-wrap:wrap; gap:12px; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-service-summary { display:grid; gap:22px; align-content:stretch; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-service-summary>section { border:1px solid #9d4edd80; background:#fff; border-radius:12px; padding:26px; box-shadow:0 4px 10px #2414380a; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-service-summary h2 { font-size:21px; line-height:1.25; text-align:center; background:#6716aa; color:#fff; margin:-26px -26px 20px; padding:13px 20px; border-radius:11px 11px 0 0; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-service-summary ul { margin:0; padding:0; list-style:none; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-service-summary li { position:relative; border-bottom:1px solid #e9d9f6; padding:10px 0 10px 26px; font-size:14px; line-height:1.55; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-service-summary li:before { content:'✓'; position:absolute; left:0; color:#6716aa; font-weight:800; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-service-summary p { font-size:15px; line-height:1.7; color:#241438; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-text-link { display:inline-block; margin-top:12px; color:#6716aa; font-size:14px; font-weight:750; text-decoration:none; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-service-summary .jd-city-hero-actions { align-items:center; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-service-summary .jd-city-text-link { margin:0; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-sections { padding-bottom:48px; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-card-section { margin:36px 0; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-card { min-width:0; border:1px solid #dfcbea; border-radius:12px; background:#fff; overflow:hidden; box-shadow:0 4px 15px #24143808; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-card img { width:100%; height:230px; display:block; object-fit:cover; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-card-copy { padding:24px; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-card h2 { font-size:22px; margin:0 0 14px; color:#3b0a5c; line-height:1.3; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-card h2 a { color:#3b0a5c; text-decoration:none; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-card h3 { font-size:22px; margin:0 0 14px; line-height:1.3; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-card h3 a { color:#3b0a5c; text-decoration:none; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-section-title { font-size:28px; color:#3b0a5c; margin:0 0 24px; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-related-links { display:flex; gap:14px; flex-wrap:wrap; padding:22px 0 0; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-related-links a { font-size:14px; color:#6716aa; font-weight:700; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-card p { font-size:15px; color:#51435e; line-height:1.7; margin:0; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-editorial { background:#fff; border:1px solid #b988d5; border-radius:12px; padding:30px; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-stored-editorial>.field>.jd-city-editorial,html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-stored-editorial .jd-city-editorial { margin-bottom:22px; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-stored-editorial .faq-section { clear:both; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-stored-editorial .faq-card { margin-bottom:12px; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-stored-editorial .faq-section .faq-card[open]>summary { background:#f3e8ff!important; border-bottom:1px solid #e1ccee!important; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-stored-editorial .faq-section .faq-answer,html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-stored-editorial .faq-section .faq-answer p { -webkit-text-fill-color:currentColor!important; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-overview-editorial { margin-top:30px; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-editorial-section { padding:0; margin:0 0 30px; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-editorial-section:last-child { margin-bottom:0; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-editorial h2 { font-size:23px; line-height:1.3; color:#3b0a5c; font-weight:750; margin:0 0 16px; padding:0 0 12px; border-bottom:1px solid #9d4edd; text-align:left; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-editorial p,html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-editorial li { font-size:16px; color:#51435e; line-height:1.85; text-align:left; margin:0 0 14px; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-overview-editorial p { font-weight:400; }
/* Retained city copy uses the shared editorial treatment without resaving it. */
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-retained-editorial .service-cards-wrapper { display:block!important; width:100%!important; max-width:none!important; padding:0!important; margin:0!important; background:transparent!important; border:0!important; box-shadow:none!important; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-retained-editorial .highlight-grid,html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-retained-editorial .trust-grid { display:block!important; grid-template-columns:none!important; gap:0!important; padding:0!important; margin:0!important; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-retained-editorial .material-card,html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-retained-editorial .trust-section,html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-retained-editorial .authority-box,html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-retained-editorial .service-areas-callout,html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-retained-editorial .material-card-question,html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-retained-editorial .service-notes { display:block!important; width:100%!important; max-width:none!important; padding:30px!important; margin:0 0 22px!important; border:1px solid #b988d5!important; border-radius:12px!important; background:#fff!important; box-shadow:none!important; color:#51435e!important; translate:none!important; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-retained-editorial .trust-card { border:0!important; border-radius:0!important; background:transparent!important; box-shadow:none!important; padding:0!important; margin:0 0 22px!important; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-retained-editorial .card-title,html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-retained-editorial .section-header { background:transparent!important; border:0!important; padding:0!important; margin:0!important; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-retained-editorial h2 { font-size:23px!important; line-height:1.3!important; color:#3b0a5c!important; -webkit-text-fill-color:#3b0a5c!important; font-weight:750!important; margin:0 0 16px!important; padding:0 0 12px!important; border:0!important; border-bottom:1px solid #9d4edd!important; background:transparent!important; text-align:left!important; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-retained-editorial h3 { font-size:18px!important; line-height:1.4!important; color:#3b0a5c!important; -webkit-text-fill-color:#3b0a5c!important; margin:20px 0 12px!important; text-align:left!important; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-retained-editorial p,html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-retained-editorial li { font-size:16px!important; font-weight:550!important; color:#51435e!important; -webkit-text-fill-color:#51435e!important; line-height:1.85!important; text-align:left!important; margin:0 0 14px!important; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-retained-editorial ul { padding-left:22px; margin:18px 0; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-retained-editorial a { color:#6716aa; -webkit-text-fill-color:currentColor; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-retained-editorial .hero-stats { display:flex!important; flex-wrap:wrap!important; gap:12px!important; margin:18px 0 0!important; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-retained-editorial .hero-stat { font-size:14px; padding:8px 12px; border:1px solid #e3d4ed; border-radius:8px; background:#faf5ff; color:#3b0a5c; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-retained-editorial .process-step { display:block!important; grid-template-columns:none!important; grid-template-areas:none!important; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-retained-editorial .process-step .num { display:inline-block!important; width:auto!important; height:auto!important; min-width:0!important; min-height:0!important; padding:0!important; margin:0!important; background:transparent!important; border:0!important; border-radius:0!important; box-shadow:none!important; color:#3b0a5c!important; -webkit-text-fill-color:#3b0a5c!important; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-retained-editorial .section-badge,html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-retained-editorial .faq-subheader { display:block!important; background:transparent!important; border:0!important; border-radius:0!important; box-shadow:none!important; padding:0!important; margin:0 0 18px!important; color:#3b0a5c!important; -webkit-text-fill-color:#3b0a5c!important; font-size:23px!important; line-height:1.35!important; text-align:left!important; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-retained-editorial .faq-subheader { font-size:25px!important; margin-bottom:22px!important; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-retained-editorial .faq-grid { display:block!important; padding:0!important; margin:0!important; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-retained-editorial .faq-card { padding:0!important; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-retained-editorial .faq-answer { font-size:15px!important; font-weight:500!important; line-height:1.8!important; color:#51435e!important; -webkit-text-fill-color:#51435e!important; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-retained-editorial .faq-answer p { font-size:15px!important; font-weight:500!important; line-height:1.8!important; margin:0!important; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-retained-editorial .btn-primary { display:inline-flex; align-items:center; justify-content:center; min-height:44px; border:1px solid #6716aa!important; border-radius:8px!important; background:#6716aa!important; color:#fff!important; -webkit-text-fill-color:#fff!important; padding:12px 22px!important; text-decoration:none; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-page--partner .jd-city-retained-editorial p { border-left:4px solid #6716aa; background:#faf5ff; border-radius:8px; padding:20px; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-page--partner .jd-city-retained-editorial h2 { border-bottom:0!important; border-left:4px solid #6716aa!important; padding:0 0 0 12px!important; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-editorial ul { padding-left:22px; margin:18px 0 0; }
html body[class*="path-"] #wrapper.jd-city-redesign .faq-section { padding:30px 0; margin:0; background:transparent; }
html body[class*="path-"] #wrapper.jd-city-redesign .faq-section>h2,html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-related>h2,html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-brand-links>h2 { font-size:25px; line-height:1.35; margin:0 0 22px; color:#3b0a5c; text-align:left; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-faq-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
html body[class*="path-"] #wrapper.jd-city-redesign .faq-card { border:1px solid #e1ccee; border-radius:8px; background:#fff; margin:0; padding:0; }
html body[class*="path-"] #wrapper.jd-city-redesign .faq-card summary { cursor:pointer; padding:18px 22px; font-size:15px; font-weight:750; color:#3b0a5c; line-height:1.5; }
html body[class*="path-"] #wrapper.jd-city-redesign .faq-answer { padding:0 22px 18px; }
html body[class*="path-"] #wrapper.jd-city-redesign .faq-answer p { font-size:15px; line-height:1.8; color:#51435e; margin:0; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-packages { margin:28px 0; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-contact-card { display:flex; justify-content:space-between; align-items:center; gap:28px; background:#faf5ff; border:1px solid #b988d5; border-radius:12px; padding:32px; margin:32px 0; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-contact-card h2 { font-size:25px; color:#3b0a5c; line-height:1.3; margin:10px 0 12px; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-contact-card p:not(.jd-city-eyebrow) { font-size:15px; line-height:1.7; margin:0; color:#51435e; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-contact-card>.jd-city-button { flex:none; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-related { margin:40px 0; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-article { padding:24px; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-article h3 { font-size:20px; line-height:1.4; margin:0 0 14px; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-article h3 a { color:#3b0a5c; text-decoration:none; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-brand-links { margin:36px 0 0; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-brand-links>div { display:flex; flex-wrap:wrap; gap:14px; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-brand-links a { display:inline-flex; align-items:center; justify-content:center; padding:14px 22px; border:1px solid #d9bae9; background:#fff; border-radius:7px; color:#3b0a5c; font-weight:750; min-height:48px; text-decoration:none; }
html body[class*="path-"] #wrapper.jd-city-redesign [data-jd-slide][hidden] { display:none!important; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-story-hero { position:relative; height:770.25px; color:#fff; background:#241438; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-story-hero>img { position:absolute; width:100%; height:100%; object-fit:cover; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-story-hero:after { content:''; position:absolute; inset:0; background:#15071f85; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-story-hero>div { position:relative; z-index:1; max-width:820px; margin:auto; height:100%; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:32px; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-story-hero h2 { font-size:44px; line-height:1.2; color:#fff; margin:16px 0; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-story-hero p { font-size:18px; line-height:1.7; color:#fff; }
/* Lift decorative words toward the gap between eyebrow and main heading. */
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-story-hero { overflow:clip; touch-action:pan-y pinch-zoom; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-story-hero:after { pointer-events:none; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-story-hero h2 { position:relative; isolation:isolate; z-index:1; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-story-hero>div>p,
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-story-hero>div>a { position:relative; z-index:2; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-story-backdrop {
  position:absolute; z-index:-1; top:calc(-.8em - 16px); left:50%; transform:translateX(-50%);
  width:max-content; margin:0; padding:0; pointer-events:none; user-select:none;
  font-family:var(--jd-font-text,"Source Sans 3",sans-serif); font-size:160px;
  font-weight:600; line-height:1.1; letter-spacing:8px; text-transform:uppercase;
  color:#fff; -webkit-text-fill-color:#fff; opacity:.35; -webkit-text-stroke:2px #fff;
  text-shadow:-5px 3px 3px #000,0 1px 0 #000,1px 0 0 #000,-1px 0 0 #000,0 0 1px #000;
}
@media (min-width:768px) and (max-width:1199.98px) {
  html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-story-backdrop { font-size:48px; opacity:.5; }
}
@media (max-width:767.98px) {
  html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-story-backdrop { top:calc(-.2em - 16px); font-size:32px; line-height:40px; letter-spacing:normal; opacity:.5; }
}
@media (hover:hover) and (pointer:fine) {
  html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-story-hero[data-jd-swipe-surface] { cursor:grab; }
  html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-story-hero.is-dragging { cursor:grabbing; user-select:none; }
}
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-story-content { max-width:1112px; margin:20px auto 32px; border:1px solid #d5bbe5; border-radius:14px; background:linear-gradient(140deg,#fff,#f3e8ff); overflow:hidden; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-story-content>h2 { background:linear-gradient(90deg,#3b0a5c,#9d4edd); color:#fff; font-size:40.8px; line-height:1.2; margin:0; padding:32px 38px; }
/* The wider desktop panel follows the native 1220px city container. */
@media (min-width:768px) {
  html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-story-content { max-width:1220px; }
}
/* Shared homepage/city panels: local guidance above six vehicle service cards. */
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-story-body { display:flex; flex-direction:column; gap:26px; padding:30px; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-story-intro { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-story-intro h3 { font-size:18px; line-height:1.4; color:#3b0a5c; margin:0 0 10px; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-story-intro p { color:#51435e; font-size:16px; line-height:1.65; margin:0; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-story-service-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-story-service-card { display:flex; flex-direction:column; min-width:0; overflow:hidden; border:1px solid #e3d4ed; border-radius:12px; background:#fff; box-shadow:0 4px 14px #24143808; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-story-service-copy { display:flex; flex-direction:column; flex:1; gap:16px; padding:20px; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-story-service-copy h3 { font-size:20px; line-height:1.35; color:#3b0a5c; margin:0; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-story-service-copy p { color:#51435e; font-size:16px; line-height:1.6; margin:0; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-story-service-copy>.jd-city-button { min-height:44px; width:100%; margin-top:auto; padding:12px 14px; font-size:15px; gap:10px; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-carousel-controls { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:14px 0; font-size:13px; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-carousel-controls button { color:#fff; background:#6716aa; border:1px solid #3b0a5c; border-radius:8px; min-height:40px; padding:10px 20px; font-size:13px; font-weight:700; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-testimonials,html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-brands-carousel { text-align:center; border-top:2px solid #24143850; padding:48px 0; margin-top:30px; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-testimonials #block-martis-views-block-testimonials-block-1>.container-wrap { width:100%!important; max-width:1220px!important; margin:auto!important; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-testimonials #block-martis-views-block-testimonials-block-1 .block-content { width:100%!important; max-width:100%!important; padding-inline:0!important; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-testimonials #block-martis-views-block-testimonials-block-1 { background:transparent!important; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-testimonials #block-martis-views-block-testimonials-block-1 .block-title { color:#3b0a5c!important; -webkit-text-fill-color:#3b0a5c!important; font-weight:800!important; text-align:center!important; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-testimonials #block-martis-views-block-testimonials-block-1 .views_slideshow_cycle_slide { background:#fff!important; border:1px solid #e9d5ff!important; border-left:5px solid #6716aa!important; border-radius:16px!important; box-shadow:0 4px 14px -4px #3b0a5c1a!important; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-testimonials #block-martis-views-block-testimonials-block-1 .views-field.views-field-body { background:#f3e8ff!important; border:1px solid #e9d5ff!important; border-left:5px solid #b781e3!important; border-radius:12px!important; color:#1a0a24!important; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-testimonials #block-martis-views-block-testimonials-block-1 .views-field.views-field-title,html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-testimonials #block-martis-views-block-testimonials-block-1 .views-field.views-field-title a { color:#3b0a5c!important; -webkit-text-fill-color:#3b0a5c!important; font-weight:800!important; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-testimonials #block-martis-views-block-testimonials-block-1 .views-field.views-field-body a { color:#5b21b6!important; -webkit-text-fill-color:#5b21b6!important; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-testimonials #block-martis-views-block-testimonials-block-1 .views-field.views-field-field-image { background:#fff!important; border:0!important; border-radius:12px 12px 0 0!important; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-testimonials>h2,html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-brands-carousel>h2 { font-size:30px; color:#3b0a5c; margin:0 0 10px; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-testimonials>p,html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-brands-carousel>p { max-width:560px; margin:0 auto 30px; font-size:20px; line-height:1.5; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-brand-slide { max-width:1050px; background:#fff; border:1px solid #d9bae9; border-radius:12px; padding:30px; margin:28px auto; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-brand-slide h3 { font-size:18px; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-brand-slide img { width:150px; height:150px; object-fit:contain; border:1px solid #3b0a5c; border-radius:50%; padding:15px; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-brand-slide p { max-width:900px; padding:28px; margin:28px auto 0; border:1px solid #3b0a5c; background:#faf5ff; border-radius:8px; font-size:16px; line-height:1.8; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-page--partners .jd-city-card img { object-fit:contain; padding:24px; background:#fff; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-index-heading { margin:0 auto 30px; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-index-heading>.jd-city-service-title { max-width:960px; margin-inline:auto; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-page--partners .jd-city-index-heading>.jd-city-service-title { max-width:830px; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-index-intro { max-width:830px; margin:22px auto 30px; padding:24px; border:1px solid #dcc8e8; border-left:4px solid #6716aa; border-radius:12px; background:#fff; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-index-intro>p { font-size:16px; line-height:1.8; margin:0 0 20px; }
/* Automotive and marine/RV hubs share one responsive intro, including city routes. */
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-page--hub .jd-city-index-heading {
  width:100%; max-width:960px; margin:0 auto 32px; padding:0; border:0; background:transparent;
}
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-page--hub .jd-city-index-heading>.jd-city-service-title {
  width:100%; margin:0 0 20px;
}
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-page--hub .jd-city-index-intro--service {
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); align-items:center; gap:32px;
  width:100%; max-width:none; margin:0; padding:28px; border:1px solid #dcc8e8;
  border-left:4px solid #6716aa; border-radius:14px; background:#faf5ff;
  box-shadow:0 6px 20px #2414380d;
}
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-page--hub .jd-city-index-intro--service>img,
html body[class*="path-"] #wrapper.jd-city-redesign :is(.jd-city-page--hub,.jd-city-page--overview) .jd-hub-animation {
  display:block; width:100%; height:auto; max-height:none; aspect-ratio:3 / 2; object-fit:contain;
  border:1px solid #e3d4ed; border-radius:12px; margin:0;
}
html body[class*="path-"] #wrapper.jd-city-redesign :is(.jd-city-page--hub,.jd-city-page--overview) .jd-hub-animation {
  position:relative; min-width:0; overflow:hidden; background:#faf5ff;
}
html body[class*="path-"] #wrapper.jd-city-redesign :is(.jd-city-page--hub,.jd-city-page--overview) .jd-hub-animation-poster,
html body[class*="path-"] #wrapper.jd-city-redesign :is(.jd-city-page--hub,.jd-city-page--overview) .jd-hub-animation-stage {
  position:absolute; inset:0; display:block; width:100%; height:100%; margin:0; padding:0; border:0;
}
html body[class*="path-"] #wrapper.jd-city-redesign :is(.jd-city-page--hub,.jd-city-page--overview) .jd-hub-animation-poster { object-fit:contain; }
html body[class*="path-"] #wrapper.jd-city-redesign :is(.jd-city-page--hub,.jd-city-page--overview) .jd-hub-animation-stage { visibility:hidden; }
html body[class*="path-"] #wrapper.jd-city-redesign :is(.jd-city-page--hub,.jd-city-page--overview) .jd-hub-animation-stage>svg { display:block; width:100%; height:100%; }
html body[class*="path-"] #wrapper.jd-city-redesign :is(.jd-city-page--hub,.jd-city-page--overview) .jd-hub-animation.is-ready .jd-hub-animation-stage { visibility:visible; }
html body[class*="path-"] #wrapper.jd-city-redesign :is(.jd-city-page--hub,.jd-city-page--overview) .jd-hub-animation.is-ready .jd-hub-animation-poster { visibility:hidden; }
html body[class*="path-"] #wrapper.jd-city-redesign :is(.jd-city-page--hub,.jd-city-page--overview) .jd-hub-animation-control {
  position:absolute; right:10px; bottom:10px; display:inline-flex; align-items:center; justify-content:center;
  min-width:76px; min-height:44px; margin:0; padding:8px 12px; border:1px solid #b781e3;
  border-radius:9px; background:#ffffffed; color:#3b0a5c; -webkit-text-fill-color:#3b0a5c;
  font-family:var(--jd-font-text,"Source Sans 3",sans-serif); font-size:13px; font-weight:700;
  line-height:1.2; box-shadow:0 2px 8px #2414380d; cursor:pointer;
}
html body[class*="path-"] #wrapper.jd-city-redesign :is(.jd-city-page--hub,.jd-city-page--overview) .jd-hub-animation-control:hover { background:#f3e8ff; }
html body[class*="path-"] #wrapper.jd-city-redesign :is(.jd-city-page--hub,.jd-city-page--overview) .jd-hub-animation-control[hidden] { display:none!important; }
@media (prefers-reduced-motion:reduce) {
  html body[class*="path-"] #wrapper.jd-city-redesign :is(.jd-city-page--hub,.jd-city-page--overview) .jd-hub-animation .jd-hub-animation-stage { visibility:hidden; }
  html body[class*="path-"] #wrapper.jd-city-redesign :is(.jd-city-page--hub,.jd-city-page--overview) .jd-hub-animation .jd-hub-animation-poster { visibility:visible; }
  html body[class*="path-"] #wrapper.jd-city-redesign :is(.jd-city-page--hub,.jd-city-page--overview) .jd-hub-animation .jd-hub-animation-control { display:none!important; }
}
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-page--overview .jd-city-story-service-card>.jd-hub-animation { border:0; border-bottom:1px solid #e3d4ed; border-radius:0; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-page--hub .jd-city-hub-intro-copy {
  display:flex; flex-direction:column; gap:20px; min-width:0;
}
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-page--hub .jd-city-hub-intro-copy>p {
  margin:0; color:#241438; font-family:var(--jd-font-text,"Source Sans 3",sans-serif);
  font-size:17px; line-height:1.65; text-align:left;
}
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-page--hub .jd-city-index-intro--service .jd-city-hero-actions {
  gap:12px; align-items:center; margin:0;
}
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-page--hub .jd-city-index-intro--service .jd-city-button--light {
  border-color:#6716aa; box-shadow:none;
}
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-page--hub .jd-city-index-intro--service .jd-city-button--light:hover {
  background:#f3e8ff; color:#3b0a5c!important; -webkit-text-fill-color:#3b0a5c!important;
}
@media (max-width:991.98px) {
  html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-page--hub .jd-city-index-intro--service {
    grid-template-columns:minmax(0,1fr); gap:20px; padding:20px;
  }
  html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-page--hub .jd-city-hub-intro-copy>p { font-size:16px; }
  html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-page--hub .jd-city-index-intro--service .jd-city-hero-actions {
    flex-direction:column; align-items:stretch;
  }
  html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-page--hub .jd-city-index-intro--service .jd-city-button { width:100%; }
}
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-card-copy>.jd-city-button { margin-top:20px; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-page--partners .jd-city-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-page--partners .jd-city-card { text-align:center; border-left:4px solid #6716aa; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-page--partners .jd-city-card img { width:122px; height:122px; margin:22px auto 0; border:1px solid #d9bae9; border-radius:50%; padding:16px; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-page--partners .jd-city-card h2 { font-size:18px; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-page--partners .jd-city-card:last-child:nth-child(odd) { grid-column:1 / -1; width:calc(50% - 12px); justify-self:center; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-page--partner .jd-city-editorial { padding:0; background:transparent; border:0; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-page--partner .jd-city-editorial h2 { border-bottom:0; border-left:4px solid #6716aa; padding:0 0 0 12px; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-page--partner .jd-city-editorial p { border-left:4px solid #6716aa; background:#faf5ff; border-radius:8px; padding:20px; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-main a:focus-visible,html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-main button:focus-visible,html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-main summary:focus-visible { outline:3px solid #9d4edd; outline-offset:4px; }
@media (max-width:767.98px) {
  html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-hero-wrap { padding-top:18px; }
  html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-hero--detail { grid-template-columns:1fr; gap:22px; }
  html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-hero--detail .jd-city-hero-visual { min-height:0; }
  html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-page--service>.jd-city-hero-wrap { padding-top:18px; }
  html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-hero--brand { grid-template-columns:1fr; padding:26px; gap:24px; }
  html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-brand-logo { width:210px; height:165px; margin:auto; }
  html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-brand-copy h1 { font-size:31px; }
  html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-hero-visual,html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-hero-copy { min-height:500px; }
  html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-hero-copy { padding:26px; }
  html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-hero-copy h1 { font-size:31px; letter-spacing:-.6px; }
  html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-hero-copy>p:not(.jd-city-eyebrow) { font-size:15px; line-height:1.7; }
  html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-hero-actions { flex-direction:column; }
  html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-service-summary>section { padding:24px; }
  html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-service-summary h2 { margin:-24px -24px 18px; font-size:21px; }
  html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-grid { grid-template-columns:1fr; gap:22px; }
  html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-page--partners .jd-city-grid { grid-template-columns:1fr; }
  html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-page--partners .jd-city-card:last-child:nth-child(odd) { grid-column:auto; width:100%; }
  html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-card-copy { padding:24px; }
  html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-editorial { padding:22px; }
  html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-editorial h2 { font-size:21px; }
  html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-editorial p,html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-editorial li { font-size:15px; }
  html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-retained-editorial .material-card,html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-retained-editorial .trust-section,html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-retained-editorial .authority-box,html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-retained-editorial .service-areas-callout,html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-retained-editorial .material-card-question,html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-retained-editorial .service-notes { padding:22px!important; }
  html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-retained-editorial h2 { font-size:21px!important; }
  html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-retained-editorial p,html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-retained-editorial li { font-size:15px!important; }
  html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-faq-grid { grid-template-columns:1fr; }
  html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-contact-card { padding:24px; flex-direction:column; align-items:flex-start; gap:22px; }
  html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-contact-card h2 { font-size:23px; }
  html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-brand-links a { flex:1 0 40%; font-size:14px; padding:14px; }
  html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-overview-title { margin:24px 16px; font-size:20.8px; line-height:1.1; }
  html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-service-title { font-size:23px; }
  html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-story-hero { height:224px; }
  html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-story-hero>div { padding:16px 20px; }
  html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-story-hero h2 { font-size:18px; line-height:1.3; margin:8px 0; }
  html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-story-hero p { font-size:13px; line-height:1.45; margin:0 0 10px; }
  html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-story-hero .jd-city-eyebrow { font-size:11px; margin:0; }
  html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-story-hero .jd-city-button { font-size:14px; min-height:44px; padding:10px 16px; }
  html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-story-content { margin-top:20px; }
  html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-story-content>h2 { font-size:30px; padding:25px; }
  html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-story-body { padding:20px; gap:22px; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-story-intro { grid-template-columns:minmax(0,1fr); gap:18px; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-story-service-grid { grid-template-columns:minmax(0,1fr); gap:20px; }
html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-story-service-copy { padding:18px; gap:14px; }
  html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-testimonials>h2,html body[class*="path-"] #wrapper.jd-city-redesign .jd-city-brands-carousel>h2 { font-size:26px; }
}

/* assets/css/city-taxonomy-testimonials.css */
/**
 * Shared homepage/city testimonial shell and original city card presentation.
 * Keep the native Views markup and canonical testimonials-slideshow.css grid.
 */
html body:is(.path-frontpage, .path-taxonomy) #wrapper.jd-city-redesign .jd-testimonials-shell {
  display: flow-root;
  width: 100%;
  max-width: none;
  padding: 0;
  margin: 0;
  background: #f3f1f6;
  border: 0;
}

html body:is(.path-frontpage, .path-taxonomy) #wrapper.jd-city-redesign .jd-testimonials-shell #block-martis-views-block-testimonials-block-1 {
  width: 100% !important;
  max-width: 100% !important;
  border: 0 !important;
  position: relative;
  padding: 3rem 15px 24px !important;
  margin-top: 24px !important;
  margin-bottom: 20px !important;
  background: transparent !important;
  color: #555;
  text-align: left;
}

html body:is(.path-frontpage, .path-taxonomy) #wrapper.jd-city-redesign .jd-testimonials-shell #block-martis-views-block-testimonials-block-1 > .container-wrap {
  width: 100% !important;
  max-width: 100% !important;
  padding: 0 !important;
  margin-left: auto !important;
  margin-right: auto !important;
  color: #000;
  text-align: center;
}

html body:is(.path-frontpage, .path-taxonomy) #wrapper.jd-city-redesign .jd-testimonials-shell #block-martis-views-block-testimonials-block-1 .block-content.clearfix {
  padding-left: 15px !important;
  padding-right: 15px !important;
}

/* Match the brands divider inside the block's clipped padding edge.
 * The block owns 3rem of space above the customer-testimonials heading. */
html body:is(.path-frontpage, .path-taxonomy) #wrapper.jd-city-redesign .jd-testimonials-shell #block-martis-views-block-testimonials-block-1::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: calc(100% - 32px);
  max-width: 1220px;
  height: 2px;
  background: #24143850;
  pointer-events: none;
}

/* 1140px native grid plus its 5px/1px card borders, centered at every width. */
html body:is(.path-frontpage, .path-taxonomy) #wrapper.jd-city-redesign .jd-testimonials-shell #block-martis-views-block-testimonials-block-1 [id^="views_slideshow_cycle_div_testimonials-block_1_"] {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 1146px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

html body.path-taxonomy #wrapper.jd-city-redesign .jd-city-taxonomy-testimonials #block-martis-views-block-testimonials-block-1 .block-title {
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  font-weight: 800 !important;
  text-align: center !important;
}

html body.path-taxonomy #wrapper.jd-city-redesign .jd-city-taxonomy-testimonials #block-martis-views-block-testimonials-block-1 .views_slideshow_cycle_slide {
  background: #fff !important;
  border: 1px solid #e9d5ff !important;
  border-left: 5px solid #6716aa !important;
  border-radius: 16px !important;
  box-shadow: 0 4px 14px -4px rgba(59, 10, 92, 0.1) !important;
}

/* Translate the original wide-top reset without changing counter dimensions. */
html body.path-taxonomy #wrapper.jd-city-redesign .jd-city-taxonomy-testimonials #block-martis-views-block-testimonials-block-1 .views_slideshow_slide_counter .num {
  background: unset !important;
  border: unset !important;
  color: #555 !important;
}

/* The original ID-scoped slideshow rules outranked the legacy city palette. */
html body.path-taxonomy #wrapper.jd-city-redesign .jd-city-taxonomy-testimonials #block-martis-views-block-testimonials-block-1 .views-field.views-field-body {
  border: 2px solid #000 !important;
  border-radius: 12px !important;
  background: rgba(123, 44, 191, 0.18) !important;
  color: #1a0a24 !important;
}

html body.path-taxonomy #wrapper.jd-city-redesign .jd-city-taxonomy-testimonials #block-martis-views-block-testimonials-block-1 .views-field.views-field-body a {
  color: #5b21b6 !important;
  -webkit-text-fill-color: #5b21b6 !important;
}

/* Neutralize older Katy author rules without changing native author links. */
html body.path-taxonomy #wrapper.jd-city-redesign .jd-city-taxonomy-testimonials #block-martis-views-block-testimonials-block-1 .views-field.views-field-title {
  color: #1a1a1a !important;
  -webkit-text-fill-color: #1a1a1a !important;
  font-weight: 500 !important;
}

html body.path-taxonomy #wrapper.jd-city-redesign .jd-city-taxonomy-testimonials #block-martis-views-block-testimonials-block-1 .views-field.views-field-title .field-content,
html body.path-taxonomy #wrapper.jd-city-redesign .jd-city-taxonomy-testimonials #block-martis-views-block-testimonials-block-1 .views-field.views-field-title .views-label-title {
  color: #1a1a1a !important;
  -webkit-text-fill-color: #1a1a1a !important;
  font-weight: 600 !important;
}

html body.path-taxonomy #wrapper.jd-city-redesign .jd-city-taxonomy-testimonials #block-martis-views-block-testimonials-block-1 .views-field.views-field-title .testimonial-author-link {
  color: inherit !important;
  -webkit-text-fill-color: inherit !important;
  font-weight: 700 !important;
}

/* Separate the testimony from the finished vehicle on desktop only. */
@media (min-width: 992px) {
  html body:is(.path-frontpage, .path-taxonomy) #wrapper.jd-city-redesign .jd-testimonials-shell #block-martis-views-block-testimonials-block-1 .views-field.views-field-field-vehicle-detailed {
    padding-top: 12px !important;
  }
}

@media (max-width: 991.98px) {
  html body:is(.path-frontpage, .path-taxonomy) #wrapper.jd-city-redesign .jd-testimonials-shell #block-martis-views-block-testimonials-block-1 {
    padding-bottom: 16px !important;
  }

  html body:is(.path-frontpage, .path-taxonomy) #wrapper.jd-city-redesign .jd-testimonials-shell #block-martis-views-block-testimonials-block-1 .block-content.clearfix {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}

/* assets/css/testimonials-pager.css */
/**
 * Native testimonial pager: shared homepage and city overview presentation.
 * Preserve Views counter updates, control markup and pause ownership.
 */
html body:is(.path-frontpage, .path-taxonomy) #wrapper #block-martis-views-block-testimonials-block-1 .views-slideshow-controls-top.clearfix {
  gap: 8px !important;
}

html body:is(.path-frontpage, .path-taxonomy) #wrapper #block-martis-views-block-testimonials-block-1 #views_slideshow_slide_counter_testimonials-block_1 {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  width: auto !important;
  max-width: 100% !important;
  min-height: 34px !important;
  margin: 0 !important;
  padding: 6px 14px !important;
  border: 1px solid #e9d5ff !important;
  border-radius: 999px !important;
  background: #f3e8ff !important;
  color: #3b0a5c !important;
  -webkit-text-fill-color: currentColor !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  font-variant-numeric: tabular-nums;
  white-space: nowrap !important;
}

html body:is(.path-frontpage, .path-taxonomy) #wrapper #block-martis-views-block-testimonials-block-1 #views_slideshow_slide_counter_testimonials-block_1 > .num,
html body:is(.path-frontpage, .path-taxonomy) #wrapper #block-martis-views-block-testimonials-block-1 #views_slideshow_slide_counter_testimonials-block_1 > .total {
  display: inline !important;
  width: auto !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: inherit !important;
  -webkit-text-fill-color: currentColor !important;
  font-size: inherit !important;
  font-weight: inherit !important;
  line-height: inherit !important;
}

html body:is(.path-frontpage, .path-taxonomy) #wrapper #block-martis-views-block-testimonials-block-1 #views_slideshow_slide_counter_testimonials-block_1 > .num {
  color: #6716aa !important;
  font-weight: 800 !important;
}

html body:is(.path-frontpage, .path-taxonomy) #wrapper #block-martis-views-block-testimonials-block-1 #views_slideshow_controls_text_testimonials-block_1 {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  align-items: stretch !important;
  gap: 8px !important;
  width: min(100%, 304px) !important;
  max-width: 304px !important;
  min-width: 0 !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

html body:is(.path-frontpage, .path-taxonomy) #wrapper #block-martis-views-block-testimonials-block-1 #views_slideshow_controls_text_testimonials-block_1 > span {
  display: block !important;
  min-width: 0 !important;
  width: 100% !important;
}

html body:is(.path-frontpage, .path-taxonomy) #wrapper #block-martis-views-block-testimonials-block-1 #views_slideshow_controls_text_testimonials-block_1 a {
  box-sizing: border-box !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  min-width: 44px !important;
  min-height: 44px !important;
  padding: 8px !important;
  border: 1px solid #6716aa !important;
  border-radius: 12px !important;
  background: #6716aa !important;
  box-shadow: 0 2px 3px rgba(59, 10, 92, 0.12) !important;
  color: #fff !important;
  -webkit-text-fill-color: currentColor !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  text-align: center !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  transform: none !important;
  transition: background-color 150ms ease, border-color 150ms ease, box-shadow 150ms ease;
}

html body:is(.path-frontpage, .path-taxonomy) #wrapper #block-martis-views-block-testimonials-block-1 #views_slideshow_controls_text_testimonials-block_1 .views_slideshow_controls_text_pause a {
  background: #fff !important;
  color: #3b0a5c !important;
}

html body:is(.path-frontpage, .path-taxonomy) #wrapper #block-martis-views-block-testimonials-block-1 #views_slideshow_controls_text_testimonials-block_1 a:hover {
  background: #3b0a5c !important;
  border-color: #3b0a5c !important;
}

html body:is(.path-frontpage, .path-taxonomy) #wrapper #block-martis-views-block-testimonials-block-1 #views_slideshow_controls_text_testimonials-block_1 .views_slideshow_controls_text_pause a:hover,
html body:is(.path-frontpage, .path-taxonomy) #wrapper #block-martis-views-block-testimonials-block-1 #views_slideshow_controls_text_testimonials-block_1 .views_slideshow_controls_text_pause a:focus-visible {
  background: #f3e8ff !important;
  border-color: #6716aa !important;
  color: #3b0a5c !important;
}

html body:is(.path-frontpage, .path-taxonomy) #wrapper #block-martis-views-block-testimonials-block-1 #views_slideshow_controls_text_testimonials-block_1 a:focus-visible {
  outline: 2px solid #6716aa !important;
  outline-offset: 3px !important;
}

@media (prefers-reduced-motion: reduce) {
  html body:is(.path-frontpage, .path-taxonomy) #wrapper #block-martis-views-block-testimonials-block-1 #views_slideshow_controls_text_testimonials-block_1 a {
    transition: none !important;
  }
}

/* assets/css/customer-reviews-ui.css */
/* Customer review forms, public CTA and staff moderation. */
/* This route's preloader sits outside #wrapper; keep the plain form usable. */
html:not(.cyb-preloading) body.path-reviews #cyb-preloader { display: none !important; }
html body[class*="path-"] #wrapper .cyb-review-cta {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin: 0 15px 1.5rem;
}

html body[class*="path-"] #wrapper .cyb-review-button,
html body[class*="path-"] #wrapper .cyb-review-form .form-submit,
html body[class*="path-"] #wrapper .cyb-review-moderation .form-submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  min-height: 48px;
  max-width: 100%;
  margin: 0 !important;
  padding: .75rem 1.4rem !important;
  border: 1px solid #6716aa;
  border-radius: 10px;
  background: #6716aa;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  font: inherit;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.5;
  text-decoration: none;
  white-space: normal;
  cursor: pointer;
  transform: none !important;
  background-image: none !important;
  box-shadow: none !important;
}
html body[class*="path-"] #wrapper .cyb-review-button:hover,
html body[class*="path-"] #wrapper .cyb-review-form .form-submit:hover,
html body[class*="path-"] #wrapper .cyb-review-moderation .form-submit:hover {
  background: #3b0a5c;
  border-color: #3b0a5c;
}
html body[class*="path-"] #wrapper .cyb-review-button--secondary {
  background: #fff;
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
}
html body[class*="path-"] #wrapper .cyb-review-button--secondary:hover { background: #f3e8ff; }
html body[class*="path-"] #wrapper .cyb-review-button.use-ajax {
  border: 2px solid #3b0a5c;
}

@media (min-width: 1000.01px) {
  html body[class*="path-"] #wrapper .cyb-review-cta .cyb-review-control {
    margin-top: 2rem;
  }
}

html body[class*="path-"] #wrapper :is(.cyb-review-button, .cyb-review-filter):focus-visible,
html body[class*="path-"] #wrapper :is(.cyb-review-form, .cyb-review-moderation, .cyb-review-dialog) :is(input, textarea, button, a, summary):focus-visible {
  outline: 3px solid #6716aa !important;
  outline-offset: 3px;
}

/* The native button reserves exactly the same space during an AJAX request. */
html body[class*="path-"] #wrapper .cyb-review-control {
  position: relative;
  display: inline-grid;
  vertical-align: top;
  max-width: 100%;
}
html body[class*="path-"] #wrapper .cyb-review-control > :is(a, input) { margin: 0 !important; width: 100%; }
html body[class*="path-"] #wrapper .cyb-review-control.is-busy > :is(a, input) {
  color: transparent !important;
  -webkit-text-fill-color: transparent !important;
  opacity: 1;
  cursor: wait;
  transition: none;
}
html body[class*="path-"] #wrapper .cyb-review-progress {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .55rem;
  pointer-events: none;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  font-size: 16px;
  font-weight: 700;
}
html body[class*="path-"] #wrapper .cyb-review-spinner {
  width: 16px;
  height: 16px;
  flex: 0 0 16px;
  box-sizing: border-box;
  border: 2px solid rgb(255 255 255 / 40%);
  border-top-color: #fff;
  border-radius: 50%;
  animation: cyb-review-spin .8s linear infinite;
}
@keyframes cyb-review-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
  html body[class*="path-"] #wrapper .cyb-review-spinner { animation: none; }
}

/* Size the dialog itself; the header stays visible as the form scrolls. */
html body[class*="path-"] #wrapper .ui-dialog.cyb-review-dialog {
  position: fixed;
  z-index: 10010;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%);
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  width: min(640px, calc(100vw - max(32px, env(safe-area-inset-left) + env(safe-area-inset-right)))) !important;
  height: auto !important;
  max-width: calc(100vw - 32px);
  max-height: min(720px, 75dvh);
  padding: 0;
  overflow: hidden;
  border: 1px solid #e2d4ec;
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 24px 80px rgb(36 20 56 / 24%);
  color: #241438;
  -webkit-text-fill-color: #241438;
}
html body[class*="path-"] #wrapper .ui-widget-overlay.cyb-review-backdrop {
  z-index: 10009;
  opacity: 1;
  background: rgb(36 20 56 / 48%);
}
html body[class*="path-"] #wrapper .cyb-review-dialog .ui-dialog-titlebar {
  flex: 0 0 auto;
  position: relative;
  padding: 1.25rem 4.25rem 1.25rem 1.75rem;
  border: 0;
  border-bottom: 1px solid #e2d4ec;
  border-radius: 0;
  background: #fff !important;
  font-size: 1.4rem;
  line-height: 1.4;
  font-weight: 700;
}
html body[class*="path-"] #wrapper .cyb-review-dialog .ui-dialog-title {
  float: none;
  font-size: inherit;
  line-height: inherit;
  width: auto;
  margin: 0;
  white-space: normal;
  color: #241438 !important;
  -webkit-text-fill-color: #241438 !important;
}
html body[class*="path-"] #wrapper .cyb-review-dialog .ui-dialog-titlebar-close {
  position: absolute;
  width: 44px;
  height: 44px;
  right: .85rem;
  top: 50%;
  margin: 0 !important;
  transform: translateY(-50%) !important;
  padding: 0;
  border: 1px solid #e2d4ec;
  border-radius: 10px;
  background: #f3f1f6;
  color: #241438 !important;
  -webkit-text-fill-color: #241438 !important;
  box-shadow: none;
}
html body[class*="path-"] #wrapper .cyb-review-dialog .ui-dialog-titlebar-close:hover { background: #f3e8ff; }
html body[class*="path-"] #wrapper .cyb-review-dialog .ui-dialog-titlebar-close .ui-icon {
  background: none;
  filter: none;
  text-indent: 0;
  font-size: 0;
  width: 18px;
  height: 18px;
  margin: -9px 0 0 -9px;
}
html body[class*="path-"] #wrapper .cyb-review-dialog .ui-dialog-titlebar-close::before,
html body[class*="path-"] #wrapper .cyb-review-dialog .ui-dialog-titlebar-close::after {
  content: '';
  position: absolute;
  left: 20px;
  top: 13px;
  width: 2px;
  height: 16px;
  background: #241438;
  transform: rotate(45deg);
}
html body[class*="path-"] #wrapper .cyb-review-dialog .ui-dialog-titlebar-close::after { transform: rotate(-45deg); }
html body[class*="path-"] #wrapper .cyb-review-dialog .ui-dialog-content {
  flex: 1 1 auto;
  min-height: 0 !important;
  height: auto !important;
  max-height: none !important;
  box-sizing: border-box;
  overflow: auto;
  overscroll-behavior: contain;
  padding: 1.5rem 1.75rem;
  scroll-padding-block: 1rem;
}
html body[class*="path-"] #wrapper .cyb-review-dialog .ui-dialog-buttonpane { display: none; }
html body[class*="path-"] #wrapper :is(.cyb-review-surface, .cyb-review-detail, .cyb-review-moderation) {
  max-width: 860px;
  min-width: 0;
  box-sizing: border-box;
  color: #241438;
  -webkit-text-fill-color: #241438;
}
html body[class*="path-"] #wrapper .cyb-review-form { margin: 0; font-size: 16px; }
html body[class*="path-"] #wrapper .cyb-review-intro {
  margin: 0 0 1.5rem;
  padding: 1rem 1.15rem;
  border-radius: 12px;
  background: #faf5ff;
  color: #483452;
  -webkit-text-fill-color: #483452;
  font-size: .9375rem;
  line-height: 1.6;
}
html body[class*="path-"] #wrapper .cyb-review-meta { color: #62596b; -webkit-text-fill-color: #62596b; line-height: 1.6; margin-bottom: 1rem; }
html body[class*="path-"] #wrapper .cyb-review-form .form-item { margin: 0 0 1.25rem; min-width: 0; }
html body[class*="path-"] #wrapper .cyb-review-form label { font-weight: 600; margin-bottom: .5rem; }
html body[class*="path-"] #wrapper .cyb-review-form :is(input[type="text"], textarea) {
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  min-height: 48px;
  padding: .8rem .95rem;
  border: 1px solid #b6a0c4;
  border-radius: 10px;
  background: #fff;
  color: #241438;
  -webkit-text-fill-color: #241438;
  font: inherit;
  font-size: 16px;
  line-height: 1.5;
  box-shadow: none;
}
html body[class*="path-"] #wrapper .cyb-review-form textarea { min-height: 145px; resize: vertical; border: 1px solid #b6a0c4 !important; border-radius: 10px !important; }
html body[class*="path-"] #wrapper .cyb-review-form .description { font-size: .875rem; line-height: 1.5; margin-top: .4rem; color: #62596b; -webkit-text-fill-color: #62596b; overflow-wrap: anywhere; }
html body[class*="path-"] #wrapper .cyb-review-counter { display: block; margin-top: .4rem; text-align: right; font-size: .8125rem; color: #62596b; -webkit-text-fill-color: #62596b; }
html body[class*="path-"] #wrapper .cyb-review-form fieldset { padding: 0; border: 0; margin: 0 0 1.25rem; min-width: 0; }
html body[class*="path-"] #wrapper .cyb-review-form legend { text-align: left !important; font: inherit; font-weight: 600; float: none; width: auto; margin: 0 0 .5rem; }
html body[class*="path-"] #wrapper .cyb-review-form :is(.radios, .form-radios) { display: flex !important; flex-wrap: wrap; gap: .5rem; }
html body[class*="path-"] #wrapper .cyb-review-form .form-type-radio { margin: 0 !important; display: flex !important; align-items: center; gap: .4rem; min-height: 44px; width: auto !important; }
html body[class*="path-"] #wrapper .cyb-review-form .form-type-radio label { margin: 0; cursor: pointer; }
html body[class*="path-"] #wrapper .cyb-review-form .cyb-review-star-input .radios { gap: 4px; flex-wrap: nowrap; }
html body[class*="path-"] #wrapper .cyb-review-form .cyb-review-star-input .form-type-radio {
  position: relative;
  flex: 0 0 48px;
  min-height: 48px;
  padding: 0 !important;
  border: 1px solid #d9c7e6;
  border-radius: 10px;
  background: #fff !important;
}
html body[class*="path-"] #wrapper .cyb-review-form .cyb-review-star-input .form-type-radio label { display: grid; place-items: center; width: 100%; height: 48px; padding: 0; }
html body[class*="path-"] #wrapper .cyb-review-form .cyb-review-star-input input {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  max-width: none !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
  opacity: 0;
  cursor: pointer;
}
html body[class*="path-"] #wrapper .cyb-review-star { font-size: 2rem; line-height: 1; color: #8b7b95; -webkit-text-fill-color: #8b7b95; }
html body[class*="path-"] #wrapper .cyb-review-form .cyb-review-star-input .is-filled { background: #f3e8ff !important; border-color: #6716aa; }
html body[class*="path-"] #wrapper .is-filled .cyb-review-star { color: #3b0a5c; -webkit-text-fill-color: #3b0a5c; }
html body[class*="path-"] #wrapper .cyb-review-star-input .form-type-radio:has(input:focus-visible) { outline: 3px solid #6716aa; outline-offset: 3px; }
html body[class*="path-"] #wrapper .cyb-review-rating-caption { display: block; margin-top: .5rem; font-size: .875rem; color: #62596b; -webkit-text-fill-color: #62596b; }
html body[class*="path-"] #wrapper .cyb-review-form :is(input[type="radio"], input[type="checkbox"]) { accent-color: #6716aa; }
html body[class*="path-"] #wrapper .cyb-review-form .form-type-checkbox { display: flex; flex-wrap: wrap; align-items: flex-start; gap: .75rem; padding: 1rem; border: 1px solid #e2d4ec; border-radius: 12px; background: #faf5ff; }
html body[class*="path-"] #wrapper .cyb-review-form input[type="checkbox"] { width: 20px; height: 20px; margin-top: .15rem; flex: 0 0 20px; }
html body[class*="path-"] #wrapper .cyb-review-form .form-type-checkbox label { flex: 1; line-height: 1.6; font-size: .875rem; margin: 0; cursor: pointer; }
html body[class*="path-"] #wrapper .cyb-review-form details { border: 1px solid #e2d4ec; border-radius: 12px; padding: 1rem; margin: 1.25rem 0; }
html body[class*="path-"] #wrapper .cyb-review-form summary { cursor: pointer; font-weight: 700; min-height: 44px; line-height: 1.6; }
html body[class*="path-"] #wrapper .cyb-review-upload { overflow-wrap: anywhere; min-width: 0; margin-top: 1rem; padding: 1rem; border: 1px solid #e2d4ec; border-radius: 10px; background: #faf5ff; }
html body[class*="path-"] #wrapper .cyb-review-upload .form-item:last-child { margin-bottom: 0; }
html body[class*="path-"] #wrapper .cyb-review-upload img { display: block; max-width: 120px; max-height: 120px; margin: 0 0 .75rem; object-fit: contain; border-radius: 8px; }
html body[class*="path-"] #wrapper .cyb-review-upload input[type="file"] { width: 100%; max-width: 100%; font: inherit; font-size: 16px; min-height: 44px; padding: 0; border: 0; border-radius: 0; background: transparent; }
html body[class*="path-"] #wrapper .cyb-review-upload input[type="file"]::file-selector-button { min-height: 44px; margin-right: .5rem; padding: .5rem .65rem; border: 1px solid #b6a0c4; border-radius: 8px; background: #fff; color: #3b0a5c; font: inherit; cursor: pointer; }
html body[class*="path-"] #wrapper .cyb-review-upload .form-submit { min-height: 44px; margin: .75rem 0 0 !important; padding: .5rem .85rem; }
html body[class*="path-"] #wrapper .cyb-review-form .form-actions { display: flex; flex-wrap: wrap; gap: .75rem; margin: 1.5rem 0 0; padding-top: 1.25rem; border-top: 1px solid #e2d4ec; }
html body[class*="path-"] #wrapper .cyb-review-field-error { flex-basis: 100%; margin-top: .5rem; color: #a12b29; -webkit-text-fill-color: #a12b29; font-size: .875rem; }
html body[class*="path-"] #wrapper .cyb-review-form :is([aria-invalid="true"], input.error, textarea.error) { border-color: #a12b29 !important; }
html body[class*="path-"] #wrapper .cyb-review-transport-error { margin: 1rem 0; padding: 1rem; border: 1px solid #e9bebc; border-radius: 10px; background: #fff5f4; color: #822826; -webkit-text-fill-color: #822826; line-height: 1.6; }
html body[class*="path-"] #wrapper .cyb-review-success h2 { margin: 0 0 .75rem; font-size: 1.5rem; line-height: 1.35; color: #3b0a5c; -webkit-text-fill-color: #3b0a5c; }
html body[class*="path-"] #wrapper .cyb-review-success p { margin: .5rem 0; }

@media (max-width: 767px) {
  html body[class*="path-"] #wrapper .ui-dialog.cyb-review-dialog {
    border-radius: 16px;
  }
  html body[class*="path-"] #wrapper .cyb-review-dialog .ui-dialog-titlebar { padding: 1.1rem 4rem 1.1rem 1rem; font-size: 1.2rem; }
  html body[class*="path-"] #wrapper .cyb-review-dialog .ui-dialog-content { padding: 1rem; }
  html body[class*="path-"] #wrapper .cyb-review-form .form-actions > * { width: 100%; }
  html body[class*="path-"] #wrapper .cyb-review-form .cyb-review-star-input .form-type-radio { flex-basis: 44px; }
  html body[class*="path-"] #wrapper .cyb-review-form .cyb-review-star-input .form-type-radio label { height: 44px; }
  html body[class*="path-"] #wrapper .cyb-review-upload { padding: .75rem; }
}
html body[class*="path-"] #wrapper .cyb-review-notice {
  margin: 1rem 0;
  padding: 1rem;
  border: 1px solid #dac5ed;
  border-left: 4px solid #6716aa;
  border-radius: 8px;
  background: #f3e8ff;
  line-height: 1.6;
  overflow-wrap: anywhere;
}
html body[class*="path-"] #wrapper .cyb-review-notice p:last-child { margin-bottom: 0; }
html body[class*="path-"] #wrapper .cyb-review-company { display: block; margin-top: .35rem; font-size: .925rem; font-weight: 400; }
html body[class*="path-"] #wrapper .cyb-review-stars { display: inline-flex; gap: .5rem; align-items: center; color: #6716aa; -webkit-text-fill-color: #6716aa; white-space: nowrap; font-size: 1.5rem; }
html body[class*="path-"] #wrapper .cyb-review-stars__label { font-size: .875rem; font-weight: 600; }
html body[class*="path-"] #wrapper .cyb-review-text { white-space: pre-wrap; overflow-wrap: anywhere; line-height: 1.75; }
html body[class*="path-"] #wrapper .cyb-review-status { display: inline-block; padding: .3rem .7rem; border-radius: 20px; background: #f3e8ff; color: #3b0a5c; -webkit-text-fill-color: #3b0a5c; font-weight: 700; }
html body[class*="path-"] #wrapper .cyb-review-detail { padding: 1.5rem; border: 1px solid #e2d4ec; border-radius: 12px; background: #fff; margin: 1rem 0; }
html body[class*="path-"] #wrapper .cyb-review-detail h2 { margin: 1rem 0 .5rem; font-size: 1.5rem; }
html body[class*="path-"] #wrapper .cyb-review-detail header {
  border: 0 !important; background: transparent !important; box-shadow: none !important; padding: 0 !important;
}
html body[class*="path-"] #wrapper .cyb-review-detail p:not(.cyb-review-notice) {
  border: 0 !important; border-radius: 0 !important; background: transparent !important;
  box-shadow: none !important; padding: 0 !important;
  color: #241438 !important; -webkit-text-fill-color: #241438 !important;
}
html body[class*="path-"] #wrapper .cyb-review-moderation .form-actions a {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 44px; padding: .75rem 1.4rem; border: 1px solid #6716aa; border-radius: 8px;
  background: #fff !important; color: #3b0a5c !important; -webkit-text-fill-color: #3b0a5c !important;
  text-decoration: none;
}
html body[class*="path-"] #wrapper :is(.cyb-review-actions, .cyb-review-filters) { display: flex; flex-wrap: wrap; gap: .75rem; margin: 1rem 0; }
html body[class*="path-"] #wrapper .cyb-review-filter { padding: .65rem 1.1rem; border: 1px solid #d7bce9; border-radius: 8px; color: #3b0a5c; -webkit-text-fill-color: #3b0a5c; text-decoration: none; }
html body[class*="path-"] #wrapper .cyb-review-filter.is-active { background: #f3e8ff; border-color: #6716aa; font-weight: 700; }
html body[class*="path-"] #wrapper .cyb-review-images { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
html body[class*="path-"] #wrapper .cyb-review-images figure { margin: 0; padding: .75rem; background: #faf5ff; border-radius: 8px; }
html body[class*="path-"] #wrapper .cyb-review-images figcaption { font-weight: 600; margin-bottom: .5rem; }
html body[class*="path-"] #wrapper .cyb-review-images img { max-width: 100%; height: auto; }
html body[class*="path-"] #wrapper .cyb-review-table { width: 100%; margin: 1rem 0; }
html body[class*="path-"] #wrapper .cyb-review-table :is(th, td) { padding: .85rem; text-align: left; border-bottom: 1px solid #e2d4ec; overflow-wrap: anywhere; }

@media (max-width: 600px) {
  html body[class*="path-"] #wrapper .cyb-review-dialog .ui-dialog-content { padding: 1rem; }
  html body[class*="path-"] #wrapper .cyb-review-images { grid-template-columns: 1fr; }
  html body[class*="path-"] #wrapper .cyb-review-detail { padding: 1rem; }
  html body[class*="path-"] #wrapper .cyb-review-table thead { display: none; }
  html body[class*="path-"] #wrapper .cyb-review-table :is(tbody, tr, td) { display: block; width: 100%; box-sizing: border-box; }
  html body[class*="path-"] #wrapper .cyb-review-table tr { margin-bottom: 1rem; border: 1px solid #e2d4ec; border-radius: 8px; }
  html body[class*="path-"] #wrapper .cyb-review-table td::before { content: attr(data-label); display: block; font-weight: 600; margin-bottom: .25rem; }
  html body[class*="path-"] #wrapper .cyb-review-form .form-actions .form-submit { width: 100%; }
}

/* Five rating choices remain complete inside the narrowest supported dialog. */
@media (max-width: 767px) {
  html body[class*="path-"] #wrapper .cyb-review-form .cyb-review-star-input .form-type-radio {
    flex-basis: 46px;
    min-height: 46px;
  }
  html body[class*="path-"] #wrapper .cyb-review-form .cyb-review-star-input .form-type-radio label {
    height: 44px;
  }
}

/* Contain staff review tabs without changing the shared workspace heading. */
html body.path-dashboard #wrapper .cyb-review-workspace .jdd-workspace-nav {
  box-sizing: border-box;
  max-width: 100%;
  width: 100%;
  margin-inline: 0;
  overflow-x: auto;
}

/* assets/css/shared-chrome.css */
/* Native public chrome: forum owns the shared presentation at every width. */
html body[class*="path-"] #wrapper header.header {
  color: #555;
}

/* Legacy blog/form rules must stay inside their main content regions. */
html body[class*="path-"] #wrapper header.header #block-header-info2 .block-content,
html body[class*="path-"] #wrapper #footer .block-content {
  padding: 0 !important;
}

/* The blog feed's field-item indent belongs to its main content only. */
html body.path-blog #wrapper header.header #block-header-info2 .field-body.field-item,
html body.path-blog #wrapper #footer #block-footer-about .field-body.field-item {
  padding-left: 0 !important;
}

html body[class*="path-"] #wrapper header.header .header-item.header-right {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* Shared sale/account strip geometry; keep the native block wrappers. */
@media (min-width: 768px) {
  html body[class*="path-"] #wrapper header.header .header-top .region-header-top-second {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 0.25rem 0.75rem;
    margin-top: 0 !important;
    padding-bottom: 0 !important;
  }
}

@media (min-width: 1200px) {
  html body[class*="path-"] #wrapper header.header .header-top > .container > .row {
    align-items: center !important;
  }
}

@media (max-width: 768px) {
  html body[class*="path-"] #wrapper header.header .header-top {
    padding-top: 0.8rem !important;
    padding-bottom: 1.1rem !important;
  }

  html body[class*="path-"] #wrapper header.header .header-top > .container > .row {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 0 !important;
  }

  html body[class*="path-"] #wrapper header.header .header-top :is(.header-top-first, .header-top-second, .region-header-top-first, .region-header-top-second) {
    margin: 0 !important;
    padding: 0 !important;
  }

  html body[class*="path-"] #wrapper header.header .header-top .region-header-top-second {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 0 !important;
  }
}

/* The reference uses the extra stack gap strictly below 768px. */
@media (max-width: 767.98px) {
  html body[class*="path-"] #wrapper header.header .header-top > .container > .row {
    gap: 0.5rem !important;
  }
}

/* Keep the legacy product .row gutter out of the promo row below 1000px. */
@media (max-width: 1000px) {
  html body[class*="path-"] #wrapper header.header .header-top > .container > .row {
    margin-right: 0 !important;
  }

  html body.path-automotive-services.page-automotive-services #wrapper header.header .navbar > .container > .header-main-wrap {
    margin-right: 0 !important;
  }
}

/* Promo and menu use different native gutters at the tablet breakpoint. */
@media (min-width: 768.01px) and (max-width: 991.98px) {
  html body[class*="path-"] #wrapper header.header .header-top > .container {
    width: 100% !important;
    max-width: 720px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
  }
}

@media (min-width: 768px) and (max-width: 991.98px) {
  html body[class*="path-"] #wrapper header.header #block-call-to-order .block-field-blockblock-contentbasicbody > .container-wrap {
    max-width: 720px !important;
  }

  html body[class*="path-"] #wrapper header.header .nav-menu > .container {
    width: 100% !important;
    max-width: 720px !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  html body[class*="path-"] #wrapper header.header .nav-menu > .container {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}

@media (max-width: 768px) {
  html body[class*="path-"] #wrapper header.header .header-top > .container {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 12px !important;
    padding-right: 12px !important;
  }
}

@media (min-width: 992px) and (max-width: 1199.98px) {
  html body[class*="path-"] #wrapper header.header .header-top > .container {
    width: 100% !important;
    max-width: 960px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
  }
}

@media (max-width: 991.98px) {
  html body[class*="path-"] #wrapper header.header .header-center > .container {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
}

/* Retain the native nested contact field's right gutter. Its own vertical
 * padding and tablet left margin are part of the reference presentation. */
@media (max-width: 1199.98px) {
  html body[class*="path-"] #wrapper header.header #block-call-to-order .layout__region {
    padding-left: 0 !important;
    padding-right: 15px !important;
  }

  html body[class*="path-"] #wrapper header.header #block-call-to-order .block-layout-builder {
    margin-right: 0 !important;
  }
}

@media (min-width: 992px) {
  html body[class*="path-"] #wrapper header.header #block-header-info2 .header-info-hours-label {
    font-size: 0.82rem !important;
    line-height: 1.3 !important;
    letter-spacing: 0.04em !important;
  }
}

/* Native footer ancestor gutters, measured on /forum. The front page's old
 * full-width resets and storefront container rules must not reach this block. */
html body[class*="path-"] #wrapper #footer .footer-bottom {
  width: 100% !important;
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

html body[class*="path-"] #wrapper #footer .footer-bottom > .container {
  width: 100% !important;
  max-width: 1220px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 15px !important;
  padding-right: 15px !important;
}

html body[class*="path-"] #wrapper #footer .footer-bottom > .container > .row,
html body[class*="path-"] #wrapper #footer #block-footer-about .row.layout {
  width: auto !important;
  max-width: none !important;
  margin-left: -15px !important;
  margin-right: -15px !important;
}

html body[class*="path-"] #wrapper #footer .footer-bottom .footer-bottom-first,
html body[class*="path-"] #wrapper #footer #block-footer-about .layout__region {
  padding-left: 15px !important;
  padding-right: 15px !important;
}

html body[class*="path-"] #wrapper #footer #block-footer-about,
html body[class*="path-"] #wrapper #footer #block-footer-about .container-wrap,
html body[class*="path-"] #wrapper #footer #block-footer-about .block-layout-builder {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* Native desktop field paragraphs use 101.25%; catalog width resets and the
 * old front-page image margin must not move the shared footer's controls. */
@media (min-width: 1200px) {
  html body[class*="path-"] #wrapper #footer #block-footer-about footer.jd-site-footer p {
    width: 101.25% !important;
  }

  html body[class*="path-"] #wrapper #footer #block-footer-about footer.jd-site-footer img.protest {
    margin-left: 7.5rem !important;
    margin-right: auto !important;
  }
}

@media (max-width: 1199.98px) {
  html body[class*="path-"] #wrapper #footer .footer-bottom > .container {
    max-width: 960px !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
  }

  html body[class*="path-"] #wrapper #footer .footer-bottom > .container > .row,
  html body[class*="path-"] #wrapper #footer #block-footer-about .row.layout {
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  html body[class*="path-"] #wrapper #footer #block-footer-about .layout__region {
    padding-left: 0 !important;
  }

  html body[class*="path-"] #wrapper #footer #block-footer-about,
  html body[class*="path-"] #wrapper #footer #block-footer-about .block-layout-builder {
    margin-right: -10px !important;
  }
}

@media (max-width: 991.98px) {
  html body[class*="path-"] #wrapper #footer .footer-bottom > .container {
    max-width: 720px !important;
  }
}

@media (max-width: 767.98px) {
  html body[class*="path-"] #wrapper #footer .footer-bottom > .container {
    max-width: 540px !important;
  }
}

@media (max-width: 575.98px) {
  html body[class*="path-"] #wrapper #footer .footer-bottom > .container {
    max-width: none !important;
  }
}

/* assets/css/node-animations.css */
/* Node-specific illustrations retain the surrounding service/article theme. */
html body.path-node:is(.page-node-type-service, .page-node-type-blog) #wrapper .jd-node-animation-pair {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: center;
  gap: 20px;
  width: 100%;
  min-width: 0;
  margin: 0 0 22px;
}

html body.path-node:is(.page-node-type-service, .page-node-type-blog) #wrapper .jd-node-animation-copy,
html body.path-node:is(.page-node-type-service, .page-node-type-blog) #wrapper .jd-node-animation-media {
  min-width: 0;
}

html body.path-node.page-node-type-service #wrapper .jd-node-animation-copy > .jd-city-editorial,
html body.path-node.page-node-type-service #wrapper .jd-city-retained-editorial .jd-node-animation-copy > .material-card {
  margin-bottom: 0 !important;
}

html body.path-node:is(.page-node-type-service, .page-node-type-blog) #wrapper .jd-node-animation-media {
  width: 100%;
  margin: 0;
}

html body.path-node:is(.page-node-type-service, .page-node-type-blog) #wrapper .jd-node-animation-media .jd-hub-animation {
  position: relative;
  display: block;
  width: 100%;
  min-width: 0;
  aspect-ratio: 3 / 2;
  overflow: hidden;
  margin: 0;
  padding: 0;
  border: 1px solid #e3d4ed;
  border-radius: 12px;
  background: #faf5ff;
}

html body.path-node:is(.page-node-type-service, .page-node-type-blog) #wrapper .jd-node-animation-media .jd-hub-animation-poster,
html body.path-node:is(.page-node-type-service, .page-node-type-blog) #wrapper .jd-node-animation-media .jd-hub-animation-stage {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  max-height: none;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
}

html body.path-node:is(.page-node-type-service, .page-node-type-blog) #wrapper .jd-node-animation-media .jd-hub-animation-poster {
  object-fit: contain;
}

html body.path-node:is(.page-node-type-service, .page-node-type-blog) #wrapper .jd-node-animation-media .jd-hub-animation-stage {
  visibility: hidden;
}

html body.path-node:is(.page-node-type-service, .page-node-type-blog) #wrapper .jd-node-animation-media .jd-hub-animation-stage > svg {
  display: block;
  width: 100%;
  height: 100%;
}

html body.path-node:is(.page-node-type-service, .page-node-type-blog) #wrapper .jd-node-animation-media .jd-hub-animation.is-ready .jd-hub-animation-stage {
  visibility: visible;
}

html body.path-node:is(.page-node-type-service, .page-node-type-blog) #wrapper .jd-node-animation-media .jd-hub-animation.is-ready .jd-hub-animation-poster {
  visibility: hidden;
}

html body.path-node:is(.page-node-type-service, .page-node-type-blog) #wrapper .jd-node-animation-media .jd-hub-animation-control {
  position: absolute;
  right: 10px;
  bottom: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 76px;
  min-height: 44px;
  margin: 0;
  padding: 8px 12px;
  border: 1px solid #b781e3;
  border-radius: 9px;
  background: #ffffffed;
  color: #3b0a5c;
  -webkit-text-fill-color: #3b0a5c;
  font-family: var(--jd-font-text, "Source Sans 3", sans-serif);
  font-size: 13px;
  font-weight: 700;
  line-height: 1.2;
  box-shadow: 0 2px 8px #2414380d;
  cursor: pointer;
  touch-action: manipulation;
}

html body.path-node:is(.page-node-type-service, .page-node-type-blog) #wrapper .jd-node-animation-media .jd-hub-animation-control:hover {
  background: #f3e8ff;
}

html body.path-node:is(.page-node-type-service, .page-node-type-blog) #wrapper .jd-node-animation-media .jd-hub-animation-control:focus-visible {
  /* The native theme's button reset uses an important zero outline. */
  outline: 3px solid #9d4edd !important;
  outline-offset: 3px !important;
}

html body.path-node:is(.page-node-type-service, .page-node-type-blog) #wrapper .jd-node-animation-media .jd-hub-animation-control[hidden] {
  display: none !important;
}

@media (min-width: 992px) {
  html body.path-node:is(.page-node-type-service, .page-node-type-blog) #wrapper .jd-node-animation-pair {
    grid-template-columns: minmax(0, 1fr) minmax(0, 38%);
    gap: 24px;
  }

  html body.path-node:is(.page-node-type-service, .page-node-type-blog) #wrapper .jd-node-animation-media {
    max-width: 420px;
    justify-self: end;
  }
}

@media (prefers-reduced-motion: reduce) {
  html body.path-node:is(.page-node-type-service, .page-node-type-blog) #wrapper .jd-node-animation-media .jd-hub-animation .jd-hub-animation-stage {
    visibility: hidden;
  }

  html body.path-node:is(.page-node-type-service, .page-node-type-blog) #wrapper .jd-node-animation-media .jd-hub-animation .jd-hub-animation-poster {
    visibility: visible;
  }

  html body.path-node:is(.page-node-type-service, .page-node-type-blog) #wrapper .jd-node-animation-media .jd-hub-animation .jd-hub-animation-control {
    display: none !important;
  }
}

/* assets/css/service-section-navigation.css */
/* Native section links belong only to published service-page content. */
html body.path-node.page-node-type-service #wrapper .jd-city-page--service .jd-section-navigation {
  width:100%; margin:0 0 28px; padding-top:16px; border-top:1px solid #e1ccee;
  color:#3b0a5c; font-family:inherit;
}
html body.path-node.page-node-type-service #wrapper .jd-city-page--service .jd-section-navigation__desktop {
  display:flex; flex-wrap:wrap; align-items:flex-start; gap:4px 20px;
}
html body.path-node.page-node-type-service #wrapper .jd-city-page--service .jd-section-navigation a {
  display:inline-flex; align-items:center; min-height:44px; max-width:100%;
  padding:8px 0; font-size:15px; line-height:1.5; font-weight:600;
  color:#6716aa; -webkit-text-fill-color:#6716aa; text-shadow:none;
  text-decoration:underline; text-underline-offset:3px; text-decoration-thickness:1px;
  white-space:normal; overflow-wrap:anywhere;
}
html body.path-node.page-node-type-service #wrapper .jd-city-page--service .jd-section-navigation a:hover {
  color:#3b0a5c; -webkit-text-fill-color:#3b0a5c; text-decoration-thickness:2px;
}
html body.path-node.page-node-type-service #wrapper .jd-city-page--service .jd-section-navigation :is(a,summary):focus-visible,
html body.path-node.page-node-type-service #wrapper .jd-city-page--service .jd-service-section-target:focus-visible {
  outline:3px solid #9d4edd; outline-offset:3px; border-radius:4px;
}
html body.path-node.page-node-type-service #wrapper .jd-city-page--service .jd-service-section-target {
  scroll-margin-top:calc(24px + var(--drupal-displace-offset-top,0px));
}
html body.path-node.page-node-type-service #wrapper .jd-city-page--service .jd-section-navigation__mobile { display:none; }
@media (max-width:767.98px) {
  html body.path-node.page-node-type-service #wrapper .jd-city-page--service .jd-section-navigation__desktop { display:none; }
  html body.path-node.page-node-type-service #wrapper .jd-city-page--service .jd-section-navigation__mobile {
    display:block; margin:0; min-width:0; border:1px solid #dfc7ef; border-radius:8px; background:#fff;
  }
  html body.path-node.page-node-type-service #wrapper .jd-city-page--service .jd-section-navigation__mobile > summary {
    display:list-item; list-style-type:disclosure-closed;
    min-height:44px; margin:0; padding:12px 16px; border-radius:7px;
    font-size:15px; line-height:1.5; font-weight:600; cursor:pointer;
    color:#3b0a5c; -webkit-text-fill-color:#3b0a5c; text-shadow:none;
  }
  html body.path-node.page-node-type-service #wrapper .jd-city-page--service .jd-section-navigation__mobile > summary::marker { color:#6716aa; }
  html body.path-node.page-node-type-service #wrapper .jd-city-page--service .jd-section-navigation__mobile[open] > summary { list-style-type:disclosure-open; border-bottom:1px solid #e1ccee; }
  html body.path-node.page-node-type-service #wrapper .jd-city-page--service .jd-section-navigation__mobile > nav {
    display:flex; flex-direction:column; align-items:stretch; gap:2px; padding:8px 16px 12px;
  }
  html body.path-node.page-node-type-service #wrapper .jd-city-page--service .jd-section-navigation__mobile a { width:100%; }
}
@media (forced-colors:active) {
  html body.path-node.page-node-type-service #wrapper .jd-city-page--service .jd-section-navigation :is(a,summary):focus-visible,
  html body.path-node.page-node-type-service #wrapper .jd-city-page--service .jd-service-section-target:focus-visible { outline-color:Highlight; }
}

/* assets/css/detailing-guides.css */
/** Complete, source-backed guides. Scoped to registered Basic page content. */
html body.path-node #wrapper :is(.jd-guide, .jd-guides-hub) {
  --guide-ink: #241438;
  --guide-purple: #6716aa;
  --guide-deep: #3b0a5c;
  --guide-lavender: #f3e8ff;
  --guide-soft: #faf5ff;
  --guide-line: #dfd2ed;
  width: 100%;
  max-width: 1220px;
  min-width: 0;
  margin: 0 auto 3rem;
  color: var(--guide-ink);
  font-size: 16px;
  font-weight: 400;
  line-height: 1.7;
  overflow-wrap: anywhere;
}
html body.jd-guide-page #wrapper .page-title,
html body.jd-guide-page #wrapper .page-title h1,
html body.jd-guides-index #wrapper .page-title,
html body.jd-guides-index #wrapper .page-title h1 {
  color: #3b0a5c !important;
  text-shadow: none;
  font-size: clamp(2.125rem, 4vw, 3.5rem);
  line-height: 1.15;
  letter-spacing: -0.025em;
  text-align: left;
}
html body.path-node #wrapper :is(.jd-guide, .jd-guides-hub) :is(p, li, td, th, dd, dt) {
  color: var(--guide-ink) !important;
  background: transparent !important;
  border: 0 !important;
  padding: 0;
  font-size: inherit;
  font-weight: 400;
  line-height: 1.7;
  text-align: left;
  text-shadow: none !important;
}
html body.path-node #wrapper :is(.jd-guide, .jd-guides-hub) :is(strong, b, em, i, small) {
  color: inherit !important;
  background: transparent !important;
  text-shadow: none !important;
}
html body.path-node #wrapper :is(.jd-guide, .jd-guides-hub) :is(strong, b) { font-weight: 700; }
html body.path-node #wrapper :is(.jd-guide, .jd-guides-hub) p {
  max-width: 78ch;
  margin: 0 0 1rem;
}
html body.path-node #wrapper :is(.jd-guide, .jd-guides-hub) :is(h2, h3, h4, h5) {
  color: var(--guide-deep);
  font-weight: 700;
  line-height: 1.3;
  text-shadow: none;
  overflow-wrap: anywhere;
}
html body.path-node #wrapper :is(.jd-guide, .jd-guides-hub) h2 {
  margin: 0 0 1rem;
  font-size: clamp(1.55rem, 2.4vw, 2rem);
}
html body.path-node #wrapper .jd-guide :is(h3, h4) {
  margin: 1.5rem 0 0.65rem;
  font-size: 1.2rem;
}
html body.path-node #wrapper :is(.jd-guide, .jd-guides-hub) :is(ul, ol) {
  margin: 0 0 1rem;
  padding-left: 1.5rem;
}
html body.path-node #wrapper :is(.jd-guide, .jd-guides-hub) li + li { margin-top: 0.45rem; }
html body.path-node #wrapper :is(.jd-guide, .jd-guides-hub) a:not(.jd-guide-button):not(.jd-city-button):not(.jd-guide-card-link) {
  color: var(--guide-purple);
  text-decoration: underline;
  text-underline-offset: 0.2em;
  overflow-wrap: anywhere;
}
html body.path-node #wrapper :is(.jd-guide, .jd-guides-hub) :is(a, button, input, summary):focus-visible {
  outline: 3px solid #9d4edd;
  outline-offset: 4px;
}
html body.path-node #wrapper :is(.jd-guide-intro, .jd-guides-hub-intro) {
  margin-bottom: 1.75rem;
  padding: clamp(1.25rem, 3vw, 2rem);
  border: 1px solid var(--guide-line);
  border-radius: 20px;
  background: linear-gradient(135deg, #faf5ff, #f3e8ff);
}
html body.path-node #wrapper :is(.jd-guide, .jd-guides-hub) .jd-guide-eyebrow {
  color: var(--guide-purple) !important;
  font-size: 0.85rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
html body.path-node #wrapper :is(.jd-guide, .jd-guides-hub) .jd-guide-lead {
  max-width: 75ch;
  font-size: 1.15rem;
  line-height: 1.65;
}
html body.path-node #wrapper :is(.jd-guide-actions, .jd-guide-intro-actions, .jd-guide-control-actions, .jd-guide-card-actions) {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem;
  margin-top: 1rem;
}
html body.path-node #wrapper :is(.jd-guide-button, .jd-guide-card-link, .jd-guides-hub .jd-city-button, .jd-guide .jd-city-button) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  min-height: 44px;
  max-width: 100%;
  padding: 0.7rem 1rem;
  border: 2px solid #6716aa;
  border-radius: 10px;
  background: #6716aa;
  color: #fff !important;
  font: inherit;
  font-weight: 700;
  line-height: 1.35;
  text-align: center;
  text-decoration: none !important;
  cursor: pointer;
  white-space: normal;
}
html body.path-node #wrapper .jd-guide-button--quiet {
  background: #fff;
  color: #6716aa !important;
}
html body.path-node #wrapper .jd-guide-button:hover { background: #3b0a5c; color: #fff !important; }
html body.path-node #wrapper .jd-guide-button:disabled { opacity: 0.6; cursor: default; }
html body.path-node #wrapper .jd-guide-controls:not(:empty) {
  margin-bottom: 1.75rem;
  padding: 1.25rem;
  border: 1px solid var(--guide-line);
  border-radius: 14px;
  background: #fff;
}
html body.path-node #wrapper .jd-guide .jd-guide-progress-count { font-weight: 700; margin-bottom: 0.25rem; }
html body.path-node #wrapper .jd-guide .jd-guide-progress-note { font-size: 0.9rem; margin-bottom: 0.75rem; }
html body.path-node #wrapper .jd-guide progress {
  display: block;
  width: 100%;
  height: 12px;
  overflow: hidden;
  border: 0;
  border-radius: 8px;
  accent-color: #6716aa;
  background: #f3e8ff;
}
html body.path-node #wrapper .jd-guide progress::-webkit-progress-bar { background: #f3e8ff; }
html body.path-node #wrapper .jd-guide progress::-webkit-progress-value { background: #6716aa; }
html body.path-node #wrapper .jd-guide-layout { display: grid; gap: 2rem; align-items: start; }
html body.path-node #wrapper .jd-guide-chapters { min-width: 0; }
html body.path-node #wrapper .jd-guide-toc {
  min-width: 0;
  padding: 1rem;
  border: 1px solid var(--guide-line);
  border-radius: 14px;
  background: var(--guide-soft);
}
html body.path-node #wrapper .jd-guide-toc summary {
  min-height: 44px;
  padding: 0.5rem;
  color: #3b0a5c;
  font-weight: 700;
  cursor: pointer;
}
html body.path-node #wrapper .jd-guide-toc a {
  display: flex;
  align-items: center;
  min-height: 44px;
  padding: 0.5rem 0.25rem;
  line-height: 1.4;
}
html body.path-node #wrapper .jd-guide-toc ul { padding-left: 1rem; margin-bottom: 0; }
html body.path-node #wrapper .jd-guide-chapter {
  margin-bottom: 2rem;
  padding: clamp(1.1rem, 2.3vw, 1.75rem);
  border: 1px solid var(--guide-line);
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 8px 26px #24143808;
  scroll-margin-top: calc(2rem + var(--drupal-displace-offset-top, 0px));
}
html body.path-node #wrapper .jd-guide-chapter-heading { display: grid; gap: 1rem; align-items: center; margin-bottom: 1.5rem; border: 0; box-shadow: none; background: transparent; }
html body.path-node #wrapper .jd-guide-illustration-slot { min-width: 0; }
html body.path-node #wrapper :is(.jd-guide, .jd-guides-hub) .jd-hub-animation {
  position: relative;
  width: 100%;
  min-width: 0;
  aspect-ratio: 3 / 2;
  overflow: hidden;
  border: 1px solid #dfd2ed;
  border-radius: 14px;
  background: #faf5ff;
}
html body.path-node #wrapper :is(.jd-guide, .jd-guides-hub) :is(.jd-hub-animation-poster, .jd-hub-animation-stage) {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  object-fit: contain;
}
html body.path-node #wrapper :is(.jd-guide, .jd-guides-hub) .jd-hub-animation-stage { opacity: 0; }
html body.path-node #wrapper :is(.jd-guide, .jd-guides-hub) .jd-hub-animation-stage > svg { width: 100%; height: 100%; }
html body.path-node #wrapper :is(.jd-guide, .jd-guides-hub) .jd-hub-animation.is-ready .jd-hub-animation-stage { opacity: 1; }
html body.path-node #wrapper :is(.jd-guide, .jd-guides-hub) .jd-hub-animation.is-ready .jd-hub-animation-poster { opacity: 0; }
html body.path-node #wrapper :is(.jd-guide, .jd-guides-hub) .jd-hub-animation-control {
  position: absolute;
  right: 12px;
  bottom: 12px;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  min-width: 86px;
  padding: 0.55rem 0.85rem;
  border: 2px solid #6716aa;
  border-radius: 9px;
  background: #fff;
  color: #6716aa;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}
html body.path-node #wrapper :is(.jd-guide, .jd-guides-hub) .jd-hub-animation-control[hidden] { display: none !important; }
html body.path-node #wrapper .jd-guide-step {
  margin-top: 1.5rem;
  padding-top: 1.25rem;
  border-top: 1px solid var(--guide-line);
  scroll-margin-top: calc(2rem + var(--drupal-displace-offset-top, 0px));
}
html body.path-node #wrapper .jd-guide-step-heading {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  gap: 0.5rem;
  align-items: start;
  min-height: 44px;
  margin-bottom: 0.65rem;
}
html body.path-node #wrapper .jd-guide-step-heading :is(h3, h4) {
  min-width: 0;
  margin: 0;
  padding-top: calc((44px - 1.3em) / 2);
}
html body.path-node #wrapper .jd-guide-step-check {
  flex: 0 0 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  min-width: 44px;
  min-height: 44px;
  margin: 0;
  accent-color: #6716aa;
  cursor: pointer;
}
html body.path-node #wrapper .jd-guide-step-heading input[type="checkbox"] {
  flex: 0 0 22px;
  width: 22px;
  height: 22px;
  min-width: 22px;
  min-height: 22px;
  margin: 0;
  accent-color: #6716aa;
  cursor: pointer;
}

/* One logical step can be checked from its instructions, list or tracker. */
html body.path-node #wrapper .jd-guide :is(.jd-guide-step-check, .jd-guide-proxy-check, .jd-guide-tracker-completion) {
  box-sizing: border-box;
  border-radius: 8px;
  -webkit-tap-highlight-color: #6716aa20;
}
html body.path-node #wrapper .jd-guide :is(.jd-guide-step-check, .jd-guide-proxy-check):hover {
  background: var(--guide-lavender);
}
html body.path-node #wrapper .jd-guide :is(.jd-guide-step-check, .jd-guide-proxy-check, .jd-guide-tracker-completion):focus-within {
  outline: 3px solid #9d4edd;
  outline-offset: 2px;
}
html body.path-node #wrapper .jd-guide :is(.jd-guide-step-check, .jd-guide-proxy-check, .jd-guide-tracker-completion) input[type="checkbox"] {
  appearance: auto;
  position: static;
  display: block;
  flex: 0 0 22px;
  width: 22px;
  height: 22px;
  min-width: 22px;
  min-height: 22px;
  margin: 0 !important;
  padding: 0;
  accent-color: var(--guide-purple);
  opacity: 1;
  cursor: pointer;
}
html body.path-node #wrapper .jd-guide :is(.jd-guide-step-check, .jd-guide-proxy-check, .jd-guide-tracker-completion) input:focus-visible {
  outline: none;
}

/* Native chapter groups remain useful before JavaScript enhances tracking. */
html body.path-node #wrapper .jd-guide-tracker-slot {
  position: relative;
  min-width: 0;
  margin-bottom: 1.75rem;
}
html body.path-node #wrapper .jd-guide-tracker {
  position: relative;
  box-sizing: border-box;
  min-width: 0;
  width: 100%;
  border: 1px solid var(--guide-line);
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 5px 20px #2414380d;
}
html body.path-node #wrapper .jd-guide-tracker.is-pinned {
  position: fixed;
  z-index: 80;
  margin: 0;
  box-shadow: 0 7px 24px #2414381c;
}
html body.path-node #wrapper .jd-guide-tracker-bar { display: none; }
html body.path-node #wrapper .jd-guide.is-tracker-ready .jd-guide-tracker-bar {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 0.75rem;
  align-items: center;
  box-sizing: border-box;
  padding: 0.75rem 1rem;
}
html body.path-node #wrapper .jd-guide-tracker-bar[hidden] { display: none !important; }
html body.path-node #wrapper .jd-guide-tracker-current {
  min-width: 0;
  line-height: 1.4;
}
html body.path-node #wrapper .jd-guide-tracker-context {
  display: inline;
  margin-right: 0.45rem;
  color: var(--guide-deep);
  font-size: 0.75rem;
  font-weight: 600;
  line-height: 1.4;
}
html body.path-node #wrapper .jd-guide-tracker-count {
  display: inline-block;
  padding: 0.1rem 0.4rem;
  border-radius: 6px;
  background: var(--guide-lavender);
  color: var(--guide-deep);
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 1.4;
  white-space: nowrap;
}
html body.path-node #wrapper .jd-guide a.jd-guide-tracker-title {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  min-height: 44px;
  margin-top: 0.2rem;
  color: var(--guide-deep);
  font-size: 0.95rem;
  font-weight: 700;
  line-height: 1.35;
  text-decoration-thickness: 1px;
}
html body.path-node #wrapper .jd-guide-tracker-completion {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  min-height: 44px;
  min-width: 44px;
  margin: 0;
  padding: 0.5rem;
  border: 1px solid var(--guide-line);
  background: var(--guide-soft);
  color: var(--guide-deep);
  font-size: 0.85rem;
  font-weight: 700;
  line-height: 1.3;
  cursor: pointer;
}
html body.path-node #wrapper .jd-guide .jd-guide-tracker-navigation {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  align-items: center;
}
html body.path-node #wrapper .jd-guide .jd-guide-tracker-navigation button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  min-height: 44px;
  min-width: 44px;
  max-width: 100%;
  margin: 0;
  padding: 0.55rem 0.7rem;
  border: 1px solid var(--guide-purple);
  border-radius: 8px;
  background: #fff;
  color: var(--guide-purple) !important;
  font: inherit;
  font-size: 0.85rem;
  font-weight: 700;
  line-height: 1.35;
  text-align: center;
  white-space: normal;
  cursor: pointer;
}
html body.path-node #wrapper .jd-guide .jd-guide-tracker-navigation .jd-guide-all-steps {
  background: var(--guide-purple);
  color: #fff !important;
}
html body.path-node #wrapper .jd-guide .jd-guide-tracker-navigation button:hover:not(:disabled) {
  background: var(--guide-deep);
  color: #fff !important;
}
html body.path-node #wrapper .jd-guide .jd-guide-tracker-navigation button:disabled {
  border-color: var(--guide-line);
  background: var(--guide-soft);
  color: #66556f !important;
  opacity: 1;
  cursor: default;
}
html body.path-node #wrapper .jd-guide-checklist { margin: 0; min-width: 0; }
html body.path-node #wrapper .jd-guide-checklist > summary {
  box-sizing: border-box;
  min-height: 44px;
  padding: 0.75rem 1rem;
  color: var(--guide-deep);
  font-weight: 700;
  cursor: pointer;
}
html body.path-node #wrapper .jd-guide.is-tracker-ready .jd-guide-checklist > summary { display: none; }
html body.path-node #wrapper .jd-guide.is-tracker-ready .jd-guide-checklist[open] {
  position: absolute;
  z-index: 1;
  top: 100%;
  left: -1px;
  right: -1px;
  box-sizing: border-box;
  max-height: min(50vh, var(--jd-guide-panel-room, 50vh));
  max-height: min(50dvh, var(--jd-guide-panel-room, 50dvh));
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 0.5rem;
  border: 1px solid var(--guide-line);
  border-radius: 0 0 14px 14px;
  background: #fff;
  box-shadow: 0 12px 24px #24143820;
  scrollbar-gutter: stable;
}
html body.path-node #wrapper .jd-guide-checklist-group {
  min-width: 0;
  border-bottom: 1px solid var(--guide-line);
}
html body.path-node #wrapper .jd-guide-checklist-group:last-child { border-bottom: 0; }
html body.path-node #wrapper .jd-guide-checklist-group > summary {
  box-sizing: border-box;
  min-height: 44px;
  padding: 0.65rem 0.75rem;
  color: var(--guide-deep);
  font-size: 0.95rem;
  font-weight: 700;
  line-height: 1.45;
  cursor: pointer;
}
html body.path-node #wrapper .jd-guide-checklist-group > summary:hover { background: var(--guide-soft); }
html body.path-node #wrapper .jd-guide-checklist-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.25rem 0.6rem;
  align-items: start;
  min-width: 0;
  margin: 0.25rem 0;
  padding: 0.4rem 0.65rem;
  border-radius: 9px;
}
html body.path-node #wrapper .jd-guide.is-tracker-ready .jd-guide-checklist-row {
  grid-template-columns: 44px minmax(0, 1fr) auto;
}
html body.path-node #wrapper .jd-guide-checklist-row:is(.is-current, [aria-current="step"]) {
  background: var(--guide-lavender);
  box-shadow: inset 3px 0 0 var(--guide-purple);
}
html body.path-node #wrapper .jd-guide:not(.is-tracker-ready) .jd-guide-proxy-check { display: none; }
html body.path-node #wrapper .jd-guide-proxy-check {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  min-width: 44px;
  min-height: 44px;
  margin: 0;
  cursor: pointer;
}
html body.path-node #wrapper .jd-guide-checklist-title {
  min-width: 0;
  padding-top: calc((44px - 1.45em) / 2);
  color: var(--guide-ink);
  font-size: 0.9rem;
  font-weight: 600;
  line-height: 1.45;
}
html body.path-node #wrapper .jd-guide :is(a.jd-guide-read-step, a.jd-guide-return) {
  display: inline-flex;
  align-items: center;
  box-sizing: border-box;
  min-height: 44px;
  max-width: 100%;
  padding: 0.5rem 0.25rem;
  font-size: 0.85rem;
  font-weight: 600;
  line-height: 1.4;
}
html body.path-node #wrapper .jd-guide a.jd-guide-return { margin-top: 0.25rem; }
html body.path-node #wrapper .jd-guide :is(.jd-guide-checklist-guidance, .jd-guide-checklist-references) {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem 0.8rem;
  padding: 0 0.75rem 0.5rem;
  font-size: 0.85rem;
}
html body.path-node #wrapper .jd-guide :is(.jd-guide-checklist-guidance, .jd-guide-checklist-references) a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
}
html body.path-node #wrapper .jd-guide :is(.jd-guide-chapter, .jd-guide-step, .jd-guide-references, .jd-guide-support, .jd-guide-safety-note, h2[id], h3[id], h4[id], h5[id], [data-guide-reference]) {
  scroll-margin-top: var(--jd-guide-tracker-offset, calc(2rem + var(--drupal-displace-offset-top, 0px)));
}
html body.path-node #wrapper .jd-guide :is(h2, h3, h4, h5, .jd-guide-support, .jd-guide-safety-note)[tabindex="-1"]:focus-visible {
  outline: 3px solid #9d4edd;
  outline-offset: 4px;
}
html body.path-node #wrapper :is(.jd-guide-note, .jd-guide-safety-note, .jd-guide-application-note, .jd-guide-warning, .jd-guide-professional, .jd-guide-professional-notes) {
  margin: 1.25rem 0;
  padding: 1rem 1.25rem;
  border: 1px solid #dfd2ed;
  border-left: 4px solid #6716aa;
  border-radius: 12px;
  background: #faf5ff;
}
html body.path-node #wrapper :is(.jd-guide-professional, .jd-guide-professional-notes) summary { min-height: 44px; color: #3b0a5c; font-weight: 700; cursor: pointer; }
html body.path-node #wrapper .jd-guide :is(table, pre) { display: block; width: 100%; max-width: 100%; overflow-x: auto; margin: 1rem 0; }
html body.path-node #wrapper .jd-guide table :is(th, td) { padding: 0.6rem !important; border-bottom: 1px solid #dfd2ed !important; }
html body.path-node #wrapper .jd-guides-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.25rem; margin: 1.5rem 0; }
html body.path-node #wrapper .jd-guide-card { min-width: 0; display: flex; flex-direction: column; gap: 0.5rem; padding: 1.5rem; border: 1px solid #dfd2ed; border-radius: 18px; background: #fff; box-shadow: 0 8px 26px #24143808; }
html body.path-node #wrapper .jd-guide-card h3 { margin: 0; font-size: 1.35rem; }
html body.path-node #wrapper .jd-guide-card-actions { margin-top: auto; }
html body.path-node #wrapper .jd-guides-hub-intro .jd-guide-illustration-slot { max-width: 520px; }
html body.path-node #wrapper .jd-city-hero-actions .jd-service-guide-link { min-height: 44px; white-space: normal; text-align: center; }
@media (min-width: 992px) {
  html body.path-node #wrapper .jd-guide-layout { grid-template-columns: 226px minmax(0, 1fr); }
  html body.path-node #wrapper .jd-guide-toc { position: sticky; top: var(--jd-guide-tracker-offset, calc(1.5rem + var(--drupal-displace-offset-top, 0px))); max-height: calc(100vh - 2rem - var(--jd-guide-tracker-offset, var(--drupal-displace-offset-top, 0px))); overflow-y: auto; }
  html body.path-node #wrapper .jd-guide-chapter-heading { grid-template-columns: minmax(0, 1.1fr) minmax(240px, 0.9fr); }
  html body.path-node #wrapper .jd-guides-hub-intro { display: grid; grid-template-columns: minmax(0, 1fr) minmax(300px, 0.8fr); gap: 2rem; align-items: center; }
}
@media (max-width: 767px) {
  html body.path-node #wrapper :is(.jd-guide, .jd-guides-hub) { font-size: 15.5px; }
  html body.path-node #wrapper .jd-guides-grid { grid-template-columns: 1fr; }
  html body.path-node #wrapper :is(.jd-guide-button, .jd-guide-card-link, .jd-guide-card-actions, .jd-guide-control-actions > button) { width: 100%; }
  html body.path-node #wrapper .jd-guide-chapter { padding: 1.1rem; border-radius: 14px; }
  html body.path-node #wrapper .jd-guide-chapter-heading { gap: 0.75rem; }
  html body.path-node #wrapper .jd-guide.is-tracker-ready .jd-guide-tracker-bar {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.5rem;
    padding: 0.625rem;
  }
  html body.path-node #wrapper .jd-guide-tracker-context { font-size: 0.7rem; }
  html body.path-node #wrapper .jd-guide-tracker-count { font-size: 0.7rem; }
  html body.path-node #wrapper .jd-guide .jd-guide-tracker-navigation {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.5rem;
  }
  html body.path-node #wrapper .jd-guide .jd-guide-tracker-navigation button { width: 100%; padding: 0.5rem 0.25rem; }
  html body.path-node #wrapper .jd-guide-checklist-row,
  html body.path-node #wrapper .jd-guide.is-tracker-ready .jd-guide-checklist-row {
    grid-template-columns: minmax(0, 1fr);
    gap: 0 0.5rem;
    padding: 0.35rem 0.4rem;
  }
  html body.path-node #wrapper .jd-guide.is-tracker-ready .jd-guide-checklist-row { grid-template-columns: 44px minmax(0, 1fr); }
  html body.path-node #wrapper .jd-guide.is-tracker-ready .jd-guide-read-step { grid-column: 2; }
  html body.path-node #wrapper .jd-guide-checklist-group > summary { padding: 0.6rem 0.5rem; }
  html body.path-node #wrapper .jd-guide-checklist-title { font-size: 0.9rem; }
}
@media (min-width: 768px) and (max-width: 991px) {
  html body.path-node #wrapper .jd-guides-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media print {
  html body.path-node #wrapper .jd-guide { --jd-guide-tracker-offset: 0px; max-width: none; margin: 0; font: 10.5pt/1.45 Arial, sans-serif; }
  html body.path-node #wrapper .jd-guide-layout { display: block; }
  html body.path-node #wrapper .jd-guide :is(.jd-guide-toc, .jd-guide-controls, .jd-hub-animation, .jd-guide-illustration-slot, .jd-guide-actions, .jd-guide-intro-actions, .jd-guide-tracker-slot, .jd-guide-checklist, .jd-guide-return) { display: none !important; }
  html body.path-node #wrapper .jd-guide-chapter { padding: 0; margin-bottom: 1.5rem; border: 0; box-shadow: none; }
  html body.path-node #wrapper .jd-guide-step-heading { break-after: avoid; }
  html body.path-node #wrapper .jd-guide :is(h2, h3, h4) { break-after: avoid; }
  html body.path-node #wrapper .jd-guide-step { border-top: 1px solid #bbb; }
  html body.path-node #wrapper .jd-guide-chapter-heading { display: block; }
  html body.path-node #wrapper .jd-guide :is(table, pre) { display: table; overflow: visible; }
  html body.path-node #wrapper .jd-guide :is(p, li) { widows: 3; orphans: 3; }
  html body.path-node #wrapper .jd-guide a { color: #241438 !important; }
  html body.path-node #wrapper :is(.jd-guide-professional, .jd-guide-professional-notes) { border: 1px solid #aaa; background: none; }
}
@media (prefers-reduced-motion: reduce) {
  html body.path-node #wrapper .jd-guide :is(.jd-guide-tracker, .jd-guide-checklist, .jd-guide-tracker-navigation button) { animation: none !important; transition: none !important; }
}

/* assets/css/external-social-links.css */
/**
 * Public/account external links, portrait socials, and Johnny Detail footers.
 * Load after legacy content/chrome rules and before breadcrumbs.
 */
html body[class*="path-"] #wrapper .jd-external-link svg.ext.jd-external-indicator {
  display: inline-block !important;
  box-sizing: border-box !important;
  flex: 0 0 14px !important;
  width: 14px !important;
  min-width: 14px !important;
  height: 14px !important;
  margin: 0 0 0 5px !important;
  padding: 0 !important;
  vertical-align: -0.12em !important;
  fill: currentColor !important;
  color: inherit !important;
  -webkit-text-fill-color: currentColor !important;
  overflow: visible !important;
  pointer-events: none;
  transform: none !important;
  scale: none !important;
}

html body[class*="path-"] #wrapper .jd-external-link svg.ext.jd-external-indicator path {
  color: inherit !important;
  -webkit-text-fill-color: currentColor !important;
  fill: currentColor !important;
  stroke: currentColor !important;
  stroke-width: 1.5 !important;
}

html body[class*="path-"] #wrapper .jd-external-text-link {
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
  text-decoration: underline !important;
  text-decoration-thickness: 1px !important;
  text-underline-offset: 3px !important;
  overflow-wrap: anywhere;
}

html body[class*="path-"] #wrapper .jd-external-text-link:hover {
  color: #6716aa !important;
  -webkit-text-fill-color: #6716aa !important;
  text-decoration-thickness: 2px !important;
}

html body[class*="path-"] #wrapper .jd-external-link:focus-visible,
html body[class*="path-"] #wrapper :is(.team-social.jd-social-links, #main-content .team-header .team-social.jd-social-links, #main-content .team-teaser .team-thumb .team-social.jd-social-links, #footer .social_footer_ul.jd-social-links, .jd-social-links) a:focus-visible {
  outline: 3px solid #9d4edd !important;
  outline-offset: 4px !important;
}

/* Keep portrait framing independent of the wider, unscaled touch targets. */
html body:is(.path-team, .page-node-type-blog) #wrapper .team-teaser .team-thumb.team-portrait-social {
  position: static !important;
  display: block !important;
  box-sizing: border-box !important;
  flex: 0 0 168px !important;
  width: 168px !important;
  min-width: 168px !important;
  max-width: 168px !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
  transform: none !important;
  scale: none !important;
}

html body:is(.path-team, .page-node-type-blog) #wrapper .team-portrait-social .team-portrait-image {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* The original author portrait rendered at 125px on phones and desktops.
 * Retain that size and its authored crop/border without scaling the socials. */
html body.page-node-type-blog #wrapper .region.region-content-wide .team-portrait-image img {
  width: 125px !important;
  height: 125px !important;
  min-width: 125px !important;
  max-width: 125px !important;
  margin: 0 !important;
  transform: none !important;
  scale: none !important;
}

html body.page-node-type-blog #wrapper .region.region-content-wide .team-portrait-image .field-field-image {
  margin: 0 !important;
}

html body[class*="path-"] #wrapper :is(.team-social.jd-social-links, #main-content .team-header .team-social.jd-social-links, #main-content .team-teaser .team-thumb .team-social.jd-social-links, #footer .social_footer_ul.jd-social-links, .jd-social-links) {
  position: static !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 12px !important;
  width: auto !important;
  max-width: 100% !important;
  padding: 0 !important;
  list-style: none !important;
  transform: none !important;
  scale: none !important;
}

html body[class*="path-"] #wrapper #main-content .team-teaser .team-thumb .team-social.jd-social-links {
  margin: 12px 0 0 !important;
}

html body.page-node-type-team #wrapper #main-content .team-header .team-meta .team-social.jd-social-links {
  justify-content: flex-start !important;
}

html body[class*="path-"] #wrapper :is(.team-social.jd-social-links, #main-content .team-header .team-social.jd-social-links, #main-content .team-teaser .team-thumb .team-social.jd-social-links, #footer .social_footer_ul.jd-social-links, .jd-social-links) a {
  position: relative !important;
  display: inline-flex !important;
  box-sizing: border-box !important;
  flex: 0 0 48px !important;
  align-items: center !important;
  justify-content: center !important;
  width: 48px !important;
  min-width: 48px !important;
  max-width: 48px !important;
  height: 48px !important;
  min-height: 48px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid #9d4edd !important;
  border-radius: 14px !important;
  background: #6716aa !important;
  background-image: none !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  font-size: 20px !important;
  line-height: 1 !important;
  text-decoration: none !important;
  text-shadow: none !important;
  box-shadow: 0 2px 5px rgb(59 10 92 / 12%) !important;
  overflow: visible !important;
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
  scale: none !important;
  transition: background-color .15s ease, border-color .15s ease;
}

html body[class*="path-"] #wrapper :is(.team-social.jd-social-links, #main-content .team-header .team-social.jd-social-links, #main-content .team-teaser .team-thumb .team-social.jd-social-links, #footer .social_footer_ul.jd-social-links, .jd-social-links) a:hover {
  background: #3b0a5c !important;
  border-color: #f3e8ff !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  transform: none !important;
}

html body[class*="path-"] #wrapper .team-social a::before,
html body[class*="path-"] #wrapper #footer .jd-social-link .jd-social-icon::before {
  position: static !important;
  display: block !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  font-size: 20px !important;
  line-height: 1 !important;
  text-shadow: none !important;
  box-shadow: none !important;
  transform: none !important;
  scale: none !important;
}

html body[class*="path-"] #wrapper #footer .jd-social-link .jd-social-icon {
  display: block !important;
  flex: 0 0 auto !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  font-size: 20px !important;
  line-height: 1 !important;
}

html body[class*="path-"] #wrapper #footer :is(.social_footer_ul, .jd-social-links) img {
  display: block !important;
  flex: 0 0 28px !important;
  width: 28px !important;
  height: 28px !important;
  min-width: 28px !important;
  max-width: 28px !important;
  max-height: 28px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 6px !important;
  object-fit: contain !important;
  transform: none !important;
  scale: none !important;
}

html body[class*="path-"] #wrapper :is(.team-social, #footer .social_footer_ul, #footer .jd-social-links) a svg.ext.jd-external-indicator {
  position: absolute !important;
  inset: 3px 3px auto auto !important;
  box-sizing: content-box !important;
  width: 12px !important;
  min-width: 12px !important;
  height: 12px !important;
  margin: 0 !important;
  padding: 2px !important;
  border-radius: 4px !important;
  background: #f3e8ff !important;
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
}

html body[class*="path-"] #wrapper .jd-external-image-link:not(.jd-social-link) {
  position: relative !important;
  display: inline-block !important;
  max-width: 100% !important;
}

html body[class*="path-"] #wrapper .jd-external-image-link:not(.jd-social-link) img {
  display: block !important;
  max-width: 100% !important;
}

html body[class*="path-"] #wrapper .jd-external-image-link:not(.jd-social-link) svg.ext.jd-external-indicator {
  position: absolute !important;
  inset: auto 8px 8px auto !important;
  box-sizing: content-box !important;
  margin: 0 !important;
  padding: 4px !important;
  border: 1px solid #9d4edd !important;
  border-radius: 6px !important;
  background: #f3e8ff !important;
  color: #3b0a5c !important;
  -webkit-text-fill-color: #3b0a5c !important;
}

/* Review/trailer anchors own their complete hit area, including the arrow. */
html body[class*="path-"] #wrapper #footer .jd-footer__credit a.jd-external-text-link,
html body[class*="path-"] #wrapper #footer .jd-footer__credit a.jd-external-text-link:hover {
  color: inherit !important;
  -webkit-text-fill-color: currentColor !important;
}

html body[class*="path-"] #wrapper #footer .jd-external-text-link:not(.jd-footer__credit a) {
  display: inline-flex !important;
  box-sizing: border-box !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  max-width: 100% !important;
  min-height: 44px !important;
  margin: 4px 0 !important;
  padding: 8px 12px !important;
  border: 1px solid #9d4edd !important;
  border-radius: 10px !important;
  background: #3b0a5c !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
  text-decoration: none !important;
  text-shadow: none !important;
  white-space: normal !important;
}

html body[class*="path-"] #wrapper #footer .jd-external-text-link:not(.jd-footer__credit a):hover {
  background: #6716aa !important;
  border-color: #f3e8ff !important;
}

html body[class*="path-"] #wrapper #footer .jd-external-text-link:not(.jd-footer__credit a) .jd-footer__btn-trailer {
  display: inline !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: inherit !important;
  -webkit-text-fill-color: currentColor !important;
  font: inherit !important;
  box-shadow: none !important;
}

html body[class*="path-"] #wrapper :is(#footer .jd-external-text-link:not(.jd-footer__credit a), .jd-share-action) svg.ext.jd-external-indicator {
  margin: 0 !important;
}

@media (max-width: 767.98px) {
  html body.path-team.page-team #wrapper #main-content .region-content .grid-wrapper > .grid-item {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
  }

  html body.page-node-type-team #wrapper #main-content .team-header .team-meta .team-social.jd-social-links {
    justify-content: center !important;
  }
}

@media (min-width: 768px) and (max-width: 1199.98px) {
  html body.path-team.page-team #wrapper #main-content .region-content .grid-wrapper > .grid-item {
    width: 50% !important;
    max-width: 50% !important;
    flex: 0 0 50% !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  html body[class*="path-"] #wrapper :is(.team-social.jd-social-links, #main-content .team-header .team-social.jd-social-links, #main-content .team-teaser .team-thumb .team-social.jd-social-links, #footer .social_footer_ul.jd-social-links, .jd-social-links) a {
    transition: none !important;
  }
}

@media print {
  html body[class*="path-"] #wrapper .jd-external-link svg.ext.jd-external-indicator {
    display: none !important;
  }

  html body[class*="path-"] #wrapper #footer .jd-external-text-link:not(.jd-footer__credit a),
  html body[class*="path-"] #wrapper :is(.team-social.jd-social-links, #main-content .team-header .team-social.jd-social-links, #main-content .team-teaser .team-thumb .team-social.jd-social-links, #footer .social_footer_ul.jd-social-links, .jd-social-links) a,
  html body[class*="path-"] #wrapper .team-social a::before,
  html body[class*="path-"] #wrapper #footer .jd-social-link .jd-social-icon,
  html body[class*="path-"] #wrapper #footer .jd-social-link .jd-social-icon::before {
    background: transparent !important;
    color: #3b0a5c !important;
    -webkit-text-fill-color: #3b0a5c !important;
    box-shadow: none !important;
  }
}

/* assets/css/jd-public-navigation.css */
/** Native TB menus in the shared Martis shell, using Johnny Detail purple. */
.jd-mega-menu {
  --jd-menu-ink: #241438;
  --jd-menu-purple: #6716aa;
  --jd-menu-lavender: #f3e8ff;
  --jd-menu-line: #e5d8ee;
  color: var(--jd-menu-ink);
  font-family: inherit;
  font-size: 1rem;
  line-height: 1.5;
  position: relative;
  text-align: left;
  width: 100%;
}
.jd-mega-menu *,
.jd-mega-menu *::before,
.jd-mega-menu *::after { box-sizing: border-box; }
.jd-mega-menu .jd-mega-menu__list { display: flex; list-style: none; margin: 0; padding: 0; width: 100%; }
.jd-mega-menu .jd-mega-menu__item-row { align-items: center; display: flex; min-width: 0; }
.jd-mega-menu .jd-mega-menu__item { float: none; list-style: none; margin: 0; min-width: 0; padding: 0; }
.jd-mega-menu .jd-mega-menu__link {
  align-items: flex-start;
  flex-direction: column;
  justify-content: center;
  color: inherit;
  display: flex;
  font-weight: 600;
  gap: 0.6rem;
  line-height: 1.45;
  min-height: 44px;
  padding: 0.75rem 1rem;
  text-decoration: none;
  white-space: normal;
}
.jd-mega-menu .jd-mega-menu__caption { display: block; font-size: 12px; font-weight: 400; line-height: 1.5; margin-top: 3px; }
.jd-mega-menu :is(a, button):focus-visible { border-radius: 8px; outline: 3px solid #9d4edd; outline-offset: 3px; }
.jd-mega-menu .jd-mega-menu__toggle {
  align-items: center;
  background: transparent;
  border: 0;
  border-radius: 8px;
  color: inherit;
  cursor: pointer;
  display: inline-flex;
  flex: 0 0 44px;
  font: inherit;
  justify-content: center;
  min-height: 44px;
  min-width: 44px;
  padding: 0.6rem;
}
.jd-mega-menu .jd-mega-menu__toggle svg { height: 20px; width: 20px; }
.jd-mega-menu .jd-mega-menu__toggle[aria-expanded="true"] svg { transform: rotate(180deg); }
.jd-mega-menu .jd-mega-menu__link.dropdown-toggle::after { content: none !important; display: none !important; }
.jd-mega-menu .jd-mega-menu__panel[hidden],
.jd-mega-menu .jd-mega-menu__drawer[hidden] { display: none !important; }
.jd-mega-menu .jd-mega-menu__panel .jd-mega-menu__list { display: grid; gap: 0.5rem; }
.jd-mega-menu .jd-mega-menu__row { display: grid; gap: 1.5rem; grid-template-columns: repeat(12, minmax(0, 1fr)); margin: 0; width: 100%; }
.jd-mega-menu .jd-mega-menu__column { min-width: 0; width: auto; }
.jd-mega-menu .jd-mega-menu__column[data-width="1"] { grid-column: span 1; }
.jd-mega-menu .jd-mega-menu__column[data-width="2"] { grid-column: span 2; }
.jd-mega-menu .jd-mega-menu__column[data-width="3"] { grid-column: span 3; }
.jd-mega-menu .jd-mega-menu__column[data-width="4"] { grid-column: span 4; }
.jd-mega-menu .jd-mega-menu__column[data-width="5"] { grid-column: span 5; }
.jd-mega-menu .jd-mega-menu__column[data-width="6"] { grid-column: span 6; }
.jd-mega-menu .jd-mega-menu__column[data-width="7"] { grid-column: span 7; }
.jd-mega-menu .jd-mega-menu__column[data-width="8"] { grid-column: span 8; }
.jd-mega-menu .jd-mega-menu__column[data-width="9"] { grid-column: span 9; }
.jd-mega-menu .jd-mega-menu__column[data-width="10"] { grid-column: span 10; }
.jd-mega-menu .jd-mega-menu__column[data-width="11"] { grid-column: span 11; }
.jd-mega-menu .jd-mega-menu__column[data-width="12"] { grid-column: span 12; }
.jd-mega-menu .jd-mega-menu__panel--group { background: none; border: 0; box-shadow: none; padding: 0; position: static; }
.jd-mega-menu .jd-mega-menu__panel--group .jd-mega-menu__link { font-size: 0.95rem; font-weight: 500; }
/* Native header presentation stays intact; only its navigation is replaced. */
html body[class*="path-"] #wrapper header.header .header-menu:has([data-jd-mega-menu="header"]) { background: #3b0a5c !important; border-bottom: 1px solid #241438; border-top: 1px solid #241438; box-shadow: none; }
html body[class*="path-"] #wrapper header.header .jd-main-menu-host,
html body[class*="path-"] #wrapper header.header .jd-main-menu-host > .region,
html body[class*="path-"] #wrapper header.header .jd-main-menu-host > .region > .block,
html body[class*="path-"] #wrapper header.header .jd-main-menu-host > .region > .block > .container-wrap { margin: 0 !important; max-width: none !important; padding: 0 !important; width: 100% !important; }
.jd-mega-menu--header { font-size: 14px; padding: 0; z-index: 80; }
.jd-mega-menu--header .jd-mega-menu__link { flex: 1 1 auto; gap: 0; }
.jd-mega-menu--header .jd-mega-menu__drawer { text-align: left; }
.jd-mega-menu--header .jd-mega-menu__drawer > .jd-mega-menu__list { align-items: center; display: flex; flex-wrap: nowrap; gap: 22px; justify-content: center; }
.jd-mega-menu--header .jd-mega-menu__drawer > .jd-mega-menu__list > .jd-mega-menu__item { position: static; }
.jd-mega-menu--header .jd-mega-menu__panel { background: #faf5ff; border: 0; border-radius: 10px; box-shadow: none; margin: 0; padding: 10px; position: static; }
.jd-mega-menu--header .jd-mega-menu__panel--group { background: transparent; margin: 0; padding: 0; }
.jd-mega-menu--header .jd-mega-menu__row { gap: 20px; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }
.jd-mega-menu--header .jd-mega-menu__column[data-width] { grid-column: auto; }
.jd-mega-menu--header .jd-mega-menu__panel .jd-mega-menu__list { gap: 3px; grid-template-columns: 1fr; }
.jd-mega-menu__open { align-items: center; background: #6716aa; border: 1px solid #6716aa; border-radius: 8px; color: #fff; cursor: pointer; display: none; font: inherit; font-size: 15px; font-weight: 700; gap: 10px; justify-content: center; margin: 0; min-height: 44px; padding: 10px 16px; }
.jd-mega-menu--header.has-external-opener > .jd-mega-menu__open { display: none !important; }
.jd-mega-menu__open svg { height: 24px; width: 24px; }
html body[class*="path-"] #wrapper header.header .jd-header-menu-toggle { display: none !important; }
html body[class*="path-"] #wrapper header.header .jd-header-menu-toggle:focus-visible { outline: 3px solid #e9c9ff !important; outline-offset: 4px !important; }

/* Defeat legacy menu-ID and Extlink skins in the native and fallback hosts. */
html body :is(#wrapper header.header [data-jd-mega-menu="header"], .jd-mega-menu__portal) .jd-mega-menu__link { align-items: flex-start !important; background: transparent !important; border: 0 !important; border-radius: 8px !important; box-shadow: none !important; color: #241438 !important; display: flex !important; flex-direction: column !important; font-size: 15px !important; font-weight: 650 !important; gap: 0 !important; justify-content: center !important; line-height: 1.45 !important; margin: 0 !important; min-height: 48px !important; padding: 12px 15px !important; text-align: left !important; text-decoration: none !important; text-shadow: none !important; }
html body :is(#wrapper header.header [data-jd-mega-menu="header"], .jd-mega-menu__portal) .jd-mega-menu__caption { color: #604571 !important; display: block; font-size: 12px !important; font-weight: 400 !important; line-height: 1.5 !important; margin-top: 3px; }
html body :is(#wrapper header.header [data-jd-mega-menu="header"], .jd-mega-menu__portal) .jd-mega-menu__link:is(:hover, :focus-visible, .is-active) { background: #f3e8ff !important; color: #6716aa !important; }
html body :is(#wrapper header.header [data-jd-mega-menu="header"], .jd-mega-menu__portal) .jd-mega-menu__toggle { color: #6716aa; }
html body :is(#wrapper header.header [data-jd-mega-menu="header"], .jd-mega-menu__portal) .jd-mega-menu__toggle:hover { background: #f3e8ff; }
html body :is(#wrapper header.header [data-jd-mega-menu="header"], .jd-mega-menu__portal) .jd-mega-menu__item:has(> .jd-mega-menu__panel--group) > .jd-mega-menu__item-row > .jd-mega-menu__link { color: #6716aa !important; font-weight: 700 !important; }

@media (min-width: 992px) {
  html body[class*="path-"] #wrapper header.header [data-jd-mega-menu="header"] > .jd-mega-menu__drawer > .jd-mega-menu__list > .jd-mega-menu__item > .jd-mega-menu__item-row > .jd-mega-menu__link { color: #fff !important; min-height: 52px !important; padding: 16px 2px 16px 14px !important; white-space: nowrap; }
  html body[class*="path-"] #wrapper header.header [data-jd-mega-menu="header"].is-enhanced > .jd-mega-menu__drawer > .jd-mega-menu__list > .jd-mega-menu__item > .jd-mega-menu__item-row > .jd-mega-menu__link > .jd-mega-menu__caption { display: none; }
  html body[class*="path-"] #wrapper header.header [data-jd-mega-menu="header"] > .jd-mega-menu__drawer > .jd-mega-menu__list > .jd-mega-menu__item > .jd-mega-menu__item-row > .jd-mega-menu__toggle { color: #fff; margin: 0 16px; }
  html body[class*="path-"] #wrapper header.header [data-jd-mega-menu="header"] > .jd-mega-menu__drawer > .jd-mega-menu__list > .jd-mega-menu__item > .jd-mega-menu__item-row > :is(.jd-mega-menu__link, .jd-mega-menu__toggle):is(:hover, :focus-visible) { background: #f3e8ff !important; color: #6716aa !important; }
  .jd-mega-menu--header.is-enhanced > .jd-mega-menu__drawer > .jd-mega-menu__list > .jd-mega-menu__item > .jd-mega-menu__panel { background: #fff; border: 1px solid #e5d8ee; border-radius: 0 0 18px 18px; border-top: 3px solid #6716aa; box-shadow: 0 20px 42px #24143824; left: 0; margin-top: 0; max-height: calc(100dvh - var(--jd-menu-panel-top, 260px) - 16px); overflow: auto; overscroll-behavior: contain; padding: 32px; position: absolute; right: 0; top: 100%; z-index: 85; }
  .jd-mega-menu--header .jd-mega-menu__panel .jd-mega-menu__list { gap: 8px 18px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .jd-mega-menu--header .jd-mega-menu__panel .jd-mega-menu__panel .jd-mega-menu__list { grid-template-columns: 1fr; }
  html body[class*="path-"] #wrapper header.header [data-jd-mega-menu="header"] .jd-mega-menu__panel .jd-mega-menu__link { background: #f3e8ff !important; border: 1px solid #e5d8ee !important; min-height: 64px !important; padding: 18px 20px !important; }
  html body[class*="path-"] #wrapper header.header [data-jd-mega-menu="header"] .jd-mega-menu__panel .jd-mega-menu__link:is(:hover, :focus-visible, .is-active) { background: #e7d1fa !important; }
}
@media (min-width: 992px) and (max-width: 1199.98px) {
  .jd-mega-menu--header .jd-mega-menu__drawer > .jd-mega-menu__list { gap: 0; }
  html body[class*="path-"] #wrapper header.header [data-jd-mega-menu="header"] > .jd-mega-menu__drawer > .jd-mega-menu__list > .jd-mega-menu__item > .jd-mega-menu__item-row > .jd-mega-menu__link { font-size: 14px !important; padding-left: 4px !important; padding-right: 0 !important; }
}

/* The mobile native dialog and its body-hosted API fallback fill the viewport. */
html.jd-mega-dialog-open,
html.jd-mega-dialog-open body { overflow: hidden !important; overscroll-behavior: none; }
.jd-mega-menu__dialog[hidden] { display: none !important; }
.jd-mega-menu .jd-mega-menu__dialog { background: #faf5ff !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; color: #241438 !important; height: 100vh !important; height: 100dvh !important; inset: 0 !important; margin: 0 !important; max-height: none !important; max-width: none !important; min-height: 0 !important; min-width: 0 !important; overflow: hidden !important; padding: 0 !important; position: fixed !important; text-align: left; width: 100% !important; }
.jd-mega-menu .jd-mega-menu__dialog[open] { display: flex !important; flex-direction: column; }
.jd-mega-menu .jd-mega-menu__dialog::backdrop { background: #24143880; }
.jd-mega-menu__dialog-bar { min-height: 85px; align-items: center; background: #3b0a5c; border-bottom: 1px solid #e5d8ee; display: flex; flex: 0 0 auto; gap: 12px; justify-content: space-between; padding: max(16px, env(safe-area-inset-top)) max(18px, env(safe-area-inset-right)) 16px max(18px, env(safe-area-inset-left)); }
.jd-mega-menu__dialog-title { color: #fff !important; font-size: 19px !important; font-weight: 700; line-height: 1.3; min-width: 0; }
.jd-mega-menu__close { align-items: center; background: #f3e8ff; border: 1px solid #e5d8ee; border-radius: 8px; color: #3b0a5c; cursor: pointer; display: inline-flex; flex: 0 0 auto; font: inherit; font-size: 14px; font-weight: 700; gap: 8px; justify-content: center; min-height: 44px; min-width: 84px; padding: 10px 12px; }
.jd-mega-menu__close:hover { background: #fff; }
.jd-mega-menu__close svg { height: 20px; width: 20px; }
.jd-mega-menu .jd-mega-menu__dialog > .jd-mega-menu__drawer { background: #faf5ff; border: 0; flex: 1 1 auto; margin: 0; max-height: none !important; min-height: 0; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; padding: 20px max(18px, env(safe-area-inset-right)) max(24px, env(safe-area-inset-bottom)) max(18px, env(safe-area-inset-left)); -webkit-overflow-scrolling: touch; width: 100% !important; }
.jd-mega-menu__dialog .jd-mega-menu__drawer > .jd-mega-menu__list { display: block; margin: 0; width: 100%; }
.jd-mega-menu__dialog .jd-mega-menu__drawer > .jd-mega-menu__list > .jd-mega-menu__item { background: #fff; border: 1px solid #e5d8ee; border-radius: 12px; display: block; margin-bottom: 12px; min-width: 0; }
.jd-mega-menu__dialog .jd-mega-menu__drawer > .jd-mega-menu__list > .jd-mega-menu__item > .jd-mega-menu__item-row { min-height: 76px; padding: 8px; }
html body :is(#wrapper header.header [data-jd-mega-menu="header"], .jd-mega-menu__portal) .jd-mega-menu__dialog .jd-mega-menu__drawer > .jd-mega-menu__list > .jd-mega-menu__item > .jd-mega-menu__item-row > .jd-mega-menu__link { font-size: 18px !important; padding: 10px !important; }
.jd-mega-menu--header .jd-mega-menu__dialog .jd-mega-menu__row,
.jd-mega-menu__portal .jd-mega-menu__row { gap: 8px; grid-template-columns: 1fr; }
.jd-mega-menu--header .jd-mega-menu__dialog .jd-mega-menu__panel,
.jd-mega-menu__portal .jd-mega-menu__panel { background: #f3e8ff; margin: 0 10px 10px; padding: 8px; }
.jd-mega-menu--header .jd-mega-menu__dialog .jd-mega-menu__panel--group,
.jd-mega-menu__portal .jd-mega-menu__panel--group { margin: 0; padding: 0; }
html body :is(#wrapper header.header [data-jd-mega-menu="header"], .jd-mega-menu__portal) .jd-mega-menu__dialog .jd-mega-menu__panel .jd-mega-menu__link { font-size: 16px !important; min-height: 56px !important; padding: 14px !important; }
.jd-mega-menu__portal { inset: 0; padding: 0; position: fixed; z-index: 20000; }
.jd-mega-menu__dialog--fallback { z-index: 20001; }
@media (max-width: 991.98px) {
  .jd-mega-menu--header.is-enhanced:not(.has-external-opener) > .jd-mega-menu__open { display: flex; margin-left: auto; }
  html body[class*="path-"] #wrapper header.header .header-element:has(.jd-header-menu-toggle.is-ready) { align-items: center !important; display: inline-flex !important; }
  html body[class*="path-"] #wrapper header.header .header-element .jd-header-menu-toggle.is-ready { align-items: center !important; background: #6716aa !important; border: 2px solid #241438 !important; border-radius: 4px !important; box-shadow: -2px -2px 3px #24143870 !important; color: #fff !important; cursor: pointer; display: inline-flex !important; flex: 0 0 44px !important; height: 44px !important; justify-content: center !important; margin: 0 !important; min-height: 44px !important; min-width: 44px !important; order: 2; padding: 0 !important; position: relative !important; width: 44px !important; }
  html body[class*="path-"] #wrapper header.header .header-menu,
  html body[class*="path-"] #wrapper header.header .header-menu.sticky { inset: auto !important; position: relative !important; width: 100% !important; }
  html body[class*="path-"] #wrapper header.header .header-menu:has(.jd-mega-menu--header.is-enhanced.has-external-opener:not(.is-open)) { display: none !important; }
  html body[class*="path-"] #wrapper header.header .header-menu:has([data-jd-mega-menu="header"]) { background: #fff !important; border: 0; box-shadow: none; }
  .jd-mega-menu--header .jd-mega-menu__drawer > .jd-mega-menu__list { display: block; }
  .jd-mega-menu--header .jd-mega-menu__drawer { padding: 12px 18px; }
  .jd-mega-menu--header .jd-mega-menu__row { gap: 8px; grid-template-columns: 1fr; }
}
@media (max-width: 767.98px) {
  html body[class*="path-"] #wrapper header.header .header-element:has(.jd-header-menu-toggle.is-ready) { gap: 0.4rem !important; }
}
/* Footer links stay visible at every width, arranged like the reference. */
.jd-mega-menu--footer { color: #f3e8ff; }
.jd-mega-menu--footer > .jd-mega-menu__drawer > .jd-mega-menu__list { display: grid; gap: 1.5rem; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.jd-mega-menu--footer .jd-mega-menu__item { display: block; }
.jd-mega-menu--footer .jd-mega-menu__row { gap: 0.4rem; grid-template-columns: 1fr; }
.jd-mega-menu--footer .jd-mega-menu__column[data-width] { grid-column: 1 / -1; }
.jd-mega-menu--footer .jd-mega-menu__panel { background: none; border: 0; box-shadow: none; padding: 0; position: static; }
.jd-mega-menu--footer .jd-mega-menu__panel[hidden] { display: block !important; }
.jd-mega-menu--footer .jd-mega-menu__toggle,
.jd-mega-menu--footer .jd-mega-menu__contact { display: none !important; }
html body[class*="path-"] #wrapper #footer.jd-public-footer [data-jd-mega-menu="footer"] .jd-mega-menu__link { background: transparent !important; border: 0 !important; border-radius: 4px !important; box-shadow: none !important; color: #e4d4ee !important; display: flex !important; font-size: 0.875rem !important; font-weight: 400 !important; line-height: 1.5 !important; margin: 0 !important; min-height: 44px !important; padding: 0.5rem 0 !important; text-decoration: none !important; text-shadow: none !important; }
html body[class*="path-"] #wrapper #footer.jd-public-footer [data-jd-mega-menu="footer"] > .jd-mega-menu__drawer > .jd-mega-menu__list > .jd-mega-menu__item > .jd-mega-menu__item-row > .jd-mega-menu__link { color: #fff !important; font-size: 0.9375rem !important; font-weight: 700 !important; padding-top: 0 !important; }
html body[class*="path-"] #wrapper #footer.jd-public-footer [data-jd-mega-menu="footer"] .jd-mega-menu__panel .jd-mega-menu__item:has(> .jd-mega-menu__panel--group) > .jd-mega-menu__item-row > .jd-mega-menu__link { color: #cda3e8 !important; font-size: 0.75rem !important; font-weight: 700 !important; letter-spacing: 0.035em; text-transform: uppercase; }
html body[class*="path-"] #wrapper #footer.jd-public-footer [data-jd-mega-menu="footer"] .jd-mega-menu__caption { color: #cda3e8 !important; font-size: 12px !important; font-weight: 400 !important; line-height: 1.5 !important; }
html body[class*="path-"] #wrapper #footer.jd-public-footer [data-jd-mega-menu="footer"] .jd-mega-menu__link:is(:hover, :focus-visible, .is-active) { color: #fff !important; text-decoration: underline !important; text-underline-offset: 0.2em; }
@media (min-width: 576px) and (max-width: 991.98px) {
  .jd-mega-menu--footer > .jd-mega-menu__drawer > .jd-mega-menu__list { gap: 1.5rem 2rem; grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 575.98px) {
  .jd-mega-menu--footer > .jd-mega-menu__drawer > .jd-mega-menu__list { gap: 1.5rem; grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: no-preference) {
  .jd-mega-menu .jd-mega-menu__link,
  .jd-mega-menu .jd-mega-menu__toggle { transition: background-color 150ms ease, color 150ms ease; }
  .jd-mega-menu .jd-mega-menu__toggle svg { transition: transform 150ms ease; }
}

/* Real native disclosures remain usable through blocked JS or partial streams. */
.jd-mega-menu__native { border: 0; margin: 0; padding: 0; }
html body #wrapper header.header [data-jd-mega-menu="header"] .jd-mega-menu__native-summary {
  align-items: center !important; cursor: pointer; display: flex !important; flex-direction: row !important; gap: 16px !important; justify-content: space-between !important; list-style: none !important;
}
.jd-mega-menu__native-summary::-webkit-details-marker { display: none; }
.jd-mega-menu__native-summary::marker { content: ""; }
.jd-mega-menu__native-summary::before,
.jd-mega-menu__native-summary::after { content: none !important; display: none !important; }
.jd-mega-menu__native-summary:focus-visible { border-radius: 8px; outline: 3px solid #9d4edd; outline-offset: 3px; }
.jd-mega-menu__native-summary svg { display: block; flex: 0 0 20px; height: 20px; width: 20px; }
html body[class*="path-"] #wrapper header.header [data-jd-mega-menu="header"] .jd-mega-menu__native-summary.jd-mega-menu__native-summary--linked { gap: 0 !important; min-height: 0 !important; padding: 0 !important; }
.jd-mega-menu__native-chevron { align-items: center; display: inline-flex; flex: 0 0 44px; justify-content: center; margin: 0 16px; min-height: 44px; min-width: 44px; padding: 0.6rem; }
.jd-mega-menu__native[open] > .jd-mega-menu__native-summary svg { transform: rotate(180deg); }
.jd-mega-menu:not(.is-enhanced) .jd-mega-menu__toggle { display: none !important; }
.jd-mega-menu--header:not(.is-enhanced) > .jd-mega-menu__drawer > .jd-mega-menu__list { align-items: stretch; display: grid; gap: 1rem; grid-template-columns: 1fr; }
.jd-mega-menu--header:not(.is-enhanced) > .jd-mega-menu__drawer > .jd-mega-menu__list > .jd-mega-menu__item { background: #fff; border: 1px solid #e5d8ee; border-radius: 12px; display: block; }
.jd-mega-menu--header:not(.is-enhanced) .jd-mega-menu__panel { box-shadow: none; max-height: none; overflow: visible; position: static; }
@media (min-width: 992px) {
  .jd-mega-menu--header:not(.is-enhanced) > .jd-mega-menu__drawer > .jd-mega-menu__list { align-items: center; display: flex; gap: 22px; grid-template-columns: none; }
  .jd-mega-menu--header:not(.is-enhanced) > .jd-mega-menu__drawer > .jd-mega-menu__list > .jd-mega-menu__item { background: transparent; border: 0; border-radius: 0; }
  html body[class*="path-"] #wrapper header.header [data-jd-mega-menu="header"]:not(.is-enhanced) > .jd-mega-menu__drawer > .jd-mega-menu__list > .jd-mega-menu__item > .jd-mega-menu__item-row > .jd-mega-menu__link { color: #fff !important; white-space: nowrap; }
  html body[class*="path-"] #wrapper header.header [data-jd-mega-menu="header"] .jd-mega-menu__native-summary { color: #fff !important; min-height: 52px !important; padding: 16px 14px !important; white-space: nowrap; }
  html body[class*="path-"] #wrapper header.header [data-jd-mega-menu="header"] .jd-mega-menu__native-summary > .jd-mega-menu__link { color: #fff !important; min-height: 52px !important; padding: 16px 2px 16px 14px !important; white-space: nowrap; }
  html body #wrapper header.header [data-jd-mega-menu="header"] .jd-mega-menu__native-summary .jd-mega-menu__caption { display: none !important; }
  .jd-mega-menu--header:not(.is-enhanced) .jd-mega-menu__native > .jd-mega-menu__panel { background: #fff; border: 1px solid #e5d8ee; border-radius: 0 0 18px 18px; border-top: 3px solid #6716aa; box-shadow: 0 20px 42px #24143824; left: 0; margin-top: 0; max-height: calc(100dvh - 260px - 16px); overflow: auto; overscroll-behavior: contain; padding: 32px; position: absolute; right: 0; top: 100%; z-index: 85; }
}
@media (min-width: 992px) and (max-width: 1199.98px) {
  .jd-mega-menu--header:not(.is-enhanced) > .jd-mega-menu__drawer > .jd-mega-menu__list { gap: 0; }
  html body[class*="path-"] #wrapper header.header [data-jd-mega-menu="header"] .jd-mega-menu__native-summary { font-size: 14px !important; padding-left: 4px !important; padding-right: 0 !important; }
  html body[class*="path-"] #wrapper header.header [data-jd-mega-menu="header"] .jd-mega-menu__native-summary > .jd-mega-menu__link { font-size: 14px !important; padding-left: 4px !important; padding-right: 0 !important; }
}
@media print {
  .jd-mega-menu--header,
  .jd-header-menu-toggle,
  .jd-mega-menu__portal { display: none !important; }
  .jd-mega-menu--footer .jd-mega-menu__link { color: #222; }
}

/* Keep the native rail geometry while centering labels and chevron artwork. */
@media (min-width: 992px) {
  html body[class*="path-"] #wrapper header.header [data-jd-mega-menu="header"] > .jd-mega-menu__drawer > .jd-mega-menu__list > .jd-mega-menu__item > .jd-mega-menu__item-row { align-items: center; }
  html body[class*="path-"] #wrapper header.header [data-jd-mega-menu="header"] > .jd-mega-menu__drawer > .jd-mega-menu__list > .jd-mega-menu__item > .jd-mega-menu__item-row > :is(.jd-mega-menu__link, .jd-mega-menu__toggle) { align-self: center; margin-block: 0 !important; }
}
.jd-mega-menu .jd-mega-menu__toggle svg { display: block; flex: 0 0 20px; }

/* Native group cards share one-column contents and light/dark heading treatments. */
.jd-mega-menu--header :is(.jd-mega-menu__item--store, .jd-mega-menu__item--services, .jd-mega-menu__item--company) .jd-mega-menu__column-inner > .jd-mega-menu__list { grid-template-columns: minmax(0, 1fr); }
html body :is(#wrapper header.header [data-jd-mega-menu="header"], .jd-mega-menu__portal) :is(.jd-mega-menu__item--store, .jd-mega-menu__item--services, .jd-mega-menu__item--company) :is(.jd-mega-menu__item--brands, .jd-mega-menu__item--shop, .jd-mega-menu__item--automotive, .jd-mega-menu__item--marine-rv, .jd-mega-menu__item--company-links, .jd-mega-menu__item--policies) {
  background: #fff; border: 1px solid #d8c3e7; border-radius: 14px; height: 100%; padding: 12px;
}
html body :is(#wrapper header.header [data-jd-mega-menu="header"], .jd-mega-menu__portal) :is(.jd-mega-menu__item--store, .jd-mega-menu__item--services, .jd-mega-menu__item--company) :is(.jd-mega-menu__item--brands, .jd-mega-menu__item--automotive, .jd-mega-menu__item--company-links) { background: #faf5ff; }
html body :is(#wrapper header.header [data-jd-mega-menu="header"], .jd-mega-menu__portal) :is(.jd-mega-menu__item--store, .jd-mega-menu__item--services, .jd-mega-menu__item--company) :is(.jd-mega-menu__item--brands, .jd-mega-menu__item--shop, .jd-mega-menu__item--automotive, .jd-mega-menu__item--marine-rv, .jd-mega-menu__item--company-links, .jd-mega-menu__item--policies) > .jd-mega-menu__item-row > .jd-mega-menu__link {
  border: 0 !important; font-size: 17px !important; min-height: 76px !important; padding: 14px 16px !important;
}
html body :is(#wrapper header.header [data-jd-mega-menu="header"], .jd-mega-menu__portal) :is(.jd-mega-menu__item--store, .jd-mega-menu__item--services, .jd-mega-menu__item--company) :is(.jd-mega-menu__item--brands, .jd-mega-menu__item--shop, .jd-mega-menu__item--automotive, .jd-mega-menu__item--marine-rv, .jd-mega-menu__item--company-links, .jd-mega-menu__item--policies) :is(.jd-mega-menu__label, .jd-mega-menu__caption) { overflow-wrap: anywhere; white-space: normal; }
html body :is(#wrapper header.header [data-jd-mega-menu="header"], .jd-mega-menu__portal) :is(.jd-mega-menu__item--store, .jd-mega-menu__item--services, .jd-mega-menu__item--company) :is(.jd-mega-menu__item--brands, .jd-mega-menu__item--automotive, .jd-mega-menu__item--company-links) > .jd-mega-menu__item-row > .jd-mega-menu__link { background: #f3e8ff !important; color: #6716aa !important; -webkit-text-fill-color: #6716aa !important; }
html body :is(#wrapper header.header [data-jd-mega-menu="header"], .jd-mega-menu__portal) :is(.jd-mega-menu__item--store, .jd-mega-menu__item--services, .jd-mega-menu__item--company) :is(.jd-mega-menu__item--shop, .jd-mega-menu__item--marine-rv, .jd-mega-menu__item--policies) > .jd-mega-menu__item-row > .jd-mega-menu__link { background: #3b0a5c !important; color: #fff !important; -webkit-text-fill-color: #fff !important; }
html body :is(#wrapper header.header [data-jd-mega-menu="header"], .jd-mega-menu__portal) :is(.jd-mega-menu__item--store, .jd-mega-menu__item--services, .jd-mega-menu__item--company) :is(.jd-mega-menu__item--shop, .jd-mega-menu__item--marine-rv, .jd-mega-menu__item--policies) > .jd-mega-menu__item-row > .jd-mega-menu__link .jd-mega-menu__caption { color: #f3e8ff !important; -webkit-text-fill-color: #f3e8ff !important; }
html body :is(#wrapper header.header [data-jd-mega-menu="header"], .jd-mega-menu__portal) :is(.jd-mega-menu__item--store, .jd-mega-menu__item--services, .jd-mega-menu__item--company) :is(.jd-mega-menu__item--brands, .jd-mega-menu__item--shop, .jd-mega-menu__item--automotive, .jd-mega-menu__item--marine-rv, .jd-mega-menu__item--company-links, .jd-mega-menu__item--policies) > .jd-mega-menu__panel--group { margin-top: 12px; }
/* Flat menus retain their native link grids inside the shared card shell. */
html body :is(#wrapper header.header [data-jd-mega-menu="header"], .jd-mega-menu__portal) :is(.jd-mega-menu__item--resources, .jd-mega-menu__item--areas) > .jd-mega-menu__panel > .jd-mega-menu__panel-inner > .jd-mega-menu__row > .jd-mega-menu__column {
  background: #faf5ff; border: 1px solid #d8c3e7; border-radius: 14px; padding: 12px;
}
@media (min-width: 992px) {
  .jd-mega-menu--header :is(.jd-mega-menu__item--store, .jd-mega-menu__item--services) > .jd-mega-menu__panel > .jd-mega-menu__panel-inner > .jd-mega-menu__row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 991.98px) {
  .jd-mega-menu--header :is(.jd-mega-menu__item--store, .jd-mega-menu__item--services) > .jd-mega-menu__panel > .jd-mega-menu__panel-inner > .jd-mega-menu__row,
  .jd-mega-menu__portal :is(.jd-mega-menu__item--store, .jd-mega-menu__item--services) > .jd-mega-menu__panel > .jd-mega-menu__panel-inner > .jd-mega-menu__row { gap: 16px; grid-template-columns: minmax(0, 1fr); }
}

/* Non-link categories expose one whole-label control after enhancement. */
html body :is(#wrapper header.header [data-jd-mega-menu="header"].is-enhanced, .jd-mega-menu__portal.is-enhanced) .jd-mega-menu__static-label { display: none !important; }
html body :is(#wrapper header.header [data-jd-mega-menu="header"]:not(.is-enhanced), .jd-mega-menu__portal:not(.is-enhanced)) .jd-mega-menu__toggle--label { display: none !important; }
html body :is(#wrapper header.header [data-jd-mega-menu="header"], .jd-mega-menu__portal) .jd-mega-menu__toggle--label {
  align-items: center !important; cursor: pointer; flex: 1 1 auto; flex-direction: row !important; gap: 16px !important; justify-content: space-between !important; margin: 0 !important; min-width: 0; width: 100%;
}
.jd-mega-menu .jd-mega-menu__toggle-copy { display: block; min-width: 0; text-align: left; }
.jd-mega-menu .jd-mega-menu__toggle-copy > .jd-mega-menu__label { display: block; }

/* About the Company: native contact, company links, then policies. */
html body :is(#wrapper header.header [data-jd-mega-menu="header"], .jd-mega-menu__portal) .jd-mega-menu__item--company [data-block="jd_service_area_menu_contact"] {
  background: #faf5ff; border: 1px solid #d8c3e7; border-radius: 14px; box-sizing: border-box; color: #241438 !important; height: 100%; padding: 22px;
}
html body :is(#wrapper header.header [data-jd-mega-menu="header"], .jd-mega-menu__portal) .jd-mega-menu__item--company [data-block="jd_service_area_menu_contact"] :is(.container-wrap, .block-content, .block-title-wrap, .block-title-content, .jd-service-contact) {
  background: transparent !important; border: 0 !important; box-shadow: none !important; display: block; float: none; margin: 0 !important; max-width: none; padding: 0 !important; width: 100%;
}
html body :is(#wrapper header.header [data-jd-mega-menu="header"], .jd-mega-menu__portal) .jd-mega-menu__item--company [data-block="jd_service_area_menu_contact"] .block-title {
  background: transparent !important; border: 0 !important; color: #6716aa !important; font-size: 17px !important; font-weight: 700 !important; line-height: 1.4 !important; margin: 0 0 14px !important; padding: 0 !important; text-align: left !important; text-shadow: none !important;
}
html body :is(#wrapper header.header [data-jd-mega-menu="header"], .jd-mega-menu__portal) .jd-mega-menu__item--company [data-block="jd_service_area_menu_contact"] :is(.block-title, .block-title-wrap)::before,
html body :is(#wrapper header.header [data-jd-mega-menu="header"], .jd-mega-menu__portal) .jd-mega-menu__item--company [data-block="jd_service_area_menu_contact"] :is(.block-title, .block-title-wrap)::after { content: none !important; }
html body :is(#wrapper header.header [data-jd-mega-menu="header"], .jd-mega-menu__portal) .jd-mega-menu__item--company .jd-service-contact__city { font-size: 14px !important; font-weight: 500 !important; line-height: 1.5 !important; margin: 0 0 12px !important; }
html body :is(#wrapper header.header [data-jd-mega-menu="header"], .jd-mega-menu__portal) .jd-mega-menu__item--company .jd-service-contact * {
  color: #241438 !important; -webkit-text-fill-color: #241438 !important; text-shadow: none !important;
}
html body :is(#wrapper header.header [data-jd-mega-menu="header"], .jd-mega-menu__portal) .jd-mega-menu__item--company .jd-service-contact :is(.jd-service-contact__phone, .jd-service-contact__email, .jd-service-contact__note) {
  line-height: 1.6 !important; margin: 0 !important; padding: 0 !important;
}
html body :is(#wrapper header.header [data-jd-mega-menu="header"], .jd-mega-menu__portal) .jd-mega-menu__item--company .jd-service-contact :is(.jd-service-contact__phone, .jd-service-contact__email) a {
  align-items: center !important; background: transparent !important; border: 0 !important; box-shadow: none !important; display: flex !important; justify-content: flex-start !important; line-height: 1.5 !important; margin: 0 !important; min-height: 44px !important; padding: 0 !important; text-decoration: none !important;
}
html body :is(#wrapper header.header [data-jd-mega-menu="header"], .jd-mega-menu__portal) .jd-mega-menu__item--company .jd-service-contact__hours { display: grid; gap: 4px; list-style: none; margin: 14px 0 !important; padding: 0 !important; }
html body :is(#wrapper header.header [data-jd-mega-menu="header"], .jd-mega-menu__portal) .jd-mega-menu__item--company .jd-service-contact__hours li { line-height: 1.6 !important; margin: 0 !important; padding: 0 !important; }
html body :is(#wrapper header.header [data-jd-mega-menu="header"], .jd-mega-menu__portal) .jd-mega-menu__item--company .jd-service-contact__mailing-address {
  line-height: 1.6 !important; margin: 0 0 14px !important; overflow-wrap: anywhere; padding: 0 !important;
}
.jd-mega-menu--header .jd-mega-menu__item--company .jd-mega-menu__panel--group .jd-mega-menu__list { grid-template-columns: minmax(0, 1fr); }
@media (min-width: 992px) {
  html body[class*="path-"] #wrapper header.header [data-jd-mega-menu="header"] > .jd-mega-menu__drawer > .jd-mega-menu__list > .jd-mega-menu__item > .jd-mega-menu__item-row > .jd-mega-menu__toggle--label { padding: 16px 14px !important; }
  html body[class*="path-"] #wrapper header.header [data-jd-mega-menu="header"].is-enhanced > .jd-mega-menu__drawer > .jd-mega-menu__list > .jd-mega-menu__item > .jd-mega-menu__item-row > .jd-mega-menu__toggle--label .jd-mega-menu__caption { display: none; }
  .jd-mega-menu--header .jd-mega-menu__item--company > .jd-mega-menu__panel > .jd-mega-menu__panel-inner > .jd-mega-menu__row { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 991.98px) {
  .jd-mega-menu--header .jd-mega-menu__item--company > .jd-mega-menu__panel > .jd-mega-menu__panel-inner > .jd-mega-menu__row,
  .jd-mega-menu__portal .jd-mega-menu__item--company > .jd-mega-menu__panel > .jd-mega-menu__panel-inner > .jd-mega-menu__row { gap: 16px; grid-template-columns: minmax(0, 1fr); }
}

/* Mobile cards follow the reference spacing within the native full-screen dialog. */
@media (max-width: 991.98px) {
  html body :is(#wrapper header.header [data-jd-mega-menu="header"], .jd-mega-menu__portal) .jd-mega-menu__dialog :is(.jd-mega-menu__item--services, .jd-mega-menu__item--store, .jd-mega-menu__item--company, .jd-mega-menu__item--resources, .jd-mega-menu__item--areas) > .jd-mega-menu__panel > .jd-mega-menu__panel-inner > .jd-mega-menu__row > .jd-mega-menu__column:not(:has([data-block="jd_service_area_menu_contact"])) {
    background: #faf5ff; border: 1px solid #d8c3e7; border-radius: 14px; padding: 14px;
  }
  html body :is(#wrapper header.header [data-jd-mega-menu="header"], .jd-mega-menu__portal) .jd-mega-menu__dialog :is(.jd-mega-menu__item--services, .jd-mega-menu__item--store, .jd-mega-menu__item--company) > .jd-mega-menu__panel > .jd-mega-menu__panel-inner > .jd-mega-menu__row > .jd-mega-menu__column:has(.jd-mega-menu__item--shop),
  html body :is(#wrapper header.header [data-jd-mega-menu="header"], .jd-mega-menu__portal) .jd-mega-menu__dialog :is(.jd-mega-menu__item--services, .jd-mega-menu__item--store, .jd-mega-menu__item--company) > .jd-mega-menu__panel > .jd-mega-menu__panel-inner > .jd-mega-menu__row > .jd-mega-menu__column:has(.jd-mega-menu__item--policies) { background: #fff; }
  html body :is(#wrapper header.header [data-jd-mega-menu="header"], .jd-mega-menu__portal) .jd-mega-menu__dialog :is(.jd-mega-menu__item--services, .jd-mega-menu__item--store, .jd-mega-menu__item--company) :is(.jd-mega-menu__item--automotive, .jd-mega-menu__item--marine-rv, .jd-mega-menu__item--brands, .jd-mega-menu__item--shop, .jd-mega-menu__item--company-links, .jd-mega-menu__item--policies) {
    background: transparent; border: 0; border-radius: 0; height: auto; padding: 0;
  }
  html body :is(#wrapper header.header [data-jd-mega-menu="header"], .jd-mega-menu__portal) .jd-mega-menu__dialog :is(.jd-mega-menu__item--services, .jd-mega-menu__item--store, .jd-mega-menu__item--company) :is(.jd-mega-menu__item--automotive, .jd-mega-menu__item--marine-rv, .jd-mega-menu__item--brands, .jd-mega-menu__item--shop, .jd-mega-menu__item--company-links, .jd-mega-menu__item--policies) > .jd-mega-menu__item-row > .jd-mega-menu__link {
    background: transparent !important; border: 0 !important; border-bottom: 1px solid #d8c3e7 !important; border-radius: 0 !important; color: #6716aa !important; -webkit-text-fill-color: #6716aa !important; font-size: 18px !important; min-height: 72px !important; padding: 4px 4px 14px !important;
  }
  html body :is(#wrapper header.header [data-jd-mega-menu="header"], .jd-mega-menu__portal) .jd-mega-menu__dialog :is(.jd-mega-menu__item--services, .jd-mega-menu__item--store, .jd-mega-menu__item--company) :is(.jd-mega-menu__item--automotive, .jd-mega-menu__item--marine-rv, .jd-mega-menu__item--brands, .jd-mega-menu__item--shop, .jd-mega-menu__item--company-links, .jd-mega-menu__item--policies) > .jd-mega-menu__item-row > .jd-mega-menu__link .jd-mega-menu__caption {
    color: #604571 !important; -webkit-text-fill-color: #604571 !important;
  }
  html body :is(#wrapper header.header [data-jd-mega-menu="header"], .jd-mega-menu__portal) .jd-mega-menu__dialog :is(.jd-mega-menu__item--services, .jd-mega-menu__item--store, .jd-mega-menu__item--company) :is(.jd-mega-menu__item--automotive, .jd-mega-menu__item--marine-rv, .jd-mega-menu__item--brands, .jd-mega-menu__item--shop, .jd-mega-menu__item--company-links, .jd-mega-menu__item--policies) > .jd-mega-menu__item-row > a.jd-mega-menu__link:is(:hover, :focus-visible, .is-active) { background: #f3e8ff !important; }
  html body :is(#wrapper header.header [data-jd-mega-menu="header"], .jd-mega-menu__portal) .jd-mega-menu__dialog :is(.jd-mega-menu__item--services, .jd-mega-menu__item--store, .jd-mega-menu__item--company) :is(.jd-mega-menu__item--automotive, .jd-mega-menu__item--marine-rv, .jd-mega-menu__item--brands, .jd-mega-menu__item--shop, .jd-mega-menu__item--company-links, .jd-mega-menu__item--policies) > .jd-mega-menu__panel--group {
    background: transparent; border: 0; border-radius: 0; margin: 12px 0 0; padding: 0;
  }
  /* Every submenu link shares the Company and Policies card treatment. */
  html body :is(#wrapper header.header [data-jd-mega-menu="header"], .jd-mega-menu__portal) .jd-mega-menu__dialog .jd-mega-menu__panel .jd-mega-menu__list { gap: 10px; }
  html body :is(#wrapper header.header [data-jd-mega-menu="header"], .jd-mega-menu__portal) .jd-mega-menu__dialog .jd-mega-menu__panel .jd-mega-menu__item:not(:has(> .jd-mega-menu__panel--group)) > .jd-mega-menu__item-row > a.jd-mega-menu__link {
    background: #f3e8ff !important; border: 1px solid #e5d8ee !important; border-radius: 8px !important; min-height: 56px !important; padding: 14px !important;
  }
  html body :is(#wrapper header.header [data-jd-mega-menu="header"], .jd-mega-menu__portal) .jd-mega-menu__dialog .jd-mega-menu__panel .jd-mega-menu__item:not(:has(> .jd-mega-menu__panel--group)) > .jd-mega-menu__item-row > a.jd-mega-menu__link:is(:hover, :focus-visible, .is-active) { background: #e7d1fa !important; }
  html body :is(#wrapper header.header [data-jd-mega-menu="header"], .jd-mega-menu__portal) .jd-mega-menu__dialog .jd-mega-menu__item--company [data-block="jd_service_area_menu_contact"] { padding: 16px; }
  html body :is(#wrapper header.header [data-jd-mega-menu="header"], .jd-mega-menu__portal) .jd-mega-menu__dialog .jd-mega-menu__item--company [data-block="jd_service_area_menu_contact"] .block-title { font-size: 18px !important; }
  html body :is(#wrapper header.header [data-jd-mega-menu="header"], .jd-mega-menu__portal) .jd-mega-menu__dialog .jd-mega-menu__item--company .jd-service-contact :is(.jd-service-contact__phone, .jd-service-contact__email) a { padding: 8px 0 !important; }
  html body :is(#wrapper header.header [data-jd-mega-menu="header"], .jd-mega-menu__portal) .jd-mega-menu__dialog .jd-mega-menu__item--company .jd-service-contact__hours { border-top: 1px solid #d8c3e7; gap: 10px; margin: 18px 0 0 !important; padding: 16px 0 0 !important; }
  html body :is(#wrapper header.header [data-jd-mega-menu="header"], .jd-mega-menu__portal) .jd-mega-menu__dialog .jd-mega-menu__item--company .jd-service-contact__hours + .jd-service-contact__mailing-address { margin-top: 14px !important; }
}

/* assets/css/jd-public-footer.css */
/** Shared public footer: reference geometry with Johnny Detail's purple palette. */
html body[class*="path-"] #wrapper #footer.jd-public-footer {
  --jd-footer-ink: #f3e8ff;
  --jd-footer-muted: #d8c8e3;
  --jd-footer-border: #79578f;
  background: #241438 !important;
  border: 0 !important;
  color: var(--jd-footer-ink) !important;
  margin: 0;
  padding: 0 !important;
  text-align: left;
}
.jd-public-footer *, .jd-public-footer *::before, .jd-public-footer *::after { box-sizing: border-box; }
html body[class*="path-"] #wrapper #footer.jd-public-footer * { text-shadow: none !important; }
html body[class*="path-"] #wrapper #footer.jd-public-footer :is(h2, h3, h4, p, li, label, span, strong, button, figcaption, dt, dd) {
  color: inherit !important;
  -webkit-text-fill-color: inherit !important;
}
.jd-public-footer .jd-public-footer__inner { box-sizing: border-box; margin: 0 auto; max-width: 1220px; padding: 64px 24px 28px; width: 100%; }
html body[class*="path-"] #wrapper #footer.jd-public-footer :is(h2, h3, h4) { background: none; border: 0; font-family: "Plus Jakarta Sans", sans-serif; padding: 0; text-transform: none; }
html body[class*="path-"] #wrapper #footer.jd-public-footer p { background: none; border: 0; box-shadow: none; font-weight: 400; padding: 0; }
html body[class*="path-"] #wrapper #footer.jd-public-footer a { color: #f3e8ff !important; -webkit-text-fill-color: #f3e8ff !important; }
html body[class*="path-"] #wrapper #footer.jd-public-footer a:hover { color: #e1b4ff !important; -webkit-text-fill-color: #e1b4ff !important; }
.jd-public-footer :is(a, button, input, select):focus-visible { border-radius: 8px; outline: 3px solid #c58cec !important; outline-offset: 4px; }
html body[class*="path-"] #wrapper #footer.jd-public-footer [hidden] { display: none !important; }
html body[class*="path-"] #wrapper #footer.jd-public-footer .jd-public-footer__eyebrow {
  color: #d6a9f5 !important; font-size: 11px; font-weight: 700; letter-spacing: 0.14em; line-height: 1.5; margin: 0 0 12px; text-transform: uppercase;
}

/* Contact and native TB links form the same second row on every city route. */
.jd-service-contact .jd-service-contact__city { color: inherit; font-size: 17px; font-weight: 650; line-height: 1.4; margin: 0 0 12px; }
.jd-service-contact :is(.jd-service-contact__phone, .jd-service-contact__email) { margin: 0; }
.jd-service-contact :is(.jd-service-contact__phone, .jd-service-contact__email) a { align-items: center; display: inline-flex; min-height: 44px; overflow-wrap: anywhere; text-decoration: none; }
.jd-service-contact .jd-service-contact__phone a { font-size: 23px; font-weight: 650; letter-spacing: -0.025em; }
.jd-service-contact .jd-service-contact__email a { font-size: 14px; }
.jd-service-contact .jd-service-contact__hours { font-size: 12px; line-height: 1.8; list-style: none; margin: 18px 0 0; padding: 0; }
.jd-service-contact .jd-service-contact__note { font-size: 12px; line-height: 1.6; margin: 12px 0 0; }
.jd-service-contact--footer .jd-service-contact__brand { font-size: 24px; font-weight: 650; line-height: 1.25; margin: 0 0 16px; }
.jd-service-contact--footer .jd-service-contact__city { font-size: 14px; font-weight: 400; line-height: 1.65; margin: 0 0 14px; }
.jd-service-contact--footer .jd-service-contact__hours { display: grid; gap: 6px; line-height: 1.6; margin: 18px 0 0; }
.jd-service-contact--footer .jd-service-contact__hours > div { display: flex; flex-wrap: wrap; gap: 4px 12px; }
.jd-service-contact--footer .jd-service-contact__hours dt { font-weight: 650; }
.jd-service-contact--footer .jd-service-contact__hours dd { margin: 0; }
html body[class*="path-"] #wrapper #footer.jd-public-footer .jd-service-contact a {
  background: transparent !important; border: 0 !important; box-shadow: none !important; display: inline-flex !important; line-height: 1.5 !important; margin: 0 !important; min-height: 44px !important; padding: 0 !important;
}
.jd-public-footer .jd-public-footer__supplemental { display: grid; gap: 1.5rem; }
.jd-public-footer .jd-public-footer__editorial-host :is(.container-wrap, .block-content, .block-layout-builder, .layout__region, .field-body.field-item) {
  background: none !important; border: 0 !important; margin: 0 !important; max-width: none !important; padding: 0 !important; width: 100% !important;
}
.jd-public-footer .jd-public-footer__editorial-host .row.layout { margin: 0 !important; }
/* The six community cards follow the current reference, using JD-owned artwork. */
.jd-public-footer .jd-public-footer__content { padding-top: 24px; text-align: center; }
.jd-public-footer .jd-public-footer__copyright { color: #d8c8e3; font-size: 14px; line-height: 1.65; margin: 0 0 16px; text-align: center; }
.jd-public-footer .jd-public-footer__community-grid { display: grid; gap: 12px; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 0 auto; max-width: 760px; width: 100%; }
html body[class*="path-"] #wrapper #footer.jd-public-footer .jd-public-footer__community-grid .jd-public-footer__community-link {
  align-items: center; background: #f3e8ff !important; border: 1px solid #d7bde7 !important; border-radius: 12px; box-shadow: none !important; color: #241438 !important; -webkit-text-fill-color: #241438 !important; display: flex !important; font-size: 14px !important; font-weight: 600 !important; gap: 10px; justify-content: center; line-height: 1.5 !important; margin: 0 !important; min-height: 64px !important; min-width: 0; overflow-wrap: anywhere; padding: 12px !important; position: relative; text-align: center; text-decoration: none !important; transform: none !important;
}
html body[class*="path-"] #wrapper #footer.jd-public-footer .jd-public-footer__community-grid .jd-public-footer__community-link--review { color: #6716aa !important; -webkit-text-fill-color: #6716aa !important; }
.jd-public-footer .jd-public-footer__social-badge { align-items: center; background: transparent; border: 0; display: flex; flex: 0 0 72px; height: 72px; justify-content: center; width: 72px; }
.jd-public-footer .jd-public-footer__social-badge img { border: 0; display: block; height: 72px; margin: 0; object-fit: contain; padding: 0; transform: none; width: 72px; }
.jd-public-footer .jd-public-footer__social-label { min-width: 0; }
.jd-public-footer .jd-public-footer__review-logo { align-items: center; background: #fff; border-radius: 10px; display: flex; flex: 0 0 44px; height: 44px; justify-content: center; width: 44px; }
.jd-public-footer .jd-public-footer__review-logo img { border: 0; display: block; height: 32px; margin: 0; object-fit: contain; padding: 0; width: 32px; }
html body[class*="path-"] #wrapper #footer.jd-public-footer .jd-public-footer__community-grid .jd-public-footer__community-link--psa { background: #fff3d6 !important; border-color: #e7d39e !important; color: #61450d !important; -webkit-text-fill-color: #61450d !important; }
html body[class*="path-"] #wrapper #footer.jd-public-footer .jd-public-footer__community-grid .jd-public-footer__community-link:hover,
html body[class*="path-"] #wrapper #footer.jd-public-footer .jd-public-footer__community-grid .jd-public-footer__community-link:focus-visible { background: #e6d2f5 !important; border-color: #9d4edd !important; text-decoration: underline !important; text-underline-offset: 4px; }
html body[class*="path-"] #wrapper #footer.jd-public-footer .jd-public-footer__community-grid .jd-public-footer__community-link--psa:hover,
html body[class*="path-"] #wrapper #footer.jd-public-footer .jd-public-footer__community-grid .jd-public-footer__community-link--psa:focus-visible { background: #f9e7b7 !important; border-color: #a67d29 !important; }
html body[class*="path-"] #wrapper #footer.jd-public-footer .jd-public-footer__community-grid .jd-public-footer__community-link :is(svg.ext, .jd-external-arrow) { height: 12px !important; inset: 8px 8px auto auto !important; margin: 0 !important; min-width: 12px !important; position: absolute !important; width: 12px !important; }
.jd-public-footer .jd-public-footer__art { margin: 20px auto 0; max-width: 112px; width: 100%; }
.jd-public-footer .jd-public-footer__art-image { background: #f3e8ff; border: 1px solid #c58cec; border-radius: 12px; display: block; height: 112px; margin: 0 auto; object-fit: contain; padding: 6px; width: 112px; }
.jd-public-footer .jd-public-footer__legal { margin-top: 16px; text-align: center; }
.jd-public-footer .jd-footer__disclaimer { color: #d8c8e3; font-size: 13px; line-height: 1.7; margin: 0 auto 8px; max-width: 900px; }
.jd-public-footer .jd-footer__credit { color: #cbb5da; font-size: 11px; line-height: 1.8; margin: 0; }
html body[class*="path-"] #wrapper #footer.jd-public-footer .jd-footer__credit a { background: transparent !important; border: 0 !important; display: inline !important; font-size: inherit; margin: 0 !important; padding: 0 !important; text-decoration: underline !important; text-underline-offset: 3px; }
.jd-public-footer .jd-public-footer__native-secondary { min-height: 0; }

/* The compact menu finder keeps its light panel; the footer owns dark geometry. */
.jd-area-locator { --jd-area-ink: #241438; background: #faf7fe; border: 1px solid #e4d6ed; border-radius: 14px; color: var(--jd-area-ink); padding: 20px; text-align: left; }
.jd-area-locator *, .jd-area-locator *::before, .jd-area-locator *::after { box-sizing: border-box; }
.jd-area-locator .jd-area-locator__heading { color: #241438; font-size: 20px; font-weight: 800; letter-spacing: -0.025em; line-height: 1.3; margin: 0 0 8px; }
.jd-area-locator .jd-area-locator__intro { color: #65536f; font-size: 14px; line-height: 1.6; margin: 0 0 16px; }
.jd-area-locator .jd-area-locator__controls { display: grid; gap: 16px; grid-template-columns: 1fr 1fr; min-width: 0; }
.jd-area-locator .jd-area-locator__field { display: flex; flex-direction: column; font-size: 13px; font-weight: 600; gap: 8px; margin: 0; min-width: 0; }
.jd-area-locator .jd-area-locator__field :is(input, select) {
  background: #fff; border: 1px solid #a287b5; border-radius: 8px; box-shadow: none; color: #241438; -webkit-text-fill-color: #241438; font: inherit; font-size: 15px; font-weight: 400; line-height: 1.5; margin: 0; min-height: 48px; min-width: 0; padding: 11px 14px; width: 100%;
}
.jd-area-locator .jd-area-locator__field input::placeholder { color: #746081; -webkit-text-fill-color: #746081; opacity: 1; }
.jd-area-locator .jd-area-locator__field select { appearance: auto; padding-right: 24px; }
.jd-area-locator button { align-items: center; background: #6716aa; border: 1px solid #6716aa; border-radius: 8px; color: #fff; cursor: pointer; display: inline-flex; font: inherit; font-size: 14px; font-weight: 700; gap: 8px; justify-content: center; line-height: 1.5; min-height: 48px; padding: 11px 20px; white-space: nowrap; }
.jd-area-locator button:hover { background: #4f1082; }
.jd-area-locator button:disabled { cursor: wait; opacity: 0.65; }
.jd-area-locator :is(a, button, input, select):focus-visible { border-radius: 8px; outline: 3px solid #9d4edd; outline-offset: 4px; }
.jd-area-locator .jd-area-locator__status { color: #65536f; font-size: 13px; font-weight: 400; line-height: 1.6; margin: 0; min-height: 1.6em; }
.jd-area-locator .jd-area-locator__results { display: grid; gap: 12px; grid-template-columns: repeat(3, minmax(0, 1fr)); min-width: 0; }
.jd-area-locator .jd-area-locator__card { background: #fff; border: 1px solid #e4d6ed; border-radius: 12px; margin: 0; min-width: 0; padding: 18px 20px; }
.jd-area-locator .jd-area-locator__card[hidden] { display: none !important; }
.jd-area-locator .jd-area-locator__card-heading { color: #241438; font-size: 17px; font-weight: 650; line-height: 1.4; margin: 0; }
.jd-area-locator .jd-area-locator__card-heading a { align-items: center; color: #241438; display: flex; gap: 10px; justify-content: space-between; min-height: 44px; text-decoration: none; }
.jd-area-locator .jd-area-locator__card-meta { color: #65536f; font-size: 12px; font-weight: 400; line-height: 1.5; margin: 4px 0 8px; }
.jd-area-locator .jd-area-locator__card-links { display: flex; flex-wrap: wrap; gap: 0 12px; margin: 0; }
.jd-area-locator .jd-area-locator__card-links a { align-items: center; color: #6716aa; display: inline-flex; font-size: 12px; min-height: 44px; overflow-wrap: anywhere; text-decoration: none; }
.jd-area-locator .jd-area-locator__view { align-items: center; color: #6716aa; display: flex; font-size: 13px; font-weight: 650; justify-content: space-between; min-height: 44px; text-decoration: none; }
.jd-area-locator .jd-area-locator__address { font-size: 13px; line-height: 1.6; margin: 8px 0; }
.jd-area-locator--compact .jd-area-locator__status { grid-column: 1 / -1; }
.jd-area-locator--compact .jd-area-locator__directory { margin-top: 16px; }
.jd-area-locator--compact .jd-area-locator__card-links { display: none; }
.jd-area-locator--compact .jd-area-locator__card { padding: 12px; }
.jd-area-locator--compact .jd-area-locator__card-heading { font-size: 15px; }

html body[class*="path-"] #wrapper #footer.jd-public-footer .jd-area-locator--footer { background: transparent; border: 0; border-radius: 0; color: var(--jd-footer-ink); padding: 0; }
.jd-area-locator--footer .jd-area-locator__introduction { margin-bottom: 28px; max-width: 670px; }
html body[class*="path-"] #wrapper #footer.jd-public-footer .jd-area-locator__heading { font-size: clamp(30px, 4vw, 48px); font-weight: 650; letter-spacing: -0.025em; line-height: 1.25; margin: 0 0 16px; }
html body[class*="path-"] #wrapper #footer.jd-public-footer .jd-area-locator__intro { color: var(--jd-footer-muted) !important; font-size: 16px; font-weight: 400; line-height: 1.65; margin: 0 0 14px; }
.jd-area-locator--footer .jd-area-locator__current { align-items: center; display: flex; font-size: 13px; gap: 8px; margin: 0; }
.jd-area-locator--footer .jd-area-locator__current > span { background: #c58cec; border-radius: 50%; height: 7px; width: 7px; }
.jd-area-locator--footer .jd-area-locator__grid { align-items: stretch; display: grid; gap: 32px; grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr); }
.jd-area-locator--footer .jd-area-locator__controls { align-content: start; background: #4b2267; border: 1px solid var(--jd-footer-border); border-radius: 18px; display: grid; gap: 20px; grid-template-columns: 1fr; padding: 26px; }
.jd-area-locator--footer .jd-area-locator__zip-row { align-items: end; display: grid; gap: 9px; grid-template-columns: minmax(80px, 1fr) auto auto; min-width: 0; }
.jd-area-locator--footer .jd-area-locator__zip-row > .jd-area-locator__field { min-width: 0; }
.jd-area-locator--footer .jd-area-locator__zip-row input { flex: 1; width: 100%; }
.jd-area-locator--footer .jd-area-locator__zip-group { display: grid; gap: 9px; }
html body[class*="path-"] #wrapper #footer.jd-public-footer .jd-area-locator :is(input, select) { background: #fff !important; border: 1px solid #ad8abf !important; color: #241438 !important; -webkit-text-fill-color: #241438 !important; font-size: 15px !important; }
html body[class*="path-"] #wrapper #footer.jd-public-footer .jd-area-locator button { background: #d8b0f2 !important; border: 1px solid #d8b0f2 !important; color: #241438 !important; -webkit-text-fill-color: #241438 !important; box-shadow: none; transform: none; }
html body[class*="path-"] #wrapper #footer.jd-public-footer .jd-area-locator button:hover { background: #e6c9f9 !important; }
html body[class*="path-"] #wrapper #footer.jd-public-footer .jd-area-locator .jd-area-locator__locate { background: transparent !important; border: 1px solid #ad8abf !important; color: #f3e8ff !important; -webkit-text-fill-color: #f3e8ff !important; font-weight: 500; min-width: 48px; padding: 10px 12px !important; width: auto !important; }
html body[class*="path-"] #wrapper #footer.jd-public-footer .jd-area-locator .jd-area-locator__locate:hover { background: #ffffff12 !important; }
.jd-area-locator--footer .jd-area-locator__locate svg { fill: none; flex: 0 0 18px; height: 18px; stroke: currentColor; stroke-width: 1.6; width: 18px; }
html body[class*="path-"] #wrapper #footer.jd-public-footer .jd-area-locator__status { color: #e1ccea !important; font-size: 13px; line-height: 1.6; }
.jd-area-locator--footer .jd-area-locator__status:empty { display: none; }
.jd-area-locator--footer .jd-area-locator__map { background: #4b2267; border: 1px solid var(--jd-footer-border); border-radius: 18px; display: flex; flex-direction: column; min-width: 0; overflow: hidden; position: static; }
.jd-area-locator--footer .jd-area-locator__map-stage { flex: 1; min-height: 385px; position: relative; }
.jd-area-locator--footer .jd-area-locator__map-fallback { align-items: center; background: #241438; display: flex; height: 100%; min-height: 385px; }
.jd-area-locator--footer .jd-area-locator__local-svg { display: block; height: auto; max-height: 100%; min-height: 300px; width: 100%; }
.jd-area-locator--footer .jd-area-locator__svg-leader { stroke: #cda3e8; stroke-width: 1.5; }
.jd-area-locator--footer .jd-area-locator__svg-marker { fill: #6716aa; stroke: #fff; stroke-width: 3; }
.jd-area-locator--footer .jd-area-locator__svg-marker--current { fill: #241438; }
html body[class*="path-"] #wrapper #footer.jd-public-footer .jd-area-locator__svg-city { align-items: center; background: #f3e8ff !important; border: 1.5px solid #c58cec !important; border-radius: 8px; box-sizing: border-box; color: #241438 !important; display: flex !important; font: 26px/1 "Source Sans 3", sans-serif !important; height: 100%; justify-content: center; margin: 0 !important; min-height: 0 !important; padding: 0 !important; text-decoration: none !important; width: 100%; -webkit-text-fill-color: #241438 !important; }
.jd-area-locator--footer .jd-area-locator__svg-city:focus-visible { border-color: #fff !important; outline: 3px solid #fff; outline-offset: -3px; }
.jd-area-locator--footer .jd-area-locator__map-options { align-items: center; display: flex; flex-wrap: wrap; gap: 8px 12px; padding: 12px 18px 0; }
html body[class*="path-"] #wrapper #footer.jd-public-footer .jd-area-locator__map-status { color: var(--jd-footer-muted) !important; font-size: 12px; line-height: 1.6; margin: 0; }
.jd-area-locator--footer .jd-area-locator__map-canvas { background: #241438; height: 100%; inset: 0; min-height: 385px; position: absolute; width: 100%; }
html body[class*="path-"] #wrapper #footer.jd-public-footer .jd-area-locator__map-note { color: var(--jd-footer-muted) !important; font-size: 12px; line-height: 1.6; margin: 0; padding: 13px 18px; }
.jd-area-locator--footer .jd-area-locator__directory { margin-top: 36px; }
.jd-area-locator--footer .jd-area-locator__directory-heading { align-items: center; display: flex; gap: 18px; justify-content: space-between; margin-bottom: 18px; }
.jd-area-locator--footer .jd-area-locator__directory-heading h3 { font-size: 22px; font-weight: 650; line-height: 1.4; margin: 0; }
.jd-area-locator--footer .jd-area-locator__directory-heading > span { font-size: 12px; }
.jd-area-locator--footer .jd-area-locator__card { background: #351c49; border: 1px solid #694582; border-radius: 12px; }
.jd-area-locator--footer .jd-area-locator__card--current { background: #4b2267; border-color: #c58cec; }
.jd-area-locator--footer .jd-area-locator__card-heading-row { align-items: center; display: flex; gap: 10px; justify-content: space-between; }
.jd-area-locator--footer .jd-area-locator__card-heading-row .jd-area-locator__card-heading { flex: 1; min-width: 0; }
html body[class*="path-"] #wrapper #footer.jd-public-footer .jd-area-locator__card-state { color: var(--jd-footer-muted) !important; font-size: 11px; }
.jd-area-locator--footer .jd-area-locator__nearby { border-top: 1px solid #79578f; margin-top: 2px; padding-top: 22px; }
.jd-area-locator--footer .jd-area-locator__nearby-heading { font-size: 17px; font-weight: 650; line-height: 1.4; margin: 0; }
html body[class*="path-"] #wrapper #footer.jd-public-footer .jd-area-locator :is(.jd-area-locator__help, .jd-area-locator__nearby-meta) { color: var(--jd-footer-muted) !important; display: block; font-size: 12px; font-weight: 400; line-height: 1.5; margin: 8px 0 0; }
.jd-area-locator--footer .jd-area-locator__nearby-list { display: grid; gap: 5px; list-style: none; margin: 12px 0 0; padding: 0; }
.jd-area-locator--footer .jd-area-locator__nearby-item { align-items: center; border-bottom: 1px solid #79578f; display: grid; gap: 0 12px; grid-template-columns: minmax(0, 1fr) auto; padding: 5px 0 12px; }
.jd-area-locator--footer .jd-area-locator__nearby-item h4 { font-size: 14px; font-weight: 650; grid-column: 1; grid-row: 1; line-height: 1.5; margin: 0; }
html body[class*="path-"] #wrapper #footer.jd-public-footer .jd-area-locator__nearby-item .jd-area-locator__nearby-meta { grid-column: 2; grid-row: 1; margin: 0; }
.jd-area-locator--footer .jd-area-locator__nearby-item:last-child { border: 0; padding-bottom: 0; }
html body[class*="path-"] #wrapper #footer.jd-public-footer .jd-area-locator__nearby-item h4 > a { align-items: center; background: transparent !important; border: 0 !important; box-shadow: none !important; display: flex !important; gap: 15px; justify-content: space-between; line-height: 1.5 !important; margin: 0 !important; min-height: 44px !important; padding: 8px 0 !important; text-decoration: none !important; }
.jd-area-locator--footer .jd-area-locator__nearby-item > a span:last-child { flex: 0 0 auto; font-size: 12px; }
.jd-area-locator--footer .jd-area-locator__nearby-contact { display: flex; flex-wrap: wrap; gap: 0 14px; grid-column: 1 / -1; grid-row: 2; margin: 0; }
html body[class*="path-"] #wrapper #footer.jd-public-footer .jd-area-locator__nearby-contact a { align-items: center; background: transparent !important; border: 0 !important; box-shadow: none !important; display: inline-flex !important; font-size: 12px !important; justify-content: flex-start !important; line-height: 1.5 !important; margin: 0 !important; min-height: 44px !important; overflow-wrap: anywhere; padding: 3px 0 !important; text-decoration: none !important; }
html body[class*="path-"] #wrapper #footer.jd-public-footer .jd-area-locator__card-meta { color: var(--jd-footer-muted) !important; font-size: 12px; font-weight: 400; margin: 4px 0 8px; }
html body[class*="path-"] #wrapper #footer.jd-public-footer .jd-area-locator :is(.jd-area-locator__card-heading a, .jd-area-locator__card-links a, .jd-area-locator__view) {
  background: transparent !important; border: 0 !important; box-shadow: none !important; line-height: 1.5 !important; margin: 0 !important; min-height: 44px !important; padding: 0 !important; text-decoration: none !important;
}
html body[class*="path-"] #wrapper #footer.jd-public-footer .jd-area-locator__card-heading a { display: flex !important; font-size: 17px !important; font-weight: 650 !important; }
html body[class*="path-"] #wrapper #footer.jd-public-footer .jd-area-locator__card-links a { display: inline-flex !important; font-size: 12px !important; font-weight: 400 !important; justify-content: flex-start !important; text-align: left !important; }
html body[class*="path-"] #wrapper #footer.jd-public-footer .jd-area-locator__view { color: #dfb4ff !important; -webkit-text-fill-color: #dfb4ff !important; display: flex !important; font-size: 13px !important; }
html body[class*="path-"] #wrapper #footer.jd-public-footer .jd-area-locator__fine-print { color: var(--jd-footer-muted) !important; font-size: 12px; line-height: 1.65; margin: 16px 0 0; }

/* Leaflet is locally hosted; only consenting visitors request external tiles. */
.jd-area-locator .jd-area-locator__pin { background: transparent; border: 0; filter: drop-shadow(0 3px 4px #24143855); height: 36px; width: 28px; }
.jd-area-locator .jd-area-locator__pin-svg { display: block; height: 36px; overflow: visible; width: 28px; }
.jd-area-locator .jd-area-locator__pin-svg path { fill: #6716aa; stroke: #fff; stroke-width: 2; }
.jd-area-locator .jd-area-locator__pin--current .jd-area-locator__pin-svg path { fill: #241438; }
.jd-area-locator .jd-area-locator__pin-svg circle { fill: #fff; }
.jd-area-locator .leaflet-marker-icon:focus-visible { border-radius: 8px; outline: 3px solid #9d4edd; outline-offset: 4px; }
.jd-area-locator .leaflet-container { font-family: inherit; }
html body[class*="path-"] #wrapper #footer.jd-public-footer .jd-area-locator .jd-area-locator__map-label { background: #f3e8ff; border: 1px solid #c58cec; border-radius: 6px; box-shadow: 0 2px 8px #24143833; color: #241438 !important; -webkit-text-fill-color: #241438 !important; cursor: pointer; font: 600 12px/1.4 "Source Sans 3", sans-serif; padding: 4px 6px; white-space: nowrap; }
html body[class*="path-"] #wrapper #footer.jd-public-footer .jd-area-locator .jd-area-locator__map-label span { color: #241438 !important; -webkit-text-fill-color: #241438 !important; font: inherit; }
.jd-area-locator .leaflet-control-zoom a { align-items: center; background: #fff; color: #591393; display: flex; height: 44px; justify-content: center; min-height: 44px; min-width: 44px; width: 44px; }
.jd-area-locator .leaflet-popup-content-wrapper { background: #fff; border-radius: 12px; box-shadow: 0 8px 25px #24143826; color: #241438; padding-top: 32px; }
.jd-area-locator .leaflet-popup-content { font-size: 14px; line-height: 1.6; }
.jd-area-locator .jd-area-locator__popup-contact { display: grid; gap: 0; margin: 8px 0; }
.jd-area-locator .leaflet-popup-content a { align-items: center; color: #6716aa; display: inline-flex; min-height: 44px; }
.jd-area-locator .leaflet-container a.leaflet-popup-close-button { align-items: center; border-radius: 0 12px 0 8px; color: #591393; display: flex; font-size: 24px; height: 44px; justify-content: center; line-height: 1; min-height: 44px; min-width: 44px; width: 44px; }
.jd-area-locator .leaflet-container a.leaflet-popup-close-button:hover { background: #f3e8ff; }
html body[class*="path-"] #wrapper #footer.jd-public-footer .jd-area-locator .leaflet-control a,
html body[class*="path-"] #wrapper #footer.jd-public-footer .jd-area-locator .leaflet-popup :is(a, .leaflet-popup-content, strong, p) { color: #241438 !important; -webkit-text-fill-color: #241438 !important; }
html body[class*="path-"] #wrapper #footer.jd-public-footer .jd-area-locator .leaflet-control-zoom a { background: #fff !important; border: 0 !important; box-shadow: none !important; display: flex !important; font-size: 22px; height: 44px; margin: 0 !important; min-height: 44px; min-width: 44px; padding: 0 !important; width: 44px; }
html body[class*="path-"] #wrapper #footer.jd-public-footer .jd-area-locator .leaflet-control-attribution { background: #fffffff2; color: #241438 !important; font-size: 11px; }
html body[class*="path-"] #wrapper #footer.jd-public-footer .jd-area-locator .leaflet-control-attribution a { background: transparent !important; border: 0 !important; display: inline !important; font-size: inherit; margin: 0 !important; min-height: 0 !important; padding: 0 !important; }
html body[class*="path-"] #wrapper #footer.jd-public-footer .jd-area-locator .leaflet-popup-content a { background: transparent !important; border: 0 !important; display: inline-flex !important; font-size: 14px; margin: 0 !important; min-height: 44px !important; padding: 0 !important; }
html body[class*="path-"] #wrapper #footer.jd-public-footer .jd-area-locator .leaflet-popup-content strong { display: block; font-size: 15px; font-weight: 700; }

@media (max-width: 1099.98px) {
  .jd-area-locator--footer .jd-area-locator__zip-row { grid-template-columns: minmax(0, 1fr) auto; }
  html body[class*="path-"] #wrapper #footer.jd-public-footer .jd-area-locator .jd-area-locator__locate { grid-column: 1 / -1; width: 100% !important; }
}
@media (max-width: 991.98px) {
  .jd-area-locator--footer .jd-area-locator__grid { gap: 20px; grid-template-columns: 1fr 1fr; }
  .jd-area-locator--footer .jd-area-locator__controls { padding: 20px; }
  .jd-area-locator--footer .jd-area-locator__results { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767.98px) {
  .jd-public-footer .jd-public-footer__inner { padding: 40px 20px 24px; }
  .jd-area-locator--footer .jd-area-locator__grid { grid-template-columns: 1fr; }
  .jd-area-locator--footer :is(.jd-area-locator__map-stage, .jd-area-locator__map-fallback, .jd-area-locator__map-canvas) { min-height: 300px; }
  .jd-area-locator--footer .jd-area-locator__map-canvas { height: 300px; }
  .jd-area-locator--footer .jd-area-locator__directory-heading { align-items: flex-start; flex-direction: column; gap: 8px; }
  .jd-area-locator--footer .jd-area-locator__results { grid-template-columns: 1fr; }
  .jd-area-locator--footer .jd-area-locator__zip-row > .jd-area-locator__field { min-width: 0; }
}
@media (max-width: 575.98px) {
  html body[class*="path-"] #wrapper #footer.jd-public-footer .jd-public-footer__community-grid .jd-public-footer__community-link { flex-direction: column; gap: 8px; }
  .jd-area-locator--compact .jd-area-locator__controls, .jd-area-locator--compact .jd-area-locator__results { grid-template-columns: 1fr; }
}
@media print {
  html body[class*="path-"] #wrapper #footer.jd-public-footer { background: #fff !important; color: #222 !important; }
  .jd-public-footer .jd-public-footer__inner { padding: 16px; }
  .jd-area-locator .jd-area-locator__controls, .jd-area-locator .jd-area-locator__map, .jd-area-locator .jd-area-locator__status,
  .jd-public-footer .jd-public-footer__art, .jd-public-footer .jd-public-footer__community-grid { display: none !important; }
  html body[class*="path-"] #wrapper #footer.jd-public-footer .jd-area-locator .jd-area-locator__card[hidden] { display: block !important; }
  .jd-area-locator--footer .jd-area-locator__results { grid-template-columns: repeat(3, 1fr); }
  .jd-area-locator--footer .jd-area-locator__card { background: #fff; border-color: #777; }
  html body[class*="path-"] #wrapper #footer.jd-public-footer [data-area-count] { display: none !important; }
  html body[class*="path-"] #wrapper #footer.jd-public-footer .jd-area-locator :is(.jd-area-locator__card-heading a, .jd-area-locator__card-heading a span, .jd-area-locator__card-links a, .jd-area-locator__card-meta, .jd-area-locator__card-state, .jd-area-locator__directory-heading > span, .jd-area-locator__fine-print) { color: #222 !important; -webkit-text-fill-color: #222 !important; }
  html body[class*="path-"] #wrapper #footer.jd-public-footer :is(h2, h3, h4, p, li, label, span, strong, figcaption, a),
  html body[class*="path-"] #wrapper #footer.jd-public-footer .jd-service-contact a,
  html body[class*="path-"] #wrapper #footer.jd-public-footer .jd-footer__credit a,
  html body[class*="path-"] #wrapper #footer.jd-public-footer .jd-area-locator__view { color: #222 !important; -webkit-text-fill-color: #222 !important; }
}

/* Native footer policies belong immediately after the contact service hours. */
.jd-service-contact--footer .jd-service-contact__policies { border-top: 1px solid #694582; margin-top: 18px; padding-top: 10px; }
.jd-service-contact--footer .jd-service-contact__policies :is(.block, .container-wrap, .block-content) { margin: 0 !important; max-width: none !important; padding: 0 !important; width: 100% !important; }
.jd-public-footer .jd-mega-menu--footer-legal > .jd-mega-menu__drawer > .jd-mega-menu__list { gap: 0; grid-template-columns: minmax(0, 1fr); }
html body[class*="path-"] #wrapper #footer.jd-public-footer [data-jd-mega-menu="footer"].jd-mega-menu--footer-legal > .jd-mega-menu__drawer > .jd-mega-menu__list > .jd-mega-menu__item > .jd-mega-menu__item-row > .jd-mega-menu__link {
  color: #e4d4ee !important; font-size: 14px !important; font-weight: 400 !important; line-height: 1.5 !important; min-height: 44px !important; padding: 8px 0 !important;
}

/* Local city popups remain legible inside the regional map on narrow screens. */
.jd-area-locator .leaflet-popup-content { overflow-wrap: anywhere; }
.jd-area-locator .leaflet-popup-content .jd-area-locator__popup-contact a { display: flex; }

/* assets/css/breadcrumb-premium.css */
/* ========================================================================== */
/* Johnny Detail premium breadcrumbs                                         */
/* ========================================================================== */

/*
 * This file is intentionally loaded last by martis_get_late_theme_css().
 * The theme contains several historical, path-specific breadcrumb rules, so
 * the active block is anchored through its real region and block IDs here.
 */
html body[class*="path-"] #wrapper #content-wide-top #block-breadcrumbs.block {
  --jd-breadcrumb-purple: #6716aa;
  --jd-breadcrumb-deep: #3b0a5c;
  --jd-breadcrumb-ink: #3b0a5c;
  --jd-breadcrumb-accent: #9d4edd;
  --jd-breadcrumb-accent-light: #e9d5ff;
  --jd-breadcrumb-lilac: #f3e8ff;
  --jd-breadcrumb-border: #e9d5ff;
  background: var(--jd-breadcrumb-lilac) !important;
  border: 0 !important;
  border-bottom: 2px solid var(--jd-breadcrumb-purple) !important;
  border-top: 1px solid var(--jd-breadcrumb-border) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
  clear: both !important;
  display: block !important;
  float: none !important;
  left: auto !important;
  margin: 0 0 clamp(.8rem, 2vw, 1.15rem) 0 !important;
  /* Parent is already the layout width. 100vw includes a classic scrollbar
     and makes the document wider than the layout viewport. */
  max-width: 100% !important;
  min-width: 100% !important;
  overflow: visible !important;
  padding: 0 !important;
  position: relative !important;
  right: auto !important;
  text-align: left !important;
  transform: none !important;
  visibility: visible !important;
  width: 100% !important;
  z-index: 5 !important;
}

html body #wrapper #content-wide-top #block-breadcrumbs > .container-wrap,
html body #wrapper #content-wide-top #block-breadcrumbs > .block-content,
html body #wrapper #content-wide-top #block-breadcrumbs > .container-wrap > .block-content {
  background: transparent !important;
  border: 0 !important;
  box-sizing: border-box !important;
  display: block !important;
  float: none !important;
  margin: 0 !important;
  max-width: none !important;
  overflow: visible !important;
  padding: 0 !important;
  width: 100% !important;
}

html body #wrapper #content-wide-top #block-breadcrumbs nav.breadcrumb {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-sizing: border-box !important;
  display: block !important;
  margin: 0 !important;
  max-width: none !important;
  overflow: visible !important;
  padding: .7rem clamp(.8rem, 3vw, 2rem) !important;
  text-align: left !important;
  width: 100% !important;
}

html body #wrapper #content-wide-top #block-breadcrumbs .breadcrumb__list {
  align-items: center !important;
  box-sizing: border-box !important;
  display: flex !important;
  flex-flow: row wrap !important;
  gap: .3rem .2rem !important;
  justify-content: center !important;
  list-style: none !important;
  margin: 0 auto !important;
  max-width: 1280px !important;
  min-width: 0 !important;
  padding: 0 !important;
  width: 100% !important;
}

html body #wrapper #content-wide-top #block-breadcrumbs .breadcrumb__item,
html body #wrapper #content-wide-top #block-breadcrumbs .breadcrumb__item:last-child,
html body #wrapper #content-wide-top #block-breadcrumbs .breadcrumb__item--current,
html body #wrapper #content-wide-top #block-breadcrumbs .breadcrumb__item--label {
  align-items: center !important;
  background: transparent !important;
  border: 0 !important;
  box-sizing: border-box !important;
  color: var(--jd-breadcrumb-ink) !important;
  display: inline-flex !important;
  flex: 0 1 auto !important;
  flex-flow: row nowrap !important;
  float: none !important;
  font-size: .9rem !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  margin: 0 !important;
  max-width: 100% !important;
  min-width: 0 !important;
  opacity: 1 !important;
  padding: 0 !important;
  position: relative !important;
  text-align: left !important;
  visibility: visible !important;
  width: auto !important;
}

/* Suppress legacy separators; spacing separates the links and current label. */
html body #wrapper #content-wide-top #block-breadcrumbs .breadcrumb__item::before,
html body #wrapper #content-wide-top #block-breadcrumbs .breadcrumb__item::after {
  background: none !important;
  border: 0 !important;
  content: none !important;
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

html body #wrapper #content-wide-top #block-breadcrumbs .breadcrumb__link,
html body #wrapper #content-wide-top #block-breadcrumbs .breadcrumb__label,
html body #wrapper #content-wide-top #block-breadcrumbs .breadcrumb__current {
  align-items: center !important;
  border: 1px solid transparent !important;
  border-radius: 9px !important;
  box-sizing: border-box !important;
  display: inline-flex !important;
  font-size: inherit !important;
  line-height: 1.25 !important;
  margin: 0 !important;
  max-width: 100% !important;
  min-height: 38px !important;
  min-width: 0 !important;
  overflow-wrap: anywhere !important;
  padding: .42rem .58rem !important;
  text-align: left !important;
  text-decoration: none !important;
  text-shadow: none !important;
  white-space: normal !important;
  word-break: normal !important;
}

html body #wrapper #content-wide-top #block-breadcrumbs .breadcrumb__link {
  background: transparent !important;
  box-shadow: none !important;
  color: var(--jd-breadcrumb-purple) !important;
  font-weight: 760 !important;
  transition: background-color .16s ease, border-color .16s ease, color .16s ease !important;
  -webkit-text-fill-color: var(--jd-breadcrumb-purple) !important;
}

html body #wrapper #content-wide-top #block-breadcrumbs .breadcrumb__link:hover {
  background: rgba(255, 255, 255, .86) !important;
  border-color: var(--jd-breadcrumb-border) !important;
  box-shadow: none !important;
  color: var(--jd-breadcrumb-deep) !important;
  text-decoration: none !important;
  transform: none !important;
  -webkit-text-fill-color: var(--jd-breadcrumb-deep) !important;
}

html body #wrapper #content-wide-top #block-breadcrumbs .breadcrumb__link:focus-visible {
  background: #f3e8ff !important;
  border-color: var(--jd-breadcrumb-accent) !important;
  box-shadow: 0 0 0 4px rgba(157, 78, 221, .2) !important;
  color: var(--jd-breadcrumb-deep) !important;
  outline: 3px solid var(--jd-breadcrumb-deep) !important;
  outline-offset: 2px !important;
  text-decoration: none !important;
  -webkit-text-fill-color: var(--jd-breadcrumb-deep) !important;
}

html body #wrapper #content-wide-top #block-breadcrumbs .breadcrumb__label {
  background: transparent !important;
  border-color: transparent !important;
  color: #552078 !important;
  font-weight: 750 !important;
  -webkit-text-fill-color: #552078 !important;
}

html body #wrapper #content-wide-top #block-breadcrumbs .breadcrumb__current {
  background: rgba(255, 255, 255, .86) !important;
  border-color: var(--jd-breadcrumb-border) !important;
  box-shadow: 0 3px 12px rgba(59, 10, 92, .08) !important;
  color: var(--jd-breadcrumb-deep) !important;
  font-weight: 850 !important;
  -webkit-text-fill-color: var(--jd-breadcrumb-deep) !important;
}

@media (max-width: 767.98px) {
  html body[class*="path-"] #wrapper #content-wide-top #block-breadcrumbs.block {
    margin-bottom: .8rem !important;
  }

  html body #wrapper #content-wide-top #block-breadcrumbs nav.breadcrumb {
    padding: .72rem .7rem !important;
  }

  html body #wrapper #content-wide-top #block-breadcrumbs .breadcrumb__list {
    gap: .2rem .08rem !important;
    justify-content: flex-start !important;
  }

  html body #wrapper #content-wide-top #block-breadcrumbs .breadcrumb__item,
  html body #wrapper #content-wide-top #block-breadcrumbs .breadcrumb__item:last-child,
  html body #wrapper #content-wide-top #block-breadcrumbs .breadcrumb__item--current,
  html body #wrapper #content-wide-top #block-breadcrumbs .breadcrumb__item--label {
    flex: 0 1 auto !important;
    font-size: .84rem !important;
    max-width: 100% !important;
    min-width: 0 !important;
    width: auto !important;
  }

  html body #wrapper #content-wide-top #block-breadcrumbs .breadcrumb__link,
  html body #wrapper #content-wide-top #block-breadcrumbs .breadcrumb__label,
  html body #wrapper #content-wide-top #block-breadcrumbs .breadcrumb__current {
    min-height: 44px !important;
    padding: .5rem .66rem !important;
  }

  html body #wrapper #content-wide-top #block-breadcrumbs .breadcrumb__item--current {
    flex: 0 1 auto !important;
    width: auto !important;
  }

  html body #wrapper #content-wide-top #block-breadcrumbs .breadcrumb__current {
    width: auto !important;
  }

}

@media (max-width: 359.98px) {
  html body #wrapper #content-wide-top #block-breadcrumbs nav.breadcrumb {
    padding-inline: .5rem !important;
  }

  html body #wrapper #content-wide-top #block-breadcrumbs .breadcrumb__item,
  html body #wrapper #content-wide-top #block-breadcrumbs .breadcrumb__item:last-child {
    font-size: .8rem !important;
  }

  html body #wrapper #content-wide-top #block-breadcrumbs .breadcrumb__link,
  html body #wrapper #content-wide-top #block-breadcrumbs .breadcrumb__label,
  html body #wrapper #content-wide-top #block-breadcrumbs .breadcrumb__current {
    padding-inline: .58rem !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  html body #wrapper #content-wide-top #block-breadcrumbs .breadcrumb__link {
    transition: none !important;
  }
}

/* Catalog landing: keep the bar flush with the header like /blog and /forum. */
html body.jd-storefront-landing #wrapper #content-wide-top {
  padding-top: 0 !important;
}

/* assets/css/related-grid-premium.css */
/**
 * @file
 * Johnny Detail premium treatment for related product and article grids.
 *
 * This file is injected in Martis's final CSS layer because the legacy theme
 * contains broad, high-specificity product and blog teaser rules.
 */

html body #wrapper .related-grid {
  --jd-related-ink: #24112f;
  --jd-related-purple-deep: #3b0a5c;
  --jd-related-purple: #6716aa;
  --jd-related-violet: #9d4edd;
  --jd-related-orchid: #9d4edd;
  --jd-related-orchid-dark: #7b2cbf;
  --jd-related-pink-light: #e9d5ff;
  --jd-related-lilac: #f3e8ff;
  --jd-related-lilac-deep: #d8b4fe;
  background:
    radial-gradient(circle at 8% 0%, rgba(157, 78, 221, 0.12), transparent 28%),
    radial-gradient(circle at 94% 100%, rgba(157, 78, 221, 0.1), transparent 30%),
    linear-gradient(180deg, #ffffff 0%, #fcf9ff 100%) !important;
  border: 2px solid black !important;
  border-radius: 10px !important;
  box-shadow:
    0 24px 55px -38px rgba(59, 10, 92, 0.46),
    0 8px 24px -18px rgba(59, 10, 92, 0.24) !important;
  box-sizing: border-box !important;
  isolation: isolate;
  margin: 3rem 0 2.25rem !important;
  max-width: 100% !important;
  padding: clamp(1.2rem, 2.8vw, 2.35rem) !important;
  position: relative !important;
  width: 100% !important;
}

html body #wrapper .related-grid *,
html body #wrapper .related-grid *::before,
html body #wrapper .related-grid *::after {
  box-sizing: border-box;
}

html body #wrapper .related-grid .related-grid__header {
  background: transparent !important;
  border: 0 !important;
  margin: 0 auto clamp(1.35rem, 2.5vw, 2rem) !important;
  max-width: 46rem !important;
  padding: 0 !important;
  text-align: center !important;
}

html body #wrapper .related-grid .related-grid__kicker {
  align-items: center !important;
  background: rgba(157, 78, 221, 0.13) !important;
  border: 1px solid rgba(123, 44, 191, 0.28) !important;
  border-radius: 999px !important;
  color: var(--jd-related-purple) !important;
  display: inline-flex !important;
  font-size: 0.72rem !important;
  font-weight: 850 !important;
  letter-spacing: 0.14em !important;
  line-height: 1.2 !important;
  margin: 0 0 0.65rem !important;
  min-height: 2rem !important;
  padding: 0.38rem 0.8rem !important;
  text-align: center !important;
  text-transform: uppercase !important;
}

html body #wrapper .related-grid .related-grid__title {
  background: transparent !important;
  border: 0 !important;
  color: var(--jd-related-purple-deep) !important;
  font-size: clamp(1.5rem, 3vw, 2.15rem) !important;
  font-weight: 850 !important;
  letter-spacing: -0.03em !important;
  line-height: 1.12 !important;
  margin: 0 auto 0.5rem !important;
  max-width: 40rem !important;
  padding: 0 !important;
  text-align: center !important;
  text-wrap: balance;
}

html body #wrapper .related-grid .related-grid__lead {
  background: transparent !important;
  border: 0 !important;
  color: #594b63 !important;
  font-size: clamp(0.92rem, 1.5vw, 1.02rem) !important;
  line-height: 1.55 !important;
  margin: 0 auto !important;
  max-width: 38rem !important;
  padding: 0 !important;
  text-align: center !important;
}

html body #wrapper .related-grid .related-grid__items {
  align-items: stretch !important;
  column-count: auto !important;
  column-width: auto !important;
  display: grid !important;
  gap: clamp(1rem, 2vw, 1.4rem) !important;
  grid-template-columns: minmax(0, 1fr) !important;
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
}

html body #wrapper .related-grid .related-grid__items > * {
  float: none !important;
  height: 100% !important;
  margin: 0 !important;
  max-width: 100% !important;
  min-width: 0 !important;
  padding: 0 !important;
  width: 100% !important;
}

/* -------------------------------------------------------------------------
 * Related products: light luxury storefront cards.
 * ---------------------------------------------------------------------- */

html body.path-product #wrapper .related-grid--products .product-teaser-wrap,
html body.path-product #wrapper .related-grid--products .product-teaser,
html body.path-product #wrapper .related-grid--products .product-teaser-container {
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
  margin: 0 !important;
  min-height: 0 !important;
  padding: 0 !important;
  width: 100% !important;
}

html body.path-product #wrapper .related-grid--products .product-teaser {
  background: #ffffff !important;
  border: 1px solid #e4d2f5 !important;
  border-top: 4px solid var(--jd-related-orchid) !important;
  border-radius: 18px !important;
  box-shadow:
    0 18px 38px -28px rgba(59, 10, 92, 0.55),
    0 8px 20px -16px rgba(103, 22, 170, 0.3) !important;
  overflow: hidden !important;
  position: relative !important;
  translate: 0 0 !important;
  transition:
    border-color 180ms ease,
    box-shadow 180ms ease,
    translate 180ms ease !important;
}

html body.path-product #wrapper .related-grid--products .product-teaser-bg {
  display: none !important;
}

html body.path-product #wrapper .related-grid--products .product-teaser-image {
  align-items: center !important;
  aspect-ratio: 1 / 1 !important;
  background: white !important;
  border: 0 !important;
  border-bottom: 1px solid #eadcf7 !important;
  border-radius: 0 !important;
  display: flex !important;
  flex: 0 0 auto !important;
  height: auto !important;
  justify-content: center !important;
  margin: 0 !important;
  max-height: none !important;
  min-height: 0 !important;
  overflow: hidden !important;
  padding: clamp(0.8rem, 1.7vw, 1.15rem) !important;
  position: relative !important;
  width: 100% !important;
}

html body.path-product #wrapper .related-grid--products .product-teaser-image .field,
html body.path-product #wrapper .related-grid--products .product-teaser-image .field-items,
html body.path-product #wrapper .related-grid--products .product-teaser-image .field-item,
html body.path-product #wrapper .related-grid--products .product-teaser-image [class*="product--variation-field"] {
  background: transparent !important;
  border: 0 !important;
  display: block !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  position: static !important;
  width: 100% !important;
}

html body.path-product #wrapper .related-grid--products .product-teaser-image img {
  border: 0 !important;
  border-radius: 0 !important;
  display: block !important;
  height: 100% !important;
  margin: 0 auto !important;
  max-height: none !important;
  max-width: 100% !important;
  object-fit: contain !important;
  object-position: center !important;
  padding: 0 !important;
  scale: 1 !important;
  transition: scale 220ms ease !important;
  width: 100% !important;
}

html body.path-product #wrapper .related-grid--products .product-icon-wrap,
html body.path-product #wrapper .related-grid--products .product-ratings,
html body.path-product #wrapper .related-grid--products .product-add-cart,
html body.path-product #wrapper .related-grid--products .has-no-option-variation,
html body.path-product #wrapper .related-grid--products .has-option-variation,
html body.path-product #wrapper .related-grid--products .form-item-quantity,
html body.path-product #wrapper .related-grid--products .quantity-button {
  display: none !important;
}

html body.path-product #wrapper .related-grid--products .product-badge {
  align-items: center !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 0.35rem !important;
  left: 0.7rem !important;
  margin: 0 !important;
  position: absolute !important;
  top: 0.7rem !important;
  z-index: 5 !important;
}

html body.path-product #wrapper .related-grid--products .badge-label {
  align-items: center !important;
  border: 1px solid rgba(59, 10, 92, 0.3) !important;
  border-radius: 999px !important;
  box-shadow: 0 5px 12px -7px rgba(36, 17, 47, 0.7) !important;
  display: inline-flex !important;
  font-size: 0.67rem !important;
  font-weight: 850 !important;
  letter-spacing: 0.075em !important;
  line-height: 1 !important;
  min-height: 1.75rem !important;
  padding: 0.35rem 0.65rem !important;
  text-transform: uppercase !important;
}

html body.path-product #wrapper .related-grid--products .badge-new {
  background: var(--jd-related-purple) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

html body.path-product #wrapper .related-grid--products .badge-sale {
  background: var(--jd-related-orchid) !important;
  color: var(--jd-related-purple-deep) !important;
  -webkit-text-fill-color: var(--jd-related-purple-deep) !important;
}

html body.path-product #wrapper .related-grid--products .badge-hot {
  background: var(--jd-related-lilac-deep) !important;
  color: var(--jd-related-purple-deep) !important;
  -webkit-text-fill-color: var(--jd-related-purple-deep) !important;
}

html body.path-product #wrapper .related-grid--products .product-meta-wrap {
  background: #ffffff !important;
  display: flex !important;
  flex: 1 1 auto !important;
  flex-direction: column !important;
  height: auto !important;
  margin: 0 !important;
  min-height: 0 !important;
  overflow: visible !important;
  padding: 1rem !important;
  position: relative !important;
  text-align: center !important;
}

html body.path-product #wrapper .related-grid--products .product-meta {
  display: flex !important;
  flex: 0 0 auto !important;
  flex-direction: column !important;
  gap: 0.45rem !important;
  margin: 0 !important;
  padding: 0 !important;
  text-align: center !important;
}

html body.path-product #wrapper .related-grid--products .product-title {
  align-items: center !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  display: flex !important;
  justify-content: center !important;
  margin: 0 !important;
  min-height: 2.7em !important;
  padding: 0 !important;
  text-align: center !important;
}

html body.path-product #wrapper .related-grid--products .product-title a,
html body.path-product #wrapper .related-grid--products a.product-title-link,
html body.path-product #wrapper .related-grid--products .product-title .field,
html body.path-product #wrapper .related-grid--products .product-title .field-item {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: var(--jd-related-purple-deep) !important;
  -webkit-text-fill-color: var(--jd-related-purple-deep) !important;
  font-size: clamp(0.98rem, 1.35vw, 1.08rem) !important;
  font-weight: 850 !important;
  letter-spacing: -0.012em !important;
  line-height: 1.35 !important;
  text-align: center !important;
  text-decoration: none !important;
}

html body.path-product #wrapper .related-grid--products .product-title a,
html body.path-product #wrapper .related-grid--products a.product-title-link {
  display: -webkit-box !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 2 !important;
  overflow: hidden !important;
  overflow-wrap: anywhere !important;
}

html body.path-product #wrapper .related-grid--products .product-price-wrap {
  margin: 0 !important;
  padding: 0 !important;
  margin-top: 1rem !important;
  margin-bottom: 2rem !important;
}

html body.path-product #wrapper .related-grid--products .product-price {
  align-items: baseline !important;
  color: var(--jd-related-purple) !important;
  -webkit-text-fill-color: var(--jd-related-purple) !important;
  display: flex !important;
  flex-wrap: wrap !important;
  font-size: 0.78rem !important;
  font-weight: 750 !important;
  gap: 0.3rem !important;
  justify-content: center !important;
  line-height: 1.3 !important;
  margin: 0 !important;
  padding: 0 !important;
  text-transform: uppercase !important;
}

html body.path-product #wrapper .related-grid--products .product-price .field,
html body.path-product #wrapper .related-grid--products .product-price .field-item,
html body.path-product #wrapper .related-grid--products .product-price .price {
  color: var(--jd-related-purple) !important;
  -webkit-text-fill-color: var(--jd-related-purple) !important;
  display: inline !important;
  font-size: 1.18rem !important;
  font-weight: 900 !important;
  letter-spacing: -0.02em !important;
  margin: 0 !important;
  padding: 0 !important;
  text-transform: none !important;
}

html body.path-product #wrapper .related-grid--products .product-old-price {
  color: #766a7e !important;
  font-size: 0.82rem !important;
  margin: 0 0 0.15rem !important;
}

html body.path-product #wrapper .related-grid--products .product-variation-wrap {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  display: flex !important;
  flex: 1 1 auto !important;
  flex-direction: column !important;
  margin: 0.65rem 0 0 !important;
  min-height: 0 !important;
  padding: 0 !important;
}

html body.path-product #wrapper .related-grid--products .product-desc {
  background: linear-gradient(180deg, #fcf9ff 0%, #f7eeff 100%) !important;
  border: 1px solid #ead9f8 !important;
  border-radius: 12px !important;
  color: #4d4056 !important;
  display: block !important;
  font-size: 0.86rem !important;
  height: 6.55rem !important;
  line-height: 1.45 !important;
  margin: 0 !important;
  max-height: 6.55rem !important;
  min-height: 6.55rem !important;
  overflow: hidden !important;
  padding: 0.65rem 0.72rem !important;
  text-align: left !important;
}

html body.path-product #wrapper .related-grid--products .product-desc .field,
html body.path-product #wrapper .related-grid--products .product-desc .field-item,
html body.path-product #wrapper .related-grid--products .product-desc p,
html body.path-product #wrapper .related-grid--products .field-field-short-description,
html body.path-product #wrapper .related-grid--products .field-field-short-description .field-item {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: #4d4056 !important;
  -webkit-text-fill-color: #4d4056 !important;
  font-size: inherit !important;
  line-height: 1.45 !important;
  margin: 0 !important;
  padding: 0 !important;
  text-align: left !important;
  white-space: normal !important;
}

html body.path-product #wrapper .related-grid--products .product-desc .field-item,
html body.path-product #wrapper .related-grid--products .product-desc p,
html body.path-product #wrapper .related-grid--products .field-field-short-description .field-item {
  display: -webkit-box !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 4 !important;
  max-height: calc(1.45em * 4) !important;
  overflow: hidden !important;
}

html body.path-product #wrapper .related-grid--products .product-desc .field-label,
html body.path-product #wrapper .related-grid--products .field-field-short-description .field-label {
  display: none !important;
}

html body.path-product #wrapper .related-grid--products .product-teaser-actions {
  align-items: center !important;
  display: flex !important;
  justify-content: center !important;
  margin: auto 0 0 !important;
  padding: 0.8rem 0 0 !important;
  position: relative !important;
  width: 100% !important;
  z-index: 3 !important;
}

html body.path-product #wrapper .related-grid--products .product-teaser-learn-more,
html body.path-product #wrapper .related-grid--products a.btn.product-teaser-learn-more {
  align-items: center !important;
  background: linear-gradient(
    135deg,
    var(--jd-related-purple-deep) 0%,
    var(--jd-related-purple) 58%,
    var(--jd-related-violet) 100%
  ) !important;
  border: 1px solid var(--jd-related-purple-deep) !important;
  border-radius: 11px !important;
  box-shadow: 0 10px 20px -13px rgba(59, 10, 92, 0.85) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  display: inline-flex !important;
  font-size: 0.91rem !important;
  font-weight: 850 !important;
  justify-content: center !important;
  line-height: 1.2 !important;
  margin: 0 !important;
  min-height: 44px !important;
  padding: 0.65rem 1rem !important;
  text-align: center !important;
  text-decoration: none !important;
  width: 100% !important;
}

/* -------------------------------------------------------------------------
 * Related articles: deep-purple editorial cards with complete metadata.
 * ---------------------------------------------------------------------- */

html body.page-node-type-blog #wrapper .related-grid--articles .blog-post-teaser {
  align-items: stretch !important;
  background:
    radial-gradient(circle at 100% 0%, rgba(157, 78, 221, 0.2), transparent 34%),
    linear-gradient(155deg, #741eb3 0%, var(--jd-related-purple) 48%, var(--jd-related-purple-deep) 100%) !important;
  border: 1px solid rgba(157, 78, 221, 0.48) !important;
  border-radius: 18px !important;
  box-shadow:
    0 22px 42px -29px rgba(36, 17, 47, 0.82),
    0 8px 20px -14px rgba(103, 22, 170, 0.55) !important;
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
  margin: 0 !important;
  max-width: 100% !important;
  min-height: 0 !important;
  overflow: hidden !important;
  padding: 0 !important;
  position: relative !important;
  translate: 0 0 !important;
  transition:
    border-color 180ms ease,
    box-shadow 180ms ease,
    translate 180ms ease !important;
  width: 100% !important;
}

html body.page-node-type-blog #wrapper .related-grid--articles .blog-post-teaser .post-content-wrap,
html body.page-node-type-blog #wrapper .related-grid--articles .blog-post-teaser .content-wrap {
  align-items: stretch !important;
  background: transparent !important;
  border: 0 !important;
  display: flex !important;
  flex: 1 1 auto !important;
  flex-direction: column !important;
  gap: 0 !important;
  height: 100% !important;
  margin: 0 !important;
  max-width: 100% !important;
  min-height: 0 !important;
  overflow: visible !important;
  padding: 0 !important;
  width: 100% !important;
}

html body.page-node-type-blog #wrapper .related-grid--articles .blog-post-teaser .post-thumb {
  background: #2d0c43 !important;
  display: block !important;
  flex: 0 0 auto !important;
  height: auto !important;
  margin: 0 !important;
  max-width: 100% !important;
  overflow: hidden !important;
  padding: 0 !important;
  position: relative !important;
  width: 100% !important;
  z-index: 2 !important;
}

html body.page-node-type-blog #wrapper .related-grid--articles .blog-post-teaser .post-image {
  aspect-ratio: 16 / 9 !important;
  background:
    radial-gradient(circle at 50% 30%, #7a27b2 0%, #3b0a5c 75%) !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(233, 213, 255, 0.4) !important;
  border-radius: 0 !important;
  display: block !important;
  height: auto !important;
  margin: 0 !important;
  max-height: none !important;
  max-width: 100% !important;
  overflow: hidden !important;
  padding: 0 !important;
  position: relative !important;
  width: 100% !important;
  z-index: 1 !important;
}

html body.page-node-type-blog #wrapper .related-grid--articles .blog-post-teaser .post-image img {
  border: 0 !important;
  border-radius: 0 !important;
  display: block !important;
  height: 100% !important;
  margin: 0 !important;
  max-height: none !important;
  max-width: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
  padding: 0 !important;
  scale: 1 !important;
  transition: scale 240ms ease !important;
  width: 100% !important;
}

html body.page-node-type-blog #wrapper .related-grid--articles .blog-post-teaser .post-image--placeholder::after {
  align-items: center;
  color: rgba(255, 255, 255, 0.84);
  content: "Johnny Detail";
  display: flex;
  font-size: 0.8rem;
  font-weight: 850;
  inset: 0;
  justify-content: center;
  letter-spacing: 0.12em;
  position: absolute;
  text-transform: uppercase;
}

html body.page-node-type-blog #wrapper .related-grid--articles .blog-post-teaser .post-content {
  align-items: stretch !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: #ffffff !important;
  display: flex !important;
  flex: 1 1 auto !important;
  flex-direction: column !important;
  height: 100% !important;
  margin: 0 !important;
  max-width: 100% !important;
  min-height: 0 !important;
  padding: clamp(1rem, 2vw, 1.25rem) !important;
  position: relative !important;
  text-align: left !important;
  width: 100% !important;
  z-index: 1 !important;
}

html body.page-node-type-blog #wrapper .related-grid--articles .blog-post-teaser .post-title-wrap,
html body.page-node-type-blog #wrapper .related-grid--articles .blog-post-teaser .post-title,
html body.page-node-type-blog #wrapper .related-grid--articles .blog-post-teaser h3.post-title {
  background: transparent !important;
  border: 0 !important;
  margin: 0 0 0.6rem !important;
  min-height: 0 !important;
  padding: 0 !important;
  text-align: left !important;
}

html body.page-node-type-blog #wrapper .related-grid--articles .blog-post-teaser .post-title a,
html body.page-node-type-blog #wrapper .related-grid--articles .blog-post-teaser .post-title span {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-size: clamp(1.05rem, 1.5vw, 1.2rem) !important;
  font-weight: 850 !important;
  letter-spacing: -0.018em !important;
  line-height: 1.3 !important;
  text-align: left !important;
  text-decoration: none !important;
}

html body.page-node-type-blog #wrapper .related-grid--articles .blog-post-teaser .post-title a {
  display: -webkit-box !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 3 !important;
  overflow: hidden !important;
  overflow-wrap: anywhere !important;
}

html body.page-node-type-blog #wrapper .related-grid--articles .blog-post-teaser .post-excerpt {
  display: -webkit-box !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 3 !important;
  margin: 0 0 0.85rem !important;
  max-height: calc(1.52em * 3) !important;
  overflow: hidden !important;
  padding: 0 !important;
}

html body.page-node-type-blog #wrapper .related-grid--articles .blog-post-teaser .post-excerpt,
html body.page-node-type-blog #wrapper .related-grid--articles .blog-post-teaser .post-excerpt *,
html body.page-node-type-blog #wrapper .related-grid--articles .blog-post-teaser .post-excerpt .field-item {
  background: transparent !important;
  border: 0 !important;
  color: #f8efff !important;
  -webkit-text-fill-color: #f8efff !important;
  font-size: 0.89rem !important;
  line-height: 1.52 !important;
  text-align: left !important;
}

html body.page-node-type-blog #wrapper .related-grid--articles .blog-post-teaser .post-excerpt .field-label,
html body.page-node-type-blog #wrapper .related-grid--articles .blog-post-teaser .post-meta .field-label,
html body.page-node-type-blog #wrapper .related-grid--articles .blog-post-teaser .post-tags .field-label {
  display: none !important;
}

html body.page-node-type-blog #wrapper .related-grid--articles .blog-post-teaser .post-meta {
  align-items: center !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  display: flex !important;
  flex: 0 0 auto !important;
  flex-wrap: wrap !important;
  gap: 0.42rem !important;
  justify-content: center !important;
  margin: 0 0 0.75rem !important;
  padding: 0 !important;
  visibility: visible !important;
  width: 100% !important;
  justify-content: center !important;
}

html body.page-node-type-blog #wrapper .related-grid--articles .blog-post-teaser .post-meta-item {
  align-items: center !important;
  background: rgb(209, 167, 255) !important;
  border: 1px solid rgba(233, 213, 255, 0.42) !important;
  border-radius: 999px !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  display: inline-flex !important;
  flex: 0 1 auto !important;
  font-size: 0.72rem !important;
  font-weight: 750 !important;
  gap: 0.32rem !important;
  line-height: 1.2 !important;
  margin: 0 !important;
  min-height: 2rem !important;
  overflow-wrap: anywhere !important;
  padding: 0.34rem 0.58rem !important;
  visibility: visible !important;
}


html body.page-node-type-blog #wrapper .related-grid--articles .blog-post-teaser .post-meta-item i {
  align-items: center !important;
  color: white !important;
  -webkit-text-fill-color: white !important;
  display: inline-flex !important;
  flex: 0 0 auto !important;
  font-size: 0.78rem !important;
  justify-content: center !important;
  margin: 0 !important;
}

html body.page-node-type-blog #wrapper .related-grid--articles .blog-post-teaser .post-meta-item.post-category i {
  color: white !important;
  -webkit-text-fill-color: white !important;
}

html body.page-node-type-blog #wrapper .related-grid--articles .blog-post-teaser .post-meta-item .field,
html body.page-node-type-blog #wrapper .related-grid--articles .blog-post-teaser .post-meta-item .field-items,
html body.page-node-type-blog #wrapper .related-grid--articles .blog-post-teaser .post-meta-item .field-item {
  background: transparent !important;
  border: 0 !important;
  color: inherit !important;
  display: inline !important;
  font-size: inherit !important;
  margin: 0 !important;
  padding: 0 !important;
}

html body.page-node-type-blog #wrapper .related-grid--articles .blog-post-teaser .post-meta-item a {
  color: inherit !important;
  -webkit-text-fill-color: inherit !important;
  font-size: inherit !important;
  font-weight: 800 !important;
  text-decoration: none !important;
}

html body.page-node-type-blog #wrapper .related-grid--articles .blog-post-teaser .post-meta-item.post-comment {
  display: none !important;
}

html body.page-node-type-blog #wrapper .related-grid--articles .blog-post-teaser .post-tags {
  align-items: center !important;
  background: transparent !important;
  border: 0 !important;
  border-top: 1px solid rgba(233, 213, 255, 0.28) !important;
  color: #ffffff !important;
  display: flex !important;
  flex: 0 0 auto !important;
  flex-wrap: wrap !important;
  gap: 0.35rem 0.45rem !important;
  margin: 0 !important;
  padding: 0.75rem 0 0 !important;
  visibility: visible !important;
  width: 100% !important;
  justify-content: center !important;
}

html body.page-node-type-blog #wrapper .related-grid--articles .blog-post-teaser .post-tags > i {
  color: var(--jd-related-pink-light) !important;
  -webkit-text-fill-color: var(--jd-related-pink-light) !important;
  display: inline-flex !important;
  font-size: 0.82rem !important;
  margin: 0 !important;
}

html body.page-node-type-blog #wrapper .related-grid--articles .blog-post-teaser .post-tags .tags-label {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  display: inline !important;
  font-size: 0.72rem !important;
  font-weight: 850 !important;
  letter-spacing: 0.08em !important;
  margin: 0 !important;
  text-transform: uppercase !important;
}

html body.page-node-type-blog #wrapper .related-grid--articles .blog-post-teaser .post-tags .tags-list {
  display: block !important;
  flex: 1 0 100% !important;
  margin: 0 !important;
  min-width: 0 !important;
  padding: 0 !important;
  width: 100% !important;
  margin-left: 1.5rem !important;
}

html body.page-node-type-blog #wrapper .related-grid--articles .blog-post-teaser .post-tags .field,
html body.page-node-type-blog #wrapper .related-grid--articles .blog-post-teaser .post-tags .field-items {
  align-items: center !important;
  background: transparent !important;
  border: 0 !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 0.4rem !important;
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
  justify-content: center !important;
}

html body.page-node-type-blog #wrapper .related-grid--articles .blog-post-teaser .post-tags .field-item {
  display: inline-flex !important;
  margin: 0 !important;
  max-width: 100% !important;
  padding: 0 !important;
}

html body.page-node-type-blog #wrapper .related-grid--articles .blog-post-teaser .post-tags a {
  align-items: center !important;
  background: rgba(255, 255, 255, 0.94) !important;
  border: 1px solid rgba(233, 213, 255, 0.78) !important;
  border-radius: 999px !important;
  color: var(--jd-related-purple-deep) !important;
  -webkit-text-fill-color: var(--jd-related-purple-deep) !important;
  display: inline-flex !important;
  font-size: 0.7rem !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  max-width: 100% !important;
  min-height: 2rem !important;
  overflow-wrap: anywhere !important;
  padding: 0.34rem 0.58rem !important;
  text-decoration: none !important;
  transition:
    background-color 160ms ease,
    border-color 160ms ease,
    color 160ms ease !important;
}

html body.page-node-type-blog #wrapper .related-grid--articles .blog-post-teaser .post-link {
  align-items: center !important;
  display: flex !important;
  justify-content: center !important;
  margin: auto 0 0 !important;
  padding: 0.9rem 0 0 !important;
  position: relative !important;
  width: 100% !important;
  z-index: 2 !important;
}

html body.page-node-type-blog #wrapper .related-grid--articles .blog-post-teaser a.read-more {
  align-items: center !important;
  background: linear-gradient(135deg, #f3e8ff 0%, var(--jd-related-pink-light) 48%, #d8b4fe 100%) !important;
  border: 1px solid var(--jd-related-pink-light) !important;
  border-radius: 11px !important;
  box-shadow: 0 11px 22px -15px rgba(20, 4, 30, 0.88) !important;
  color: var(--jd-related-purple-deep) !important;
  -webkit-text-fill-color: var(--jd-related-purple-deep) !important;
  display: inline-flex !important;
  font-size: 0.91rem !important;
  font-weight: 900 !important;
  justify-content: center !important;
  line-height: 1.2 !important;
  margin: 0 !important;
  min-height: 44px !important;
  padding: 0.65rem 1rem !important;
  text-align: center !important;
  text-decoration: none !important;
  width: 100% !important;
}

/* Hover and keyboard interactions are scoped to the related grids. */
html body #wrapper .related-grid a:focus-visible {
  outline: 3px solid var(--jd-related-orchid) !important;
  outline-offset: 3px !important;
}

html body.path-product #wrapper .related-grid--products .product-teaser:focus-within,
html body.page-node-type-blog #wrapper .related-grid--articles .blog-post-teaser:focus-within {
  border-color: var(--jd-related-orchid) !important;
  box-shadow:
    0 0 0 3px rgba(157, 78, 221, 0.18),
    0 18px 38px -26px rgba(59, 10, 92, 0.65) !important;
}

@media (hover: hover) and (pointer: fine) {
  html body.path-product #wrapper .related-grid--products .product-teaser:hover,
  html body.page-node-type-blog #wrapper .related-grid--articles .blog-post-teaser:hover {
    border-color: var(--jd-related-orchid) !important;
    box-shadow:
      0 26px 48px -30px rgba(59, 10, 92, 0.72),
      0 11px 24px -17px rgba(103, 22, 170, 0.45) !important;
    translate: 0 -5px !important;
  }

  html body.path-product #wrapper .related-grid--products .product-teaser:hover .product-teaser-image img {
    scale: 1.035 !important;
  }

  html body.page-node-type-blog #wrapper .related-grid--articles .blog-post-teaser:hover .post-image img {
    scale: 1.04 !important;
  }

  html body.path-product #wrapper .related-grid--products .product-title a:hover,
  html body.path-product #wrapper .related-grid--products a.product-title-link:hover {
    color: var(--jd-related-orchid-dark) !important;
    -webkit-text-fill-color: var(--jd-related-orchid-dark) !important;
  }

  html body.page-node-type-blog #wrapper .related-grid--articles .blog-post-teaser .post-title a:hover,
  html body.page-node-type-blog #wrapper .related-grid--articles .blog-post-teaser .post-meta-item a:hover {
    color: var(--jd-related-orchid-dark) !important;
    -webkit-text-fill-color: var(--jd-related-orchid-dark) !important;
  }

  html body.page-node-type-blog #wrapper .related-grid--articles .blog-post-teaser .post-tags a:hover {
    background: var(--jd-related-pink-light) !important;
    border-color: #ffffff !important;
  }

  html body.path-product #wrapper .related-grid--products .product-teaser-learn-more:hover,
  html body.page-node-type-blog #wrapper .related-grid--articles .blog-post-teaser a.read-more:hover {
    filter: brightness(1.06) saturate(1.04) !important;
  }
}

@media (min-width: 768px) {
  html body #wrapper .related-grid--products .related-grid__items,
  html body #wrapper .related-grid--articles .related-grid__items {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (min-width: 992px) {
  html body #wrapper .related-grid--products .related-grid__items,
  html body #wrapper .related-grid--articles .related-grid__items {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

@media (min-width: 1200px) {
  html body #wrapper .related-grid--products .related-grid__items {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 767.98px) {
  .path-product .main-content {
    margin-top: -1rem !important;
    margin-bottom: -2.5rem !important;
  }
  html body #wrapper .related-grid {
    border-radius: 20px !important;
    margin: 2.25rem 0 2rem !important;
    padding: 1.2rem 0.9rem 1.35rem !important;
  }

  html body #wrapper .related-grid .related-grid__header {
    margin-bottom: 1.25rem !important;
    padding: 0 0.25rem !important;
  }

  html body #wrapper .related-grid .related-grid__items {
    gap: 1.15rem !important;
    grid-template-columns: minmax(0, 1fr) !important;
  }

  html body.path-product #wrapper .related-grid--products .product-meta-wrap {
    padding: 0.9rem !important;
  }

  html body.path-product #wrapper .related-grid--products .product-desc {
    font-size: 0.84rem !important;
    height: 6.45rem !important;
    max-height: 6.45rem !important;
    min-height: 6.45rem !important;
  }

  html body.page-node-type-blog #wrapper .related-grid--articles .blog-post-teaser .post-meta {
    display: flex !important;
    gap: 0.38rem !important;
    justify-content: center !important;
  }

  html body.page-node-type-blog #wrapper .related-grid--articles .blog-post-teaser .post-meta-item {
    min-height: 2.1rem !important;
  }

  html body.page-node-type-blog #wrapper .related-grid--articles .blog-post-teaser .post-tags a {
    min-height: 2.1rem !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  html body #wrapper .related-grid *,
  html body #wrapper .related-grid *::before,
  html body #wrapper .related-grid *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
  }

  html body.path-product #wrapper .related-grid--products .product-teaser:hover,
  html body.page-node-type-blog #wrapper .related-grid--articles .blog-post-teaser:hover {
    translate: none !important;
    scale: none !important;
  }
}

/* Product-card alignment and single-border ownership. */
html body.path-product #wrapper .related-grid--products .product-teaser-wrap {
  background: transparent !important;
  border: 0 !important;
  border-left: 0 !important;
  border-radius: 18px !important;
  box-shadow: none !important;
  overflow: visible !important;
}

html body.path-product #wrapper .related-grid--products .product-meta-wrap,
html body.path-product #wrapper .related-grid--products .product-meta {
  align-items: center !important;
  text-align: center !important;
}

html body.path-product #wrapper .related-grid--products .product-title {
  display: block !important;
  flex: 0 0 3em !important;
  height: 3em !important;
  max-height: 7em !important;
  min-height: 7em !important;
  overflow: hidden !important;
  width: 100% !important;
}

html body.path-product #wrapper .related-grid--products .product-title a,
html body.path-product #wrapper .related-grid--products a.product-title-link {
  color: var(--jd-related-purple-deep) !important;
  -webkit-text-fill-color: var(--jd-related-purple-deep) !important;
  line-height: 1.4 !important;
  margin-inline: auto !important;
  max-height: 6em !important;
  min-height: 0 !important;
  overflow: hidden !important;
  text-align: center !important;
}

html body.path-product #wrapper .related-grid--products .product-price-wrap,
html body.path-product #wrapper .related-grid--products .product-price {
  justify-content: center !important;
  text-align: center !important;
  width: 100% !important;
}

/* assets/css/commerce-checkout-pages.css */
/**
 * Native Commerce cart and checkout presentation.
 * Brand adapter: edit only the --jd-ck-* tokens for another site's theme.
 */
html body.path-cart #wrapper,
html body.path-checkout #wrapper {
  --jd-ck-deep: #3b0a5c;
  --jd-ck-purple: #6716aa;
  --jd-ck-violet: #9d4edd;
  --jd-ck-lilac: #f3e8ff;
  --jd-ck-mist: #faf5ff;
  --jd-ck-surface: #fff;
  --jd-ck-on-accent: #fff;
  --jd-ck-page: #fcfaff;
  --jd-ck-ink: #1a0a24;
  --jd-ck-body: #40364a;
  --jd-ck-muted: #675c72;
  --jd-ck-border: #e9d5ff;
  --jd-ck-border-strong: #ccb5dd;
  --jd-ck-field-border: #bdb1c8;
  --jd-ck-danger: #a92340;
  --jd-ck-danger-soft: #fff1f4;
  --jd-ck-focus: rgba(103, 22, 170, 0.2);
  --jd-ck-shadow: 0 12px 32px rgba(59, 10, 92, 0.07);
  --jd-ck-radius: 18px;
  --jd-ck-radius-sm: 12px;
  --jd-ck-font: var(--jd-font-text, system-ui, sans-serif);
  --jd-ck-display: var(--jd-font-display, system-ui, sans-serif);
}

/* Page shell: align with the storefront's light heading and violet accent. */
html body.path-cart #wrapper #page-wrapper,
html body.path-checkout #wrapper #page-wrapper {
  background: var(--jd-ck-page) !important;
  margin: 0 !important; padding-top: 1rem !important;
  padding-bottom: clamp(2rem, 5vw, 4rem);
}
html body.path-cart #wrapper #page-wrapper > .container,
html body.path-checkout #wrapper #page-wrapper > .container {
  box-sizing: border-box; width: 100% !important; max-width: 72rem !important;
  margin-inline: auto !important; padding-inline: 12px !important;
}
html body.path-cart #wrapper #page-wrapper > .container > .row.content-layout,
html body.path-checkout #wrapper #page-wrapper > .container > .row.content-layout {
  width: 100% !important; min-width: 0; margin-inline: 0 !important; padding: 0 !important;
}
html body.path-cart #wrapper :is(.jd-cart-checkout-main, .col-md-9.main-content),
html body.path-checkout #wrapper :is(.jd-cart-checkout-main, .col-md-9.main-content) {
  box-sizing: border-box; float: none !important; flex: 0 0 100% !important;
  width: 100% !important; min-width: 0; max-width: 100% !important;
  margin-inline: auto !important; padding-inline: 0 !important;
}
html body.path-cart #wrapper :is(aside.sidebar, .col-md-3.sidebar),
html body.path-checkout #wrapper :is(aside.sidebar, .col-md-3.sidebar) { display: none !important; }
html body.path-cart #wrapper .commerce-content-header,
html body.path-checkout #wrapper .commerce-content-header {
  box-sizing: border-box; width: 100% !important; max-width: 72rem !important;
  margin: 0.75rem auto 1.25rem !important; padding: clamp(1.15rem, 3vw, 1.75rem) !important;
  background: linear-gradient(120deg, var(--jd-ck-surface), var(--jd-ck-mist)) !important;
  border: 1px solid var(--jd-ck-border) !important; border-left: 5px solid var(--jd-ck-violet) !important;
  border-radius: var(--jd-ck-radius) !important; box-shadow: var(--jd-ck-shadow) !important;
}
html body.path-cart #wrapper h1.commerce-content-h1,
html body.path-checkout #wrapper h1.commerce-content-h1 {
  display: block !important; width: auto !important; margin: 0 !important; padding: 0 !important;
  background: transparent !important; border: 0 !important; box-shadow: none !important;
  color: var(--jd-ck-deep) !important; -webkit-text-fill-color: var(--jd-ck-deep) !important;
  font-family: var(--jd-ck-display) !important; font-size: clamp(1.6rem, 3vw, 2.15rem) !important;
  font-weight: 800 !important; letter-spacing: -0.035em !important; line-height: 1.2 !important;
  text-align: left !important;
}
html body.path-cart #wrapper #page-wrapper :is(.region-content, .block-system-main-block, .block-system-main-block > .container-wrap, .block-system-main-block .block-content),
html body.path-checkout #wrapper #page-wrapper :is(.region-content, .block-system-main-block, .block-system-main-block > .container-wrap, .block-system-main-block .block-content) {
  width: 100% !important; min-width: 0; max-width: none !important;
  box-sizing: border-box; margin: 0 !important; padding: 0 !important;
  background: transparent !important; border: 0 !important; box-shadow: none !important;
}
html body.path-cart #wrapper .region-content p,
html body.path-checkout #wrapper .region-content p {
  width: auto !important; max-width: none !important; margin-inline: 0 !important; padding: 0 !important;
  background: transparent !important; border: 0 !important; box-shadow: none !important;
  color: var(--jd-ck-body) !important; -webkit-text-fill-color: var(--jd-ck-body) !important;
  text-shadow: none !important; line-height: 1.55;
}
html body.path-cart #wrapper .messages,
html body.path-checkout #wrapper .messages {
  max-width: 72rem; margin: 0 auto 1rem; border-radius: var(--jd-ck-radius-sm); overflow-wrap: anywhere;
}
html body.path-cart #wrapper :is(a, button, input, select, textarea, summary):focus-visible,
html body.path-checkout #wrapper :is(a, button, input, select, textarea, summary):focus-visible {
  outline: 3px solid var(--jd-ck-purple) !important; outline-offset: 3px !important;
  box-shadow: 0 0 0 5px var(--jd-ck-focus) !important;
}

/* Empty cart and populated cart: one shell, native controls and forms. */
html body.path-cart #wrapper .cart.cart-form {
  margin: 0 0 1.5rem !important; padding: 0 !important;
  background: transparent !important; border: 0 !important; box-shadow: none !important;
}
html body.path-cart #wrapper :is(.jd-cart-empty, form.jd-cart-form) {
  box-sizing: border-box !important; min-width: 0; margin: 0 auto 1.5rem !important;
  padding: clamp(0.85rem, 2vw, 1.5rem) !important; background: var(--jd-ck-surface) !important;
  border: 1px solid var(--jd-ck-border) !important; border-radius: var(--jd-ck-radius) !important;
  box-shadow: var(--jd-ck-shadow) !important; color: var(--jd-ck-ink) !important;
  font-family: var(--jd-ck-font) !important;
}
html body.path-cart #wrapper .jd-cart-empty {
  max-width: 38rem !important; padding: clamp(1.75rem, 5vw, 3rem) clamp(1rem, 4vw, 2rem) !important; text-align: center;
}
html body.path-cart #wrapper .cart-empty-icon {
  display: flex; align-items: center; justify-content: center; width: 4.5rem; height: 4.5rem;
  margin: 0 auto 1.15rem !important; background: var(--jd-ck-lilac) !important;
  border: 1px solid var(--jd-ck-border) !important; border-radius: 50%;
  color: var(--jd-ck-purple) !important; opacity: 1 !important;
}
html body.path-cart #wrapper .cart-empty-icon svg,
html body.path-checkout #wrapper .jd-checkout-complete__icon svg {
  width: 2rem; height: 2rem; fill: none; stroke: currentColor;
  stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8;
}
html body.path-cart #wrapper .jd-cart-empty__title {
  margin: 0 0 0.6rem !important; color: var(--jd-ck-deep) !important; font-family: var(--jd-ck-display);
  font-size: clamp(1.3rem, 3vw, 1.65rem) !important; font-weight: 800 !important;
}
html body.path-cart #wrapper .jd-cart-empty__message { margin: 0 0 1.5rem !important; }
html body.path-cart #wrapper .jd-cart-empty__actions {
  display: flex; flex-wrap: wrap; gap: 0.65rem; justify-content: center;
}
html body.path-cart #wrapper :is(.jd-cart-empty__cta, .jd-cart-empty__home),
html body.path-checkout #wrapper .jd-checkout-complete__cta {
  display: inline-flex; align-items: center; justify-content: center; min-height: 46px;
  padding: 0.75rem 1.15rem !important; background: var(--jd-ck-purple) !important;
  border: 1px solid var(--jd-ck-purple) !important; border-radius: var(--jd-ck-radius-sm);
  color: var(--jd-ck-on-accent) !important; -webkit-text-fill-color: var(--jd-ck-on-accent) !important;
  font-weight: 700; text-decoration: none !important;
}
html body.path-cart #wrapper .jd-cart-empty__home {
  background: var(--jd-ck-surface) !important; border-color: var(--jd-ck-border-strong) !important;
  color: var(--jd-ck-purple) !important; -webkit-text-fill-color: var(--jd-ck-purple) !important;
}
html body.path-cart #wrapper .jd-cart-form {
  display: grid; grid-template-columns: minmax(0, 1fr); gap: 1rem; align-items: start;
}
html body.path-cart #wrapper .jd-cart-form > table { grid-row: 1; }
html body.path-cart #wrapper .jd-cart-form > [data-drupal-selector="order-total-summary"] { grid-row: 2; }
html body.path-cart #wrapper .jd-cart-form > .form-actions { grid-row: 3; }
html body.path-cart #wrapper .jd-cart-form > .jd-cart-continue { grid-row: 4; }
html body.path-cart #wrapper .jd-cart-form table {
  width: 100% !important; margin: 0 !important; border-collapse: separate !important;
  border-spacing: 0 !important; background: transparent !important;
}
html body.path-cart #wrapper .jd-cart-form thead th {
  padding: 0.65rem 0.55rem !important; background: var(--jd-ck-mist) !important; border: 0 !important;
  color: var(--jd-ck-muted) !important; font-size: 0.78rem !important; font-weight: 700 !important;
  text-transform: none !important; letter-spacing: 0 !important;
}
html body.path-cart #wrapper .jd-cart-form tbody :is(th, td) {
  padding: 1rem 0.55rem !important; background: var(--jd-ck-surface) !important;
  border: 0 !important; border-bottom: 1px solid var(--jd-ck-border) !important;
  color: var(--jd-ck-ink) !important; vertical-align: middle !important;
}
html body.path-cart #wrapper .jd-cart-form :is(.views-field-unit-price__number, .views-field-total-price__number) { white-space: nowrap; }
html body.path-cart #wrapper .jd-cart-form .cart-item-variation { display: flex; align-items: center; min-width: 0; gap: 0.75rem; }
html body.path-cart #wrapper .jd-cart-form .cart-item-image {
  display: flex; flex: 0 0 3.5rem; align-items: center; justify-content: center;
  width: 3.5rem !important; min-width: 3.5rem !important; height: 3.5rem !important; overflow: hidden;
  background: var(--jd-ck-mist) !important; border: 1px solid var(--jd-ck-border) !important;
  border-radius: 10px !important; box-shadow: none !important;
}
html body.path-cart #wrapper .jd-cart-form .cart-item-image img,
html body.path-checkout #wrapper .jd-order-summary__image img {
  display: block; width: 100% !important; height: 100% !important; max-width: none !important;
  max-height: none !important; object-fit: cover;
}
html body.path-cart #wrapper .jd-cart-form .cart-item-image .field-item:not(:first-child) { display: none !important; }
html body.path-cart #wrapper .jd-cart-form .cart-item-image--gift-card {
  display: flex !important; align-items: center !important; justify-content: center !important;
  min-height: 3.5rem !important;
}
html body.path-cart #wrapper .jd-cart-form .cart-item-image--gift-card .cart-gift-card {
  display: flex; flex: 0 0 auto; align-items: center; justify-content: center;
  box-sizing: border-box; width: 80%; height: 65%; overflow: hidden;
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.16) 0 42%, transparent 42%),
    linear-gradient(135deg, var(--jd-ck-purple), var(--jd-ck-deep));
  border: 1px solid rgba(255, 255, 255, 0.2); border-radius: 6px;
  box-shadow: 0 3px 8px rgba(59, 10, 92, 0.22); color: var(--jd-ck-on-accent) !important;
}
html body.path-cart #wrapper .jd-cart-form .cart-item-image--gift-card .cart-gift-icon {
  display: block; flex: 0 0 auto; width: 26px !important; height: 26px !important;
  max-width: 90%; max-height: 90%; color: var(--jd-ck-on-accent) !important;
  fill: none; stroke: currentColor; stroke-width: 5; stroke-linecap: round; stroke-linejoin: round;
}
html body.path-cart #wrapper .jd-cart-form :is(.cart-item-info, .cart-item-title) {
  min-width: 0; color: var(--jd-ck-deep) !important; font-size: 1rem !important;
  font-weight: 700; line-height: 1.4; overflow-wrap: anywhere;
}
html body.path-cart #wrapper .jd-cart-form .cart-item-title {
  display: block !important; overflow: visible; white-space: normal; -webkit-line-clamp: unset;
}
html body.path-cart #wrapper .jd-cart-form input[type="number"] {
  box-sizing: border-box; width: 4.25rem !important; min-height: 44px !important; margin: 0 !important;
  padding: 0.4rem !important; background: var(--jd-ck-surface) !important;
  border: 1px solid var(--jd-ck-field-border) !important; border-radius: 8px !important;
  color: var(--jd-ck-ink) !important; font-size: 1rem !important; text-align: center;
}
html body.path-cart #wrapper .jd-cart-form .number-btn {
  min-width: 44px; min-height: 44px; background: var(--jd-ck-mist);
  border: 1px solid var(--jd-ck-border-strong); color: var(--jd-ck-purple);
}
html body.path-cart #wrapper .jd-cart-form :is(.button--remove, input[id*="remove"]) {
  min-height: 44px !important; margin: 0 !important; padding: 0.65rem 0.75rem !important;
  background: var(--jd-ck-danger-soft) !important; border: 1px solid var(--jd-ck-danger) !important;
  border-radius: 8px !important; box-shadow: none !important; color: var(--jd-ck-danger) !important;
  font-size: 0.88rem !important; font-weight: 600; letter-spacing: 0 !important; text-transform: none !important;
}
html body.path-cart #wrapper .jd-cart-form > [data-drupal-selector="order-total-summary"] {
  padding: 1.1rem !important; background: var(--jd-ck-mist) !important;
  border: 1px solid var(--jd-ck-border) !important; border-radius: var(--jd-ck-radius-sm) !important;
}
html body.path-cart #wrapper .order-total-line,
html body.path-checkout #wrapper .order-total-line {
  display: flex !important; justify-content: space-between; align-items: baseline; gap: 0.75rem;
  margin: 0.45rem 0 !important; color: var(--jd-ck-body) !important; font-size: 0.95rem !important; line-height: 1.45;
}
html body.path-cart #wrapper .order-total-line__total,
html body.path-checkout #wrapper .order-total-line__total {
  margin-top: 0.85rem !important; padding-top: 0.85rem !important; border-top: 1px solid var(--jd-ck-border-strong);
  color: var(--jd-ck-deep) !important; font-size: 1.1rem !important; font-weight: 800;
}
html body.path-cart #wrapper .order-total-line-value,
html body.path-checkout #wrapper .order-total-line-value { white-space: nowrap; }
html body.path-cart #wrapper .jd-cart-form .form-actions {
  display: flex !important; flex-direction: column; gap: 0.65rem; margin: 0 !important;
  padding: 0 !important; background: transparent !important; border: 0 !important;
}
html body.path-cart #wrapper .jd-cart-form .form-actions input[type="submit"] {
  width: 100% !important; min-height: 46px !important; margin: 0 !important; padding: 0.75rem 1rem !important;
  background: var(--jd-ck-surface) !important; border: 1px solid var(--jd-ck-border-strong) !important;
  border-radius: var(--jd-ck-radius-sm) !important; box-shadow: none !important; color: var(--jd-ck-purple) !important;
  font-size: 1rem !important; font-weight: 700 !important; letter-spacing: 0 !important; text-transform: none !important;
}
html body.path-cart #wrapper .jd-cart-form .form-actions input[data-drupal-selector="edit-checkout"] {
  order: -1; background: var(--jd-ck-purple) !important; border-color: var(--jd-ck-purple) !important;
  color: var(--jd-ck-on-accent) !important; -webkit-text-fill-color: var(--jd-ck-on-accent) !important;
}
html body.path-cart #wrapper .jd-cart-continue,
html body.path-checkout #wrapper :is(.link--previous, .jd-checkout__sign-in a) {
  display: inline-flex; align-items: center; justify-content: center; min-height: 44px;
  color: var(--jd-ck-purple) !important; font-weight: 700; text-decoration: underline !important; text-underline-offset: 3px;
}

/* Checkout shell: summary first on mobile, redemption panes after the fields. */
html body.path-checkout #wrapper .jd-checkout {
  box-sizing: border-box !important; width: 100%; max-width: 72rem; min-width: 0;
  margin: 0 auto 1.5rem !important; padding: clamp(0.85rem, 2vw, 1.5rem) !important;
  background: var(--jd-ck-surface) !important; border: 1px solid var(--jd-ck-border) !important;
  border-radius: var(--jd-ck-radius) !important; box-shadow: var(--jd-ck-shadow) !important;
  color: var(--jd-ck-body) !important; font-family: var(--jd-ck-font) !important;
}
html body.path-checkout #wrapper .jd-checkout--simple { max-width: 48rem; }
html body.path-checkout #wrapper :is(.jd-checkout-form, form.commerce-checkout-flow) {
  box-sizing: border-box; display: block; float: none !important;
  width: 100% !important; min-width: 0; max-width: none !important; margin: 0 auto !important;
  padding: 0 !important; background: transparent !important; border: 0 !important; box-shadow: none !important;
}
html body.path-checkout #wrapper .jd-checkout__header {
  display: flex; flex-wrap: wrap; align-items: start; justify-content: space-between;
  gap: 0.5rem 1rem; margin-bottom: 1.2rem;
  padding: 0 !important; background: transparent !important; border: 0 !important; box-shadow: none !important;
}
html body.path-checkout #wrapper .jd-checkout__header > div:first-child { flex: 1 1 16rem; min-width: 0; }
html body.path-checkout #wrapper .jd-checkout__title {
  margin: 0 0 0.4rem !important; padding: 0 !important; background: transparent !important; border: 0 !important;
  color: var(--jd-ck-deep) !important; font-family: var(--jd-ck-display);
  font-size: clamp(1.25rem, 2.2vw, 1.55rem) !important; font-weight: 800 !important; line-height: 1.3;
}
html body.path-checkout #wrapper .jd-checkout__intro { margin: 0 !important; font-size: 0.97rem; }
html body.path-checkout #wrapper .jd-checkout__sign-in {
  flex: 0 1 auto; max-width: 100%; padding: 0 !important;
  background: transparent !important; border: 0 !important; box-shadow: none !important;
}
html body.path-checkout #wrapper .jd-checkout__grid {
  display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.25rem; align-items: start;
}
html body.path-checkout #wrapper :is(.layout-region-checkout-main, .layout-region-checkout-secondary, .layout-region-checkout-footer, .jd-checkout__main, .jd-checkout__extras) {
  float: none !important; box-sizing: border-box; width: 100% !important; min-width: 0; max-width: 100%;
  min-height: 0 !important; margin: 0 !important; padding: 0 !important;
  background: transparent !important; border: 0 !important; box-shadow: none !important;
}
html body.path-checkout #wrapper .jd-checkout-summary {
  margin: 0 0 1rem !important; padding: 0 !important; background: var(--jd-ck-mist) !important;
  border: 1px solid var(--jd-ck-border) !important; border-radius: var(--jd-ck-radius-sm) !important; overflow-wrap: anywhere;
}
html body.path-checkout #wrapper .jd-checkout-summary__toggle {
  display: flex; align-items: center; justify-content: space-between; gap: 0.5rem; min-height: 48px;
  margin: 0 !important; padding: 1rem !important; background: transparent !important;
  color: var(--jd-ck-deep) !important; font-size: 1rem; font-weight: 800; list-style: none; cursor: pointer;
}
html body.path-checkout #wrapper .jd-checkout-summary__toggle::-webkit-details-marker { display: none; }
html body.path-checkout #wrapper .jd-checkout-summary__toggle::after {
  content: ''; flex: 0 0 0.5rem; width: 0.5rem; height: 0.5rem;
  border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg);
}
html body.path-checkout #wrapper .jd-checkout-summary[open] > summary::after { transform: rotate(225deg); }
html body.path-checkout #wrapper .jd-checkout-summary__total { margin-left: auto; white-space: nowrap; }
html body.path-checkout #wrapper .jd-checkout-summary__content { padding: 0 1rem 1rem; }
html body.path-checkout #wrapper .jd-checkout .jd-checkout-summary__content .checkout-pane {
  margin: 0 !important; padding: 0 !important; background: transparent !important;
  border: 0 !important; box-shadow: none !important;
}
html body.path-checkout #wrapper .jd-checkout__extras:empty { display: none; }

/* Progress: every step retains its accessible label on small screens. */
html body.path-checkout #wrapper .jd-checkout-progress {
  margin: 0 0 1.5rem !important; padding: 1rem !important; background: var(--jd-ck-mist) !important;
  border: 1px solid var(--jd-ck-border) !important; border-radius: var(--jd-ck-radius-sm) !important;
}
html body.path-checkout #wrapper .jd-checkout-progress__status { display: none; }
html body.path-checkout #wrapper .jd-checkout-progress__steps {
  display: flex !important; align-items: start; justify-content: space-between; width: 100% !important;
  margin: 0 !important; padding: 0 !important; list-style: none !important;
}
html body.path-checkout #wrapper .jd-checkout-progress__step {
  position: relative; display: flex !important; flex: 1 1 0; flex-direction: column; align-items: center;
  min-width: 0; margin: 0 !important; padding: 0 0.25rem !important;
  color: var(--jd-ck-muted) !important; font-weight: 600; text-align: center;
}
html body.path-checkout #wrapper .checkout-progress--step::before { content: none !important; }
html body.path-checkout #wrapper .jd-checkout-progress__step::after {
  content: ''; position: absolute; top: 1rem; right: 50%; left: -50%; height: 2px; background: var(--jd-ck-border-strong);
}
html body.path-checkout #wrapper .jd-checkout-progress__step:first-child::after { display: none; }
html body.path-checkout #wrapper .jd-checkout-progress__step:is(.is-current, .is-previous)::after { background: var(--jd-ck-purple); }
html body.path-checkout #wrapper .jd-checkout-progress__marker {
  position: relative; z-index: 1; display: flex; align-items: center; justify-content: center;
  width: 2.1rem; height: 2.1rem; margin-bottom: 0.5rem; background: var(--jd-ck-surface);
  border: 2px solid var(--jd-ck-border-strong); border-radius: 50%; color: var(--jd-ck-purple);
  font-size: 0.9rem; font-weight: 800;
}
html body.path-checkout #wrapper .is-current .jd-checkout-progress__marker {
  background: var(--jd-ck-purple); border-color: var(--jd-ck-purple); color: var(--jd-ck-on-accent);
  box-shadow: 0 0 0 4px var(--jd-ck-focus);
}
html body.path-checkout #wrapper .is-previous .jd-checkout-progress__marker { background: var(--jd-ck-lilac); border-color: var(--jd-ck-purple); }
html body.path-checkout #wrapper .jd-checkout-progress__label {
  max-width: 100%; color: inherit; font-size: 0.85rem; line-height: 1.3; overflow-wrap: anywhere;
}
html body.path-checkout #wrapper .jd-checkout-progress__label a {
  display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px;
  color: var(--jd-ck-purple); text-decoration: underline; text-underline-offset: 3px;
}
html body.path-checkout #wrapper .is-current .jd-checkout-progress__label { color: var(--jd-ck-deep); font-weight: 800; }

/* Native panes, fields, checkboxes and radios; payment SDK containers are untouched. */
html body.path-checkout #wrapper .jd-checkout .checkout-pane {
  min-width: 0; margin: 0 0 1.25rem !important; padding: 1.1rem !important; background: var(--jd-ck-surface) !important;
  border: 1px solid var(--jd-ck-border) !important; border-radius: var(--jd-ck-radius-sm) !important; box-shadow: none !important;
}
html body.path-checkout #wrapper .jd-checkout :is(legend, .checkout-pane-title, .fieldset-legend):not(.sr-only):not(.visually-hidden) {
  position: static !important; display: block !important; float: none !important; width: auto !important; max-width: 100%;
  height: auto !important; min-height: 0 !important; margin: 0 0 0.85rem !important; padding: 0 !important;
  background: transparent !important; border: 0 !important; box-shadow: none !important; color: var(--jd-ck-deep) !important;
  -webkit-text-fill-color: var(--jd-ck-deep) !important; font-family: var(--jd-ck-display); font-size: 1.05rem !important;
  font-weight: 800 !important; letter-spacing: 0 !important; line-height: 1.4; text-shadow: none !important; text-transform: none !important;
}
html body.path-checkout #wrapper .jd-checkout :is(fieldset, .form-wrapper, .fieldset-wrapper, .address-container, .address-book) { min-width: 0; max-width: 100%; }
html body.path-checkout #wrapper .jd-checkout legend > .fieldset-legend { margin: 0 !important; }
html body.path-checkout #wrapper .jd-checkout div.form-item {
  box-sizing: border-box; min-width: 0; max-width: 100%; margin: 0 0 1rem !important; padding: 0 !important;
  background: transparent !important; border: 0 !important; box-shadow: none !important;
}
html body.path-checkout #wrapper .jd-checkout :is(.form-item label, .control-label):not(.sr-only):not(.visually-hidden) {
  position: static !important; display: block; float: none !important; width: auto !important; height: auto !important;
  min-height: 0 !important; margin: 0 0 0.4rem !important; padding: 0 !important; background: transparent !important;
  border: 0 !important; box-shadow: none !important; color: var(--jd-ck-body) !important;
  -webkit-text-fill-color: var(--jd-ck-body) !important; font-size: 0.94rem !important; font-weight: 600 !important;
  letter-spacing: 0 !important; line-height: 1.4; text-shadow: none !important; text-transform: none !important;
  text-align: left !important; justify-content: flex-start;
}
html body.path-checkout #wrapper .jd-checkout :is(input[type="text"], input[type="email"], input[type="password"], input[type="tel"], input[type="number"], input[type="search"], input[type="url"], input[type="date"], input[type="time"], textarea, select) {
  box-sizing: border-box; width: 100% !important; max-width: 100% !important; height: auto !important; min-height: 46px !important;
  padding: 0.7rem 0.8rem !important; background: var(--jd-ck-surface) !important; border: 1px solid var(--jd-ck-field-border) !important;
  border-radius: 9px !important; box-shadow: none !important; color: var(--jd-ck-ink) !important;
  font-family: var(--jd-ck-font) !important; font-size: 1rem !important; line-height: 1.35;
}
html body.path-checkout #wrapper .jd-checkout select { padding-right: 2rem !important; }
html body.path-checkout #wrapper .jd-checkout textarea { min-height: 7rem !important; }
html body.path-checkout #wrapper .jd-checkout :is(input[type="radio"], input[type="checkbox"]) {
  display: inline-block; flex: 0 0 1.2rem; width: 1.2rem !important; height: 1.2rem !important; min-height: 0 !important;
  margin: 0 0.5rem 0 0 !important; padding: 0 !important; accent-color: var(--jd-ck-purple);
  box-shadow: none !important; vertical-align: middle;
}
html body.path-checkout #wrapper .jd-checkout :is(.form-type-radio, .form-type-checkbox) label:not(.sr-only):not(.visually-hidden),
html body.path-checkout #wrapper .jd-checkout label.option:not(.sr-only):not(.visually-hidden) {
  display: inline-flex !important; align-items: center; min-height: 44px !important;
  max-width: 100%; margin-bottom: 0 !important; vertical-align: middle;
  font-weight: 500 !important; cursor: pointer;
}
html body.path-checkout #wrapper .jd-checkout :is(.radio, .checkbox) label:has(> input) {
  width: 100% !important; padding-left: 0 !important;
}
html body.path-checkout #wrapper .jd-checkout :is(.radio, .checkbox) label > :is(input[type="radio"], input[type="checkbox"]) {
  position: static !important; float: none !important;
}
html body.path-checkout #wrapper .jd-checkout .address-container-inline {
  display: grid; grid-template-columns: minmax(0, 1fr); gap: 0 1rem; min-width: 0;
}
html body.path-checkout #wrapper .jd-checkout .address-container-inline > div.form-item {
  display: block !important; float: none !important; width: 100% !important; margin-inline: 0 !important;
}
html body.path-checkout #wrapper .jd-checkout :is(.field--widget-address-default, .address-container, .address-book, div[data-drupal-selector$="billing-information"]) {
  box-sizing: border-box; width: 100%; padding: 0 !important;
  background: transparent !important; border: 0 !important; box-shadow: none !important;
}
html body.path-checkout #wrapper .jd-checkout .form-radios > .form-item {
  min-height: 44px; padding: 0.9rem !important; background: transparent !important;
  border: 1px solid var(--jd-ck-border) !important; border-radius: 10px !important;
}
html body.path-checkout #wrapper .jd-checkout .form-radios > .form-item:has(input:checked) { border-color: var(--jd-ck-purple) !important; }
html body.path-checkout #wrapper .fieldset-wrapper .form-item { background: transparent !important; }
html body.path-checkout #wrapper .jd-checkout :is(.description, .details-description) {
  margin: 0.4rem 0 0; color: var(--jd-ck-muted); font-size: 0.88rem; line-height: 1.45;
}
html body.path-checkout #wrapper .jd-checkout :is(input.error, select.error, textarea.error, [aria-invalid="true"]) { border-color: var(--jd-ck-danger) !important; }
html body.path-checkout #wrapper .jd-checkout .form-item--error-message { margin-top: 0.5rem; color: var(--jd-ck-danger); font-size: 0.9rem; line-height: 1.5; }
html body.path-checkout #wrapper .jd-checkout :is(input, select, textarea):disabled { opacity: 0.65; cursor: not-allowed; }

/* Do not set display on submit controls: SDK-hidden actions must stay hidden. */
html body.path-checkout #wrapper .jd-checkout :is(.button, input[type="submit"]) {
  box-sizing: border-box; min-height: 46px !important; max-width: 100% !important; margin: 0 !important; padding: 0.75rem 1.15rem !important;
  background: var(--jd-ck-purple) !important; border: 1px solid var(--jd-ck-purple) !important;
  border-radius: var(--jd-ck-radius-sm) !important; box-shadow: none !important;
  color: var(--jd-ck-on-accent) !important; -webkit-text-fill-color: var(--jd-ck-on-accent) !important;
  font-family: var(--jd-ck-font) !important; font-size: 1rem !important; font-weight: 700 !important;
  letter-spacing: 0 !important; line-height: 1.3; text-transform: none !important; white-space: normal;
}
html body.path-checkout #wrapper .jd-checkout :is(.button, input[type="submit"]):hover,
html body.path-cart #wrapper .jd-cart-form .form-actions input[data-drupal-selector="edit-checkout"]:hover {
  background: var(--jd-ck-deep) !important; border-color: var(--jd-ck-deep) !important; transform: none !important;
}
html body.path-checkout #wrapper .jd-checkout :is(.address-book-edit-button, input[name="billing_edit"], input[name="shipping_edit"], input[name^="remove_coupon"], input[name^="remove_giftcard"]) {
  background: var(--jd-ck-surface) !important; border-color: var(--jd-ck-border-strong) !important;
  color: var(--jd-ck-purple) !important; -webkit-text-fill-color: var(--jd-ck-purple) !important;
}
html body.path-checkout #wrapper .jd-checkout__actions,
html body.path-checkout #wrapper .jd-checkout__actions .form-actions {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 0.75rem;
  margin: 1rem 0 0 !important; padding: 0 !important; background: transparent !important; border: 0 !important; box-shadow: none !important;
}
html body.path-checkout #wrapper .jd-checkout__actions .form-actions { width: 100%; margin: 0 !important; }
html body.path-checkout #wrapper .jd-checkout__actions:empty { display: none; }
html body.path-checkout #wrapper .jd-checkout [hidden] { display: none !important; }
html body.path-checkout #wrapper .jd-checkout iframe { max-width: 100%; }

/* Guest/login, review and redemption controls preserve their native markup. */
html body.path-checkout #wrapper .jd-checkout :is(.form-wrapper__returning-customer, .form-wrapper__guest-checkout, .form-wrapper__login-option) {
  box-sizing: border-box; float: none !important; width: 100% !important; margin: 0 0 1rem !important; padding: 1.1rem !important;
  background: var(--jd-ck-mist) !important; border: 1px solid var(--jd-ck-border) !important; border-radius: var(--jd-ck-radius-sm) !important;
}
html body.path-checkout #wrapper .jd-checkout .checkout-review {
  width: 100% !important; margin: 0 !important; background: var(--jd-ck-surface) !important; border: 1px solid var(--jd-ck-border) !important;
}
html body.path-checkout #wrapper .jd-checkout .checkout-review :is(th, td) {
  padding: 0.8rem !important; border-color: var(--jd-ck-border) !important;
  color: var(--jd-ck-body) !important; vertical-align: top; overflow-wrap: anywhere;
}
html body.path-checkout #wrapper .jd-checkout .checkout-review-edit-link { color: var(--jd-ck-purple) !important; font-weight: 700; }
html body.path-checkout #wrapper .jd-checkout .checkout-review-edit-link a {
  display: inline-flex; align-items: center; justify-content: center; min-width: 44px;
  min-height: 44px; color: var(--jd-ck-purple) !important;
}
html body.path-checkout #wrapper .jd-checkout :is(.coupon-redemption-form, .commerce-coupon-redemption-form, .giftcard-redemption-form, .commerce-giftcard-redemption-form) {
  display: flex; flex-wrap: wrap; align-items: end; gap: 0.65rem;
}
html body.path-checkout #wrapper .jd-checkout :is(.coupon-redemption-form, .commerce-coupon-redemption-form, .giftcard-redemption-form, .commerce-giftcard-redemption-form) > .form-item { flex: 1 1 10rem; margin: 0 !important; }
html body.path-checkout #wrapper .jd-checkout :is(.coupon-redemption-form__coupons, .giftcard-redemption-form__giftcards) { width: 100%; min-width: 0; overflow-wrap: anywhere; }
html body.path-checkout #wrapper .jd-checkout :is(.coupon-redemption-form__coupons, .giftcard-redemption-form__giftcards) :is(table, td) { background: transparent !important; border: 0 !important; }

/* Compact semantic line items; never reshape gift card/coupon tables. */
html body.path-checkout #wrapper .jd-order-summary__items { margin: 0 0 1rem !important; padding: 0 !important; list-style: none !important; }
html body.path-checkout #wrapper .jd-order-summary__item { display: flex; align-items: start; gap: 0.65rem; margin: 0 !important; padding: 0.8rem 0 !important; border-bottom: 1px solid var(--jd-ck-border); }
html body.path-checkout #wrapper .jd-order-summary__image { flex: 0 0 3rem; width: 3rem; height: 3rem; overflow: hidden; background: var(--jd-ck-surface); border: 1px solid var(--jd-ck-border); border-radius: 8px; }
html body.path-checkout #wrapper .jd-order-summary__image .field-item:not(:first-child) { display: none !important; }
html body.path-checkout #wrapper :is(.jd-order-summary__body, .jd-order-summary__title) { flex: 1 1 auto; min-width: 0; overflow-wrap: anywhere; }
html body.path-checkout #wrapper .jd-order-summary__title { color: var(--jd-ck-ink); font-weight: 600; font-size: 0.95rem; line-height: 1.35; }
html body.path-checkout #wrapper .jd-order-summary__meta { margin-top: 0.3rem; color: var(--jd-ck-muted); font-size: 0.85rem; }
html body.path-checkout #wrapper :is(.jd-order-summary__price, .jd-order-summary__qty) { flex: 0 0 auto; color: var(--jd-ck-deep); font-weight: 700; font-size: 0.9rem; white-space: nowrap; }

/* Completion presents Commerce's real order and gateway message. */
html body.path-checkout #wrapper .jd-checkout-complete { max-width: 38rem; margin: 0 auto; padding: 1.5rem 0.25rem; text-align: center; }
html body.path-checkout #wrapper .jd-checkout-complete__icon { display: flex; align-items: center; justify-content: center; width: 4.5rem; height: 4.5rem; margin: 0 auto 1.25rem; background: var(--jd-ck-lilac); border: 1px solid var(--jd-ck-border); border-radius: 50%; color: var(--jd-ck-purple); }
html body.path-checkout #wrapper .jd-checkout-complete__message { color: var(--jd-ck-body); font-size: 1.05rem; line-height: 1.65; overflow-wrap: anywhere; }
html body.path-checkout #wrapper .jd-checkout-complete__cta { margin-top: 1.25rem; }
html body.path-checkout #wrapper .jd-checkout-complete__instructions { margin-top: 1.25rem; padding: 1rem; background: var(--jd-ck-mist); border: 1px solid var(--jd-ck-border); border-radius: var(--jd-ck-radius-sm); text-align: left; }

@media (min-width: 960px) {
  html body.path-cart #wrapper #page-wrapper > .container,
  html body.path-checkout #wrapper #page-wrapper > .container { padding-inline: 20px !important; }
  html body.path-checkout #wrapper .jd-checkout .address-container-inline { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  html body.path-cart #wrapper .jd-cart-form { grid-template-columns: minmax(0, 1fr) 20rem; column-gap: 1.5rem; }
  html body.path-cart #wrapper .jd-cart-form > table { grid-column: 1; grid-row: 1 / span 5; }
  html body.path-cart #wrapper .jd-cart-form > [data-drupal-selector="order-total-summary"] { grid-column: 2; grid-row: 1; }
  html body.path-cart #wrapper .jd-cart-form > .form-actions { grid-column: 2; grid-row: 2; }
  html body.path-cart #wrapper .jd-cart-form > .jd-cart-continue { grid-column: 2; grid-row: 3; }
  html body.path-checkout #wrapper .jd-checkout__grid { grid-template-columns: minmax(0, 1fr) 20rem; grid-template-rows: min-content 1fr; column-gap: 1.5rem; }
  html body.path-checkout #wrapper .layout-region-checkout-main { grid-column: 1; grid-row: 1 / span 2; }
  html body.path-checkout #wrapper .layout-region-checkout-secondary { grid-column: 2; grid-row: 1; }
  html body.path-checkout #wrapper .jd-checkout__extras { grid-column: 2; grid-row: 2; align-self: start; }
  html body.path-checkout #wrapper .jd-checkout-summary__toggle { cursor: default; }
  html body.path-checkout #wrapper .jd-checkout-summary__toggle::after { display: none; }
  html body.path-checkout #wrapper .jd-checkout__main .checkout-pane-login > .fieldset-wrapper { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
}
@media (max-width: 959px) {
  html body.path-checkout #wrapper .layout-region-checkout-secondary { grid-row: 1; }
  html body.path-checkout #wrapper .layout-region-checkout-main { grid-row: 2; }
  html body.path-checkout #wrapper .jd-checkout__extras { grid-row: 3; }
}
@media (max-width: 767px) {
  html body.path-checkout #wrapper .jd-checkout {
    padding: 0 !important; background: transparent !important; border: 0 !important; box-shadow: none !important;
  }
  html body.path-cart #wrapper .jd-cart-form thead { position: absolute !important; width: 1px !important; height: 1px !important; overflow: hidden !important; clip-path: inset(50%); }
  html body.path-cart #wrapper .jd-cart-form :is(table, tbody, tbody tr) { display: block !important; width: 100% !important; }
  html body.path-cart #wrapper .jd-cart-form tbody tr { margin: 0 0 0.85rem !important; padding: 0.85rem !important; background: var(--jd-ck-surface) !important; border: 1px solid var(--jd-ck-border) !important; border-radius: var(--jd-ck-radius-sm); }
  html body.path-cart #wrapper .jd-cart-form tbody td { display: flex !important; align-items: center; justify-content: space-between; gap: 0.75rem; width: 100% !important; padding: 0.5rem 0 !important; border: 0 !important; border-radius: 0 !important; }
  html body.path-cart #wrapper .jd-cart-form td.views-field-purchased-entity { display: block !important; padding: 0 0 0.6rem !important; }
  html body.path-cart #wrapper .jd-cart-form td.views-field-unit-price__number::before { content: 'Price'; }
  html body.path-cart #wrapper .jd-cart-form td.views-field-edit-quantity::before { content: 'Quantity'; }
  html body.path-cart #wrapper .jd-cart-form td.views-field-total-price__number::before { content: 'Total'; }
  html body.path-cart #wrapper .jd-cart-form td::before { color: var(--jd-ck-muted); font-size: 0.9rem; font-weight: 600; }
  html body.path-cart #wrapper .jd-cart-form td.views-field-remove-button { justify-content: flex-end; }
  html body.path-checkout #wrapper .jd-checkout-progress { padding: 0.85rem !important; }
  html body.path-checkout #wrapper .jd-checkout-progress__status { display: flex; justify-content: space-between; gap: 0.5rem; margin: 0 0 0.75rem !important; font-size: 0.85rem; font-weight: 700; }
  html body.path-checkout #wrapper .jd-checkout-progress__current { color: var(--jd-ck-deep); }
  html body.path-checkout #wrapper .jd-checkout-progress__label { font-size: 0.75rem; }
  html body.path-checkout #wrapper .jd-checkout .checkout-pane { padding: 0.9rem !important; }
  html body.path-checkout #wrapper .jd-checkout__actions .form-actions { flex-direction: column-reverse; align-items: stretch; }
  html body.path-checkout #wrapper .jd-checkout__actions :is(.button, input[type="submit"], .link--previous) { width: 100% !important; text-align: center; }
  html body.path-checkout #wrapper .jd-checkout .checkout-review :is(table, tbody, tr, th, td) { display: block; width: 100% !important; }
  html body.path-checkout #wrapper .jd-checkout .checkout-review th { padding-bottom: 0 !important; }
  html body.path-cart #wrapper .jd-cart-empty__actions > a { width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  html body.path-cart #wrapper :is(.jd-cart-form, .jd-cart-empty) *,
  html body.path-checkout #wrapper .jd-checkout * { scroll-behavior: auto !important; transition: none !important; animation: none !important; }
}

/* assets/css/home-city-carousel-fix.css */
/**
 * Homepage and service-city hero carousel corrections.
 *
 * The legacy carousel made the overlay a nested Y-axis scrollport on mobile.
 * Keep page scrolling native while leaving Owl's horizontal gesture intact.
 */

html body:is(.path-frontpage, .page-service-city) #wrapper .slide-block .slide-carousel-hero,
html body:is(.path-frontpage, .page-service-city) #wrapper .slide-block .slide-image {
  background: #1a0a24 !important;
}

html body:is(.path-frontpage, .page-service-city) #wrapper .slide-block .slide-image :is(picture, img) {
  height: 100% !important;
  max-height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
  width: 100% !important;
}

/* Keep the checkmark inset after legacy city-card padding overrides. */
html body:is(.path-frontpage, .page-service-city) #wrapper .slide-block .seo-benefits li {
  padding-left: 4.25rem !important;
}

html body:is(.path-frontpage, .page-service-city) #wrapper .slide-block .seo-benefits li::before {
  left: 0.85rem !important;
}

@media (max-width: 767.98px) {
  html body.path-frontpage #wrapper #content-wide-top .block.slide-block .slide-content,
  html body.page-service-city #wrapper #content-wide-top .block.slide-block .slide-content {
    height: auto !important;
    max-height: none !important;
    min-height: 0 !important;
    overflow: visible !important;
    overflow-y: visible !important;
    overscroll-behavior: auto !important;
    touch-action: pan-y pinch-zoom !important;
  }

  html body:is(.path-frontpage, .page-service-city) #wrapper .slide-block .slide-carousel,
  html body:is(.path-frontpage, .page-service-city) #wrapper .slide-block .owl-stage-outer,
  html body:is(.path-frontpage, .page-service-city) #wrapper .slide-block .owl-stage,
  html body:is(.path-frontpage, .page-service-city) #wrapper .slide-block .owl-item {
    max-height: none !important;
    overscroll-behavior-y: auto !important;
    touch-action: pan-y pinch-zoom !important;
  }

  /*
   * `overflow-x: hidden` computes the other axis to `auto`, turning the whole
   * carousel into a one-pixel Y scrollport. That consumes the first mobile
   * drag before the document can scroll. Clip horizontal stage bleed without
   * creating a scrolling box so vertical gestures go straight to the page.
   */
  html body:is(.path-frontpage, .page-service-city.path-taxonomy) #wrapper .slide-block .slide-carousel {
    overflow-x: clip !important;
    overflow-y: visible !important;
  }

  html body:is(.path-frontpage, .page-service-city) #wrapper .slide-block :is(.node--type-slide, .slide-additional-content, .slide-additional-content__inner) {
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    overscroll-behavior-y: auto !important;
    touch-action: pan-y pinch-zoom !important;
  }

  html body:is(.path-frontpage, .page-service-city) #wrapper .slide-block .slide-additional-content {
    touch-action: pan-y pinch-zoom !important;
  }

  html body:is(.path-frontpage, .page-service-city) #wrapper .slide-block .slide-carousel-hero {
    aspect-ratio: 1536 / 819 !important;
    height: auto !important;
    min-height: 0 !important;
    padding-bottom: 0 !important;
  }

  html body:is(.path-frontpage, .page-service-city) #wrapper .slide-block .slide-content-wrap {
    overflow: hidden !important;
    background: linear-gradient(90deg, rgba(26, 10, 36, 0.88), rgba(59, 10, 92, 0.58), rgba(26, 10, 36, 0.32)) !important;
  }

  html body:is(.path-frontpage, .page-service-city) #wrapper .slide-block .slide-content {
    height: auto !important;
    max-height: none !important;
    min-height: 0 !important;
    overflow: visible !important;
    overscroll-behavior: auto !important;
    scrollbar-width: none !important;
    touch-action: pan-y pinch-zoom !important;
    pointer-events: none !important;
  }

  html body:is(.path-frontpage, .page-service-city) #wrapper .slide-block .slide-content :is(a, button, input, select, textarea, [role='button']) {
    pointer-events: auto !important;
  }

  html body:is(.path-frontpage, .page-service-city) #wrapper .slide-block .slide-content::-webkit-scrollbar {
    display: none !important;
  }

  html body:is(.path-frontpage, .page-service-city) #wrapper .slide-block .slide-content-main {
    margin-block: auto !important;
    max-width: min(92vw, 38rem) !important;
    gap: 0.2rem !important;
    padding: 0.35rem 0.75rem !important;
  }

  html body:is(.path-frontpage, .page-service-city) #wrapper .slide-block :is(.slide-h1, .heading-text) {
    font-size: clamp(0.95rem, 4.5vw, 1.35rem) !important;
    line-height: 1.12 !important;
    overflow-wrap: anywhere !important;
    text-shadow: 0 2px 5px rgba(0, 0, 0, 0.95) !important;
  }

  html body:is(.path-frontpage, .page-service-city) #wrapper .slide-block .slide-content-body {
    font-size: clamp(0.68rem, 2.8vw, 0.82rem) !important;
    line-height: 1.28 !important;
    margin-inline: auto !important;
    max-width: 34rem !important;
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.95) !important;
  }

  html body:is(.path-frontpage, .page-service-city) #wrapper .slide-block .slide-button {
    margin-top: 0.3rem !important;
  }

  html body:is(.path-frontpage, .page-service-city) #wrapper .slide-block .slide-button-link {
    font-size: 0.7rem !important;
    line-height: 1.2 !important;
    padding: 0.38rem 0.7rem !important;
    white-space: normal !important;
  }

  /* TRAVEL / ESCAPE: 2rem on mobile */
  html body:is(.path-frontpage, .page-service-city) #wrapper .slide-block .owl-item.active .field-field-pre-heading-text .field-item:nth-child(2),
  html body:is(.path-frontpage, .page-service-city) #wrapper .slide-block .owl-item.active .field-field-pre-heading-text .field-items > div:nth-child(2),
  html body:is(.path-frontpage, .page-service-city) #wrapper .slide-block .owl-item.active .pre-heading-text .animate__jello {
    animation: none !important;
    bottom: auto !important;
    font-size: 2rem !important;
    font-weight: 800 !important;
    left: 0 !important;
    letter-spacing: 0.14em !important;
    line-height: 1.2 !important;
    margin: 0 auto !important;
    opacity: 0.35 !important;
    position: absolute !important;
    right: 0 !important;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.9) !important;
    top: 0.75rem !important;
    transform: none !important;
    -webkit-text-stroke: 0 !important;
    width: max-content !important;
  }

  /* Owl clones do not always retain the field-name class. */
  html body.path-frontpage #wrapper #content-wide-top .block.slide-block .owl-item .pre-heading-text .field-items > .field-item:nth-child(2),
  html body.path-frontpage #wrapper #content-wide-top .block.slide-block .owl-item .pre-heading-text .field-items > div:nth-child(2),
  html body.page-service-city #wrapper #content-wide-top .block.slide-block .owl-item .pre-heading-text .field-items > .field-item:nth-child(2),
  html body.page-service-city #wrapper #content-wide-top .block.slide-block .owl-item .pre-heading-text .field-items > div:nth-child(2),
  html body #wrapper .slide-carousel .pre-heading-text--carousel .field-item:nth-child(2),
  html body #wrapper .slide-carousel .pre-heading-text--carousel .field-items > div:nth-child(2),
  html body #wrapper .slide-carousel .pre-heading-text .field-item:nth-child(2),
  html body #wrapper .slide-carousel .pre-heading-text .field-items > div:nth-child(2) {
    animation: none !important;
    bottom: auto !important;
    font-size: 2rem !important;
    font-weight: 800 !important;
    left: 0 !important;
    letter-spacing: 0.14em !important;
    line-height: 1.2 !important;
    margin: 0 auto !important;
    opacity: 0.35 !important;
    position: absolute !important;
    right: 0 !important;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.9) !important;
    top: 0.75rem !important;
    transform: none !important;
    -webkit-text-stroke: 0 !important;
    width: max-content !important;
  }

  /* Let the page own vertical gestures while Owl handles horizontal swipes. */
  html body:is(.path-frontpage, .page-service-city.path-taxonomy) #wrapper .slide-block .slide-carousel.martis-mobile-axis-gate,
  html body:is(.path-frontpage, .page-service-city.path-taxonomy) #wrapper .slide-block .slide-carousel.martis-mobile-axis-gate * {
    -ms-touch-action: pan-y !important;
    touch-action: pan-y pinch-zoom !important;
  }

  html body:is(.path-frontpage, .page-service-city.path-taxonomy) #wrapper .slide-block .slide-carousel.martis-mobile-axis-gate img {
    -webkit-user-drag: none;
    user-select: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  html body:is(.path-frontpage, .page-service-city) #wrapper .slide-block .field-field-pre-heading-text .field-item:nth-child(2) {
    animation: none !important;
  }
}

/* assets/css/city-taxonomy-mobile.css */
/**
 * City taxonomy mobile parity: constrain long headings and match homepage nav.
 */

@media (max-width: 767.98px) {
  html body.path-taxonomy.page-service-city #wrapper :is(.block-page-title-block, [id*='frontpagetitle'], [id*='pagetitle'], .row.layout.layout--onecol) h1,
  html body.path-taxonomy.page-service-city #wrapper h1.commerce-content-h1 {
    box-sizing: border-box !important;
    display: block !important;
    font-size: clamp(1.35rem, 7vw, 2rem) !important;
    line-height: 1.15 !important;
    margin: 0 auto 0.75rem 0.5rem !important;
    max-width: calc(100vw - 2rem) !important;
    overflow-wrap: anywhere !important;
    padding: 0.7rem 0.85rem !important;
    text-align: center !important;
    width: calc(100vw - 2rem) !important;
  }

  /* Match the homepage H1's 16px viewport gutters without changing city type. */
  html body.path-taxonomy.page-service-city #wrapper #content-wide-top :is([id*='frontpagetitle'], [id*='pagetitle']) h1 {
    margin-left: 0.5rem !important;
    margin-right: auto !important;
    max-width: calc(100vw - 2rem) !important;
    width: calc(100vw - 2rem) !important;
  }

  html body.path-taxonomy.page-service-city #wrapper .header #main-menu.show,
  html body.path-taxonomy.page-service-city #wrapper .header #main-menu.collapse.show {
    background: #3b0a5c !important;
    box-sizing: border-box !important;
    display: block !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    max-width: 100vw !important;
    min-width: 100vw !important;
    padding: 0.5rem 0.75rem 0.85rem !important;
    width: 100vw !important;
  }

  html body.path-taxonomy.page-service-city #wrapper .header #main-menu.show ul.menu.menu-parent,
  html body.path-taxonomy.page-service-city #wrapper .header #main-menu.collapse.show ul.menu.menu-parent {
    display: list-item !important;
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
  }

  html body.path-taxonomy.page-service-city #wrapper .header #main-menu.show li.menu-item,
  html body.path-taxonomy.page-service-city #wrapper .header #main-menu.collapse.show li.menu-item {
    display: block !important;
    margin: 0 0 0.4rem !important;
    padding: 0 !important;
    width: 100% !important;
  }

  html body.path-taxonomy.page-service-city #wrapper .header #main-menu.show li.menu-item > a,
  html body.path-taxonomy.page-service-city #wrapper .header #main-menu.collapse.show li.menu-item > a {
    align-items: center !important;
    background: #b781e3 !important;
    border: 2px solid #000 !important;
    border-radius: 10px !important;
    box-sizing: border-box !important;
    color: #fff !important;
    display: flex !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    justify-content: center !important;
    line-height: 1.35 !important;
    min-height: 0 !important;
    padding: 0.65rem 1rem !important;
    text-align: center !important;
    width: 100% !important;
  }
}

/* assets/css/martis-nav-accent-jd.css */
/**
 * Johnny Detail — menu accent vars ONLY.
 * Sources (live CSS, Sep 2026):
 *   --jd-nav-deep / mid / bright / hot (slide late)
 *   --jd-purple-primary #6716aa, --jd-hub-leaf #b781e3
 *   active-trail pill #c9a0e8 (--jd-forum-mid)
 *   mobile panel deep #3b0a5c; desktop bar uses brand family
 * NEVER green.
 */
:root,
html {
  --menu-deep: #3b0a5c;       /* nav panel / forest equivalent */
  --menu-brand: #6716aa;      /* primary JD purple */
  --menu-mid: #6716aa;        /* desktop bar fill */
  --menu-leaf: #b781e3;       /* default mobile pill / soft leaf */
  --menu-hover: #c9a0e8;      /* CYB-intensity hover (lighter than leaf, darker than active) */
  --menu-active: #d8b4fe;     /* active-trail pill — lightest step (clearer vs hover) */
  --menu-soft: #f3e8ff;       /* lilac wash */
  --menu-ink: #1a0a24;        /* --jd-nav-ink */
  --menu-on-accent: #ffffff;
  --menu-border: #000000;
  --menu-focus: #8d3bd1;      /* --jd-nav-bright */
  --menu-duration: 200ms;
  --menu-radius: 10px;
}

/* assets/css/martis-nav-system.css */
/**
 * Martis unified nav system — from nav-unify pack.
 * !important on item-level interaction props only.
 * BOUNCE: do NOT set background on .navbar / .nav-menu / .primary-menu bar chrome.
 */
/**
 * Martis unified main-nav interaction system (structure only).
 * Load AFTER Martis core / site chrome. Accent files set the vars.
 *
 * Scope: main + city menu blocks. Does NOT restyle account menu.
 * Eng: prefer replacing duplicate late !important piles with this file once.
 */

/* -------------------------------------------------------------------------- */
/* Token defaults (overridden by TARGET-JD.css / TARGET-CYB.css)               */
/* -------------------------------------------------------------------------- */
:root {
  --menu-deep: #111111;
  --menu-brand: #555555;
  --menu-mid: #666666;
  --menu-leaf: #888888;
  --menu-hover: #999999;
  --menu-active: #aaaaaa;
  --menu-soft: #f5f5f5;
  --menu-ink: #111111;
  --menu-on-accent: #ffffff;
  --menu-border: #000000;
  --menu-focus: var(--menu-brand);
  --menu-duration: 200ms;
  --menu-ease: ease;
  --menu-radius: 10px;
  --menu-pad-y: 0.65rem;
  --menu-pad-x: 1rem;
  --menu-gap: 0.4rem;
  --menu-underline: 2px;
  --menu-min-tap: 44px;
}

/* City + main menu roots (single selector family — do not fork per city color) */
:is(
  .header #main-menu,
  .header #block-martis-main-menu,
  .header [id^="block-martis-menu"],
  .header #block-martis-houston-menu,
  .header #block-martis-jerseyvillagemenu,
  .header #block-martis-spring-menu,
  .header #block-martis-tomball-menu,
  .header #block-martis-menukaty,
  .header #block-martis-menu-cypress,
  .header .mega-menu,
  .header .primary-menu
) {
  /* local alias so nested rules stay short */
  --_accent: var(--menu-brand);
}

/* -------------------------------------------------------------------------- */
/* Desktop bar                                                                */
/* -------------------------------------------------------------------------- */
@media (min-width: 768px) {
  /* Bar/chrome background intentionally untouched (Row 16 bounce). */

  .header #main-menu ul.menu.menu-parent,
  .header #main-menu ul.nav.menu.menu-parent,
  .header #block-martis-main-menu ul.nav.menu.menu-parent,
  .header [id^="block-martis-menu"] ul.nav.menu.menu-parent,
  .header .mega-menu > ul.menu.menu-parent {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0;
    margin: 0;
    padding: 0;
    list-style: none;
  }

  .header #main-menu .menu-item,
  .header #block-martis-main-menu .menu-item,
  .header [id^="block-martis-menu"] .menu-item,
  .header .mega-menu > ul > li.menu-item {
    flex: 0 1 auto;
    width: auto;
    margin: 0;
    padding: 0;
    list-style: none;
    background: transparent;
  }

  .header #main-menu .menu-item > a,
  .header #block-martis-main-menu .menu-item > a,
  .header [id^="block-martis-menu"] .menu-item > a,
  .header .mega-menu > ul > li > a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: var(--menu-min-tap);
    padding: var(--menu-pad-y) var(--menu-pad-x);
    color: var(--menu-on-accent) !important;
    background: transparent;
    border: 0 solid transparent;
    border-radius: var(--menu-radius);
    text-decoration: none;
    white-space: nowrap;
    box-shadow: inset 0 0 0 0 transparent;
    transition:
      color var(--menu-duration) var(--menu-ease),
      background-color var(--menu-duration) var(--menu-ease),
      box-shadow var(--menu-duration) var(--menu-ease),
      border-color var(--menu-duration) var(--menu-ease),
      opacity var(--menu-duration) var(--menu-ease);
  }

  /* Hover — soft leaf wash + underline (NOT the active pill) */
  .header #main-menu .menu-item > a:hover,
  .header #block-martis-main-menu .menu-item > a:hover,
  .header [id^="block-martis-menu"] .menu-item > a:hover,
  .header .mega-menu > ul > li > a:hover {
    color: var(--menu-on-accent) !important;
    background-color: var(--menu-hover) !important;
    box-shadow: inset 0 calc(-1 * var(--menu-underline)) 0 0 var(--menu-on-accent) !important;
  }

  /* Active trail — distinct from hover: solid active tint + stronger underline */
  .header #main-menu .menu-item--active-trail > a,
  .header #main-menu .menu-item--active-trail > a:hover,
  .header #main-menu a.is-active,
  .header #block-martis-main-menu .menu-item--active-trail > a,
  .header #block-martis-main-menu a.is-active,
  .header [id^="block-martis-menu"] .menu-item--active-trail > a,
  .header .mega-menu > ul > li.menu-item--active-trail > a {
    color: var(--menu-on-accent) !important;
    background-color: var(--menu-active) !important;
    font-weight: 700 !important;
    box-shadow: inset 0 calc(-1 * var(--menu-underline)) 0 0 var(--menu-on-accent) !important;
  }

  /* Focus-visible — ring, never rely on hover alone */
  .header #main-menu .menu-item > a:focus-visible,
  .header #block-martis-main-menu .menu-item > a:focus-visible,
  .header [id^="block-martis-menu"] .menu-item > a:focus-visible,
  .header .mega-menu > ul > li > a:focus-visible {
    outline: 3px solid var(--menu-focus);
    outline-offset: 2px;
  }
}

/* -------------------------------------------------------------------------- */
/* Mobile drawer (.show)                                                      */
/* -------------------------------------------------------------------------- */
@media (max-width: 767.98px) {
  #main-menu.collapse.show,
  #main-menu.show,
  .header #main-menu.collapse.show,
  .header #main-menu.show,
  #main-menu.navbar-collapse.collapse.show {
    display: block !important;
    /* Panel/chrome background left to pre-Row-16 chrome (bounce). */
    color: var(--menu-on-accent) !important;
    padding: 0.5rem 0.75rem 0.85rem;
  }

  #main-menu.show .menu-item,
  #main-menu.collapse.show .menu-item,
  #block-martis-main-menu .menu-item,
  .header [id^="block-martis-menu"] .menu-item {
    width: 100%;
    margin: 0 0 var(--menu-gap);
    padding: 0;
    list-style: none;
    background: transparent;
    border-bottom: 0;
  }

  #main-menu.show .menu-item > a,
  #main-menu.show a,
  #block-martis-main-menu .menu-item > a,
  .header [id^="block-martis-menu"] .menu-item > a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: var(--menu-min-tap);
    padding: 0.75rem 1rem;
    color: var(--menu-on-accent) !important;
    background: var(--menu-leaf) !important;
    background-color: var(--menu-leaf) !important;
    border: 2px solid var(--menu-border);
    border-radius: var(--menu-radius);
    text-decoration: none;
    text-align: center;
    transition:
      background-color var(--menu-duration) var(--menu-ease),
      color var(--menu-duration) var(--menu-ease),
      border-color var(--menu-duration) var(--menu-ease);
  }

  /* Mobile: no hover-only affordance — use :active + focus-visible + aria-expanded */
  #main-menu.show .menu-item > a:active,
  #block-martis-main-menu .menu-item > a:active {
    background-color: var(--menu-hover) !important;
  }

  #main-menu.show .menu-item--active-trail > a,
  #main-menu.show a.is-active,
  #block-martis-main-menu .menu-item--active-trail > a,
  #block-martis-main-menu a.is-active {
    background: var(--menu-active) !important;
    background-color: var(--menu-active) !important;
    color: var(--menu-on-accent) !important;
    font-weight: 700 !important;
  }

  #main-menu.show .menu-item > a:focus-visible,
  #block-martis-main-menu .menu-item > a:focus-visible {
    outline: 3px solid var(--menu-focus);
    outline-offset: 2px;
  }

  /* Parent open state via Bootstrap aria-expanded on toggler — keep visible */
  .navbar-toggler.nav-button[aria-expanded="true"] {
    outline: 2px solid var(--menu-focus);
    outline-offset: 2px;
  }
}

/* -------------------------------------------------------------------------- */
/* Reduced motion                                                             */
/* -------------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  .header #main-menu .menu-item > a,
  .header #block-martis-main-menu .menu-item > a,
  .header [id^="block-martis-menu"] .menu-item > a,
  .header .mega-menu > ul > li > a,
  #main-menu.show .menu-item > a {
    transition: none !important;
  }
}

/* assets/css/martis-nav-conflicts-kill.css */
/** Account menu excluded by selector scope in martis-nav-system.css. */

/* assets/css/martis-nav-item-match-jd.css */
/**
 * JD menu-item typography + hover/active/focus match CYB structure (purple only).
 * Thinner look: antialiased + etched text-shadow (CYB uses green shadow; JD uses purple).
 * Ladder: #b781e3 → #c9a0e8 → #d8b4fe
 * No navbar chrome background.
 */
@media (min-width: 768px) {
  html body:not(.path-admin) #wrapper .header #main-menu li.menu-item:not(.menu-item--active-trail) > a,
  html body:not(.path-admin) #wrapper .header #block-martis-main-menu li.menu-item:not(.menu-item--active-trail) > a,
  html body:not(.path-admin) #wrapper .header [id^="block-martis-menu"] li.menu-item:not(.menu-item--active-trail) > a,
  html body:not(.path-admin) #wrapper .header .mega-menu > ul > li:not(.menu-item--active-trail) > a {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    font-family: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif !important;
    font-size: 0.95rem !important;
    font-weight: 600 !important;
    font-synthesis: weight style small-caps !important;
    -webkit-font-smoothing: auto !important;
    -moz-osx-font-smoothing: auto !important;
    letter-spacing: normal !important;
    text-transform: none !important;
    line-height: 1.25 !important;
    /* Exact CYB etched-shadow structure; purple tint instead of green */
    text-shadow: #6716aa -1.1px -1.1px 0, #000 0 0 0, #000 0 0 0, #000 0 0 0 !important;
    background: #b781e3 !important;
    background-color: #b781e3 !important;
  }

  html body:not(.path-admin) #wrapper .header #main-menu li.menu-item > a:hover,
  html body:not(.path-admin) #wrapper .header #main-menu li.menu-item > a:focus,
  html body:not(.path-admin) #wrapper .header #main-menu li.menu-item > a:focus-visible,
  html body:not(.path-admin) #wrapper .header #block-martis-main-menu li.menu-item > a:hover,
  html body:not(.path-admin) #wrapper .header #block-martis-main-menu li.menu-item > a:focus,
  html body:not(.path-admin) #wrapper .header #block-martis-main-menu li.menu-item > a:focus-visible,
  html body:not(.path-admin) #wrapper .header [id^="block-martis-menu"] li.menu-item > a:hover,
  html body:not(.path-admin) #wrapper .header [id^="block-martis-menu"] li.menu-item > a:focus,
  html body:not(.path-admin) #wrapper .header [id^="block-martis-menu"] li.menu-item > a:focus-visible,
  html body:not(.path-admin) #wrapper .header .mega-menu > ul > li > a:hover,
  html body:not(.path-admin) #wrapper .header .mega-menu > ul > li > a:focus {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    font-weight: 600 !important;
    background: #c9a0e8 !important;
    background-color: #c9a0e8 !important;
  }

  html body:not(.path-admin) #wrapper .header #main-menu li.menu-item--active-trail > a,
  html body:not(.path-admin) #wrapper .header #main-menu li.menu-item--active-trail > a:hover,
  html body:not(.path-admin) #wrapper .header #main-menu li.menu-item--active-trail > a:focus,
  html body:not(.path-admin) #wrapper .header #main-menu a.is-active,
  html body:not(.path-admin) #wrapper .header #block-martis-main-menu li.menu-item--active-trail > a,
  html body:not(.path-admin) #wrapper .header [id^="block-martis-menu"] li.menu-item--active-trail > a,
  html body:not(.path-admin) #wrapper .header .mega-menu > ul > li.menu-item--active-trail > a {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    font-weight: 700 !important;
    text-shadow: #6716aa -1.1px -1.1px 0, #000 0 0 0, #000 0 0 0, #000 0 0 0 !important;
    background: #d8b4fe !important;
    background-color: #d8b4fe !important;
  }
}

@media (max-width: 767.98px) {
  html body:not(.path-admin) #wrapper #main-menu.show li.menu-item:not(.menu-item--active-trail) > a,
  html body:not(.path-admin) #wrapper #main-menu.collapse.show li.menu-item:not(.menu-item--active-trail) > a,
  html body:not(.path-admin) #wrapper #block-martis-main-menu li.menu-item:not(.menu-item--active-trail) > a,
  html body:not(.path-admin) #wrapper .header [id^="block-martis-menu"] li.menu-item:not(.menu-item--active-trail) > a {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    font-family: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif !important;
    font-size: 0.95rem !important;
    font-weight: 600 !important;
    font-synthesis: weight style small-caps !important;
    -webkit-font-smoothing: auto !important;
    -moz-osx-font-smoothing: auto !important;
    letter-spacing: normal !important;
    text-transform: none !important;
    line-height: 1.25 !important;
    text-shadow: #6716aa -1.1px -1.1px 0, #000 0 0 0, #000 0 0 0, #000 0 0 0 !important;
    background: #b781e3 !important;
    background-color: #b781e3 !important;
  }

  html body:not(.path-admin) #wrapper #main-menu.show li.menu-item > a:hover,
  html body:not(.path-admin) #wrapper #main-menu.show li.menu-item > a:focus,
  html body:not(.path-admin) #wrapper #main-menu.show li.menu-item > a:focus-visible,
  html body:not(.path-admin) #wrapper #main-menu.show li.menu-item > a:active,
  html body:not(.path-admin) #wrapper #main-menu.collapse.show li.menu-item > a:hover,
  html body:not(.path-admin) #wrapper #main-menu.collapse.show li.menu-item > a:focus,
  html body:not(.path-admin) #wrapper #main-menu.collapse.show li.menu-item > a:active {
    color: #ffffff !important;
    font-weight: 600 !important;
    background: #c9a0e8 !important;
    background-color: #c9a0e8 !important;
  }

  html body:not(.path-admin) #wrapper .header #main-menu.show li.menu-item.menu-item--active-trail > a,
  html body:not(.path-admin) #wrapper .header #main-menu.show li.menu-item.menu-item--active-trail > a:hover,
  html body:not(.path-admin) #wrapper .header #main-menu.show li.menu-item.menu-item--active-trail > a:focus,
  html body:not(.path-admin) #wrapper .header #main-menu.show li.menu-item.menu-item--active-trail > a:focus-visible,
  html body:not(.path-admin) #wrapper .header #main-menu.collapse.show li.menu-item.menu-item--active-trail > a,
  html body:not(.path-admin) #wrapper .header #main-menu.show a.is-active,
  html body:not(.path-admin) #wrapper .header #block-martis-main-menu li.menu-item.menu-item--active-trail > a,
  html body:not(.path-admin) #wrapper .header [id^="block-martis-menu"] li.menu-item.menu-item--active-trail > a {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    font-weight: 700 !important;
    background: #d8b4fe !important;
    background-color: #d8b4fe !important;
  }
}

/* header-divider-style-v1
   Desktop only. Right-align the location copy against the existing
   divider (end of the left half). Do not set flex-direction.
   Do not change border width, border color, or bar color. */
@media (min-width: 1001px) {
  html body .header .header-info .header-info-location,
  html body .header .header-info .header-info-item--location {
    justify-content: flex-end !important;
    text-align: right !important;
  }

  html body .header .header-info .header-info-location .header-info-desc,
  html body .header .header-info .header-info-item--location .header-info-desc,
  html body .header .header-info .header-info-location .header-info-label,
  html body .header .header-info .header-info-location .header-info-city,
  html body .header .header-info .header-info-location .header-info-areas,
  html body .header .header-info .header-info-item--location .header-info-label,
  html body .header .header-info .header-info-item--location .header-info-city,
  html body .header .header-info .header-info-item--location .header-info-areas {
    text-align: right !important;
    margin-left: auto !important;
    margin-right: 0 !important;
    width: auto !important;
    max-width: 100% !important;
  }
}

/* header-divider-center-v1
   Desktop only. Location text stays right-aligned on the existing pad.
   The hours block was centered in a column whose width follows the
   address, so the gap after the divider changed by page. Pin that block
   to the start of the hours cell. Do not change border width, border
   color, or margin-right. */
@media (min-width: 1001px) {
  html body .header .header-info .header-info-hours,
  html body .header .header-info .header-info-item--hours,
  html body.path-taxonomy .header .header-info .header-info-hours,
  html body.path-taxonomy .header .header-info .header-info-item--hours,
  html body.page-node-type-service .header .header-info .header-info-hours,
  html body.page-node-type-service .header .header-info .header-info-item--hours {
    align-items: flex-start !important;
    justify-content: flex-start !important;
  }

  html body .header .header-info .header-info-hours .header-info-desc,
  html body .header .header-info .header-info-item--hours .header-info-desc,
  html body.path-taxonomy .header .header-info .header-info-hours .header-info-desc,
  html body.path-taxonomy .header .header-info .header-info-item--hours .header-info-desc,
  html body.page-node-type-service .header .header-info .header-info-hours .header-info-desc,
  html body.page-node-type-service .header .header-info .header-info-item--hours .header-info-desc {
    align-self: flex-start !important;
    margin-left: 0 !important;
    margin-right: auto !important;
  }
}