/** Shopify CDN: Minification failed

Line 2272:0 Unexpected "`"
Line 2274:73 Unterminated string token

**/
/* Place any CSS overrides in this file. */

:root {
  --oat: #e2ded2;
  --blue: #01273e;
  --olive: #645d3b;
  --white: #ffffff;
  --grey: #f1f1f1;
}

/* === NAVIGATION TYPOGRAPHY ===================================== */
 .site-nav__link,
 .menu-link a,
 .header__menu-item,
 .mega-menu-wrapper .mega-menu--links a,  /* real dropdown links only */
 .mobile-nav__link{
   font-family: var(--font-body);
   font-weight: 500;
 }

/* === ABCO TYPE SYSTEM ===================================== */
:root{
  --font-heading: "Larken", serif;
  --label-font-stack: "Aktiv Grotesk Text", "Aktiv Grotesk", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  --font-body:    "Aktiv Grotesk Text", "Helvetica Neue", Arial, sans-serif;
}

/* === ABCO Font Corrections – Global Cleanup === */

/* Global fix for headings that may still be using PT Mono */
h1, h2, h3, h4, h5, h6,
.template-title, .page__title, .cart__drawer__heading,
.drawer__heading, .drawer__title, .mobile-nav__link,
.customer__title, .account__title {
  font-family: var(--font-heading, "Larken", serif) !important;
  font-weight: 400;
}

/* Top-level mobile nav links - Larken */
.mobile-nav__item.top-level > .mobile-nav__link {
  font-family: var(--font-heading) !important;
  font-weight: 600; /* optional: adjust based on desired visual */
  text-transform: none; /* optional: remove all caps if not desired */
}

.mobile-nav__item:not(.top-level) > .mobile-nav__link {
  font-family: var(--font-body) !important;
}

/* Cart drawer heading override */
.cart__drawer__heading,
.global-drawer h1, 
.global-drawer h2, 
.global-drawer h3 {
  font-family: var(--font-heading, "Larken", serif) !important;
  font-weight: 400 !important;
}

/* Map Flow's stacks to your brand stacks */
:root{
  --heading-font-stack: var(--font-heading);
  --body-font-stack:    var(--font-body);
}

header .mega-menu-link--title{
  color: var(--blue) !important;
  font-weight:bold !important;
  position: relative;
  letter-spacing: 1px !important;
}

header .mega-menu-link--title a{
    position: relative;
}

header .mega-menu-link--title a::after{
  content: "";
    position: absolute;
    top: 150%;
    left: 0;
    width: 100%;
    z-index: 100;
    background: var(--blue);
}

header .menu-link a{
  text-transform:capitalize !important;
}

.mega-menu--links{
      grid-template-columns: repeat(4, 1fr) !important;
}

header .mega-menu-wrapper .mega-menu--promos > div{
  width:unset !important;
}

header .mega-menu-promo-subtitle{
  font-weight:bold !important;
}

.nav-link-animated--custom .animated-link--item, .product__meta--vendor.nav-link-animated a, .register-link--wrapper a{
  background:none !important;
}

.wrapper-spacing--h {
  max-width: 1400px;
  margin: 0 auto;
  width: 100%;
}

.site-header.wrapper-spacing--h, .mega-menu-block.wrapper-spacing--h {
  max-width: unset;
  margin: 0;
}

.mega-menu-wrapper .mega-menu--promos{
  justify-content:flex-end;
}
/* Sticky Header Fix - Add at the end of the file */

/* Footer Styles */
.footer-main {
  position: relative;
  color: var(--oat);
  padding-top: 60px;
  padding-bottom: 0;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  width: 100%;
  display: block;
}

/* Rich Text */
.richtext-block em {
  font-family: var(--font-heading) !important;
  font-size: 20px;
  font-weight: 700;
  line-height:1;
}

.richtext-block p {
  font-family: var(--font-body) !important;
  padding-bottom: 20px;
}

.collection-info .template-title {
  font-family: var(--font-heading) !important;
  font-size: 24px;
  font-weight: 700;
}

.product-grid--title a {
  font-family: var(--font-heading) !important;
  color: var(--blue) !important;
  font-weight: bold;
}

/* Ensure the background image gets proper z-index handling */
.site-footer {
  position: relative;
  z-index: 1;
}

/* Distinct containers for main and bottom sections */
.footer-main-container {
  padding-bottom: 40px;
  width: 100%;
}

.footer-main--inner,
.footer-bottom-wrapper,
.footer-divider,
.social-links-row {
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
}

@media screen and (max-width: 1200px) {
  .footer-main--inner,
  .footer-bottom-wrapper,
  .footer-divider,
  .social-links-row {
    padding: 0 20px;
  }
}

/* Footer bottom section as a separate container */
.footer-bottom-container {
  position: relative;
  width: 100%;
  padding-bottom: 40px;
}

.h3.footer-header {
  font-size: 16px;
  text-transform: uppercase;
  font-weight: 700;
  margin-bottom: 10px;
  color: var(--white);
  width: fit-content;
  letter-spacing: 1px;
}

.newsletter-footer .h3.footer-header {
  font-family: var(--font-heading) !important;
}
.newsletter-footer .h3.footer-header:after {
  display: none;
}

.h3.footer-header::after {
  content: "";
  display: block;
  width: 100%;
  height: 2px;
  background-color: var(--white);
}

.footer-content li {
  margin-bottom: 10px;
}

.footer-content a {
  color: var(--white);
  text-decoration: none;
  font-size: 14px;
}

/* Custom styling for the rich text company/help section */
.content-footer .rte p {
  margin-bottom: 10px !important;
  color: #e2ded2;
}

.content-footer .rte p a {
  color: #e2ded2;
  text-decoration: none;
  font-size: 14px;
}

.content-footer .rte p strong {
  font-size: 16px;
  text-transform: uppercase;
  font-weight: 500;
  display: block;
  margin-bottom: 15px;
}

.content-footer .rte p:empty {
  margin-bottom: 15px !important;
}

/* Newsletter section styling */
.newsletter-footer--wrapper .input-group {
  display: flex;
  margin-top: 15px;
}

.newsletter-footer--wrapper input[type="email"] {
  border: 1px solid var(--white);
  background-color: transparent;
  color: inherit;
  padding: 10px 15px;
  min-width: 250px;
  height: 44px;
}

.newsletter-footer--wrapper input[type="email"]::placeholder {
  color: rgba(255, 255, 255, 0.7);
}

.newsletter-footer--wrapper .btn {
  background-color: #01273E;
  color: var(--white);
  border: 0.5px solid var(--white);
  text-transform: uppercase;
  padding: 10px 20px;
  letter-spacing: 1.5px;
  height: 44px;
  font-size: 14px;
}

.btn {
  background-color: transparent !important;
  font-family: var(--font-body);
  color: var(--white);
  border: 2px solid var(--white);
  text-transform: uppercase;
  height: 40px;
  font-size: 12px;
  font-weight: 400;
}

/* Footer bottom section */
.footer-divider {
  height: 2px;
  width: 100%;
  background-color: #ffffff;
  margin: 0 auto;
  margin: 20px auto;
}

.social-links-row {
  display: flex;
  justify-content: end;
}

.social-links-row svg {
  fill: none;
}

.bottom--footer-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 30px;
  gap: 30px;
  width: 100%;
}

.bottom--footer-copyright-row {
  display: flex;
  justify-content: center;
  text-transform: uppercase;
  font-size: 12px;
  font-family: var(--body-font-stack);
  color: #e2ded2;
}

.bottom--footer---links {
  display: flex;
  list-style: none;
  margin: 0;
  padding: 0;
  flex-wrap: wrap;
  justify-content: center;
}

.bottom--footer---links li:not(:first-child):before {
  content: none;
}

.bottom--footer---links li {
  margin-right: 20px;
  position: relative;
}

.bottom--footer---links li:last-child {
  margin-right: 0;
  padding-right: 0;
}

