/**
 * QASF Storefront frontend.
 * Visual ownership belongs to Commerce Studio X / Aqua Legendary.
 * This file intentionally contains no fixed palette or font family.
 */

.qasf-storefront,
.qasf-section {
  --qasf-primary: var(--csx-primary, var(--theme-palette-color-1));
  --qasf-secondary: var(--csx-secondary, var(--theme-palette-color-2));
  --qasf-accent: var(--csx-accent, var(--theme-palette-color-3));
  --qasf-surface: var(--csx-surface, var(--theme-palette-color-8));
  --qasf-surface-alt: var(--csx-surface-alt, var(--theme-palette-color-7));
  --qasf-text: var(--csx-text, var(--theme-text-color));
  --qasf-muted: var(--csx-muted, var(--theme-text-color));
  --qasf-border: var(--csx-border, var(--theme-border-color));
  --qasf-on-primary: var(--csx-on-primary, var(--qasf-surface));
  --qasf-glass: var(--csx-glass, color-mix(in srgb, var(--qasf-surface) 72%, transparent));
  --qasf-glass-strong: var(--csx-glass-strong, color-mix(in srgb, var(--qasf-surface) 88%, transparent));
  --qasf-primary-soft: var(--csx-primary-soft, color-mix(in srgb, var(--qasf-primary) 14%, transparent));
  --qasf-primary-border: var(--csx-primary-border, color-mix(in srgb, var(--qasf-primary) 34%, transparent));
  --qasf-shadow: var(--csx-shadow, 0 10px 30px color-mix(in srgb, var(--theme-text-color) 10%, transparent));
  --qasf-radius: var(--csx-radius, 14px);
  --qasf-card-radius: var(--csx-card-radius, var(--qasf-radius));
  --qasf-button-radius: var(--csx-button-radius, 8px);
  --qasf-space: var(--csx-section-space, 72px);
  --qasf-gutter: var(--csx-gutter, clamp(1rem, 4vw, 2.25rem));
  --qasf-motion: var(--csx-motion-duration, 180ms);
  --qasf-ease: var(--csx-ease, ease);
  --qasf-body-font: var(--csx-body-font, inherit);
  --qasf-heading-font: var(--csx-heading-font, inherit);
  color: var(--qasf-text);
  font-family: var(--qasf-body-font);
}

.qasf-storefront {
  overflow: clip;
}

.qasf-storefront *,
.qasf-storefront *::before,
.qasf-storefront *::after {
  box-sizing: border-box;
}

.qasf-container {
  inline-size: min(calc(100% - (var(--qasf-gutter) * 2)), var(--csx-container, 90rem));
  margin-inline: auto;
}

.qasf-section {
  position: relative;
  padding-block: clamp(calc(var(--qasf-space) * .58), 7vw, var(--qasf-space));
  content-visibility: auto;
  contain-intrinsic-size: auto 38rem;
}

.qasf-section--hero {
  padding-block: 0;
  content-visibility: visible;
  contain-intrinsic-size: none;
}

.qasf-section-heading {
  display: grid;
  gap: .65rem;
  max-inline-size: min(100%, 50rem);
  margin: 0 auto clamp(1.5rem, 4vw, 2.75rem);
  text-align: center;
}

.qasf-section-heading h1,
.qasf-section-heading h2,
.qasf-section-heading h3,
.qasf-hero-content h1,
.qasf-hero-content h2 {
  margin: 0;
  color: var(--qasf-text);
  font-family: var(--qasf-heading-font);
  font-weight: var(--csx-heading-weight, 800);
  line-height: 1.12;
  text-wrap: balance;
}

.qasf-section-heading h2 {
  font-size: clamp(1.65rem, 4vw, 2.75rem);
}

.qasf-section-heading p,
.qasf-feature-card p,
.qasf-cta p,
.qasf-hero-content p {
  margin: 0;
  color: var(--qasf-muted);
  line-height: 1.75;
  text-wrap: pretty;
}

.qasf-section-action {
  display: flex;
  justify-content: center;
  margin-block-start: clamp(1.25rem, 3vw, 2rem);
}

