/* Smokers Paradise London - responsive & accessibility UX layer
   Added 2026-08-14. Remove by disabling wp-content/novamira-sandbox/spl-ux.php */

/* ---------------------------------------------------------------
   1. Minimum 44px tap targets (WCAG 2.5.5 / Apple + Google guidance)
   --------------------------------------------------------------- */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce ul.products li.product .button,
.woocommerce #respond input#submit,
.single_add_to_cart_button,
.wc-block-components-button {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1.2;
}

/* Header utility links (Cart / Login) were 23px tall */
.elementor-location-header .elementor-icon-list-item > a {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
}

/* Astra on-image quick buttons were 28x27 */
.ast-on-card-button,
.astra-shop-thumbnail-wrap .ast-on-card-button {
  min-width: 44px;
  min-height: 44px;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
}

/* Pagination and sorting controls */
.woocommerce-pagination a.page-numbers,
.woocommerce-pagination span.page-numbers {
  min-width: 44px;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.woocommerce-ordering select,
.woocommerce .quantity input.qty {
  min-height: 44px;
}

/* ---------------------------------------------------------------
   2. Legible text floor - 41 nodes were rendering below 12px
   --------------------------------------------------------------- */
.woocommerce .price,
.woocommerce-loop-product__title,
.elementor-location-header .elementor-icon-list-text,
.woocommerce-result-count,
.product_meta,
.woocommerce-breadcrumb {
  font-size: max(0.8125rem, 1em);
}
.woocommerce ul.products li.product .woocommerce-loop-product__title {
  line-height: 1.35;
}

/* ---------------------------------------------------------------
   3. Product grid - was 1 column on mobile, cramped 171px at tablet
   --------------------------------------------------------------- */
@media (max-width: 767px) {
  .woocommerce ul.products.elementor-grid,
  .woocommerce ul.products {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 24px 12px !important;
  }
  .woocommerce ul.products li.product .woocommerce-loop-product__title {
    font-size: 0.95rem !important;
  }
  .woocommerce ul.products li.product .button {
    width: 100%;
    padding-left: 8px;
    padding-right: 8px;
    font-size: 0.85rem;
  }
}

/* Very narrow phones keep a single column so cards stay usable */
@media (max-width: 359px) {
  .woocommerce ul.products.elementor-grid,
  .woocommerce ul.products {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

/* ---------------------------------------------------------------
   4. Tablet - stop the shop sidebar squeezing products into 171px.
      Scoped to sections that actually contain the product grid.
   --------------------------------------------------------------- */
@media (max-width: 1024px) {
  .elementor-section:has(.elementor-widget-woocommerce-products)
    > .elementor-container
    > .elementor-top-column {
    width: 100% !important;
  }
  .woocommerce ul.products.elementor-grid,
  .woocommerce ul.products {
    gap: 32px 20px;
  }
}

/* ---------------------------------------------------------------
   5. Collapsible filter panel below desktop (toggle added by spl-ux.js)
   --------------------------------------------------------------- */
.spl-filter-toggle {
  display: none;
  width: 100%;
  min-height: 44px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 16px;
  margin: 0 0 12px;
  font: inherit;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  background: #f4f2ee;
  color: #222;
  border: 1px solid #d8d3c9;
  border-radius: 2px;
  cursor: pointer;
}
.spl-filter-toggle::after {
  content: "+";
  font-size: 1.25em;
  line-height: 1;
}
.spl-filter-toggle[aria-expanded="true"]::after { content: "\2212"; }
.spl-filter-toggle:focus-visible { outline: 2px solid #2e5241; outline-offset: 2px; }

@media (max-width: 1024px) {
  .spl-filter-toggle { display: flex; }
  .spl-filters-collapsed { display: none !important; }
}

/* ---------------------------------------------------------------
   6. Sticky add-to-cart on mobile product pages
   --------------------------------------------------------------- */
.spl-sticky-atc {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 9990;
  display: none;
  align-items: center;
  gap: 12px;
  padding: 10px 14px calc(10px + env(safe-area-inset-bottom));
  background: #fff;
  border-top: 1px solid #ddd8ce;
  box-shadow: 0 -4px 18px rgba(0, 0, 0, 0.12);
}
.spl-sticky-atc__info { flex: 1 1 auto; min-width: 0; }
.spl-sticky-atc__name {
  display: block;
  font-size: 0.8125rem;
  line-height: 1.25;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  color: #444;
}
.spl-sticky-atc__price { display: block; font-weight: 700; font-size: 0.95rem; }
.spl-sticky-atc__btn {
  flex: 0 0 auto;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 20px;
  border: 0;
  border-radius: 2px;
  background: #222;
  color: #fff;
  font-weight: 600;
  cursor: pointer;
}
@media (max-width: 767px) {
  body.single-product .spl-sticky-atc { display: flex; }
  body.single-product { padding-bottom: 72px; }
}

/* ---------------------------------------------------------------
   7. Checkout and cart on small screens
   --------------------------------------------------------------- */
@media (max-width: 767px) {
  .woocommerce form .form-row-first,
  .woocommerce form .form-row-last,
  .woocommerce-page form .form-row-first,
  .woocommerce-page form .form-row-last {
    width: 100%;
    float: none;
    margin-right: 0;
  }
  .woocommerce form .form-row input.input-text,
  .woocommerce form .form-row select,
  .woocommerce form .form-row textarea {
    min-height: 44px;
    font-size: 16px; /* stops iOS zooming the viewport on focus */
  }
  .woocommerce table.shop_table_responsive tr td { text-align: right; }
  .woocommerce .cart-collaterals .cart_totals { width: 100%; float: none; }
}

/* ---------------------------------------------------------------
   8. Focus visibility for keyboard users
   --------------------------------------------------------------- */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 2px solid #2e5241;
  outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
  .spl-sticky-atc { transition: none !important; }
}

/* ===================================================================
   9. Sticky header (desktop / tablet / mobile)

   body has overflow-x:hidden, which makes position:sticky unreliable,
   so the header is switched to position:fixed once you scroll past it
   and a spacer holds its place. spl-ux.js adds .spl-stuck to <html>.
   =================================================================== */
.spl-header-spacer { display: none; }
html.spl-stuck .spl-header-spacer { display: block; }

html.spl-stuck .elementor-location-header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 9995;
  background: #fff;
  box-shadow: 0 2px 14px rgba(0, 0, 0, 0.14);
}
html.spl-stuck.spl-adminbar .elementor-location-header { top: 32px; }

/* Contact strip folds away once stuck, on desktop and tablet. */
@media (min-width: 768px) {
  html.spl-stuck .elementor-location-header .elementor-element-bedf77d { display: none; }
}

/* Compress the logo row and nav row so the stuck bar stays shallow. */
html.spl-stuck .elementor-location-header .elementor-element-f53bf2d,
html.spl-stuck .elementor-location-header .elementor-element-f53bf2d > .elementor-container,
html.spl-stuck .elementor-location-header .elementor-element-3fb4d75,
html.spl-stuck .elementor-location-header .elementor-element-3fb4d75 > .elementor-container {
  padding-top: 4px !important;
  padding-bottom: 4px !important;
  min-height: 0 !important;
}
html.spl-stuck .elementor-location-header .elementor-element-f53bf2d .elementor-widget-image img {
  max-height: 46px;
  width: auto;
  transition: max-height 0.18s ease;
}

/* Mobile: keep a tap-to-call button in the stuck bar, drop email + address. */
@media (max-width: 767px) {
  html.spl-stuck .elementor-location-header .elementor-element-a5223bb,
  html.spl-stuck .elementor-location-header .elementor-element-dfc4826 {
    display: none;
  }
  html.spl-stuck .elementor-location-header .elementor-element-bedf77d,
  html.spl-stuck .elementor-location-header .elementor-element-bedf77d > .elementor-container {
    padding-top: 2px !important;
    padding-bottom: 2px !important;
  }
  html.spl-stuck .elementor-location-header .elementor-element-f53bf2d .elementor-widget-image img {
    max-height: 38px;
  }
}

@media (prefers-reduced-motion: reduce) {
  html.spl-stuck .elementor-location-header .elementor-widget-image img { transition: none; }
}

/* ===================================================================
   10. Tap-to-call button
   =================================================================== */
.elementor-element-0e5d24b a[href^="tel:"] {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
}

@media (max-width: 767px) {
  .elementor-element-0e5d24b a[href^="tel:"] {
    justify-content: center;
    width: 100%;
    min-height: 44px;
    padding: 8px 16px;
    border: 1px solid currentColor;
    border-radius: 3px;
    font-weight: 700;
    letter-spacing: 0.02em;
    text-decoration: none;
  }
  .elementor-element-0e5d24b a[href^="tel:"]::before {
    content: "\260E";
    font-size: 1.05em;
    line-height: 1;
  }
}

/* ===================================================================
   11. Out-of-stock products in listings
   =================================================================== */
.woocommerce ul.products li.product.outofstock .astra-shop-thumbnail-wrap,
.woocommerce ul.products li.product.outofstock .woocommerce-loop-product__link {
  position: relative;
  display: block;
}
.woocommerce ul.products li.product.outofstock .astra-shop-thumbnail-wrap::after {
  content: "Out of stock";
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: 3;
  padding: 5px 10px;
  background: rgba(28, 35, 32, 0.86);
  color: #fff;
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.woocommerce ul.products li.product.outofstock img {
  opacity: 0.62;
  filter: saturate(0.55);
}
.woocommerce ul.products li.product.outofstock:hover img { opacity: 0.78; }

/* ===================================================================
   12. Back-in-stock notify form
   =================================================================== */
.spl-notify {
  margin: 18px 0 0;
  padding: 16px 18px 18px;
  background: #f4f2ee;
  border: 1px solid #ddd8ce;
  border-left: 3px solid #2e5241;
  border-radius: 2px;
}
.spl-notify__lead {
  margin: 0 0 12px;
  font-size: 0.9rem;
  line-height: 1.5;
  color: #333;
}
.spl-notify__form {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 10px;
  align-items: start;
}
.spl-notify__email {
  min-height: 44px;
  width: 100%;
  padding: 10px 12px;
  font-size: 16px;
  border: 1px solid #c9c3b7;
  border-radius: 2px;
  background: #fff;
}
.spl-notify__btn {
  min-height: 44px;
  padding: 0 20px;
  border: 0;
  border-radius: 2px;
  background: #2e5241;
  color: #fff;
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
}
.spl-notify__btn:hover { background: #24412f; }
.spl-notify__btn[disabled] { opacity: 0.6; cursor: default; }
.spl-notify__consent {
  grid-column: 1 / -1;
  display: flex;
  gap: 9px;
  align-items: flex-start;
  font-size: 0.8125rem;
  line-height: 1.45;
  color: #555;
}
.spl-notify__consent input {
  margin-top: 2px;
  width: 18px;
  height: 18px;
  flex: 0 0 auto;
}
.spl-notify__msg {
  grid-column: 1 / -1;
  margin: 0;
  font-size: 0.85rem;
  min-height: 1.2em;
}
.spl-notify__msg.is-error { color: #9c2f26; }
.spl-notify__msg.is-ok { color: #2e5241; font-weight: 600; }

@media (max-width: 480px) {
  .spl-notify__form { grid-template-columns: 1fr; }
  .spl-notify__btn { width: 100%; }
}

/* Sentinel that tells the observer when the header has scrolled past. */
.spl-header-sentinel {
  height: 1px;
  margin: 0;
  padding: 0;
  pointer-events: none;
}

/* ===================================================================
   13. Compact sticky header on small screens

   Elementor stacks each header section's columns to full width below
   its mobile breakpoint, which turned the stuck header into three
   tall rows (306px on a 375px phone). When stuck, lay the columns
   back out in a single row and drop what is not needed while
   scrolling: the email address, the postal address and the search box.
   Logo, basket, menu and the call button all stay reachable.
   =================================================================== */
@media (max-width: 767px) {
  html.spl-stuck .elementor-location-header .elementor-top-section > .elementor-container {
    flex-wrap: nowrap !important;
    align-items: center;
    gap: 8px;
  }
  html.spl-stuck .elementor-location-header .elementor-top-section > .elementor-container > .elementor-column {
    width: auto !important;
    flex: 0 1 auto !important;
  }
  html.spl-stuck .elementor-location-header .elementor-widget-wrap {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  /* Contact strip keeps only the call button. */
  html.spl-stuck .elementor-location-header .elementor-element-bedf77d
    > .elementor-container
    > .elementor-column:not(:has(a[href^="tel:"])) {
    display: none !important;
  }
  html.spl-stuck .elementor-location-header .elementor-element-bedf77d
    > .elementor-container
    > .elementor-column:has(a[href^="tel:"]) {
    flex: 1 1 auto !important;
  }

  /* Search is reachable from the page itself while scrolling. */
  html.spl-stuck .elementor-location-header .elementor-element-2e8373f { display: none !important; }

  /* Logo row: logo left, basket and account right. */
  html.spl-stuck .elementor-location-header .elementor-element-f53bf2d
    > .elementor-container
    > .elementor-column:first-child {
    display: none !important;
  }
  html.spl-stuck .elementor-location-header .elementor-element-f53bf2d .elementor-widget-image { text-align: left; }
  html.spl-stuck .elementor-location-header .elementor-element-d8b4173 .elementor-icon-list-items {
    display: flex;
    gap: 14px;
    justify-content: flex-end;
    margin: 0;
  }

  /* Menu toggle sits at the end of the nav row. */
  html.spl-stuck .elementor-location-header .elementor-element-3fb4d75
    > .elementor-container
    > .elementor-column:empty {
    display: none !important;
  }
}

/* Desktop and tablet: trim the nav and logo rows while stuck. The height
   there comes from the menu items' own padding, not section padding. */
@media (min-width: 768px) {
  html.spl-stuck .elementor-location-header .elementor-element-f53bf2d .elementor-widget-wrap,
  html.spl-stuck .elementor-location-header .elementor-element-3fb4d75 .elementor-widget-wrap {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
  html.spl-stuck .elementor-location-header .elementor-element-3fb4d75 .elementor-nav-menu .elementor-item {
    padding-top: 12px !important;
    padding-bottom: 12px !important;
  }
  html.spl-stuck .elementor-location-header .elementor-element-3fb4d75 .elementor-widget-aws input[type="search"],
  html.spl-stuck .elementor-location-header .elementor-element-3fb4d75 .aws-container input {
    min-height: 40px;
  }
}

/* Hamburger deserves the same 44px target as everything else.
   Deliberately does NOT set display: Elementor hides this toggle above the
   mobile breakpoint, and forcing a display value made it appear on desktop. */
.elementor-menu-toggle {
  min-width: 44px;
  min-height: 44px;
}

/* The stuck header lays header columns out in a single row on mobile; make
   sure that can never clip or stack under the mobile menu dropdown. */
html.spl-stuck .elementor-location-header .elementor-top-section > .elementor-container,
html.spl-stuck .elementor-location-header .elementor-widget-wrap,
html.spl-stuck .elementor-location-header .elementor-widget-nav-menu {
  overflow: visible !important;
}
html.spl-stuck .elementor-location-header .elementor-nav-menu--dropdown {
  z-index: 9996;
}

/* ===================================================================
   14. Product cards - 3D lift and layered shadow

   Applies wherever WooCommerce renders a product grid: shop, category,
   tag, search, related products, upsells and the Elementor Products
   widget all share ul.products > li.product.

   Hover effects are gated behind (hover: hover) so touch devices get a
   press state instead of a stuck hover, and everything collapses under
   prefers-reduced-motion.
   =================================================================== */
.woocommerce ul.products {
  perspective: 1400px;
}

/* The theme already paints a resting glow on cards, so this deliberately
   does not set a resting box-shadow - it only owns the hover state. */
.woocommerce ul.products li.product {
  position: relative;
  border-radius: 4px;
  background-clip: padding-box;
  transition:
    transform 0.34s cubic-bezier(0.22, 0.61, 0.36, 1),
    box-shadow 0.34s cubic-bezier(0.22, 0.61, 0.36, 1);
  transform: translate3d(0, 0, 0);
}

/* Keep the image inside the rounded corner so the lift reads cleanly. */
.woocommerce ul.products li.product .astra-shop-thumbnail-wrap {
  overflow: hidden;
  border-radius: 3px;
}
.woocommerce ul.products li.product .astra-shop-thumbnail-wrap img {
  transition: transform 0.5s cubic-bezier(0.22, 0.61, 0.36, 1);
}

/* Tidy the grid: mixed source image sizes made rows ragged. */
.woocommerce ul.products li.product .astra-shop-thumbnail-wrap img,
.woocommerce ul.products li.product > a img {
  aspect-ratio: 1 / 1;
  object-fit: contain;
  width: 100%;
  height: auto;
}

/* .spl-force-hover mirrors :hover so the effect can be verified without a
   real pointer; nothing in the site ever adds that class at runtime. */
@media (hover: hover) and (pointer: fine) {
  body .woocommerce ul.products li.product:hover,
  body .woocommerce ul.products li.product:focus-within,
  body .woocommerce ul.products li.product.spl-force-hover {
    z-index: 3;
    transform: translate3d(0, -9px, 30px) rotateX(2deg) !important;
    box-shadow:
      0 2px 4px rgba(28, 35, 32, 0.06),
      0 9px 18px rgba(28, 35, 32, 0.10),
      0 26px 46px -14px rgba(28, 35, 32, 0.30) !important;
  }

  body .woocommerce ul.products li.product:hover .astra-shop-thumbnail-wrap img,
  body .woocommerce ul.products li.product.spl-force-hover .astra-shop-thumbnail-wrap img {
    transform: scale(1.05);
  }

  /* Out-of-stock cards lift too, but stay visually muted. */
  body .woocommerce ul.products li.product.outofstock:hover .astra-shop-thumbnail-wrap img {
    transform: scale(1.03);
  }
}

/* Touch: a short press response instead of a hover that sticks. */
@media (hover: none) {
  .woocommerce ul.products li.product:active {
    transform: scale(0.985);
    transition: transform 0.12s ease;
  }
}

/* Keyboard users get the same affordance as mouse users. */
.woocommerce ul.products li.product:focus-within {
  outline: 2px solid #2e5241;
  outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
  .woocommerce ul.products li.product,
  .woocommerce ul.products li.product .astra-shop-thumbnail-wrap img {
    transition: none !important;
  }
  .woocommerce ul.products li.product:hover,
  .woocommerce ul.products li.product:focus-within {
    transform: none !important;
    box-shadow: 0 6px 20px rgba(28, 35, 32, 0.22);
  }
  .woocommerce ul.products li.product:hover .astra-shop-thumbnail-wrap img {
    transform: none !important;
  }
}

/* ===================================================================
   15. Add-to-basket confirmation toast
   =================================================================== */
.spl-toast {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 9994;
  display: flex;
  align-items: center;
  gap: 12px;
  max-width: min(360px, calc(100vw - 36px));
  padding: 13px 16px;
  background: #1c2320;
  color: #fff;
  border-radius: 3px;
  box-shadow: 0 12px 32px -8px rgba(0, 0, 0, 0.45);
  font-size: 0.9rem;
  line-height: 1.35;
  opacity: 0;
  transform: translateY(14px);
  transition: opacity 0.25s ease, transform 0.25s ease;
}
.spl-toast.is-visible {
  opacity: 1;
  transform: translateY(0);
}
.spl-toast__text { flex: 1 1 auto; min-width: 0; }
.spl-toast__link {
  flex: 0 0 auto;
  color: #fff;
  font-weight: 700;
  text-decoration: underline;
  white-space: nowrap;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
}
.spl-toast__link:hover, .spl-toast__link:focus { color: #fff; }

/* Keep clear of the sticky add-to-cart bar on mobile product pages. */
@media (max-width: 767px) {
  .spl-toast { left: 12px; right: 12px; bottom: 12px; max-width: none; }
  body.single-product .spl-toast { bottom: 84px; }
}

@media (prefers-reduced-motion: reduce) {
  .spl-toast { transition: none; }
}

/* ===================================================================
   16. Footer

   The footer now carries the full product menu from the header, laid
   out flat in four columns so nothing is hidden behind a dropdown.
   Elementor stacks the columns below its tablet breakpoint.
   =================================================================== */
.elementor-location-footer {
  border-top: 1px solid rgba(255, 255, 255, 0.14);
}

.elementor-location-footer .elementor-widget-heading .elementor-heading-title {
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.13em;
  text-transform: uppercase;
  margin: 0 0 0.7rem;
}
.elementor-location-footer .elementor-widget-heading:not(:first-child) {
  margin-top: 1.6rem;
}

ul.spl-foot-list {
  list-style: none;
  margin: 0 0 0.4rem;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 1px;
}
ul.spl-foot-list li { margin: 0; }
ul.spl-foot-list a {
  display: block;
  padding: 7px 0;
  min-height: 30px;
  font-size: 0.9rem;
  line-height: 1.3;
  text-decoration: none;
  opacity: 0.86;
  transition: opacity 0.15s ease, transform 0.15s ease;
}
ul.spl-foot-list a:hover,
ul.spl-foot-list a:focus-visible {
  opacity: 1;
  transform: translateX(3px);
  text-decoration: underline;
}

.spl-foot-intro {
  font-size: 0.88rem;
  line-height: 1.55;
  opacity: 0.85;
  margin: 0 0 1rem;
  max-width: 34ch;
}
.spl-foot-contact {
  font-size: 0.9rem;
  line-height: 1.6;
  margin: 0 0 0.9rem;
}
.spl-foot-contact a {
  text-decoration: none;
  border-bottom: 1px solid rgba(255, 255, 255, 0.28);
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 4px 0;
}
.spl-foot-contact a:hover { border-bottom-color: currentColor; }

.spl-foot-age {
  font-size: 0.76rem;
  line-height: 1.5;
  letter-spacing: 0.02em;
  opacity: 0.7;
  margin: 1rem 0 0;
  padding-top: 0.8rem;
  border-top: 1px solid rgba(255, 255, 255, 0.14);
  max-width: 34ch;
}

.spl-foot-legal {
  font-size: 0.8rem;
  margin: 0;
  opacity: 0.75;
}
.spl-foot-legal a {
  text-decoration: none;
  border-bottom: 1px solid transparent;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  padding: 4px 0;
}
.spl-foot-legal a:hover, .spl-foot-legal a:focus-visible { border-bottom-color: currentColor; }
.spl-foot-legal--right { text-align: right; }

/* Tablet and below: columns stack, so give links room to be tapped. */
@media (max-width: 1024px) {
  ul.spl-foot-list a { padding: 10px 0; min-height: 40px; }
}
@media (max-width: 767px) {
  ul.spl-foot-list a,
  .spl-foot-contact a,
  .spl-foot-legal a {
    min-height: 44px;
    display: flex;
    align-items: center;
  }
  ul.spl-foot-list a:hover { transform: none; }
  .spl-foot-legal--right { text-align: left; }
  .spl-foot-intro, .spl-foot-age { max-width: none; }
  .elementor-location-footer .elementor-widget-heading:not(:first-child) { margin-top: 1.9rem; }
}

@media (prefers-reduced-motion: reduce) {
  ul.spl-foot-list a { transition: none; }
  ul.spl-foot-list a:hover { transform: none; }
}

/* Footer column behaviour. Elementor keeps the four columns side by side
   at tablet, which left them 188px wide and pushed long labels such as
   "MG Cigars Smokers Paradise" past the viewport edge. */
.elementor-location-footer ul.spl-foot-list a,
.elementor-location-footer .spl-foot-contact,
.elementor-location-footer .spl-foot-legal {
  overflow-wrap: anywhere;
  word-break: normal;
}

@media (max-width: 1024px) {
  .elementor-location-footer .elementor-element-splfoot1
    > .elementor-container
    > .elementor-top-column {
    width: 50% !important;
  }
}

@media (max-width: 767px) {
  .elementor-location-footer .elementor-element-splfoot1
    > .elementor-container
    > .elementor-top-column,
  .elementor-location-footer .elementor-element-splfoot2
    > .elementor-container
    > .elementor-top-column {
    width: 100% !important;
  }
}

/* Belt and braces: the footer must never be the source of a sideways scroll. */
.elementor-location-footer,
.elementor-location-footer .elementor-container {
  max-width: 100%;
}