.bottom--footer---links a {
  color: #ffffff;
  text-decoration: none;
  font-family: var(--body-font-stack);
}

/* Footer logo */
.footer-logo {
  display: flex;
  justify-content: center;
  margin-bottom: 0;
}

.footer-logo img {
  height: auto;
  padding: 0 40px;
}

/* Social media icons */
.social-icons-footer #sm-icons {
  display: flex;
  justify-content: center;
  list-style: none;
  padding: 0;
  margin: 0;
}

.footer-email-submit {
  font-weight: bold;
}

.social-icons-footer #sm-icons li {
  margin-left: 20px;
  list-style-type: none;
}
.social-icons-footer #sm-icons li:last-child {
  margin-right: 0;
}

.social-icons-footer #sm-icons li a {
  display: flex;
  align-items: center;
  justify-content: center;
  color: #e2ded2;
}

.social-icons-footer #sm-icons li a svg {
  width: 24px;
  height: 24px;
  fill: none;
}

/* Currency selector */
.localization-form-wrapper {
  color: #e2ded2;
  margin-right: 15px;
}

.disclosure__button {
  color: #ffffff;
  border: none;
  padding: 0;
  display: flex;
  align-items: center;
  background-color: transparent;
  cursor: pointer;
  font-size: 14px;
  font-family: var(--body-font-stack);
}

.disclosure__button svg {
  margin-left: 10px;
  width: 12px;
  height: 12px;
  fill: #e2ded2;
}

.image-with-text-overlay__desktop-image--original {
  height: 100%;
}

/* Main footer grid layout */
.footer-main--inner {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 30px;
  position: relative;
  z-index: 2;
}
.bottom--footer---links li:first-child {
  padding-left: 0;
}

/* Image overlay styling */
.image-overlay {
  pointer-events: none;
}

@media screen and (max-width: 989px) {
  .footer-main--inner {
    grid-template-columns: repeat(3, 1fr);
  }

  .bottom--footer-row {
    flex-direction: column;
    align-items: center;
  }

  .localization-form-wrapper {
    margin-right: 0;
    margin-bottom: 00px;
  }

  .bottom--footer-copyright-row {
    text-align: center;
  }

  .bottom--footer---links {
    flex-wrap: wrap;
    justify-content: center;
  }

  .bottom--footer---links li {
    margin-right: 10px;
    margin-bottom: 10px;
  }
}

@media screen and (max-width: 749px) {
  .footer-main--inner {
    grid-template-columns: repeat(2, 1fr);
  }

  .newsletter-footer {
    grid-column: span 2;
  }

  .bottom--footer---links {
    flex-direction: row;
    align-items: center;
    justify-content: center;
  }

  .bottom--footer---links li {
    margin-right: 20px;
    margin-bottom: 10px;
    text-align: center;
  }

  .bottom--footer---links li:last-child {
    margin-right: 0;
  }
}

/* === Slideshow Controls – slimmer, white bars ================== */

.image--slideshow__navigation.bars .swiper-pagination.pagination-bars {
  max-width: 360px; /* overall width of the bar group – tweak as needed */
}

/* keep nav aligned to the right, but this can stay as-is */
.swiper .image--slideshow__navigation {
  bottom: unset;
  left: unset;
  width: 100%;
  max-width: 1200px;
  display: flex;
  justify-content: end;
  position: relative;
  transform: none;
}

.swiper .image--slideshow__navigation.bars {
  bottom: unset;
}

/* each individual bar */
.image--slideshow__navigation
  .swiper-pagination.pagination-bars.swiper-pagination-bullets
  .swiper-pagination-bullet.progress-bar {
  width: 56px;          /* bar length – make smaller/bigger as you like */
  height: 3px;          /* bar thickness */
  margin: 0 4px;        /* spacing between bars */
  border-radius: 999px; /* pill shape */
  overflow: hidden;     /* keep inner <b>/<i> clipped */
}

/* active progress (fill) */
.image--slideshow__navigation
  .swiper-pagination.pagination-bars.swiper-pagination-bullets
  .swiper-pagination-bullet.progress-bar
  b {
  background-color: rgba(255, 255, 255, 0.95) !important; /* almost solid white */
}

/* background track */
.image--slideshow__navigation
  .swiper-pagination.pagination-bars.swiper-pagination-bullets
  .swiper-pagination-bullet.progress-bar
  i {
  background-color: rgba(255, 255, 255, 0.35) !important; /* soft white */
  opacity: 1 !important; /* let the rgba control the transparency */
}

/* Slideshow buttons – let them hug the text instead of centering full-width */
.slideshow-slider-container .slide-buttons {
  max-width: none;
  width: auto;
  margin: 0;              /* no auto-centering */
  display: inline-flex;   /* buttons sit under the text as a tight group */
}

/* For left-aligned hero copy, make text + buttons share the same left edge */
.slideshow-slider-container
  .swiper-slide.text-position--bottom-left .slideshow-text-container,
.slideshow-slider-container
  .swiper-slide.text-position--center-left .slideshow-text-container,
.slideshow-slider-container
  .swiper-slide.text-position--bottom-left .slide-buttons,
.slideshow-slider-container
  .swiper-slide.text-position--center-left .slide-buttons {
  margin-left: 0;
  margin-right: auto;
}

.slideshow-slider-container .slide-buttons .btn {
  font-family: var(--font-body);
  background-color: #645d3b;
  color: #fff;
  border: 1px solid #e2ded2;
  text-transform: uppercase;
  padding: 10px 20px;
  letter-spacing: 0.5px;
  height: 44px;
  font-size: 14px;
  font-weight: 400;
  margin: 0px 2px;
}

.image--slideshow__navigation__container {
  position: absolute;
  left: 0;
  bottom: 40px;
  width: 100%;
  display: flex;
  justify-content: center;
  padding: 0px 60px;
}

@media screen and (max-width: 767px) {
  .image--slideshow__navigation__container {
    padding: 0px 15px;
    bottom: 20px;
  }
  .slideshow-callout-desktop-image {
    height: unset !important;
    width: unset !important;
    padding-top: 7vh;
  }

  .slideshow--mobile-height-extra_large {
    height: 70vh !important;
  }
  .slideshow-callout-image-container {
    height: 52vh !important;
  }
}

/* Callout Image Styling */
.slideshow-callout-image-container {
  margin-bottom: 20px;
  max-width: 1200px;
  width: 100%;
  margin: 0 auto;
  position: relative;
  z-index: 10;
  height: 60vh;
}

.slideshow-callout-image-container .responsive-image-wrapper {
  max-width: 100%;
  display: flex;
  justify-content: end;
}

/* Position the callout image based on content position */
.text-position--center-left
  .slideshow-callout-image-container
  .responsive-image-wrapper,
.text-position--bottom-left
  .slideshow-callout-image-container
  .responsive-image-wrapper {
  justify-content: flex-start;
}

.text-position--center
  .slideshow-callout-image-container
  .responsive-image-wrapper,
.text-position--bottom
  .slideshow-callout-image-container
  .responsive-image-wrapper {
  justify-content: center;
}

.text-position--center-right
  .slideshow-callout-image-container
  .responsive-image-wrapper,
.text-position--bottom-right
  .slideshow-callout-image-container
  .responsive-image-wrapper {
  justify-content: flex-end;
}

/* Mobile positioning */
@media only screen and (max-width: 767px) {
  .mobile-text-position--center-left
    .slideshow-callout-image-container
    .responsive-image-wrapper,
  .mobile-text-position--bottom-left
    .slideshow-callout-image-container
    .responsive-image-wrapper {
    justify-content: flex-start;
  }

  .mobile-text-position--center
    .slideshow-callout-image-container
    .responsive-image-wrapper,
  .mobile-text-position--bottom
    .slideshow-callout-image-container
    .responsive-image-wrapper {
    justify-content: center;
  }

  .mobile-text-position--center-right
    .slideshow-callout-image-container
    .responsive-image-wrapper,
  .mobile-text-position--bottom-right
    .slideshow-callout-image-container
    .responsive-image-wrapper {
    justify-content: flex-end;
  }
}