.qasf-button,
.qasf-section .button.qasf-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-block-size: 3rem;
  padding-inline: 1.35rem;
  border: 1px solid var(--qasf-primary);
  border-radius: var(--qasf-button-radius);
  background: var(--qasf-primary);
  color: var(--qasf-on-primary);
  font: inherit;
  font-weight: 750;
  text-decoration: none;
  box-shadow: 0 .65rem 1.8rem color-mix(in srgb, var(--qasf-primary) 22%, transparent);
  transition: transform var(--qasf-motion) var(--qasf-ease), box-shadow var(--qasf-motion) var(--qasf-ease), opacity var(--qasf-motion) var(--qasf-ease);
}

.qasf-button--secondary,
.qasf-section .button.qasf-button--secondary {
  border-color: var(--qasf-primary-border);
  background: var(--qasf-glass-strong);
  color: var(--qasf-text);
  box-shadow: none;
  backdrop-filter: blur(.75rem);
  -webkit-backdrop-filter: blur(.75rem);
}

.qasf-button:active {
  transform: translateY(1px);
}

.qasf-button:focus-visible,
.qasf-slider-arrow:focus-visible,
.qasf-slider-dots button:focus-visible {
  outline: 2px solid var(--qasf-primary);
  outline-offset: 3px;
}

/* Hero */
.qasf-hero {
  position: relative;
  min-block-size: var(--qasf-hero-m);
  background: var(--qasf-surface);
  isolation: isolate;
}

.qasf-hero > .qasf-slider-track,
.qasf-hero-slide {
  min-block-size: inherit;
}

.qasf-hero > .qasf-slider-track {
  display: grid;
  overflow: hidden;
}

.qasf-hero-slide {
  position: relative;
  display: grid;
  grid-area: 1 / 1;
  align-items: center;
  min-inline-size: 100%;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity calc(var(--qasf-motion) * 2) var(--qasf-ease), visibility calc(var(--qasf-motion) * 2) var(--qasf-ease);
}

.qasf-hero-slide:first-child {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.qasf-hero-slide.is-initialized {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.qasf-hero-slide.is-active {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.qasf-hero-media,
.qasf-hero-overlay {
  position: absolute;
  inset: 0;
}

.qasf-hero-media {
  z-index: -3;
  overflow: hidden;
  background: var(--qasf-surface-alt);
}

.qasf-hero-media img {
  inline-size: 100%;
  block-size: 100%;
  object-fit: cover;
  object-position: var(--qasf-focus-x) var(--qasf-focus-y);
}

.qasf-hero-media--fallback {
  background:
    radial-gradient(circle at 18% 22%, var(--qasf-primary-soft), transparent 38%),
    radial-gradient(circle at 78% 64%, color-mix(in srgb, var(--qasf-secondary) 18%, transparent), transparent 42%),
    linear-gradient(145deg, var(--qasf-surface), var(--qasf-surface-alt));
}

.qasf-hero-overlay {
  z-index: -2;
  background:
    linear-gradient(90deg, color-mix(in srgb, var(--qasf-surface) 92%, transparent), color-mix(in srgb, var(--qasf-surface) 54%, transparent) 62%, transparent),
    linear-gradient(0deg, color-mix(in srgb, var(--qasf-surface) 34%, transparent), transparent 50%);
}

.qasf-hero-content {
  display: grid;
  justify-items: start;
  gap: clamp(.85rem, 2vw, 1.35rem);
  max-inline-size: min(calc(100% - (var(--qasf-gutter) * 2)), var(--csx-container, 90rem));
  padding-block: clamp(5rem, 12vw, 9rem);
}

.qasf-hero-content > * {
  max-inline-size: min(100%, 44rem);
}

.qasf-hero-content h1,
.qasf-hero-content h2 {
  font-size: clamp(2.15rem, 7vw, 5rem);
  color: var(--qasf-text);
}

.qasf-hero-content p {
  max-inline-size: 40rem;
  font-size: clamp(1rem, 2.2vw, 1.25rem);
  color: color-mix(in srgb, var(--qasf-text) 82%, transparent);
}

.qasf-hero-badge {
  display: inline-flex;
  align-items: center;
  min-block-size: 2.25rem;
  padding-inline: .9rem;
  border: 1px solid var(--qasf-primary-border);
  border-radius: var(--qasf-button-radius);
  background: var(--qasf-glass);
  color: var(--qasf-primary);
  font-weight: 750;
  backdrop-filter: blur(.75rem);
  -webkit-backdrop-filter: blur(.75rem);
}

.qasf-hero-actions,
.qasf-cta-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
}

/* Native, progressively enhanced slider */
.qasf-display-slider {
  position: relative;
}

.qasf-display-slider > .qasf-slider-track,
.qasf-display-slider > .products {
  display: flex !important;
  gap: var(--csx-shop-gap, 1rem);
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  scroll-snap-type: inline mandatory;
  scrollbar-width: none;
  padding-block: .25rem 1rem;
}

.qasf-display-slider > .qasf-slider-track::-webkit-scrollbar,
.qasf-display-slider > .products::-webkit-scrollbar {
  display: none;
}

.qasf-display-slider > .qasf-slider-track > *,
.qasf-display-slider > .products > li.product {
  flex: 0 0 max(250px, calc((100% - ((var(--qasf-cols-m) - 1) * var(--csx-shop-gap, 1rem))) / var(--qasf-cols-m)));
  min-inline-size: 250px;
  scroll-snap-align: start;
}

.qasf-slider-arrows {
  display: flex;
  justify-content: center;
  gap: .65rem;
  margin-block-start: .75rem;
}

.qasf-hero > .qasf-slider-arrows {
  position: absolute;
  inset-inline: var(--qasf-gutter);
  inset-block-end: 1.25rem;
  z-index: 4;
  justify-content: flex-start;
  pointer-events: none;
}

.qasf-slider-arrow {
  display: inline-grid;
  place-items: center;
  inline-size: 2.75rem;
  block-size: 2.75rem;
  padding: 0;
  border: 1px solid var(--qasf-primary-border);
  border-radius: 50%;
  background: var(--qasf-glass-strong);
  color: var(--qasf-text);
  box-shadow: var(--qasf-shadow);
  cursor: pointer;
  pointer-events: auto;
  backdrop-filter: blur(.75rem);
  -webkit-backdrop-filter: blur(.75rem);
}

.qasf-slider-arrow svg {
  inline-size: 1.2rem;
  block-size: 1.2rem;
}

.qasf-slider-arrow:disabled {
  opacity: .35;
  cursor: not-allowed;
}

.qasf-slider-dots {
  display: flex;
  justify-content: center;
  gap: .45rem;
  margin-block-start: .75rem;
}

.qasf-hero > .qasf-slider-dots {
  position: absolute;
  inset-inline: 0;
  inset-block-end: 1.75rem;
  z-index: 4;
  margin: 0;
}

.qasf-slider-dots button {
  inline-size: .55rem;
  block-size: .55rem;
  padding: 0;
  border: 0;
  border-radius: var(--qasf-button-radius);
  background: var(--qasf-text);
  opacity: .35;
  cursor: pointer;
  transition: inline-size var(--qasf-motion) var(--qasf-ease), opacity var(--qasf-motion) var(--qasf-ease);
}

.qasf-slider-dots button.is-active {
  inline-size: 1.5rem;
  opacity: 1;
}

/* Responsive grids */
.qasf-display-grid,
.qasf-feature-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 12rem), 1fr));
  gap: var(--csx-shop-gap, 1rem);
  inline-size: 100%;
}

.qasf-term-grid.qasf-display-grid {
  grid-template-columns: repeat(var(--qasf-cols-m), minmax(0, 1fr));
}

/* WooCommerce product sections: structural rules only; Blocksy owns card visuals. */
.qasf-section--products .qasf-container{display:block!important;min-inline-size:0}
.qasf-product-wrap,.qasf-product-wrap.qasf-display-grid{display:block!important;inline-size:100%!important;min-inline-size:0}
.qasf-product-wrap>.products::before,.qasf-product-wrap>.products::after{display:none!important;content:none!important}
.qasf-product-wrap>.products>li.product{float:none!important;min-inline-size:0!important;margin:0!important}

/* Terms */
.qasf-term-card,
.qasf-feature-card,
.qasf-review-card,
.qasf-cta {
  border: 1px solid var(--qasf-border);
  border-radius: var(--qasf-card-radius);
  background: var(--qasf-glass);
  color: var(--qasf-text);
  box-shadow: var(--qasf-shadow);
  backdrop-filter: blur(.75rem);
  -webkit-backdrop-filter: blur(.75rem);
}

.qasf-term-card {
  display: grid;
  overflow: hidden;
  min-block-size: 100%;
  text-decoration: none;
  transition: transform var(--qasf-motion) var(--qasf-ease), border-color var(--qasf-motion) var(--qasf-ease), box-shadow var(--qasf-motion) var(--qasf-ease);
}