.homepage-featured-content-box {
  position: relative;
  z-index: 10;
}

.slideshow-desktop-image,
.slideshow-mobile-image,
.slideshow-desktop-as-mobile-image {
  z-index: 1;
}

.slideshow-callout-desktop-image,
.slideshow-callout-mobile-image {
  width: 100%;
  height: auto;
  display: block;
}

/* Position the callout image based on content position */
.text-position--center-left .slideshow-callout-image-container,
.text-position--bottom-left .slideshow-callout-image-container {
  margin-right: auto;
}

.text-position--center .slideshow-callout-image-container,
.text-position--bottom .slideshow-callout-image-container {
  margin-left: auto;
  margin-right: auto;
}

.text-position--center-right .slideshow-callout-image-container,
.text-position--bottom-right .slideshow-callout-image-container {
  margin-left: auto;
}

/* Mobile/Desktop visibility */
@media only screen and (max-width: 767px) {
  .slideshow-callout-desktop-image {
    display: none;
  }

  .slideshow-callout-image-container {
    max-width: var(--mobile-width, 200px);
  }

  /* Mobile positioning */
  .mobile-text-position--center-left .slideshow-callout-image-container,
  .mobile-text-position--bottom-left .slideshow-callout-image-container {
    margin-right: auto;
  }

  .mobile-text-position--center .slideshow-callout-image-container,
  .mobile-text-position--bottom .slideshow-callout-image-container {
    margin-left: auto;
    margin-right: auto;
  }

  .mobile-text-position--center-right .slideshow-callout-image-container,
  .mobile-text-position--bottom-right .slideshow-callout-image-container {
    margin-left: auto;
  }
}

@media only screen and (min-width: 768px) {
  .slideshow-callout-mobile-image {
    display: none;
  }
}

/* Featured Collection */

.featured-collections-wrapper .section-title {
  font-family: var(--font-heading);
  font-weight: 200;
  letter-spacing: 0.06em;
}

.featured-collections-wrapper .section-title--wrapper {
  align-items: start;
}

.featured-collections-wrapper .grid-item__title {
  font-family: var(--font-heading);
  color: var(--white);
  position: absolute;
  bottom: 20px;
  left: 20px;
  font-size: 18px;
  font-weight: bold;
}

/* Featured Products */

.featured-products-wrapper .section-title--wrapper,
.product-recommendations-wrapper .section-title--wrapper {
  align-items: start;
}

.featured-products-wrapper .section-title--wrapper .section-title,
.product-recommendations-wrapper .section-title--wrapper .section-title {
  font-family: var(--font-heading) !important;
  letter-spacing: 1px;
}

.featured-products-wrapper .quick-shop--block,
.product-recommendations-wrapper .quick-add-button {
  display: none !important;
}

.featured-products-wrapper .product-grid--title,
.featured-products-wrapper .product-grid--price span,
.product-recommendations-wrapper .product-grid--title {
  color: var(--blue) !important;
  font-weight: 400;
}

.featured-products-wrapper .wrapper-spacing--h {
  padding-right: 0px;
}



.featured-products-wrapper .width--content {
  margin-right: 0px;
}

.featured-products-wrapper .wrapper-spacing--h {
  max-width: unset;
  margin: 0;
}

/* Rich Text */

.rich-text .homepage-sections--title {
  font-family: var(--font-heading) !important;
  letter-spacing: 1px;
}

body.template-product {
  background-color: var(--white);
}

.swatch:not(.is-color-swatch) .swatch-items-wrapper .swatch-element label{
  outline: none !important;
  background-color: unset !important;
  font-weight: bold;
}

.swatch:not(.is-color-swatch):not(.linked-products-swatch)
  .swatch-element
  input:checked
  + label {
  background-color: var(--grey) !important;
  color: #000 !important;
}

.swatch:not(.is-color-swatch):not(.linked-products-swatch) label {
  padding: 2px 6px !important;
}

.product-details-product-title {
  word-wrap: break-word;
  letter-spacing: var(--heading-spacing);
  text-transform: var(--heading-font-case);
  margin: 0;
  font-family: var(--font-heading) !important;
  font-size: 32px;
  padding-top: 24px;
}

.product-recommendations {
  background: none !important;
}

.product-details-wrapper .label-font {
  font-weight: bold !important;
}

.shop-the-look__container {
  background-color: transparent !important;
}

.shop-the-look__container button {
  background-color: transparent !important;
}

.shop-the-look__container a,
.shop-the-look__container .money {
  color: var(--white) !important;
}

.shop-the-look__container .section-title {
  font-family: var(--font-heading) !important;
  letter-spacing: 1px;
  color: var(--oat) !important;
  text-align: left;
  padding-left: 50px;
}

.shop-the-look__container .section-title--wrapper {
  margin-bottom: 5px;
}

.shop-the-look__content:not(.shop-the-look--mobile)
  .shop-the-look__image-container,
.shop-the-look__content:not(.shop-the-look--mobile)
  .shop-the-look__product-card-container {
  width: calc((100% - var(--grid-spacing)) * 0.5) !important;
}

.shop-the-look__container .quick-add-wrapper {
  display: none !important;
}

.shop-the-look__container .shop-the-look__product-card-swiper {
  max-width: 80%;
  margin-left: unset;
  margin-right: unset;
}

.shop-the-look--mobile.shop-the-look--modal-open
  .shop-the-look__product-card-container
  .section-title,
.shop-the-look--mobile.shop-the-look--modal-open
  .shop-the-look__product-card-container
  .shop-the-look__custom-button-container {
  display: none;
}

.shop-the-look--mobile.shop-the-look--modal-open
  .shop-the-look__product-card-swiper {
  max-width: 100%;
}

.shop-the-look--mobile.shop-the-look--modal-open button {
  box-shadow: none !important;
}

.shop-the-look--mobile.shop-the-look--modal-open a,
.shop-the-look--mobile.shop-the-look--modal-open .money {
  color: var(--blue) !important;
}

.shop-the-look--mobile.shop-the-look--modal-open
  .shop-the-look__product-navigation {
  top: 35%;
}

.shop-the-look__container
  .shop-the-look__product-card-swiper
  .swiper-wrapper.has-scrollbar {
  padding-bottom: 0px !important;
}

.footer-wrapper .footer-main .footer-main--inner > *{
  gap:2rem !important;
}

/* Hero headline */
.homepage-hero-menu-indiv-text .h4{
  font-family: var(--font-heading);
  font-size: 32px !important;
  font-weight: 700 !important;
  letter-spacing: .06em;
  text-transform: uppercase;
}

/* === Slideshow CTA buttons – outline variant ================= */

/* Dynamic section button */
.dynamic-section.btn {
  background-color: transparent !important;
  border: 2px solid #fefdfc !important;
  color:  #fefdfc !important;
  font-weight: 400 !important;
  font-size: 12px !important;
  padding: 12px 18px !important;
}

.dynamic-section.btn:hover {
  background-color: transparent !important;
  border-color:     #fefdfc !important;
  color:            #fefdfc !important;
}

/* Homepage section button */
.homepage-section-btn {
  background-color: transparent !important;
  border: 2px solid #fefdfc !important;
  color:  #fefdfc !important;
  font-weight: 400 !important;
  font-size: 12px !important;
  padding: 10px 18px !important;
}

.homepage-section-btn:hover {
  background-color: transparent !important;
  border-color:     #fefdfc !important;
  color:            #fefdfc !important;
}

/* Image-based button variants */
[class*="button--image_"].btn {
  background-color: transparent !important;
  border: 2px solid #fefdfc !important;
  color:  #fefdfc !important;
  font-weight: 400 !important;
  font-size: 12px !important;
  padding: 12px 18px !important;
}