.qasf-term-media {
  display: grid;
  place-items: center;
  aspect-ratio: 1 / .72;
  padding: clamp(.8rem, 2vw, 1.35rem);
  background: var(--qasf-surface-alt);
}

.qasf-term-media img {
  inline-size: 100%;
  block-size: 100%;
  object-fit: contain;
}

.qasf-term-placeholder {
  display: grid;
  place-items: center;
  inline-size: 4rem;
  block-size: 4rem;
  border-radius: var(--qasf-card-radius);
  background: var(--qasf-primary-soft);
  color: var(--qasf-primary);
}

.qasf-term-placeholder svg {
  inline-size: 2rem;
  block-size: 2rem;
}

.qasf-term-content {
  display: grid;
  gap: .35rem;
  padding: 1rem;
}

.qasf-term-content strong {
  color: var(--qasf-text);
  font-family: var(--qasf-heading-font);
  font-size: clamp(.95rem, 2vw, 1.1rem);
}

.qasf-term-content small,
.qasf-term-content span {
  color: var(--qasf-muted);
}

/* Brand studio output */
.qasf-brands {
  --qasf-brand-logo-scale: 82%;
  --qasf-brand-media-padding: 20px;
  --qasf-brand-card-min-height: 180px;
}

.qasf-brands .qasf-term-card--brand {
  position: relative;
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  min-block-size: var(--qasf-brand-card-min-height);
  isolation: isolate;
  text-align: center;
  transform: translateZ(0);
}

.qasf-brands .qasf-term-media {
  min-block-size: 0;
  padding: var(--qasf-brand-media-padding);
  overflow: hidden;
}

.qasf-brand-ratio-square .qasf-term-media { aspect-ratio: 1 / 1; }
.qasf-brand-ratio-landscape .qasf-term-media { aspect-ratio: 4 / 3; }
.qasf-brand-ratio-wide .qasf-term-media { aspect-ratio: 16 / 9; }
.qasf-brand-ratio-auto .qasf-term-media { aspect-ratio: auto; min-block-size: calc(var(--qasf-brand-card-min-height) * .68); }

.qasf-brands .qasf-term-media img {
  display: block;
  inline-size: var(--qasf-brand-logo-scale);
  block-size: var(--qasf-brand-logo-scale);
  margin: auto;
  object-position: center;
  transition: transform var(--qasf-motion) var(--qasf-ease), filter var(--qasf-motion) var(--qasf-ease), opacity var(--qasf-motion) var(--qasf-ease);
}

.qasf-brand-fit-contain .qasf-term-media img { object-fit: contain; }
.qasf-brand-fit-cover .qasf-term-media,
.qasf-brand-fit-fill .qasf-term-media {
  padding: 0;
}

.qasf-brand-fit-cover .qasf-term-media img {
  inline-size: 100%;
  block-size: 100%;
  object-fit: cover;
}
.qasf-brand-fit-fill .qasf-term-media img {
  inline-size: 100%;
  block-size: 100%;
  object-fit: fill;
}

.qasf-brand-layout-logo-only .qasf-term-card--brand {
  grid-template-rows: minmax(0, 1fr);
}

.qasf-brand-layout-logo-only .qasf-term-media {
  aspect-ratio: auto;
  min-block-size: var(--qasf-brand-card-min-height);
}

.qasf-brands .qasf-term-content {
  justify-items: center;
  text-align: center;
}

.qasf-brand-align-right .qasf-term-content { justify-items: start; text-align: right; }
.qasf-brand-align-left .qasf-term-content { justify-items: end; text-align: left; }

.qasf-brand-style-soft .qasf-term-card--brand {
  background: var(--qasf-surface-alt);
  box-shadow: none;
}

.qasf-brand-style-glass .qasf-term-card--brand {
  background: var(--qasf-glass);
  backdrop-filter: blur(.75rem);
  -webkit-backdrop-filter: blur(.75rem);
}

.qasf-brand-style-plain .qasf-term-card--brand {
  border-color: transparent;
  background: transparent;
  box-shadow: none;
}

.qasf-brand-style-plain .qasf-term-media {
  background: transparent;
}

.qasf-brand-style-outline .qasf-term-card--brand {
  background: transparent;
  box-shadow: none;
}

.qasf-brand-effect-shine .qasf-term-card--brand::after {
  content: "";
  position: absolute;
  inset-block: -25%;
  inset-inline-start: -65%;
  inline-size: 38%;
  z-index: 2;
  background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--qasf-text) 18%, transparent), transparent);
  transform: skewX(-18deg);
  pointer-events: none;
  transition: inset-inline-start calc(var(--qasf-motion) * 3) var(--qasf-ease);
}

@media (hover: hover) and (pointer: fine) {
  .qasf-brand-effect-lift .qasf-term-card--brand:hover,
  .qasf-brand-effect-lift .qasf-term-card--brand:focus-visible {
    transform: translateY(-.35rem);
    border-color: var(--qasf-primary-border);
    box-shadow: var(--qasf-shadow);
  }

  .qasf-brand-effect-zoom .qasf-term-card--brand:hover .qasf-term-media img,
  .qasf-brand-effect-zoom .qasf-term-card--brand:focus-visible .qasf-term-media img {
    transform: scale(1.07);
  }

  .qasf-brand-effect-glow .qasf-term-card--brand:hover,
  .qasf-brand-effect-glow .qasf-term-card--brand:focus-visible {
    border-color: var(--qasf-primary-border);
    box-shadow: 0 0 0 1px var(--qasf-primary-border), 0 1rem 2.4rem color-mix(in srgb, var(--qasf-primary) 20%, transparent);
  }

  .qasf-brand-effect-shine .qasf-term-card--brand:hover::after,
  .qasf-brand-effect-shine .qasf-term-card--brand:focus-visible::after {
    inset-inline-start: 130%;
  }
}

.qasf-brands.qasf-display-slider > .qasf-slider-track > * {
  flex-basis: max(10rem, calc((100% - ((var(--qasf-cols-m) - 1) * var(--csx-shop-gap, 1rem))) / var(--qasf-cols-m)));
  min-inline-size: 10rem;
}

.qasf-section--brands .qasf-slider-arrows,
.qasf-section--brands .qasf-slider-dots {
  justify-content: center;
}

/* Features */
.qasf-feature-card {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 1rem;
  align-items: start;
  padding: clamp(1rem, 2.5vw, 1.5rem);
  min-block-size: 100%;
  text-decoration: none;
}

.qasf-feature-icon {
  display: grid;
  place-items: center;
  inline-size: 3rem;
  block-size: 3rem;
  border: 1px solid var(--qasf-primary-border);
  border-radius: var(--qasf-card-radius);
  background: var(--qasf-primary-soft);
  color: var(--qasf-primary);
}

.qasf-feature-icon svg {
  inline-size: 1.55rem;
  block-size: 1.55rem;
}

.qasf-feature-card h3 {
  margin: 0 0 .35rem;
  color: var(--qasf-text);
  font-family: var(--qasf-heading-font);
  font-size: 1.1rem;
}

/* Reviews */
.qasf-review-card {
  display: grid;
  gap: 1rem;
  min-block-size: 100%;
  padding: clamp(1rem, 2.5vw, 1.5rem);
}

.qasf-review-card__head {
  display: flex;
  align-items: center;
  gap: .75rem;
}

.qasf-review-card__avatar-wrap,
.qasf-review-card__avatar,
.qasf-review-card__initial {
  inline-size: 3rem;
  block-size: 3rem;
  flex: 0 0 3rem;
  border-radius: 50%;
}

.qasf-review-card__avatar {
  object-fit: cover;
}

.qasf-review-card__initial {
  display: grid;
  place-items: center;
  background: var(--qasf-primary-soft);
  color: var(--qasf-primary);
  font-weight: 800;
}

.qasf-review-card__identity {
  display: grid;
  min-inline-size: 0;
}

.qasf-review-card__identity strong {
  color: var(--qasf-text);
}

.qasf-review-card__identity small,
.qasf-review-card time {
  color: var(--qasf-muted);
}

.qasf-review-card__verified {
  margin-inline-start: auto;
  color: var(--qasf-accent);
  font-size: .8rem;
  font-weight: 750;
}

.qasf-review-card__text {
  margin: 0;
  padding: 0;
  border: 0;
  color: var(--qasf-text);
  font-size: 1rem;
  line-height: 1.8;
}

.qasf-review-card__ratings {
  display: grid;
  gap: .45rem;
}