[class*="button--image_"].btn:hover {
  background-color: transparent !important;
  border-color:     #fefdfc !important;
  color:            #fefdfc !important;
}

/* optional: keep full width on small screens */
@media (max-width: 749px){
  section[data-section-type="image-with-text-overlay"],
  .shopify-section.section--image-with-text-overlay{
    max-width: 100% !important;
  }
}

/* Center the Featured‑products block without shrinking it */
@media (min-width: 750px){
  .featured-products-wrapper .wrapper-spacing--h{
    padding-left:0 !important;      /* kill the inline 368 px */
    padding-right:0 !important;
    max-width:1300px !important;    /* match your hero width   */
    margin-left:auto !important;    /* centers the wrapper     */
    margin-right:auto !important;
  }
}

/* ====  HEADER LIGHT‑ON‑IDLE  ===================================== */
/*  0) Normalise the selector list to cover all Flow variants you have          */
.overlay-header-wrapper,                /* outer wrapper – takes hover too   */
.site-header                            /* actual <header> element           */
{
  position:relative;
  z-index:5;
  /* keep smooth colour cross‑fade if you already change bg on scroll */
  transition:background .25s ease;
}

/*  1) Subtle glow overlay – visible by default (non‑hover)                   */
.overlay-header-wrapper::before,
.site-header::before{
  content:'';
  position:absolute;
  inset:0;
  pointer-events:none;  /* never block clicks */
  /*  ↓ Pick one of these background tints ↓ */

  /* A) Simple white‑cream sheet (lighter on dark hero images) */
  background:rgba(255,255,255,0.15);               /* 15 % white */
  /*  OR                                                             */
  /* B) Brand‑cream radial vignette – uncomment to try               */
  /* background:radial-gradient(ellipse at center,
                 rgba(249,244,237,0.85) 0%,
                 rgba(249,244,237,0.6)  60%,
                 rgba(249,244,237,0)    95%); */

  backdrop-filter:blur(6px);                      /* softens BG bleed‑through */
  opacity:1;                                      /* <-- SHOWN when not hovered */
  transition:opacity .25s ease;
  mix-blend-mode:screen;                          /* gently brightens texture */
}

/*  2) Fade overlay out on hover so you see the solid white state       */
.overlay-header-wrapper:hover::before,
.site-header:hover::before{
  opacity:0;
}

/* Optional: faint shadow so bar stays readable over bright photos     */
.overlay-header-wrapper,
.site-header{
  box-shadow:0 1px 4px rgba(0,0,0,0.05);
}

.overlay-header-wrapper::after,
.site-header::after{
  content:'';
  position:absolute;
  left:0; right:0; bottom:0;
  height:1px;
  background:#FFFFFF;   /* solid white */
  pointer-events:none;
  z-index:3;            /* sits above the glow (::before) */
}

.hero-video-wrapper{min-height:40vh;}
@media(max-width:749px){.hero-video-wrapper{min-height:24vh;}}

/* HERO video block – make the CTA as wide as its text */
.hero-video-wrapper .text-block{
  align-items: center;
}

.hero-video-wrapper .text-block .btn{
  width: auto !important;
  min-width: 0 !important;
  max-width: max-content !important;
  display: inline-flex !important;
  padding-left: 16px !important;
  padding-right: 16px !important;
  height: 50px;
  line-height: 36px;
}

/* === Announcement bar – use body font ===================== */
.announcement_bar .announcement_wrapper,
.announcement_bar .announcement_block,
.announcement_bar .announcement_text,
.announcement_bar .announcement_text a {
  font-family: var(--font-body), sans-serif !important;
  /* optional tweaks: uncomment if you want them
  font-weight: 500;
  letter-spacing: .02em;
  */
}

/* Force Larken on slideshow headline only */
.slideshow-title-container .homepage-sections--title,
.slideshow-title-container .homepage-section-title{
  font-family: var(--font-heading), "Larken", serif !important;
  font-weight: 400;
}

.cta-transparent .slide-buttons .btn:hover,
.cta-transparent .slide-buttons .btn:focus{
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

/* Gift Card product — fix hidden Add to cart button */
[data-wetheme-section-type="template--product"] .product--add-to-cart-button,
[data-wetheme-section-type="template--product"] button[name="add"] {
  background: #01273e !important;
  color: #fff !important;
  border-color: #01273e !important;
}

/* Hover state (optional) */
[data-wetheme-section-type="template--product"] .product--add-to-cart-button:hover,
[data-wetheme-section-type="template--product"] .shopify-payment-button__button:hover {
  opacity: .95;
}

/* === Cart Drawer text + buttons (ABCO blue) === */
.global-drawer { color:#01273e !important; }

.global-drawer h1,
.global-drawer h2,
.global-drawer h3,
.global-drawer .cart-drawer__heading,
.global-drawer a,
.global-drawer .cart-item__name,
.global-drawer .price,
.global-drawer .totals__subtotal,
.global-drawer .totals__subtotal-value,
.global-drawer .discounts__discount,
.global-drawer .tax-note,
.global-drawer label,
.global-drawer .quantity__label,
.global-drawer .cart-remove-button {
  color:#01273e !important;
}

/* Inputs / qty controls / borders */
.global-drawer .quantity__button,
.global-drawer .quantity__input {
  color:#01273e !important;
  border-color:#01273e !important;
}

/* Buttons in the drawer (checkout/updates) */
.global-drawer .button,
.global-drawer button[type="submit"],
.global-drawer .shopify-payment-button__button,
.global-drawer .shopify-payment-button__button--unbranded {
  background:#01273e !important;
  color:#fff !important;
  border-color:#01273e !important;
}

/* Cart drawer close icon — force ABCO blue */
.global-drawer .global-drawer__close { 
  color:#01273e !important;            /* if SVG uses currentColor */
}

/* Make top-level menu parents (set to "#") not clickable */
#AccessibleNav > li > a[href="#"],
.site-header a[href="#"],
.mega-menu--link-title a[href="#"],
.mobile-nav__has-sublist > a[href="#"] {
  pointer-events: none !important;
  cursor: default !important;
  text-decoration: none !important; /* optional: kill underline on focus */
}

/* Use ABCO grey for the underline effect */
.header-section--wrapper{
  --nav-text-hover: #525252;   /* drives the animated underline color */
}

/* Also darken the label text on hover/focus for REAL links (not the '#' parents) */
#AccessibleNav > li > a[href]:not([href="#"]):hover .site-nav--link-text,
#AccessibleNav > li > a[href]:not([href="#"]):focus .site-nav--link-text{
  color:#525252 !important;
  text-decoration:none;
}

/* Mega-menu/dropdown links inside the panel */
.mega-menu-wrapper .mega-menu--links a[href]:not([href="#"]):hover,
.mega-menu-wrapper .mega-menu--links a[href]:not([href="#"]):focus{
  color:#525252 !important;
  text-decoration:none;
}

/* Mobile drawer links */
.mobile-nav a.mobile-nav__link[href]:not([href="#"]):hover,
.mobile-nav a.mobile-nav__link[href]:not([href="#"]):focus{
  color:#525252 !important;
  text-decoration:none;
}

/* ==== Mega-menu link hover: slide-in highlight ==== */
.mega-menu-wrapper .mega-menu--links a.animated-link--item{
  position: relative;
  display: inline-block;                 /* hug the text */
  padding: 2px 8px;                      /* tweak to taste */
  border-radius: 4px;
  color: var(--nav-text-color);
  background-image: none !important;     /* kill any underline bg */
  transition: color .18s ease;
  z-index: 0;
}
.mega-menu-wrapper .mega-menu--links a.animated-link--item::before{
  content:"";
  position:absolute;
  inset:0;                               /* full link area */
  background:#f1f1f1;                    /* light grey highlight */
  transform:scaleX(0);                   /* start hidden */
  transform-origin:left center;
  transition:transform .22s ease;        /* slide duration */
  border-radius:4px;
  z-index:-1;                            /* sit under the text */
}
.mega-menu-wrapper .mega-menu--links a.animated-link--item:hover::before,
.mega-menu-wrapper .mega-menu--links a.animated-link--item:focus-visible::before{
  transform:scaleX(1);
}
.mega-menu-wrapper .mega-menu--links a.animated-link--item:hover,
.mega-menu-wrapper .mega-menu--links a.animated-link--item:focus-visible{
  color:#01273e;                         /* ABCO blue text on hover */
  text-decoration:none;
}

/* ─── tighten the header-to-links gap inside each mega-menu column ─── */
.mega-menu-wrapper .inner p.h4.mega-menu-link-title{
  margin-bottom: 4px !important;   /* 15 px → 4 px (tweak as you like) */
}

/* kill the extra top-margin/padding on the first UL of links */
.mega-menu-wrapper .inner ul.menu-link{
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* ───────── MOBILE DRAWER  •  disable grey highlight & colour swap ────── */
@media (max-width: 989px){                 /* only when the drawer is used */

  /* 1 ▸ stop the colour from flipping to grey */
  #NavDrawer a.mobile-nav__link:hover,
  #NavDrawer a.mobile-nav__link:focus,
  #NavDrawer a.mobile-nav__link:active{
    color: currentColor !important;        /* keep whatever colour it has */
  }

  /* 2 ▸ kill the sliding grey pill that sits under the text */
  #NavDrawer a.mobile-nav__link::before{
    display:none !important;
  }

  /* 3 ▸ keep text colour the same while touching / hovering */
  #NavDrawer a.mobile-nav__link,
  #NavDrawer a.mobile-nav__link:hover,
  #NavDrawer a.mobile-nav__link:focus,
  #NavDrawer a.mobile-nav__link:active{
    color: var(--nav-text-color) !important;   /* stays the normal menu colour */
  }
}