.qasf-review-rating {
  display: flex;
  justify-content: space-between;
  gap: .75rem;
  color: var(--qasf-muted);
  font-size: .85rem;
}

.qasf-review-stars {
  color: var(--qasf-accent);
  letter-spacing: .08em;
}

.qasf-review-card__product {
  color: var(--qasf-primary);
  text-decoration: none;
  font-weight: 700;
}

/* CTA */
.qasf-cta {
  display: grid;
  gap: 1.5rem;
  align-items: center;
  padding: clamp(1.25rem, 4vw, 2.5rem);
  background:
    radial-gradient(circle at 15% 10%, var(--qasf-primary-soft), transparent 42%),
    var(--qasf-glass);
}

.qasf-cta .qasf-section-heading {
  margin: 0;
  text-align: start;
}

.qasf-cta .qasf-section-action {
  margin: 0;
}

.qasf-cta-actions {
  align-items: center;
  justify-content: flex-start;
}

.qasf-html {
  color: var(--qasf-text);
}

/* Visibility */
.qasf-hide-mobile {
  display: none;
}

.qasf-show-desktop {
  display: none;
}

@media (min-width: 48rem) {
  .qasf-hero {
    min-block-size: var(--qasf-hero-t);
  }

  .qasf-display-grid,
  .qasf-feature-grid {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 13rem), 1fr));
  }

  .qasf-term-grid.qasf-display-grid {
    grid-template-columns: repeat(var(--qasf-cols-t), minmax(0, 1fr));
  }

  .qasf-brands.qasf-display-slider > .qasf-slider-track > * {
    flex-basis: max(10rem, calc((100% - ((var(--qasf-cols-t) - 1) * var(--csx-shop-gap, 1rem))) / var(--qasf-cols-t)));
  }

  .qasf-display-slider > .qasf-slider-track > *,
  .qasf-display-slider > .products > li.product {
    flex-basis: max(250px, calc((100% - ((var(--qasf-cols-t) - 1) * var(--csx-shop-gap, 1rem))) / var(--qasf-cols-t)));
  }

  .qasf-cta {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .qasf-hide-mobile {
    display: block;
  }

  .qasf-hide-tablet {
    display: none;
  }

  .qasf-show-mobile {
    display: none;
  }

  .qasf-show-desktop {
    display: grid;
  }
}

@media (min-width: 64rem) {
  .qasf-hero {
    min-block-size: var(--qasf-hero-d);
  }

  .qasf-display-grid,
  .qasf-feature-grid {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr));
  }

  .qasf-term-grid.qasf-display-grid {
    grid-template-columns: repeat(var(--qasf-cols-d), minmax(0, 1fr));
  }

  .qasf-brands.qasf-display-slider > .qasf-slider-track > * {
    flex-basis: max(10rem, calc((100% - ((var(--qasf-cols-d) - 1) * var(--csx-shop-gap, 1rem))) / var(--qasf-cols-d)));
  }

  .qasf-display-slider > .qasf-slider-track > *,
  .qasf-display-slider > .products > li.product {
    flex-basis: max(250px, calc((100% - ((var(--qasf-cols-d) - 1) * var(--csx-shop-gap, 1rem))) / var(--qasf-cols-d)));
  }

  .qasf-hide-tablet {
    display: block;
  }

  .qasf-hide-desktop {
    display: none;
  }
}

@media (max-width: 47.99rem) {
  .qasf-hero-media img {
    object-position: var(--qasf-focus-m-x) var(--qasf-focus-m-y);
  }

  .qasf-hero-overlay {
    background:
      linear-gradient(0deg, color-mix(in srgb, var(--qasf-surface) 92%, transparent), color-mix(in srgb, var(--qasf-surface) 48%, transparent) 64%, transparent),
      linear-gradient(90deg, color-mix(in srgb, var(--qasf-surface) 38%, transparent), transparent);
  }

  .qasf-hero-content {
    align-content: end;
    justify-items: center;
    padding-block: 5.5rem 6.5rem;
    text-align: center;
  }

  .qasf-hero-actions {
    inline-size: 100%;
    justify-content: center;
  }

  .qasf-hero-actions .qasf-button {
    flex: 1 1 9rem;
  }

  .qasf-hero > .qasf-slider-arrows {
    display: none;
  }

  .qasf-term-content {
    padding: .8rem;
  }

  .qasf-feature-card {
    grid-template-columns: 2.7rem 1fr;
    gap: .8rem;
  }

  .qasf-feature-icon {
    inline-size: 2.7rem;
    block-size: 2.7rem;
  }

  .qasf-review-card__verified {
    display: none;
  }
}