/* ───── Fine-tune individual footer icons ──── */

/* Facebook → solid (fill only) */
#sm-facebook a svg,
#sm-facebook a svg *{
  fill:#ffffff !important;       /* solid white */
  stroke:none !important;        /* kill stroke so it stays solid */
}

/* Instagram → outline (stroke only) */
#sm-instagram a svg,
#sm-instagram a svg *{
  fill:none !important;          /* hollow */
  stroke:#ffffff !important;     /* white line work */
}

/* X / Twitter → outline (stroke only) */
#sm-x a svg,
#sm-x a svg *{
  fill:none !important;
  stroke:#ffffff !important;
}

/* Collage component — force Larken on all headings */
.collage-builder .collage-builder__heading,
.collage-builder__heading,
.collage-builder__heading a {
  font-family: "Larken", serif !important;
  font-weight: 700 !important;
  letter-spacing: .06em !important;
  text-transform: uppercase;
  line-height: 1.05;
}

/* Size tuning: small top tiles vs larger text tile */
.collage-builder .collage-builder__grid-item--image .collage-builder__heading {
  /* top row tiles over images */
  font-size: clamp(16px, 1.6vw, 22px);
}

.collage-builder .collage-builder__grid-item--text .collage-builder__heading {
  /* bottom-left large text block */
  font-size: clamp(28px, 3vw, 42px);
}

/* (Optional) ensure legibility on image overlays */
.collage-builder .collage-builder__grid-item--image .collage-builder__heading {
  color: #fff !important;
  text-shadow: 0 1px 2px rgba(0,0,0,.25);
}

.footer-header {
  color: #A95346 !important;
  font-family: "Larken", serif !important;
  font-weight: 700 !important;
  letter-spacing: .06em !important;
  text-transform: uppercase;
  font-size: 1.05rem; /* slightly smaller for balance */
  margin-bottom: 0.75rem; /* adjust spacing from links */
  border-bottom: none !important;
}

.footer-header::after {
  display: none !important;
  content: none !important;
}

/* Lead line (“IT’S ALL IN THE”) – it’s a <p>, set Larken + color */
section[data-wetheme-section-type="animated-text"] .content-wrapper--text_static .richtext-block p{
  font-family: "Larken", serif !important;
  font-weight: 700 !important;
}

/* Rotating word – keep in body font (Aktiv) */
section[data-wetheme-section-type="animated-text"] animated-text,
section[data-wetheme-section-type="animated-text"] animated-text .text-wrap,
section[data-wetheme-section-type="animated-text"] .content-wrapper--text_dynamic span{
  font-family: "Aktiv Grotesk Text","Aktiv Grotesk",system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif !important;
  font-family: "Larken", serif !important;
  font-weight: 400;
  margin: 0 !important;
  color: #A95346 !important;
}

/* 2) Add more air before the button */
section[data-wetheme-section-type="animated-text"] .content-wrapper--button{
  margin-top: 30px !important;
}

/* === ABCO – Override Specific “View All” Button to Match Newsletter Style === */
.dynamic-section-button--view-all--template--19848293318895__featured_collection_YnhWpt.btn {
  background-color: transparent !important;
  color: #01273e !important;
  border: 2px solid #01273e !important;
  transition: background-color 0.25s ease, color 0.25s ease, border-color 0.25s ease;
  font-family: var(--font-body) !important;
  font-size: 12px !important;
  line-height: 1.25 !important;
  text-align: center !important;
  height: 46px !important;
  padding: 14px 18px !important;
  text-transform: uppercase;
  box-shadow: none !important;
  background-image: none !important;
}

/* === ABCO – Hover state matches newsletter button === */
.dynamic-section-button--view-all--template--19848293318895__featured_collection_YnhWpt.btn:hover,
.dynamic-section-button--view-all--template--19848293318895__featured_collection_YnhWpt.btn:focus,
.dynamic-section-button--view-all--template--19848293318895__featured_collection_YnhWpt.btn:focus-visible {
  background-color: #01273e !important;
  color: #ffffff !important;
  border-color: #01273e !important;
  text-decoration: none !important;
}

/* ABCO · Footer newsletter subscribe button styling */
.btn.footer-email-submit.dynamic-section-button--newsletter {
  font-size: 12px;
  font-weight: 400;
  text-align: center !important;
  padding: 13px 18px !important;
}

/* Custom height overrides for animated-text component */
.height-mobile--custom {
  height: 25vh;
}

@media screen and (min-width: 768px) {
  .height-desktop--custom {
    height: 27vh;
  }
}

/* Ensure fallback wrapper takes full height */
.homepage-map--fallback-wrap {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  height: 100%;
  width: 100%;
  z-index: 0;
  overflow: hidden;
}

/* Ensure fallback iframe stretches full height */
.homepage-map--fallback-wrap iframe {
  height: 100%;
  width: 100%;
  display: block;
  border: 0;
}

.repair-services-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
  gap: 1.5rem;
  margin-top: 2rem;
}

.repair-service {
  background: #f1f1f1; /* or use #e2ded2 for 'oat' if preferred */
  padding: 1.25rem;
  border-radius: 8px;
  text-align: left;
  font-family: var(--font-body-family);
}

.repair-service h4 {
  font-family: var(--font-heading-family);
  margin-bottom: 0.5rem;
  font-size: 1.1rem;
  color: #01273e; /* ABCO 'moss' */
}

.repair-service p {
  margin: 0.25rem 0;
  font-size: 0.95rem;
}

.mobile-nav .customer-login-link {
  font-family: var(--font-body-family) !important;
}

.mobile-nav__item a:active {
  background-color: rgba(0,0,0,0.04); /* light touch feedback */
}

/* Set product/gallery boot headings to a specific px size */
h3.content-grid-item__heading {
  font-size: 15px !important;
  line-height: 1.2 !important;
  font-weight: 600 !important;   /* Optional: keep for clarity */
  margin-bottom: 0.5em !important;
}

/* Even more targeted (only inside featured collection/gallery slider): */
.content-grid .content-grid-item__heading {
  font-size: 18px !important;
}