@media (hover: hover) and (pointer: fine) {
  .qasf-button:hover,
  .qasf-term-card:hover,
  .qasf-feature-card:hover,
  .qasf-review-card:hover {
    transform: translateY(var(--csx-motion-lift, -2px));
  }

  .qasf-term-card:hover,
  .qasf-feature-card:hover,
  .qasf-review-card:hover {
    border-color: var(--qasf-primary-border);
    box-shadow: 0 1.25rem 3rem color-mix(in srgb, var(--qasf-text) 14%, transparent);
  }
}

@media (prefers-reduced-motion: reduce) {
  .qasf-storefront *,
  .qasf-storefront *::before,
  .qasf-storefront *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

@supports not (backdrop-filter: blur(.75rem)) {
  .qasf-term-card,
  .qasf-feature-card,
  .qasf-review-card,
  .qasf-cta,
  .qasf-hero-badge,
  .qasf-button--secondary,
  .qasf-slider-arrow {
    background: var(--qasf-surface);
  }
}

/* 1.3 — resilient edge hero, RTL text tones and product grid. */
.qasf-managed-page .entry-content > .qasf-storefront,
.qasf-managed-page .ct-container-full > .qasf-storefront,
.qasf-managed-page main > .qasf-storefront {
  inline-size: 100%;
  max-inline-size: none;
}

.qasf-section--edge {
  inline-size: 100vw;
  max-inline-size: none;
  margin-inline: calc(50% - 50vw);
  overflow: clip;
}

.qasf-section--hero-container {
  padding-inline: var(--qasf-gutter);
}

.qasf-section--hero-container .qasf-hero {
  max-inline-size: var(--csx-container, 90rem);
  margin-inline: auto;
  overflow: clip;
  border: 1px solid var(--qasf-border);
  border-radius: var(--qasf-card-radius);
}

.qasf-hero-slide {
  --qasf-hero-text: var(--qasf-text);
  --qasf-hero-muted: color-mix(in srgb, var(--qasf-hero-text) 82%, transparent);
  --qasf-hero-overlay-base: var(--qasf-surface);
  --qasf-hero-control-surface: var(--qasf-glass-strong);
  color: var(--qasf-hero-text);
}

.qasf-hero-slide.qasf-tone-light {
  --qasf-hero-text: var(--csx-dark-text, var(--qasf-text));
  --qasf-hero-overlay-base: var(--csx-dark-surface, var(--qasf-surface));
  --qasf-hero-control-surface: var(--csx-dark-surface-alt, var(--qasf-surface-alt));
}

.qasf-hero-slide.qasf-tone-dark {
  --qasf-hero-text: var(--csx-light-text, var(--qasf-text));
  --qasf-hero-overlay-base: var(--csx-light-surface, var(--qasf-surface));
  --qasf-hero-control-surface: var(--csx-light-surface-alt, var(--qasf-surface-alt));
}

.qasf-hero-slide.qasf-tone-custom {
  --qasf-hero-text: var(--qasf-hero-custom-text, var(--qasf-text));
}

.qasf-hero-overlay {
  background:
    linear-gradient(90deg, color-mix(in srgb, var(--qasf-hero-overlay-base) var(--qasf-overlay-strength, 56%), transparent), color-mix(in srgb, var(--qasf-hero-overlay-base) 28%, transparent) 62%, transparent),
    linear-gradient(0deg, color-mix(in srgb, var(--qasf-hero-overlay-base) 22%, transparent), transparent 52%);
}

.qasf-hero-content {
  align-content: center;
  min-block-size: inherit;
  padding-block: clamp(5.5rem, 12vw, 9rem);
  color: var(--qasf-hero-text);
}

body.qasf-overlay-header .qasf-hero-content {
  padding-block-start: clamp(7.25rem, 15vw, 11rem);
}

.qasf-hero-content h1,
.qasf-hero-content h2,
.qasf-hero-content p {
  color: inherit;
}

.qasf-hero-content p {
  color: var(--qasf-hero-muted);
}

.qasf-hero-badge {
  color: inherit;
  border-color: color-mix(in srgb, currentColor 34%, transparent);
  background: color-mix(in srgb, var(--qasf-hero-control-surface) 70%, transparent);
}

.qasf-tone-light .qasf-button--secondary,
.qasf-tone-dark .qasf-button--secondary,
.qasf-tone-custom .qasf-button--secondary {
  color: var(--qasf-hero-text);
  border-color: color-mix(in srgb, var(--qasf-hero-text) 36%, transparent);
  background: color-mix(in srgb, var(--qasf-hero-control-surface) 64%, transparent);
}

.qasf-content-right .qasf-hero-content {
  justify-items: start;
  margin-inline-start: auto;
}

.qasf-content-center .qasf-hero-content {
  justify-items: center;
  margin-inline: auto;
}

.qasf-content-left .qasf-hero-content {
  justify-items: end;
  margin-inline-end: auto;
}

.qasf-align-right .qasf-hero-content { text-align: right; }
.qasf-align-center .qasf-hero-content { text-align: center; }
.qasf-align-left .qasf-hero-content { text-align: left; }

.qasf-content-center .qasf-hero-actions,
.qasf-align-center .qasf-hero-actions {
  justify-content: center;
}

.qasf-content-left .qasf-hero-actions,
.qasf-align-left .qasf-hero-actions {
  justify-content: flex-end;
}

.qasf-section--products,.qasf-section--products .qasf-container,.qasf-section--products .qasf-product-wrap,.qasf-section--products ul.products{min-inline-size:0!important;max-inline-size:none!important}

@media (max-width: 47.99rem) {
  .qasf-hero-overlay {
    background:
      linear-gradient(0deg, color-mix(in srgb, var(--qasf-hero-overlay-base) var(--qasf-overlay-strength, 62%), transparent), color-mix(in srgb, var(--qasf-hero-overlay-base) 22%, transparent) 68%, transparent),
      linear-gradient(90deg, color-mix(in srgb, var(--qasf-hero-overlay-base) 18%, transparent), transparent);
  }

  .qasf-mobile-align-right .qasf-hero-content { text-align: right; justify-items: start; }
  .qasf-mobile-align-center .qasf-hero-content { text-align: center; justify-items: center; }
  .qasf-mobile-align-left .qasf-hero-content { text-align: left; justify-items: end; }

  .qasf-hero-content {
    align-content: end;
    padding-block: 5.75rem 6.5rem;
  }

  body.qasf-overlay-header .qasf-hero-content {
    padding-block-start: 7.5rem;
  }

  .qasf-section--hero-container {
    padding-inline: 0;
  }

  .qasf-section--hero-container .qasf-hero {
    border-inline: 0;
    border-radius: 0;
  }
}

@media (max-width: 17.99rem) {
  .qasf-product-wrap.qasf-display-grid > ul.products,
  .qasf-product-wrap.qasf-display-grid > .products,
  .qasf-product-wrap.qasf-display-grid ul.products[class*="columns-"] {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

/* Product-section columns are a QASF section-layout concern; gaps and card visuals come from Blocksy. */
.qasf-section--products .qasf-product-wrap.qasf-display-grid>ul.products,.qasf-section--products .qasf-product-wrap.qasf-display-grid>.products,.qasf-section--products .qasf-product-wrap.qasf-display-grid ul.products[class*="columns-"]{display:grid!important;grid-template-columns:repeat(var(--qasf-cols-m,2),minmax(0,1fr))!important;inline-size:100%!important;margin:0!important;padding:0!important;align-items:stretch}
@media(min-width:48rem){.qasf-section--products .qasf-product-wrap.qasf-display-grid>ul.products,.qasf-section--products .qasf-product-wrap.qasf-display-grid>.products,.qasf-section--products .qasf-product-wrap.qasf-display-grid ul.products[class*="columns-"]{grid-template-columns:repeat(var(--qasf-cols-t,3),minmax(0,1fr))!important}}
@media(min-width:64rem){.qasf-section--products .qasf-product-wrap.qasf-display-grid>ul.products,.qasf-section--products .qasf-product-wrap.qasf-display-grid>.products,.qasf-section--products .qasf-product-wrap.qasf-display-grid ul.products[class*="columns-"]{grid-template-columns:repeat(var(--qasf-cols-d,4),minmax(0,1fr))!important}}