/* Make slider nav arrows always visible */
.swiper-button--next,
.swiper-button--prev {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  display: flex !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

/* Force arrow icon color to ABCO blue (works because stroke uses currentColor) */
.swiper-button--next,
.swiper-button--prev {
  color: #01273e !important;
}

/* Optional: Make arrow a little bolder for accessibility */
.swiper-button--next svg path,
.swiper-button--prev svg path {
  stroke-width: 2 !important;
}

.custom-banner__container {
  display: flex;
  align-items: stretch;
  gap: 0;
}

.custom-banner__text {
  flex: 1 1 45%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 3rem 2rem;
  color: #fff;
  min-height: 340px;
}

.custom-banner__text h2 {
  margin-bottom: 1rem;
  font-size: 2rem;
}

.custom-banner__cta {
  margin-top: 2rem;
  display: inline-flex;
  align-items: center;
  font-weight: 600;
  color: #fff;
  transition: color 0.2s;
  gap: 0.5rem;
}

.custom-banner__cta .arrow svg {
  transition: stroke 0.2s;
}

.custom-banner__cta:hover,
.custom-banner__cta:focus {
  color: #E68819; /* Your hover color */
}

.custom-banner__cta:hover .arrow svg,
.custom-banner__cta:focus .arrow svg {
  stroke: #E68819;
}

.custom-banner__image {
  flex: 1 1 55%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #ececec;
  min-height: 340px;
}

.custom-banner__image img {
  max-width: 100%;
  height: auto;
  display: block;
}

/* === BLOG SECTION HEADER === */
.shopify-section[data-wetheme-section-type="blog-posts"] .width--content > h2,
.shopify-section[data-wetheme-section-type="blog-posts"] .width--content > .section-header__title {
  text-align: left;
  font-size: 2.4rem;
  margin-bottom: 0.5em;
  font-family: 'Larken', serif;
  font-weight: 700;
  letter-spacing: -0.01em;
  position: relative;
}
.shopify-section[data-wetheme-section-type="blog-posts"] .width--content > h2::after,
.shopify-section[data-wetheme-section-type="blog-posts"] .width--content > .section-header__title::after {
  content: "";
  display: block;
  width: 80px;
  height: 4px;
  background: #01273e; /* ABCO Blue */
  margin-top: 0.5em;
  border-radius: 2px;
}

/* === BLOG CARDS === */
.main-blog-excerpt {
  background: #fff;
  border-radius: 0;
  box-shadow: none;
  padding: 0;
  margin: 0 1.5% 40px 1.5%;
  display: flex;
  flex-direction: column;
  transition: box-shadow 0.15s;
  border: none;
  max-width: 32%;
  flex: 1 1 32%;
}

@media (max-width: 1023px) {
  .main-blog-excerpt { max-width: 48%; flex-basis: 48%; }
}
@media (max-width: 767px) {
  .main-blog-excerpt { max-width: 100%; flex-basis: 100%; }
}

/* BLOG GRID: show 3 per row, gap like Ariat */
.homepage-blog-list.grid--full {
  display: flex;
  flex-wrap: wrap;
  gap: 30px 2%;
  justify-content: flex-start;
}

/* === IMAGE === */
.main-blog-excerpt .main-blog-image img {
  border-radius: 0;
  object-fit: cover;
  min-height: 260px;
  max-height: 260px;
  width: 100%;
  aspect-ratio: 2 / 1;
  box-shadow: none;
  margin-bottom: 0;
}

/* === BLOG META (DATE, TAG) === */
.main-blog-excerpt .blog-meta {
  color: #757575;
  font-size: 0.95rem;
  margin-bottom: 8px;
  margin-top: 18px;
  font-weight: 500;
  letter-spacing: 0.03em;
}

/* === TITLE === */
.main-blog-excerpt .homepage-blog-title {
  font-size: 1.25rem;
  font-family: 'Larken', serif;
  font-weight: 700;
  margin: 0 0 6px 0;
  letter-spacing: -0.01em;
  color: #01273e;
}

/* === EXCERPT === */
.main-blog-excerpt .main-blog-excerpt__content {
  color: #222;
  font-size: 1.04rem;
  line-height: 1.6;
  margin-bottom: 12px;
}

/* === READ MORE LINK WITH ARROW === */
.main-blog-excerpt__read-more {
  color: #01273e;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-size: 1.02rem;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  text-decoration: none !important;
  transition: color 0.18s;
  margin-top: 10px;
  gap: 0.45em;
  position: relative;
}
.main-blog-excerpt__read-more::after {
  content: '→';
  font-size: 1.25em;
  margin-left: 0.25em;
  transition: transform 0.18s, color 0.18s;
  color: #01273e;
}
.main-blog-excerpt__read-more:hover,
.main-blog-excerpt__read-more:focus {
  color: #e68819;
}
.main-blog-excerpt__read-more:hover::after,
.main-blog-excerpt__read-more:focus::after {
  color: #e68819;
  transform: translateX(4px);
}

/* === MISC: REMOVE DEFAULT BOX SHADOW, SPACING CLEANUP === */
.shopify-section[data-wetheme-section-type="blog-posts"] .width--content {
  padding-left: 0 !important;
  padding-right: 0 !important;
  max-width: 1300px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Brand Detection Nav Bar Styling */
.site-header--cands {
  background: #e2ded2; /* C&S oat */
  color: #645d3b;
}
.site-header--cands .nav-link-animated,
.site-header--cands .site-nav__link,
.site-header--cands .top-links a,
.site-header--cands .site-header__links a,
.site-header--cands .standalone-icon--wrapper {
  color: #645d3b !important;
  fill: #645d3b !important;
}
.site-header--cands .site-header__logo-image img {
  filter: none; /* Remove or keep grayscale as you wish */
}
.site-header--abco {
  background: #fff; /* or your ABCO color */
  color: #01273e;
}
.site-header--abco .nav-link-animated,
.site-header--abco .site-nav__link,
.site-header--abco .top-links a,
.site-header--abco .site-header__links a,
.site-header--abco .standalone-icon--wrapper {
  color: #01273e !important;
  fill: #01273e !important;
}
.site-header--abco .site-header__logo-image img {
  filter: none;
}

/* footer background is on <footer>, let it show through */
.footer-main.site-footer{
  background-repeat: repeat !important;
  background-size: auto !important;       /* or 600px auto */
  background-position: top left !important;
}

.footer-main .footer-main-container,
.footer-main .footer-bottom-container,
.footer-wrapper{
  background: transparent !important;
}

/* remove any visual seam from spacing */
.footer-main .footer-main-container{ margin-bottom: 0 !important; }
.footer-main .footer-bottom-container{ margin-top: 0 !important; }

/* headings & body */
.brand-cands h1,.brand-cands h2,.brand-cands h3,.brand-cands h4,.brand-cands h5,.brand-cands h6,
.brand-abco  h1,.brand-abco  h2,.brand-abco  h3,.brand-abco  h4,.brand-abco  h5,.brand-abco  h6{
  font-family: var(--brand-font-heading) !important;
}

.brand-cands body,.brand-cands .site-nav__link,.brand-cands .mobile-nav__link,
.brand-abco  body,.brand-abco  .site-nav__link,.brand-abco  .mobile-nav__link{
  font-family: var(--brand-font-body) !important;
}

/* header colour scheme */
.brand-cands .site-header{ background: var(--brand-color-cream); color: var(--brand-color-accent); }
.brand-cands .site-header .site-nav__link,
.brand-cands .standalone-icon--wrapper{ color: var(--brand-color-accent) !important; fill: var(--brand-color-accent) !important; }

.brand-abco .site-header{ background: #fff; color: var(--brand-color-primary); }
.brand-abco .site-header .site-nav__link,
.brand-abco .standalone-icon--wrapper{ color: var(--brand-color-primary) !important; fill: var(--brand-color-primary) !important; }

/* newsletter/button example */
.brand-cands .newsletter-footer .btn{ background:#645d3b; color:var(--brand-color-cream); border:1px solid var(--brand-color-cream); }
.brand-abco  .newsletter-footer .btn{ background:transparent; color:#fff; border:2px solid #fff; }

/* === Sticky footer on short pages (login / password reset, etc.) === */
/* Your page-level wrapper (parent of .footer-wrapper) */
body > .body-wrapper {
  min-height: 100svh;     /* modern mobile-safe vh */
  min-height: 100vh;      /* fallback */
  display: flex;
  flex-direction: column;
}

/* Let the main content expand; covers most themes */
body > .body-wrapper main,
body > .body-wrapper #MainContent {
  flex: 1 0 auto;
}

/* Push the footer to the bottom and undo the theme’s baseline alignment */
.footer-wrapper {
  margin-top: auto;
  align-self: stretch !important;   /* override theme.min.css */
  width: 100%;
}

/* === SINGLE-COLUMN DROPDOWNS (non-mega): final styles === */
.site-header .site-nav__dropdown:not([class*="mega"]) {
  /* inner gutters so items aren’t jammed left/right */
  padding: 18px 26px;            /* was ~16/20 */
  margin-top: -1px;              /* stay flush with header */
  border: 0; border-radius: 0; box-shadow: none;
  background-clip: padding-box;
}
.site-header .site-nav__dropdown:not([class*="mega"]) ul {
  margin: 0; padding-left: 0;    /* don’t add extra left pad */
}
.site-header .site-nav__dropdown:not([class*="mega"]) li {
  padding-left: 2px;             /* tiny indent for balance */
}

/* Links inside single dropdowns */
.site-header .site-nav__dropdown:not([class*="mega"]) a,
.site-header .site-nav__dropdown:not([class*="mega"]) .site-nav__link {
  /* kill underline/animated line + cardy bits */
  text-decoration: none !important;
  background: none !important;
  background-image: none !important;
  border-bottom: 0 !important;
  box-shadow: none !important;

  /* size + pill spacing */
  font-size: 1rem;               /* 16px */
  line-height: 1.55;
  padding: 2px 8px;              /* snug, but not hugging */
  border-radius: 3px;
  text-transform: capitalize;

  position: relative;
  display: inline-block;
}

/* Nuke theme underline carriers & their pseudos (only here) */
.site-header .site-nav__dropdown:not([class*="mega"]) .nav-link-animated,
.site-header .site-nav__dropdown:not([class*="mega"]) .animated-link--item,
.site-header .site-nav__dropdown:not([class*="mega"]) .site-nav--link-text {
  background: none !important;
  background-image: none !important;
  box-shadow: none !important;
}
.site-header .site-nav__dropdown:not([class*="mega"]) .animated-link--item::before,
.site-header .site-nav__dropdown:not([class*="mega"]) .animated-link--item::after,
.site-header .site-nav__dropdown:not([class*="mega"]) .site-nav--link-text::before,
.site-header .site-nav__dropdown:not([class*="mega"]) .site-nav--link-text::after,
.site-header .site-nav__dropdown:not([class*="mega"]) a::after {
  content: none !important; width: 0 !important; height: 0 !important;
  background: none !important; transform: none !important; box-shadow: none !important;
}

/* Keep your left→right “pill” hover (tight to letters) */
.site-header .site-nav__dropdown:not([class*="mega"]) a::before {
  content: "";
  position: absolute;
  left: 0; right: 0; top: .12em; bottom: .12em;
  background: #f1f1f1;
  border-radius: 3px; z-index: -1;
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform .22s ease;
}
.site-header .site-nav__dropdown:not([class*="mega"]) a:hover::before,
.site-header .site-nav__dropdown:not([class*="mega"]) a:focus-visible::before {
  transform: scaleX(1);
}

/* Brand hover text colours (no underline) */
.brand-cands .site-nav__dropdown:not([class*="mega"]) a:hover,
.brand-cands .site-nav__dropdown:not([class*="mega"]) a:focus-visible { color: var(--cands-accent-strong, #2e2d23); }
.brand-abco  .site-nav__dropdown:not([class*="mega"]) a:hover,
.brand-abco  .site-nav__dropdown:not([class*="mega"]) a:focus-visible  { color: #01273e; }

/* Title-case only the links INSIDE single-column dropdowns */
.site-header .site-nav__dropdown:not([class*="mega"]) a,
.site-header .site-nav__dropdown:not([class*="mega"]) .site-nav__link{
  text-transform: capitalize;
}

/* C&S — darker green for single (non-mega) dropdown items */
.brand-cands .site-header .site-nav__dropdown:not([class*="mega"]) a,
.brand-cands .site-header .site-nav__dropdown:not([class*="mega"]) .site-nav__link{
  color: #2e2d23 !important;   /* darker green */
}

/* Hide the "Update Cart" button on the full cart page (robust selectors) */
form#CartForm input[name="update"],
form[action*="/cart"] input[name="update"],
form[action*="/cart"] .update-cart,
form[action*="/cart"] .cart__button-update,
.cart-checkout-default .update-cart,
.cart-checkout-default .cart__button-update {
  display: none !important;
}

/* Let the Checkout button take the full width of that row */
.cart-checkout-default [name="checkout"],
form[action*="/cart"] [name="checkout"] {
  width: 100% !important;
}

/* Cart page: make the 'shipping' link plain text */
.template-cart .cart__shipping a,
.cart__shipping a {
  pointer-events: none !important;   /* not clickable */
  cursor: default !important;
  text-decoration: none !important;
  background: none !important;       /* kill Flow’s animated underline */
  background-image: none !important;
  box-shadow: none !important;
  color: inherit !important;          /* match surrounding text */
}

/* also remove any pseudo-element underline the theme draws */
.template-cart .cart__shipping a::before,
.template-cart .cart__shipping a::after,
.cart__shipping a::before,
.cart__shipping a::after {
  content: none !important;
  display: none !important;
}

/* === ABCO footer newsletter — border ONLY around the input === */

/* 1) Remove any border on the whole group */
.brand-abco #newsletter-footer_form .input-group,
.brand-abco .newsletter-footer_wrapper .input-group {
  border: none !important;
  gap: 12px;                 /* space between input and button */
  display: inline-flex;
  align-items: stretch;
  background: transparent !important;
}

/* 2) Style the email input itself with the white box */
.brand-abco #newsletter-footer_form #FooterEmail.input-group-field.footer-email-input,
.brand-abco .newsletter-footer_wrapper #FooterEmail {
  border: 1px solid #fff !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #fff !important;
  padding: 10px 14px !important;
  min-height: 44px;
  line-height: 22px;
  flex: 1 1 auto;
  /* optional sizing guards */
  max-width: 320px;          /* tweak or remove if you want it to grow */
}

.brand-abco #newsletter-footer_form #FooterEmail::placeholder {
  color: rgba(255,255,255,0.75);
}

/* 3) Keep the button styled independently (no shared border) */
.brand-abco #newsletter-footer_form #FooterSubscribe,
.brand-abco .newsletter-footer_wrapper button[type="submit"] {
  border: none !important;   /* ensure no accidental left border */
  margin: 0;                 /* sits beside the input cleanly */
  min-height: 44px;
  padding: 0 14px !important;
  /* keep your existing background/typography from theme */
}

/* 4) Focus state: ring just around the input */
.brand-abco #newsletter-footer_form #FooterEmail:focus {
  outline: none;
  box-shadow: 0 0 0 2px rgba(255,255,255,.15);
}

/* ABCO footer newsletter: spacing between header and input */
.brand-abco .newsletter-footer_wrapper .footer-header,
.brand-abco .newsletter-footer_wrapper .h3.footer-header {
  margin-bottom: 12px; /* match C&S look; tweak to 14–16px if you want a hair more */
}

/* Safety net if some templates don’t use the .footer-header class */
.brand-abco #newsletter-footer_form .input-group {
  margin-top: 19px;
}

/* === ONE-OFF width control for this specific Image-with-Text-Overlay ===
   Section: #shopify-section-template--19848293318895__image_with_text_overlay_zfUAbq
*/
:root{
  --iwto-oneoff-max: 879px;   /* <— change this to adjust width */
  --iwto-oneoff-gutter: 0px;   /* optional inner side padding */
}

@media (min-width: 750px){

  /* Constrain ONLY this section wrapper */
  #shopify-section-template--19848293318895__image_with_text_overlay_zfUAbq{
    max-width: var(--iwto-oneoff-max) !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: var(--iwto-oneoff-gutter) !important;
    padding-right: var(--iwto-oneoff-gutter) !important;
    width: 100% !important;
  }

  /* If Flow adds an inner width container, constrain it too */
  #shopify-section-template--19848293318895__image_with_text_overlay_zfUAbq > .wrapper-spacing--h,
  #shopify-section-template--19848293318895__image_with_text_overlay_zfUAbq .width--content,
  #shopify-section-template--19848293318895__image_with_text_overlay_zfUAbq .image-with-text-overlay__grid,
  #shopify-section-template--19848293318895__image_with_text_overlay_zfUAbq .image-with-text-overlay__grid-foreground{
    max-width: var(--iwto-oneoff-max) !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: var(--iwto-oneoff-gutter) !important;
    padding-right: var(--iwto-oneoff-gutter) !important;
    width: 100% !important;
  }

  /* Remove extra caption padding just in this section */
  #shopify-section-template--19848293318895__image_with_text_overlay_zfUAbq .image-with-text-overlay__caption{
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}

/* Keep full-bleed on small screens */
@media (max-width: 749px){
  #shopify-section-template--19848293318895__image_with_text_overlay_zfUAbq{
    max-width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}

/* Collage • mobile height for the "FOOTWEAR ACCESSORIES" text tile */
@media (max-width: 749px){
  .collage-builder__text-container--text_zwApjf{
    --h: 100vw;                         /* adjust height here */
    min-height: var(--h) !important;
    height: var(--h) !important;
    background-size: cover !important; /* keep image full */
    background-position: center !important;
  }
}

/* Collage • mobile height for the middle image tile */
@media (max-width: 749px){
  .collage-builder__image_GBFRYW{
    --h: 100vw;                         /* adjust height here */
    min-height: var(--h) !important;
    height: var(--h) !important;
    background-size: cover !important;
    background-position: center !important;
  }
}

/* Collage • mobile height for the "ALBERTA BOOT CO." text tile */
@media (max-width: 749px){
  .collage-builder__text-container--image_AqUWKp{
    --h: 100vw;                         /* adjust height here */
    min-height: var(--h) !important;
    height: var(--h) !important;
    background-size: cover !important;
    background-position: center !important;
  }
}

/* Site-wide maintenance banner (neutral, Aktiv Grotesk) */
.maint-banner{
  background:#474747;           /* neutral dark */
  color:#fff;
  font-family: "Aktiv Grotesk Text","Aktiv Grotesk",system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif !important;
  font-weight: 400;              /* lighter weight */
}

.maint-banner__inner{
  display:flex;
  align-items:center;
  gap:.75rem;
  padding:.6rem 1rem;
}

.maint-banner__text{
  flex:1 1 auto;
  text-align:center;
  font: inherit;                 /* inherit Aktiv + size/weight */
  font-weight: 400;              /* ensure not bolded by theme */
}

.maint-banner__close{
  background:transparent;
  border:0;
  color:inherit;                 /* same white as text */
  font: inherit;                 /* Aktiv Grotesk */
  font-size:1rem;
  line-height:1;
  cursor:pointer;
  padding:.25rem .4rem;
  opacity:.95;
}

@media (min-width: 990px){
  .maint-banner__inner{ padding:.6rem 1.25rem; }
}

.cart-item__right .cart-item__subtotal{
  font-weight: 600;
  text-align: right;
  display: inline-block;
}

/* ABCO nav: restore normal weight and keep Aktiv */
.brand-abco .site-nav__link,
.brand-abco .menu-link a,
.brand-abco .header__menu-item,
.brand-abco .mega-menu-wrapper .mega-menu--links a,
.brand-abco .mobile-nav__link {
  font-family: var(--font-body) !important;
  font-weight: 400 !important;
}

/* === Maintenance banner: DISABLED === */
.maint-banner{ display:none !important; }

/* Countdown section CTA – white outline button, even when "Filled" */
.countdown__content-box-wrapper .btn.countdown__button {
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;

  color: #ffffff !important;
  border: 1px solid #ffffff !important;
}

/* Hover state */
.countdown__content-box-wrapper .btn.countdown__button:hover,
.countdown__content-box-wrapper .btn.countdown__button:focus-visible {
  background-color: #ffffff !important;
  color: #01273e !important; /* ABCO blue */
}

/* ---------- Product card sale pill ---------- */
.product-card__sale-pill-wrapper {
  margin-bottom: 0.25rem;
}

.product-card__sale-pill {
  display: inline-block;
  padding: 0.125rem 0.5rem;
  border-radius: 999px;
  background-color: #01273e; /* ABCO blue */
  color: #ffffff;
  font-size: 0.75rem;
  line-height: 1.2;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-weight: 600;
}

/* ---------- Stronger sale price weight ---------- */
/* Target the Flow product-grid price markup */
.product-grid--price .money.sale-price,
.product-grid--price .money.price--sale-price {
  font-weight: 600;
}

/* ============================
   Announcement bar – brand split
   ============================ */

/* ABCO: lock announcement bar to ABCO blue */
html.brand-abco .announcement_bar .announcement_block {
  background-color: #01273e !important;
  color: #ffffff !important;
}

html.brand-abco .announcement_bar .announcement_block a,
html.brand-abco .announcement_bar .announcement_block .announcement_text {
  color: #ffffff !important;
}

/* C&S: use the Olive / on-brand green tone */
html.brand-cands .announcement_bar .announcement_block {
  background-color: #31331F !important; /* C&S olive/green */
  color: #ffffff !important;
}

html.brand-cands .announcement_bar .announcement_block a,
html.brand-cands .announcement_bar .announcement_block .announcement_text {
  color: #ffffff !important;
}

/* Prevent horizontal scroll on mobile ONLY - No scrollbars */
@media (max-width: 768px) {
  html {
    overflow-x: hidden;
    overflow-y: auto;
    max-width: 100vw;
  }

  body {
    overflow-x: hidden;
    overflow-y: auto;
    max-width: 100vw;
    position: relative;
  }

  /* Prevent images and media from causing overflow */
  img,
  video,
  iframe {
    max-width: 100%;
    height: auto;
  }

  /* Fix for sections - no overflow property, just max-width */
  section,
  .section,
  [class*="section"] {
    max-width: 100vw;
  }

  /* Containers - max-width only */
  .container,
  [class*="container"]:not([class*="nav"]):not([class*="header"]) {
    max-width: 100vw;
  }

  /* Explicitly preserve navigation functionality on mobile */
  header,
  nav,
  [class*="nav"],
  [class*="menu"],
  [class*="header"] {
    max-width: none !important;
  }

  /* Allow carousels and sliders to work properly */
  .carousel-track,
  [class*="carousel"],
  [class*="slider"] {
    max-width: none;
  }
}

.custom-boots-hero-overlap {
  margin-top: -80px;
  position: relative;
  z-index: 5;
}

@media (min-width: 768px) {
  .custom-boots-hero-overlap {
    margin-top: -120px;
  }
}
```

Then add `custom-boots-hero-overlap` class to the next section's wrapper.

### **Option B: Shopify Section Setting**
If the next section has custom class field in its settings, add: `custom-boots-hero-overlap`

---

## ⚙️ **How the Controls Work:**

### **Circular Timer:**
```
 ⏸️  ← Play/Pause button in center
○────  ← Progress ring fills clockwise