/* pool enclosure rev41 — 02-page-styles-rev41.css
   TARGET: child theme stylesheet (or a Bricks page-level CSS block)
   ---------------------------------------------------------------------------
   Every rule is scoped to .bnl-page--products-pool-enclosure or to a section id
   (#perf, #vibe, #compare-cta, #contractors, #sp-*), so this cannot leak into
   other pages. Requires tokens.css to be enqueued FIRST.

   Media paths point at /wp-content/uploads/bnlt/pool-enclosure/
   Brace balance and depth-walk asserted at build time (HANDOFF-STANDARD #4).
   --------------------------------------------------------------------------- */


/* =====================================================================
   TOKENS v1.2 PROPOSAL — heading font + tracking. Scoped to this page for
   preview. If approved, these become token changes and this block goes away.
===================================================================== */
.bnl-page--products-pool-enclosure {
  --font-heading-proposed: var(--font-heading); /* alias retained for back-compat; canonical token is --font-heading */
  --glow-ambient-teal: 0 0 48px -12px color-mix(in srgb, var(--color-primary) 55%, transparent);
  --glow-ambient-pink: 0 0 56px -10px color-mix(in srgb, var(--color-pink) 45%, transparent);
}

.bnl-page--products-pool-enclosure {
  background: var(--color-bg);
  color: var(--color-text);
  font-family: var(--font-body);
  font-size: var(--text-body);
  line-height: var(--line-height-body);
  overflow-x: clip;
}
.bnl-page--products-pool-enclosure img {
  max-width: 100%;
}
/* ---- Breadcrumbs ---- */
.bnl-page--products-pool-enclosure .bnl-crumbs {
  padding: var(--space-md) var(--space-md) 0;
  max-width: var(--width-content);
  margin: 0 auto;
}
.bnl-page--products-pool-enclosure .bnl-crumbs ol {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-xs);
  font-size: var(--text-small);
  color: var(--color-text-muted);
}
.bnl-page--products-pool-enclosure .bnl-crumbs li + li::before {
  content: "/";
  margin: 0 var(--space-xs);
  color: var(--color-border);
}
.bnl-page--products-pool-enclosure .bnl-crumbs a {
  color: var(--color-text-muted);
  text-decoration: none;
}
.bnl-page--products-pool-enclosure .bnl-crumbs a:hover { color: var(--color-primary); }
.bnl-page--products-pool-enclosure .bnl-crumbs [aria-current] { color: var(--color-text); }

/* anchor targets clear the sticky header when deep-linked */
.bnl-page--products-pool-enclosure section[id] { scroll-margin-top: 90px; }

/* ---- Ecosystem text links (crawlable, descriptive anchors) ---- */
.bnl-page--products-pool-enclosure .bnl-eco-links {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-sm);
  justify-content: center;
  margin-top: var(--space-lg);
}
.bnl-page--products-pool-enclosure .bnl-eco-links a {
  font-family: var(--font-heading-proposed);
  font-weight: var(--font-weight-semibold);
  font-size: var(--text-small);
  letter-spacing: .02em;
  color: var(--color-text);
  text-decoration: none;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-pill);
  padding: 9px 16px;
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  transition: border-color .2s ease, box-shadow .2s ease, color .2s ease;
}
.bnl-page--products-pool-enclosure .bnl-eco-links a:hover {
  border-color: var(--color-primary);
  color: var(--color-primary);
  box-shadow: var(--shadow-glow-teal);
}

/* ---- Sticky mobile quote bar (CSS only) ---- */
.bnl-page--products-pool-enclosure .bnl-sticky-cta {
  display: none;
}
@media (max-width: 767px) {
  .bnl-page--products-pool-enclosure { padding-bottom: 76px; }
  .bnl-page--products-pool-enclosure .bnl-sticky-cta {
    display: block;
    position: fixed;
    left: 0; right: 0; bottom: 0;
    z-index: 40;
    padding: var(--space-sm) var(--space-md);
    padding-bottom: max(var(--space-sm), env(safe-area-inset-bottom));
    background: color-mix(in srgb, var(--color-bg) 88%, transparent);
    backdrop-filter: blur(10px);
    border-top: 1px solid var(--color-border);
  }
  .bnl-page--products-pool-enclosure .bnl-sticky-cta .bnl-btn { display: block; }
}

.bnl-page--products-pool-enclosure .bnl-wide-img {
  width: 100%;
  height: auto;
  border-radius: var(--radius-md);
  display: block;
  margin-top: var(--space-lg);
}
.bnl-page--products-pool-enclosure .bnl-section {
  padding: var(--space-lg) var(--space-md);
}
.bnl-page--products-pool-enclosure .bnl-section--alt {
  /* Rev 24: seamless bands — fade to page bg at both edges (no hard seams),
     with off-axis teal/pink pools so the tint breathes instead of sitting flat */
  padding-top: var(--space-xl);
  padding-bottom: var(--space-xl);
  background:
    radial-gradient(90% 52% at 12% 26%, color-mix(in srgb, var(--color-primary) 10%, transparent), transparent 62%),
    radial-gradient(85% 48% at 88% 74%, color-mix(in srgb, var(--color-pink) 9%, transparent), transparent 62%),
    linear-gradient(180deg,
      transparent 0%,
      color-mix(in srgb, var(--color-bg-section) 55%, transparent) 9%,
      color-mix(in srgb, var(--color-bg-section) 82%, transparent) 22%,
      color-mix(in srgb, var(--color-bg-section) 82%, transparent) 78%,
      color-mix(in srgb, var(--color-bg-section) 55%, transparent) 91%,
      transparent 100%);
}
.bnl-page--products-pool-enclosure .bnl-gradient-text {
  background: var(--gradient-brand);
  -webkit-background-clip: text;
  background-clip: text;
  color: var(--color-pink); /* fallback */
  -webkit-text-fill-color: transparent;
}
.bnl-page--products-pool-enclosure .bnl-section__inner {
  max-width: var(--width-content);
  margin: 0 auto;
}
.bnl-page--products-pool-enclosure .bnl-heading {
  font-family: var(--font-heading-proposed);
  font-weight: var(--font-weight-bold);
  line-height: var(--line-height-heading);
  letter-spacing: -0.015em;
  margin: 0 0 var(--space-ml);
}
.bnl-page--products-pool-enclosure .bnl-heading--section {
  font-size: var(--text-h2);
}
.bnl-page--products-pool-enclosure .bnl-lede {
  color: var(--color-text-muted);
  margin: 0 0 var(--space-lg);
}

/* ---- Buttons ---- */
.bnl-page--products-pool-enclosure .bnl-btn {
  display: inline-block;
  min-height: 44px;
  padding: var(--space-md) var(--space-lg);
  border-radius: var(--radius-pill);
  font-family: var(--font-heading-proposed);
  font-weight: var(--font-weight-semibold);
  letter-spacing: var(--letter-spacing-heading);
  text-decoration: none;
  text-align: center;
  transition: box-shadow 0.2s ease, background-color 0.2s ease;
}
.bnl-page--products-pool-enclosure .bnl-btn--primary {
  background: transparent;
  color: var(--color-white);
  border: 1.5px solid var(--color-pink);
  box-shadow: var(--glow-ambient-pink);
}
.bnl-page--products-pool-enclosure .bnl-btn--primary:hover {
  box-shadow: var(--shadow-glow-pink);
  background: color-mix(in srgb, var(--color-pink) 12%, transparent);
}
.bnl-page--products-pool-enclosure .bnl-btn--secondary {
  background: transparent;
  color: var(--color-primary);
  border: 1px solid var(--color-primary);
}
.bnl-page--products-pool-enclosure .bnl-btn--secondary:hover {
  box-shadow: var(--shadow-glow-teal);
}
.bnl-page--products-pool-enclosure .bnl-btn--ghost {
  background: transparent;
  color: var(--color-white);
  border: 1.5px solid var(--color-pink);
  box-shadow: var(--glow-ambient-pink);
}
.bnl-page--products-pool-enclosure .bnl-btn--ghost:hover {
  box-shadow: var(--shadow-glow-pink);
}
/* PROPOSAL (tokens v1.2): larger section headings, less gradient */
.bnl-page--products-pool-enclosure .bnl-heading--section {
  font-size: clamp(30px, 4.6vw, 46px);
}
/* shared glow frame */
.bnl-page--products-pool-enclosure .bnl-glow-frame {
  border: 1px solid color-mix(in srgb, var(--color-pink) 40%, var(--color-border));
  border-radius: var(--radius-md);
  box-shadow: var(--glow-ambient-teal), var(--glow-ambient-pink);
}
/* photo hairline guards (color-wash + temperature stages tint per selection below) */
.bnl-page--products-pool-enclosure .bnl-temp__stage,
.bnl-page--products-pool-enclosure .bnl-cw__stage {
  border: 1.5px solid var(--color-border);
  transition: border-color .45s ease, box-shadow .45s ease;
}
/* By Day / By Night — framed with the brand glow */
.bnl-page--products-pool-enclosure .bnl-ba img {
  border: 1.5px solid color-mix(in srgb, var(--color-pink) 40%, var(--color-border));
  box-shadow: var(--glow-ambient-teal), var(--glow-ambient-pink);
}
/* Rev 25: day/night compare slider */
.bnl-page--products-pool-enclosure .bnl-ba-slider {
  position: relative;
  aspect-ratio: 4 / 3;
  border-radius: var(--radius-md);
  overflow: hidden;
  border: 1.5px solid color-mix(in srgb, var(--color-pink) 40%, var(--color-border));
  box-shadow: var(--glow-ambient-teal), var(--glow-ambient-pink);
  touch-action: pan-y;
}
.bnl-page--products-pool-enclosure .bnl-ba-slider img {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
  border: 0;
  box-shadow: none;
}
.bnl-page--products-pool-enclosure .bnl-ba-slider__top {
  position: absolute; inset: 0;
  clip-path: inset(0 calc(100% - var(--pos, 50%)) 0 0);
}
.bnl-page--products-pool-enclosure .bnl-ba-slider__divider {
  position: absolute; top: 0; bottom: 0;
  left: var(--pos, 50%);
  width: 3px;
  transform: translateX(-50%);
  background: var(--color-white);
  box-shadow: 0 0 14px rgba(0,0,0,.85);
  pointer-events: none;
  z-index: 2;
}
.bnl-page--products-pool-enclosure .bnl-ba-slider__knob {
  position: absolute; top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: 46px; height: 46px;
  display: grid; place-items: center;
  border-radius: var(--radius-pill);
  background: color-mix(in srgb, var(--color-bg) 55%, transparent);
  border: 1.5px solid var(--color-white);
  backdrop-filter: blur(6px);
  color: var(--color-white);
  font-size: 14px;
  white-space: nowrap;
}
.bnl-page--products-pool-enclosure .bnl-ba-slider__range {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  margin: 0;
  opacity: 0;
  cursor: ew-resize;
  -webkit-appearance: none;
  appearance: none;
  background: transparent;
  z-index: 3;
}
.bnl-page--products-pool-enclosure .bnl-ba-slider__range::-webkit-slider-thumb {
  -webkit-appearance: none; appearance: none;
  width: 64px; height: 480px;
  background: transparent;
}
.bnl-page--products-pool-enclosure .bnl-ba-slider__range::-moz-range-thumb {
  width: 64px; height: 480px; border: 0; background: transparent;
}
.bnl-page--products-pool-enclosure .bnl-ba-slider__tag {
  position: absolute; top: var(--space-md);
  padding: 6px 14px;
  border-radius: var(--radius-pill);
  background: color-mix(in srgb, var(--color-bg) 62%, transparent);
  border: 1px solid color-mix(in srgb, var(--color-border) 70%, transparent);
  backdrop-filter: blur(8px);
  font-family: var(--font-heading-proposed);
  font-size: var(--text-small);
  font-weight: var(--font-weight-semibold);
  letter-spacing: .08em;
  text-transform: uppercase;
  z-index: 2;
  pointer-events: none;
}
.bnl-page--products-pool-enclosure .bnl-ba-slider__tag--day { left: var(--space-md); }
.bnl-page--products-pool-enclosure .bnl-ba-slider__tag--night { right: var(--space-md); }
.bnl-page--products-pool-enclosure .bnl-ba-slider__hint {
  text-align: center;
  color: var(--color-text-muted);
  font-size: var(--text-small);
  margin-top: var(--space-md);
}
/* relocated feature grid + stats, inside the premium card */
.bnl-page--products-pool-enclosure .bnl-frame-card .bnl-stats {
  margin-top: var(--space-lg);
  padding-top: var(--space-lg);
  border-top: 1px solid color-mix(in srgb, var(--color-border) 60%, transparent);
}
/* Rev 26: icon bullet list (relocated color-wash features) */
.bnl-page--products-pool-enclosure .bnl-featlist {
  list-style: none;
  margin: var(--space-lg) 0 0;
  padding: var(--space-lg) 0 0;
  border-top: 1px solid color-mix(in srgb, var(--color-border) 60%, transparent);
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-md);
  text-align: left;
}
@media (min-width: 760px) {
  .bnl-page--products-pool-enclosure .bnl-featlist { grid-template-columns: 1fr 1fr; }
}
.bnl-page--products-pool-enclosure .bnl-featlist li {
  display: flex;
  align-items: flex-start;
  gap: var(--space-md);
}
.bnl-page--products-pool-enclosure .bnl-featlist__ic {
  flex-shrink: 0;
  width: 44px; height: 44px;
  display: grid; place-items: center;
  border-radius: var(--radius-pill);
  color: var(--color-primary);
  background: color-mix(in srgb, var(--color-primary) 12%, transparent);
  border: 1px solid color-mix(in srgb, var(--color-primary) 35%, transparent);
  box-shadow: 0 0 16px color-mix(in srgb, var(--color-primary) 18%, transparent);
}
.bnl-page--products-pool-enclosure .bnl-featlist b {
  display: block;
  font-family: var(--font-heading-proposed);
  letter-spacing: -0.01em;
  margin-bottom: 2px;
}
.bnl-page--products-pool-enclosure .bnl-featlist p {
  margin: 0;
  color: var(--color-text-muted);
  font-size: var(--text-small);
}
/* boxed statement card (Premium Lighting Without Compromise) */
.bnl-page--products-pool-enclosure .bnl-frame-card {
  border: 1px solid color-mix(in srgb, var(--color-pink) 40%, var(--color-border));
  border-radius: var(--radius-md);
  background: color-mix(in srgb, var(--color-bg-elevated) 88%, transparent);
  box-shadow: var(--glow-ambient-teal), var(--glow-ambient-pink);
  padding: var(--space-lg);
}
.bnl-page--products-pool-enclosure .bnl-frame-card > :last-child { margin-bottom: 0; }
/* framed More-Than split */
.bnl-page--products-pool-enclosure #why .bnl-split {
  border: 1px solid color-mix(in srgb, var(--color-pink) 40%, var(--color-border));
  border-radius: var(--radius-md);
  background: var(--color-bg-elevated);
  box-shadow: var(--glow-ambient-teal), var(--glow-ambient-pink);
  padding: var(--space-lg);
}
/* spec table redesign */
.bnl-page--products-pool-enclosure #specs .bnl-table-scroll {
  border: 1px solid color-mix(in srgb, var(--color-primary) 45%, var(--color-border));
  border-radius: var(--radius-md);
  background: var(--color-bg-elevated);
  box-shadow: var(--glow-ambient-teal);
}
.bnl-page--products-pool-enclosure #specs .bnl-table__head {
  font-size: var(--text-h3);
}
.bnl-page--products-pool-enclosure #specs .bnl-table__cell--label {
  color: var(--color-primary);
  font-family: var(--font-heading-proposed);
  font-size: var(--text-h3);
  letter-spacing: -0.01em;
}
.bnl-page--products-pool-enclosure #specs tbody tr:nth-child(odd) {
  background: color-mix(in srgb, var(--color-primary) 6%, transparent);
}
.bnl-page--products-pool-enclosure #specs tbody tr:nth-child(even) {
  background: color-mix(in srgb, var(--color-pink) 5%, transparent);
}
/* comparison table: keep brand column visually centered on phones */
@media (max-width: 640px) {
  .bnl-page--products-pool-enclosure .bnl-compare .bnl-table__cell--label,
  .bnl-page--products-pool-enclosure .bnl-compare .bnl-table__head:first-child {
    width: 36%;
    white-space: normal;
  }
}
/* stats extras */
.bnl-page--products-pool-enclosure .bnl-stats__note {
  display: block;
  margin-top: 6px;
  font-size: var(--text-small);
  color: var(--color-text-muted);
  text-decoration: underline;
}
.bnl-page--products-pool-enclosure .bnl-stats__note:hover { color: var(--color-primary); }
/* animated tap hint on the ecosystem map */
.bnl-page--products-pool-enclosure .bnl-eco__hint {
  position: absolute;
  top: var(--space-md);
  left: 4%;
  z-index: 4;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 18px;
  border-radius: var(--radius-pill);
  background: color-mix(in srgb, var(--color-bg) 70%, transparent);
  border: 1px solid var(--color-primary);
  backdrop-filter: blur(8px);
  font-family: var(--font-heading-proposed);
  font-size: var(--text-small);
  font-weight: var(--font-weight-semibold);
  pointer-events: none;
  box-shadow: var(--shadow-glow-teal);
  animation: bnl-hint-slide 6s ease-in-out infinite alternate;
}
.bnl-page--products-pool-enclosure .bnl-eco__hint span { font-size: 20px; animation: bnl-hint-bob 1.2s ease-in-out infinite alternate; }
@keyframes bnl-hint-slide { from { left: 4%; } to { left: calc(96% - 170px); } }
@keyframes bnl-hint-bob { from { transform: translateY(-3px); } to { transform: translateY(3px); } }
@media (prefers-reduced-motion: reduce) {
  .bnl-page--products-pool-enclosure .bnl-eco__hint { animation: none; left: 50%; transform: translateX(-50%); }
  .bnl-page--products-pool-enclosure .bnl-eco__hint span { animation: none; }
}
.bnl-page--products-pool-enclosure .bnl-btn:focus-visible,
.bnl-page--products-pool-enclosure .bnl-link:focus-visible,
.bnl-page--products-pool-enclosure .bnl-faq__q:focus-visible {
  outline: var(--focus-ring);
  outline-offset: var(--focus-ring-offset);
}
.bnl-page--products-pool-enclosure .bnl-link {
  color: var(--color-primary);
}
.bnl-page--products-pool-enclosure .bnl-btn-row {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-md);
}

/* ---- Hero (video band on top; content below; title slightly overlaps the video's bottom edge) ---- */
.bnl-page--products-pool-enclosure .bnl-hero {
  padding: 0;
}
.bnl-page--products-pool-enclosure .bnl-hero__media-frame {
  position: relative;
  height: min(64vh, 600px);
  overflow: hidden;
}
.bnl-page--products-pool-enclosure .bnl-hero__bg--video { object-position: center 42%; }
.bnl-hero__bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 30%;
}
@media (prefers-reduced-motion: reduce) {
  .bnl-page--products-pool-enclosure .bnl-hero__bg--video { display: none; }
}
.bnl-page--products-pool-enclosure .bnl-hero__media-frame::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(0deg, var(--color-bg) 0%, color-mix(in srgb, var(--color-bg) 55%, transparent) 18%, transparent 42%);
  pointer-events: none;
}
.bnl-page--products-pool-enclosure .bnl-hero__content {
  position: relative;
  z-index: 2;
  max-width: var(--width-content);
  margin: -44px auto 0;
  padding: 0 var(--space-md) var(--space-lg);
}
@media (min-width: 768px) {
  .bnl-page--products-pool-enclosure .bnl-hero__content {
    margin-top: -76px;
    padding: 0 var(--space-lg) var(--space-xl);
  }
}
.bnl-page--products-pool-enclosure .bnl-hero__inner { max-width: 720px; }
.bnl-page--products-pool-enclosure .bnl-hero .bnl-btn-row { justify-content: center; }
.bnl-page--products-pool-enclosure .bnl-hero__eyebrow {
  font-family: var(--font-heading-proposed);
  font-size: var(--text-small);
  font-weight: var(--font-weight-semibold);
  letter-spacing: var(--letter-spacing-heading);
  text-transform: uppercase;
  color: var(--color-primary);
  margin: 0 0 var(--space-sm);
  text-shadow: 0 2px 12px rgba(0,0,0,.8);
}
.bnl-page--products-pool-enclosure .bnl-hero__title {
  font-family: var(--font-heading-proposed);
  font-size: var(--text-h1);
  font-weight: 800;
  line-height: var(--line-height-heading);
  letter-spacing: -0.02em;
  margin: 0 0 var(--space-md);
  text-shadow: 0 2px 16px rgba(0,0,0,.75);
}

/* ---- Checkmark lists ---- */
.bnl-page--products-pool-enclosure .bnl-checks {
  list-style: none;
  margin: var(--space-md) 0 var(--space-lg);
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: var(--space-sm) var(--space-lg);
}
.bnl-page--products-pool-enclosure .bnl-checks li {
  position: relative;
  padding-left: 30px;
  font-family: var(--font-heading-proposed);
  font-weight: var(--font-weight-semibold);
  letter-spacing: -0.01em;
}
.bnl-page--products-pool-enclosure .bnl-checks li::before {
  content: "\2713";
  position: absolute;
  left: 0;
  color: var(--color-primary);
  font-weight: var(--font-weight-bold);
}

/* ---- Split (text + image) ---- */
.bnl-page--products-pool-enclosure .bnl-split {
  display: grid;
  gap: var(--space-lg);
  align-items: center;
}
@media (min-width: 900px) {
  .bnl-page--products-pool-enclosure .bnl-split { grid-template-columns: 1fr 1fr; }
}
.bnl-page--products-pool-enclosure .bnl-split__img {
  width: 100%;
  height: auto;
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-sm);
}

/* ---- Occasion chips ---- */
.bnl-page--products-pool-enclosure .bnl-chips {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-sm);
  margin: var(--space-md) 0 var(--space-lg);
}
.bnl-page--products-pool-enclosure .bnl-chips span {
  font-family: var(--font-heading-proposed);
  font-weight: var(--font-weight-semibold);
  font-size: var(--text-small);
  color: var(--color-text);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-pill);
  padding: 9px 16px;
  box-shadow: var(--glow-ambient-teal);
}

/* ---- Punch lines ---- */
.bnl-page--products-pool-enclosure .bnl-punch p {
  font-family: var(--font-heading-proposed);
  font-weight: var(--font-weight-semibold);
  margin: 0 0 var(--space-xs);
}
.bnl-page--products-pool-enclosure .bnl-punch p:last-child {
  color: var(--color-text-muted);
  font-family: var(--font-body);
  font-weight: 400;
  margin-top: var(--space-sm);
}

/* ---- Statistics band ---- */
.bnl-page--products-pool-enclosure .bnl-stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: var(--space-lg) var(--space-md);
  text-align: center;
}
.bnl-page--products-pool-enclosure .bnl-stats__num {
  display: block;
  font-family: var(--font-heading-proposed);
  font-weight: 800;
  font-size: clamp(34px, 5vw, 58px);
  letter-spacing: -0.02em;
  line-height: 1.05;
}
.bnl-page--products-pool-enclosure .bnl-stats__label {
  display: block;
  margin-top: var(--space-xs);
  color: var(--color-text-muted);
  font-family: var(--font-heading-proposed);
  font-size: var(--text-small);
  font-weight: var(--font-weight-semibold);
  letter-spacing: var(--letter-spacing-heading);
  text-transform: uppercase;
}

/* ---- Interactive stat counters (pure CSS: @property + counter; on hover/tap the
   number replays from 0. Browsers without @property simply show the final number.) ---- */
@property --bnl-statn { syntax: '<integer>'; inherits: false; initial-value: 0; }
.bnl-page--products-pool-enclosure .bnl-sr {
  position: absolute;
  width: 1px; height: 1px;
  clip-path: inset(50%);
  overflow: hidden;
}
.bnl-page--products-pool-enclosure .bnl-stats__item { cursor: default; outline: none; }
.bnl-page--products-pool-enclosure .bnl-stats__num {
  counter-reset: bnlstat var(--bnl-statn);
}
.bnl-page--products-pool-enclosure .bnl-stats__digits::before {
  content: counter(bnlstat);
}
.bnl-page--products-pool-enclosure .bnl-stats__item:hover .bnl-stats__num,
.bnl-page--products-pool-enclosure .bnl-stats__item:focus-visible .bnl-stats__num {
  animation: bnl-count-up 0.9s ease-out;
}
@keyframes bnl-count-up { from { --bnl-statn: 0; } }
@media (prefers-reduced-motion: reduce) {
  .bnl-page--products-pool-enclosure .bnl-stats__item:hover .bnl-stats__num,
  .bnl-page--products-pool-enclosure .bnl-stats__item:focus-visible .bnl-stats__num { animation: none; }
}

/* ---- Compare tool feature band ---- */
.bnl-page--products-pool-enclosure .bnl-compare-cta {
  margin-top: var(--space-xl);
  border: 1px solid color-mix(in srgb, var(--color-pink) 45%, var(--color-border));
  border-radius: var(--radius-md);
  padding: var(--space-xl) var(--space-lg);
  text-align: center;
  background: var(--color-bg-elevated);
  box-shadow: var(--glow-ambient-pink);
}
.bnl-page--products-pool-enclosure button.bnl-compare-cta__chip {
  font: inherit;
  cursor: pointer;
}
.bnl-page--products-pool-enclosure button.bnl-compare-cta__chip:hover {
  box-shadow: var(--shadow-glow-teal);
}
.bnl-page--products-pool-enclosure .bnl-compare-cta__vs {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: var(--space-md);
  margin: var(--space-lg) 0;
  font-family: var(--font-heading-proposed);
  font-weight: var(--font-weight-bold);
}
.bnl-page--products-pool-enclosure .bnl-compare-cta__chip {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-pill);
  padding: 12px 22px;
  font-size: var(--text-h3);
}
.bnl-page--products-pool-enclosure .bnl-compare-cta__chip--us {
  color: var(--color-primary);
  border-color: var(--color-primary);
  box-shadow: var(--shadow-glow-teal);
}
.bnl-page--products-pool-enclosure .bnl-compare-cta__chip--them {
  color: var(--color-text-muted);
  border-style: dashed;
}
.bnl-page--products-pool-enclosure .bnl-compare-cta__x {
  font-size: clamp(26px, 4vw, 40px);
  font-weight: 800;
}
.bnl-page--products-pool-enclosure .bnl-compare-cta__fine {
  margin-top: var(--space-md);
  font-size: var(--text-small);
  color: var(--color-text-muted);
}

/* ---- Apple-style closer ---- */
.bnl-page--products-pool-enclosure .bnl-closer {
  position: relative;
  min-height: min(64vh, 560px);
  display: flex;
  align-items: flex-end;
  justify-content: center;
  padding-bottom: var(--space-2xl);
  text-align: center;
  overflow: hidden;
  padding: var(--space-2xl) var(--space-md);
}
.bnl-page--products-pool-enclosure .bnl-closer__bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
}
.bnl-page--products-pool-enclosure .bnl-closer::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    linear-gradient(0deg, var(--color-bg) 0%, transparent 35%),
    linear-gradient(180deg, var(--color-bg) 0%, transparent 35%),
    color-mix(in srgb, var(--color-bg) 45%, transparent);
}
.bnl-page--products-pool-enclosure .bnl-closer__content {
  position: relative;
  z-index: 2;
}
.bnl-page--products-pool-enclosure .bnl-closer__title {
  font-family: var(--font-heading-proposed);
  font-weight: 800;
  font-size: clamp(34px, 6vw, 64px);
  letter-spacing: -0.02em;
  line-height: 1.1;
  margin: 0 0 var(--space-lg);
}

/* ---- Premium motion: CSS-only scroll reveal (progressive enhancement) ---- */
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    .bnl-page--products-pool-enclosure .bnl-card,
    .bnl-page--products-pool-enclosure .bnl-gallery__figure,
    .bnl-page--products-pool-enclosure .bnl-split__img,
    .bnl-page--products-pool-enclosure .bnl-stats > div,
    .bnl-page--products-pool-enclosure .bnl-ba figure {
      animation: bnl-rise-in both;
      animation-timeline: view();
      animation-range: entry 0% entry 55%;
    }
  }
}
@keyframes bnl-rise-in {
  from { opacity: 0.15; transform: translateY(18px); }
  to   { opacity: 1;    transform: none; }
}

/* ---- Interactive Color Wash slider (pure CSS radio carousel) ---- */
.bnl-page--products-pool-enclosure .bnl-cw__radio {
  position: absolute;
  width: 1px; height: 1px;
  clip-path: inset(50%);
  overflow: hidden;
}
.bnl-page--products-pool-enclosure .bnl-cw__stage {
  position: relative;
  aspect-ratio: 459 / 246;
  border-radius: var(--radius-md);
  overflow: hidden;
  box-shadow: var(--shadow-sm);
  margin-top: var(--space-lg);
}
.bnl-page--products-pool-enclosure .bnl-cw__img {
  position: absolute;
  inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  opacity: 0;
  transition: opacity .45s ease;
}
.bnl-page--products-pool-enclosure .bnl-cw__nav {
  display: none;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 46px; height: 46px;
  place-items: center;
  border-radius: var(--radius-pill);
  background: color-mix(in srgb, var(--color-bg) 55%, transparent);
  border: 1px solid var(--color-border);
  color: var(--color-text);
  font-size: 26px;
  cursor: pointer;
  z-index: 3;
  transition: box-shadow .2s ease, border-color .2s ease;
}
.bnl-page--products-pool-enclosure .bnl-cw__nav:hover { border-color: var(--color-primary); box-shadow: var(--shadow-glow-teal); }
.bnl-page--products-pool-enclosure .bnl-cw__nav--prev { left: var(--space-md); }
.bnl-page--products-pool-enclosure .bnl-cw__nav--next { right: var(--space-md); }
.bnl-page--products-pool-enclosure .bnl-cw__swatches {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--space-md) var(--space-ml);
  margin-top: var(--space-lg);
}
.bnl-page--products-pool-enclosure .bnl-cw__sw {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  cursor: pointer;
  font-family: var(--font-heading-proposed);
  font-size: var(--text-small);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text-muted);
  min-width: 44px;
}
.bnl-page--products-pool-enclosure .bnl-cw__dot {
  width: 34px; height: 34px;
  border-radius: var(--radius-pill);
  background: var(--sw);
  transition: box-shadow .2s ease, transform .2s ease;
}
.bnl-page--products-pool-enclosure .bnl-cw__sw:hover .bnl-cw__dot { transform: scale(1.12); }

/* ---- Season cards (hover to zoom ~35%) ---- */
.bnl-page--products-pool-enclosure .bnl-season {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--space-md);
}
@media (min-width: 900px) {
  .bnl-page--products-pool-enclosure .bnl-season { grid-template-columns: repeat(4, 1fr); }
}
.bnl-page--products-pool-enclosure .bnl-season__card {
  margin: 0;
  position: relative;
  transition: transform .3s ease;
  outline: none;
}
.bnl-page--products-pool-enclosure .bnl-season__card img {
  width: 100%; height: auto;
  border-radius: var(--radius-md);
  display: block;
  box-shadow: var(--shadow-sm);
}
.bnl-page--products-pool-enclosure .bnl-season__card figcaption {
  position: absolute; width: 1px; height: 1px; overflow: hidden;
  clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap;
}
.bnl-page--products-pool-enclosure .bnl-season__card figcaption b {
  display: block;
  font-family: var(--font-heading-proposed);
  letter-spacing: -0.01em;
}
.bnl-page--products-pool-enclosure .bnl-season__card figcaption span {
  color: var(--color-text-muted);
  font-size: var(--text-small);
}
@media (prefers-reduced-motion: no-preference) {
  .bnl-page--products-pool-enclosure .bnl-season__card:hover,
  .bnl-page--products-pool-enclosure .bnl-season__card:focus-visible {
    transform: scale(1.35);
    z-index: 6;
  }
  .bnl-page--products-pool-enclosure .bnl-season__card:hover img,
  .bnl-page--products-pool-enclosure .bnl-season__card:focus-visible img {
    box-shadow: var(--shadow-glow-teal), 0 18px 50px rgba(0,0,0,.6);
  }
}

/* ---- Temperature preset cards (real photos, pure CSS) ---- */
.bnl-page--products-pool-enclosure .bnl-temp__body {
  max-width: 860px;
  margin: var(--space-lg) auto 0;
}
.bnl-page--products-pool-enclosure .bnl-temp__stage {
  position: relative;
  aspect-ratio: 460 / 406;
  border-radius: var(--radius-md);
  overflow: hidden;
  box-shadow: var(--shadow-sm);
}
.bnl-page--products-pool-enclosure .bnl-temp__img {
  position: absolute;
  inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  opacity: 0;
  transition: opacity .4s ease;
}
.bnl-page--products-pool-enclosure .bnl-temp__info {
  display: none;
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.bnl-page--products-pool-enclosure .bnl-temp__badge {
  position: absolute;
  top: var(--space-md);
  left: var(--space-md);
  padding: 8px 16px;
  border-radius: var(--radius-pill);
  background: color-mix(in srgb, var(--color-bg) 62%, transparent);
  border: 1px solid color-mix(in srgb, var(--color-border) 70%, transparent);
  backdrop-filter: blur(8px);
  font-family: var(--font-heading-proposed);
  font-size: var(--text-small);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
}
.bnl-page--products-pool-enclosure .bnl-temp__cap {
  position: absolute;
  left: 0; right: 0; bottom: 0;
  padding: var(--space-xl) var(--space-md) var(--space-md);
  background: linear-gradient(0deg, color-mix(in srgb, var(--color-bg) 88%, transparent) 0%, transparent 100%);
}
.bnl-page--products-pool-enclosure .bnl-temp__cap b {
  display: block;
  font-family: var(--font-heading-proposed);
  font-size: var(--text-h3);
  letter-spacing: -0.01em;
  margin-bottom: 4px;
}
.bnl-page--products-pool-enclosure .bnl-temp__cap span {
  color: var(--color-text-muted);
  font-size: var(--text-small);
}
.bnl-page--products-pool-enclosure .bnl-temp__picker {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--space-sm);
  margin-top: var(--space-md);
}
.bnl-page--products-pool-enclosure .bnl-temp__opt {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  min-width: 82px;
  padding: 14px 16px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  cursor: pointer;
  font-family: var(--font-heading-proposed);
  font-size: var(--text-small);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text-muted);
  transition: border-color .2s ease, color .2s ease, box-shadow .2s ease;
}
.bnl-page--products-pool-enclosure .bnl-temp__opt:hover { border-color: var(--color-primary); color: var(--color-text); }
.bnl-page--products-pool-enclosure .bnl-temp__dot {
  width: 18px; height: 18px;
  border-radius: var(--radius-pill);
  background: var(--dot);
  box-shadow: 0 0 10px color-mix(in srgb, var(--dot) 70%, transparent);
}

/* Rev 24: the temperature stage frame glows in the selected kelvin tone */
.bnl-page--products-pool-enclosure #t-2000:checked ~ .bnl-temp__body .bnl-temp__stage { border-color: color-mix(in srgb, #E8951D 80%, var(--color-border)); box-shadow: 0 0 24px color-mix(in srgb, #E8951D 34%, transparent), 0 0 70px color-mix(in srgb, #E8951D 15%, transparent); }
.bnl-page--products-pool-enclosure #t-3000:checked ~ .bnl-temp__body .bnl-temp__stage { border-color: color-mix(in srgb, #F2C57F 80%, var(--color-border)); box-shadow: 0 0 24px color-mix(in srgb, #F2C57F 34%, transparent), 0 0 70px color-mix(in srgb, #F2C57F 15%, transparent); }
.bnl-page--products-pool-enclosure #t-4000:checked ~ .bnl-temp__body .bnl-temp__stage { border-color: color-mix(in srgb, #F6E7C8 80%, var(--color-border)); box-shadow: 0 0 24px color-mix(in srgb, #F6E7C8 34%, transparent), 0 0 70px color-mix(in srgb, #F6E7C8 15%, transparent); }
.bnl-page--products-pool-enclosure #t-5000:checked ~ .bnl-temp__body .bnl-temp__stage { border-color: color-mix(in srgb, #DCE8F5 80%, var(--color-border)); box-shadow: 0 0 24px color-mix(in srgb, #DCE8F5 34%, transparent), 0 0 70px color-mix(in srgb, #DCE8F5 15%, transparent); }
.bnl-page--products-pool-enclosure #t-7000:checked ~ .bnl-temp__body .bnl-temp__stage { border-color: color-mix(in srgb, #9CC4EE 80%, var(--color-border)); box-shadow: 0 0 24px color-mix(in srgb, #9CC4EE 34%, transparent), 0 0 70px color-mix(in srgb, #9CC4EE 15%, transparent); }
.bnl-page--products-pool-enclosure #t-2000:checked ~ .bnl-temp__body .bnl-temp__img--2000 { opacity: 1; }
.bnl-page--products-pool-enclosure #t-2000:checked ~ .bnl-temp__body .bnl-temp__info--2000 { display: block; }
.bnl-page--products-pool-enclosure #t-2000:checked ~ .bnl-temp__body .bnl-temp__picker label[for="t-2000"] { border-color: var(--color-primary); color: var(--color-text); box-shadow: var(--shadow-glow-teal); }
.bnl-page--products-pool-enclosure #t-2000:focus-visible ~ .bnl-temp__body .bnl-temp__picker label[for="t-2000"] { outline: var(--focus-ring); outline-offset: var(--focus-ring-offset); }
.bnl-page--products-pool-enclosure #t-3000:checked ~ .bnl-temp__body .bnl-temp__img--3000 { opacity: 1; }
.bnl-page--products-pool-enclosure #t-3000:checked ~ .bnl-temp__body .bnl-temp__info--3000 { display: block; }
.bnl-page--products-pool-enclosure #t-3000:checked ~ .bnl-temp__body .bnl-temp__picker label[for="t-3000"] { border-color: var(--color-primary); color: var(--color-text); box-shadow: var(--shadow-glow-teal); }
.bnl-page--products-pool-enclosure #t-3000:focus-visible ~ .bnl-temp__body .bnl-temp__picker label[for="t-3000"] { outline: var(--focus-ring); outline-offset: var(--focus-ring-offset); }
.bnl-page--products-pool-enclosure #t-4000:checked ~ .bnl-temp__body .bnl-temp__img--4000 { opacity: 1; }
.bnl-page--products-pool-enclosure #t-4000:checked ~ .bnl-temp__body .bnl-temp__info--4000 { display: block; }
.bnl-page--products-pool-enclosure #t-4000:checked ~ .bnl-temp__body .bnl-temp__picker label[for="t-4000"] { border-color: var(--color-primary); color: var(--color-text); box-shadow: var(--shadow-glow-teal); }
.bnl-page--products-pool-enclosure #t-4000:focus-visible ~ .bnl-temp__body .bnl-temp__picker label[for="t-4000"] { outline: var(--focus-ring); outline-offset: var(--focus-ring-offset); }
.bnl-page--products-pool-enclosure #t-5000:checked ~ .bnl-temp__body .bnl-temp__img--5000 { opacity: 1; }
.bnl-page--products-pool-enclosure #t-5000:checked ~ .bnl-temp__body .bnl-temp__info--5000 { display: block; }
.bnl-page--products-pool-enclosure #t-5000:checked ~ .bnl-temp__body .bnl-temp__picker label[for="t-5000"] { border-color: var(--color-primary); color: var(--color-text); box-shadow: var(--shadow-glow-teal); }
.bnl-page--products-pool-enclosure #t-5000:focus-visible ~ .bnl-temp__body .bnl-temp__picker label[for="t-5000"] { outline: var(--focus-ring); outline-offset: var(--focus-ring-offset); }
.bnl-page--products-pool-enclosure #t-7000:checked ~ .bnl-temp__body .bnl-temp__img--7000 { opacity: 1; }
.bnl-page--products-pool-enclosure #t-7000:checked ~ .bnl-temp__body .bnl-temp__info--7000 { display: block; }
.bnl-page--products-pool-enclosure #t-7000:checked ~ .bnl-temp__body .bnl-temp__picker label[for="t-7000"] { border-color: var(--color-primary); color: var(--color-text); box-shadow: var(--shadow-glow-teal); }
.bnl-page--products-pool-enclosure #t-7000:focus-visible ~ .bnl-temp__body .bnl-temp__picker label[for="t-7000"] { outline: var(--focus-ring); outline-offset: var(--focus-ring-offset); }


/* Rev 24: the stage frame glows in the selected wash color */
.bnl-page--products-pool-enclosure #cwc-red:checked ~ .bnl-cw__stage { border-color: #E23B3B; box-shadow: 0 0 0 1px color-mix(in srgb, #E23B3B 30%, transparent), 0 0 26px color-mix(in srgb, #E23B3B 45%, transparent), 0 0 78px color-mix(in srgb, #E23B3B 20%, transparent); }
.bnl-page--products-pool-enclosure #cwc-orange:checked ~ .bnl-cw__stage { border-color: #F5761A; box-shadow: 0 0 0 1px color-mix(in srgb, #F5761A 30%, transparent), 0 0 26px color-mix(in srgb, #F5761A 45%, transparent), 0 0 78px color-mix(in srgb, #F5761A 20%, transparent); }
.bnl-page--products-pool-enclosure #cwc-yellow:checked ~ .bnl-cw__stage { border-color: #F0C41B; box-shadow: 0 0 0 1px color-mix(in srgb, #F0C41B 30%, transparent), 0 0 26px color-mix(in srgb, #F0C41B 45%, transparent), 0 0 78px color-mix(in srgb, #F0C41B 20%, transparent); }
.bnl-page--products-pool-enclosure #cwc-green:checked ~ .bnl-cw__stage { border-color: #3FBF3F; box-shadow: 0 0 0 1px color-mix(in srgb, #3FBF3F 30%, transparent), 0 0 26px color-mix(in srgb, #3FBF3F 45%, transparent), 0 0 78px color-mix(in srgb, #3FBF3F 20%, transparent); }
.bnl-page--products-pool-enclosure #cwc-teal:checked ~ .bnl-cw__stage { border-color: #14B8A6; box-shadow: 0 0 0 1px color-mix(in srgb, #14B8A6 30%, transparent), 0 0 26px color-mix(in srgb, #14B8A6 45%, transparent), 0 0 78px color-mix(in srgb, #14B8A6 20%, transparent); }
.bnl-page--products-pool-enclosure #cwc-cyan:checked ~ .bnl-cw__stage { border-color: #22C7EE; box-shadow: 0 0 0 1px color-mix(in srgb, #22C7EE 30%, transparent), 0 0 26px color-mix(in srgb, #22C7EE 45%, transparent), 0 0 78px color-mix(in srgb, #22C7EE 20%, transparent); }
.bnl-page--products-pool-enclosure #cwc-blue:checked ~ .bnl-cw__stage { border-color: #2E5BFF; box-shadow: 0 0 0 1px color-mix(in srgb, #2E5BFF 30%, transparent), 0 0 26px color-mix(in srgb, #2E5BFF 45%, transparent), 0 0 78px color-mix(in srgb, #2E5BFF 20%, transparent); }
.bnl-page--products-pool-enclosure #cwc-indigo:checked ~ .bnl-cw__stage { border-color: #5B3FD4; box-shadow: 0 0 0 1px color-mix(in srgb, #5B3FD4 30%, transparent), 0 0 26px color-mix(in srgb, #5B3FD4 45%, transparent), 0 0 78px color-mix(in srgb, #5B3FD4 20%, transparent); }
.bnl-page--products-pool-enclosure #cwc-purple:checked ~ .bnl-cw__stage { border-color: #9A3FD4; box-shadow: 0 0 0 1px color-mix(in srgb, #9A3FD4 30%, transparent), 0 0 26px color-mix(in srgb, #9A3FD4 45%, transparent), 0 0 78px color-mix(in srgb, #9A3FD4 20%, transparent); }
.bnl-page--products-pool-enclosure #cwc-pink:checked ~ .bnl-cw__stage { border-color: #E23B8E; box-shadow: 0 0 0 1px color-mix(in srgb, #E23B8E 30%, transparent), 0 0 26px color-mix(in srgb, #E23B8E 45%, transparent), 0 0 78px color-mix(in srgb, #E23B8E 20%, transparent); }
.bnl-page--products-pool-enclosure #cwc-red:checked ~ .bnl-cw__stage .bnl-cw__img--red { opacity: 1; }
.bnl-page--products-pool-enclosure #cwc-red:checked ~ .bnl-cw__stage .bnl-cw__nav--for-red { display: grid; }
.bnl-page--products-pool-enclosure #cwc-red:checked ~ .bnl-cw__swatches label[for="cwc-red"] { color: var(--color-text); }
.bnl-page--products-pool-enclosure #cwc-red:checked ~ .bnl-cw__swatches label[for="cwc-red"] .bnl-cw__dot { box-shadow: 0 0 0 3px var(--color-bg), 0 0 0 5px var(--sw), 0 0 22px var(--sw); }
.bnl-page--products-pool-enclosure #cwc-red:focus-visible ~ .bnl-cw__swatches label[for="cwc-red"] { outline: var(--focus-ring); outline-offset: var(--focus-ring-offset); }
.bnl-page--products-pool-enclosure #cwc-orange:checked ~ .bnl-cw__stage .bnl-cw__img--orange { opacity: 1; }
.bnl-page--products-pool-enclosure #cwc-orange:checked ~ .bnl-cw__stage .bnl-cw__nav--for-orange { display: grid; }
.bnl-page--products-pool-enclosure #cwc-orange:checked ~ .bnl-cw__swatches label[for="cwc-orange"] { color: var(--color-text); }
.bnl-page--products-pool-enclosure #cwc-orange:checked ~ .bnl-cw__swatches label[for="cwc-orange"] .bnl-cw__dot { box-shadow: 0 0 0 3px var(--color-bg), 0 0 0 5px var(--sw), 0 0 22px var(--sw); }
.bnl-page--products-pool-enclosure #cwc-orange:focus-visible ~ .bnl-cw__swatches label[for="cwc-orange"] { outline: var(--focus-ring); outline-offset: var(--focus-ring-offset); }
.bnl-page--products-pool-enclosure #cwc-yellow:checked ~ .bnl-cw__stage .bnl-cw__img--yellow { opacity: 1; }
.bnl-page--products-pool-enclosure #cwc-yellow:checked ~ .bnl-cw__stage .bnl-cw__nav--for-yellow { display: grid; }
.bnl-page--products-pool-enclosure #cwc-yellow:checked ~ .bnl-cw__swatches label[for="cwc-yellow"] { color: var(--color-text); }
.bnl-page--products-pool-enclosure #cwc-yellow:checked ~ .bnl-cw__swatches label[for="cwc-yellow"] .bnl-cw__dot { box-shadow: 0 0 0 3px var(--color-bg), 0 0 0 5px var(--sw), 0 0 22px var(--sw); }
.bnl-page--products-pool-enclosure #cwc-yellow:focus-visible ~ .bnl-cw__swatches label[for="cwc-yellow"] { outline: var(--focus-ring); outline-offset: var(--focus-ring-offset); }
.bnl-page--products-pool-enclosure #cwc-green:checked ~ .bnl-cw__stage .bnl-cw__img--green { opacity: 1; }
.bnl-page--products-pool-enclosure #cwc-green:checked ~ .bnl-cw__stage .bnl-cw__nav--for-green { display: grid; }
.bnl-page--products-pool-enclosure #cwc-green:checked ~ .bnl-cw__swatches label[for="cwc-green"] { color: var(--color-text); }
.bnl-page--products-pool-enclosure #cwc-green:checked ~ .bnl-cw__swatches label[for="cwc-green"] .bnl-cw__dot { box-shadow: 0 0 0 3px var(--color-bg), 0 0 0 5px var(--sw), 0 0 22px var(--sw); }
.bnl-page--products-pool-enclosure #cwc-green:focus-visible ~ .bnl-cw__swatches label[for="cwc-green"] { outline: var(--focus-ring); outline-offset: var(--focus-ring-offset); }
.bnl-page--products-pool-enclosure #cwc-teal:checked ~ .bnl-cw__stage .bnl-cw__img--teal { opacity: 1; }
.bnl-page--products-pool-enclosure #cwc-teal:checked ~ .bnl-cw__stage .bnl-cw__nav--for-teal { display: grid; }
.bnl-page--products-pool-enclosure #cwc-teal:checked ~ .bnl-cw__swatches label[for="cwc-teal"] { color: var(--color-text); }
.bnl-page--products-pool-enclosure #cwc-teal:checked ~ .bnl-cw__swatches label[for="cwc-teal"] .bnl-cw__dot { box-shadow: 0 0 0 3px var(--color-bg), 0 0 0 5px var(--sw), 0 0 22px var(--sw); }
.bnl-page--products-pool-enclosure #cwc-teal:focus-visible ~ .bnl-cw__swatches label[for="cwc-teal"] { outline: var(--focus-ring); outline-offset: var(--focus-ring-offset); }
.bnl-page--products-pool-enclosure #cwc-cyan:checked ~ .bnl-cw__stage .bnl-cw__img--cyan { opacity: 1; }
.bnl-page--products-pool-enclosure #cwc-cyan:checked ~ .bnl-cw__stage .bnl-cw__nav--for-cyan { display: grid; }
.bnl-page--products-pool-enclosure #cwc-cyan:checked ~ .bnl-cw__swatches label[for="cwc-cyan"] { color: var(--color-text); }
.bnl-page--products-pool-enclosure #cwc-cyan:checked ~ .bnl-cw__swatches label[for="cwc-cyan"] .bnl-cw__dot { box-shadow: 0 0 0 3px var(--color-bg), 0 0 0 5px var(--sw), 0 0 22px var(--sw); }
.bnl-page--products-pool-enclosure #cwc-cyan:focus-visible ~ .bnl-cw__swatches label[for="cwc-cyan"] { outline: var(--focus-ring); outline-offset: var(--focus-ring-offset); }
.bnl-page--products-pool-enclosure #cwc-blue:checked ~ .bnl-cw__stage .bnl-cw__img--blue { opacity: 1; }
.bnl-page--products-pool-enclosure #cwc-blue:checked ~ .bnl-cw__stage .bnl-cw__nav--for-blue { display: grid; }
.bnl-page--products-pool-enclosure #cwc-blue:checked ~ .bnl-cw__swatches label[for="cwc-blue"] { color: var(--color-text); }
.bnl-page--products-pool-enclosure #cwc-blue:checked ~ .bnl-cw__swatches label[for="cwc-blue"] .bnl-cw__dot { box-shadow: 0 0 0 3px var(--color-bg), 0 0 0 5px var(--sw), 0 0 22px var(--sw); }
.bnl-page--products-pool-enclosure #cwc-blue:focus-visible ~ .bnl-cw__swatches label[for="cwc-blue"] { outline: var(--focus-ring); outline-offset: var(--focus-ring-offset); }
.bnl-page--products-pool-enclosure #cwc-indigo:checked ~ .bnl-cw__stage .bnl-cw__img--indigo { opacity: 1; }
.bnl-page--products-pool-enclosure #cwc-indigo:checked ~ .bnl-cw__stage .bnl-cw__nav--for-indigo { display: grid; }
.bnl-page--products-pool-enclosure #cwc-indigo:checked ~ .bnl-cw__swatches label[for="cwc-indigo"] { color: var(--color-text); }
.bnl-page--products-pool-enclosure #cwc-indigo:checked ~ .bnl-cw__swatches label[for="cwc-indigo"] .bnl-cw__dot { box-shadow: 0 0 0 3px var(--color-bg), 0 0 0 5px var(--sw), 0 0 22px var(--sw); }
.bnl-page--products-pool-enclosure #cwc-indigo:focus-visible ~ .bnl-cw__swatches label[for="cwc-indigo"] { outline: var(--focus-ring); outline-offset: var(--focus-ring-offset); }
.bnl-page--products-pool-enclosure #cwc-purple:checked ~ .bnl-cw__stage .bnl-cw__img--purple { opacity: 1; }
.bnl-page--products-pool-enclosure #cwc-purple:checked ~ .bnl-cw__stage .bnl-cw__nav--for-purple { display: grid; }
.bnl-page--products-pool-enclosure #cwc-purple:checked ~ .bnl-cw__swatches label[for="cwc-purple"] { color: var(--color-text); }
.bnl-page--products-pool-enclosure #cwc-purple:checked ~ .bnl-cw__swatches label[for="cwc-purple"] .bnl-cw__dot { box-shadow: 0 0 0 3px var(--color-bg), 0 0 0 5px var(--sw), 0 0 22px var(--sw); }
.bnl-page--products-pool-enclosure #cwc-purple:focus-visible ~ .bnl-cw__swatches label[for="cwc-purple"] { outline: var(--focus-ring); outline-offset: var(--focus-ring-offset); }
.bnl-page--products-pool-enclosure #cwc-pink:checked ~ .bnl-cw__stage .bnl-cw__img--pink { opacity: 1; }
.bnl-page--products-pool-enclosure #cwc-pink:checked ~ .bnl-cw__stage .bnl-cw__nav--for-pink { display: grid; }
.bnl-page--products-pool-enclosure #cwc-pink:checked ~ .bnl-cw__swatches label[for="cwc-pink"] { color: var(--color-text); }
.bnl-page--products-pool-enclosure #cwc-pink:checked ~ .bnl-cw__swatches label[for="cwc-pink"] .bnl-cw__dot { box-shadow: 0 0 0 3px var(--color-bg), 0 0 0 5px var(--sw), 0 0 22px var(--sw); }
.bnl-page--products-pool-enclosure #cwc-pink:focus-visible ~ .bnl-cw__swatches label[for="cwc-pink"] { outline: var(--focus-ring); outline-offset: var(--focus-ring-offset); }

/* ---- Testimonials ---- */
.bnl-page--products-pool-enclosure .bnl-quote {
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
}
.bnl-page--products-pool-enclosure .bnl-quote__stars {
  color: var(--color-orange);
  letter-spacing: .15em;
  font-size: var(--text-small);
}
.bnl-page--products-pool-enclosure .bnl-quote blockquote {
  margin: 0;
  font-style: italic;
  color: var(--color-text);
}
.bnl-page--products-pool-enclosure .bnl-quote figcaption {
  color: var(--color-text-muted);
  font-size: var(--text-small);
  font-family: var(--font-heading-proposed);
  font-weight: var(--font-weight-semibold);
}

/* ---- Before & After ---- */
.bnl-page--products-pool-enclosure .bnl-ba {
  display: grid;
  gap: var(--space-md);
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}
.bnl-page--products-pool-enclosure .bnl-ba figure { margin: 0; }
.bnl-page--products-pool-enclosure .bnl-ba img {
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: var(--radius-md);
  display: block;
}
.bnl-page--products-pool-enclosure .bnl-ba figcaption {
  font-family: var(--font-heading-proposed);
  font-size: var(--text-small);
  font-weight: var(--font-weight-semibold);
  letter-spacing: var(--letter-spacing-heading);
  text-transform: uppercase;
  color: var(--color-text-muted);
  margin-top: var(--space-sm);
  text-align: center;
}

/* ---- Benefits grid ---- */
.bnl-page--products-pool-enclosure .bnl-grid {
  display: grid;
  gap: var(--space-ml);
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}
.bnl-page--products-pool-enclosure .bnl-card {
  position: relative;
  background: var(--color-bg-elevated);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  padding: var(--space-ml);
  box-shadow: var(--shadow-sm);
  box-shadow: var(--glow-ambient-teal);
  transition: box-shadow 0.25s ease, transform 0.25s ease;
}
.bnl-page--products-pool-enclosure .bnl-card:hover {
  box-shadow: var(--shadow-glow-teal);
  transform: translateY(-2px);
}
.bnl-page--products-pool-enclosure .bnl-card__title {
  font-family: var(--font-heading-proposed);
  font-size: var(--text-h3);
  font-weight: var(--font-weight-semibold);
  line-height: var(--line-height-heading);
  letter-spacing: -0.01em;
  margin: 0 0 var(--space-sm);
  color: var(--color-primary);
}
.bnl-page--products-pool-enclosure .bnl-card__body {
  margin: 0;
  color: var(--color-text-muted);
}

/* ---- Spec + comparison tables ---- */
.bnl-page--products-pool-enclosure .bnl-table-scroll {
  overflow-x: auto;
}
.bnl-page--products-pool-enclosure .bnl-table {
  width: 100%;
  border-collapse: collapse;
  text-align: left;
}
.bnl-page--products-pool-enclosure .bnl-table__cell,
.bnl-page--products-pool-enclosure .bnl-table__head {
  padding: var(--space-md);
  border-bottom: 1px solid var(--color-border);
}
.bnl-page--products-pool-enclosure .bnl-table__head {
  font-family: var(--font-heading-proposed);
  font-weight: var(--font-weight-semibold);
  letter-spacing: -0.01em;
  color: var(--color-orange);
  white-space: nowrap;
}
.bnl-page--products-pool-enclosure .bnl-table__cell--label {
  color: var(--color-text);
  font-weight: var(--font-weight-semibold);
  white-space: nowrap;
}
.bnl-page--products-pool-enclosure .bnl-table__cell {
  color: var(--color-text-muted);
}
.bnl-page--products-pool-enclosure .bnl-compare {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  overflow: hidden;
  box-shadow: var(--shadow-sm);
  box-shadow: var(--glow-ambient-teal);
}
.bnl-page--products-pool-enclosure .bnl-compare .bnl-table__head {
  white-space: normal;
  text-align: center;
  vertical-align: middle;
  min-width: 170px;
}
.bnl-page--products-pool-enclosure .bnl-compare .bnl-table__head--brand {
  color: var(--color-primary);
  text-align: center;
  font-size: clamp(17px, 2.3vw, 22px);
  line-height: 1.25;
  min-width: 230px;
}
.bnl-page--products-pool-enclosure .bnl-compare .bnl-table__cell--brand {
  text-align: center;
}
.bnl-page--products-pool-enclosure .bnl-compare .bnl-table__cell--brand {
  color: var(--color-text);
  background: color-mix(in srgb, var(--color-primary) 6%, transparent);
}
.bnl-page--products-pool-enclosure .bnl-compare__foot {
  font-size: var(--text-small);
  color: var(--color-text-muted);
  margin-top: var(--space-md);
}

/* ---- Process steps ---- */
.bnl-page--products-pool-enclosure .bnl-steps {
  list-style: none;
  counter-reset: bnl-step;
  margin: 0;
  padding: 0;
  display: grid;
  gap: var(--space-ml);
}
.bnl-page--products-pool-enclosure .bnl-steps__item {
  counter-increment: bnl-step;
  position: relative;
  padding-left: var(--space-xl);
  color: var(--color-text-muted);
}
.bnl-page--products-pool-enclosure .bnl-steps__item::before {
  content: counter(bnl-step);
  position: absolute;
  left: 0;
  top: 0;
  width: 40px;
  height: 40px;
  display: grid;
  place-items: center;
  border-radius: var(--radius-pill);
  background: var(--gradient-brand);
  color: var(--color-white);
  font-family: var(--font-heading-proposed);
  font-weight: var(--font-weight-bold);
  box-shadow: var(--glow-ambient-pink);
}
.bnl-page--products-pool-enclosure .bnl-steps__title {
  display: block;
  color: var(--color-text);
  font-weight: var(--font-weight-semibold);
  margin-bottom: var(--space-xs);
}

/* ---- Contractor band ---- */
.bnl-page--products-pool-enclosure .bnl-pro-band {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  padding: var(--space-lg);
  background: var(--color-bg-elevated);
  box-shadow: var(--shadow-sm);
  box-shadow: var(--glow-ambient-pink);
  display: grid;
  gap: var(--space-md);
}
.bnl-page--products-pool-enclosure .bnl-pro-band__title {
  font-family: var(--font-heading-proposed);
  font-size: var(--text-h3);
  font-weight: var(--font-weight-semibold);
  margin: 0;
}
.bnl-page--products-pool-enclosure .bnl-pro-band__body {
  margin: 0;
  color: var(--color-text-muted);
}

/* ---- Gallery ---- */
.bnl-page--products-pool-enclosure .bnl-gallery {
  display: grid;
  gap: var(--space-md);
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  margin: 0;
}
.bnl-page--products-pool-enclosure .bnl-gallery__figure {
  margin: 0;
}
.bnl-page--products-pool-enclosure .bnl-gallery__img {
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: var(--radius-md);
  display: block;
}


/* ---- Tech panel (controller) ---- */
.bnl-page--products-pool-enclosure .bnl-tech {
  display: grid;
  justify-items: center;
}
.bnl-page--products-pool-enclosure .bnl-tech__media-wrap {
  position: relative;
  max-width: 820px;
  width: 100%;
}
.bnl-page--products-pool-enclosure .bnl-tech__media-wrap::before {
  content: "";
  position: absolute;
  inset: 6% 8%;
  background: var(--gradient-brand);
  filter: blur(70px);
  opacity: 0.22;
}
.bnl-page--products-pool-enclosure .bnl-tech__media {
  position: relative;
  width: 100%;
  height: auto;
  border-radius: var(--radius-md);
  border: 1px solid var(--color-border);
  box-shadow: var(--shadow-sm);
}

/* ---- Ecosystem map (clickable systems) ---- */
.bnl-page--products-pool-enclosure .bnl-eco {
  position: relative;
  max-width: 860px;
  margin: 0 auto;
  padding: var(--space-sm);
  background: var(--color-bg-elevated);
  border: 1px solid color-mix(in srgb, var(--color-pink) 45%, var(--color-border));
  border-radius: var(--radius-md);
  box-shadow: var(--glow-ambient-teal), var(--glow-ambient-pink);
}
.bnl-page--products-pool-enclosure .bnl-eco__img {
  width: 100%;
  height: auto;
  border-radius: var(--radius-md);
  border: 1px solid var(--color-border);
  display: block;
}
.bnl-page--products-pool-enclosure .bnl-eco__hot {
  position: absolute;
  display: block;
  border-radius: var(--radius-sm);
  border: 1px solid transparent;
  transition: border-color .2s ease, box-shadow .2s ease;
}
.bnl-page--products-pool-enclosure .bnl-eco__hot:hover,
.bnl-page--products-pool-enclosure .bnl-eco__hot:focus-visible {
  border-color: var(--color-primary);
  box-shadow: var(--shadow-glow-teal);
}

/* ---- FAQ ---- */
.bnl-page--products-pool-enclosure .bnl-faq__item {
  border-bottom: 1px solid var(--color-border);
  padding: var(--space-md) 0;
}
.bnl-page--products-pool-enclosure .bnl-faq__q {
  cursor: pointer;
  min-height: 44px;
  display: flex;
  align-items: center;
}
.bnl-page--products-pool-enclosure .bnl-faq__q-text {
  font-family: var(--font-heading-proposed);
  font-size: var(--text-h3);
  font-weight: var(--font-weight-semibold);
  line-height: var(--line-height-heading);
  letter-spacing: -0.01em;
  margin: 0;
  display: inline;
}
.bnl-page--products-pool-enclosure .bnl-faq__a {
  color: var(--color-text-muted);
  margin: var(--space-sm) 0 0;
}

/* ---- CTA band ---- */
.bnl-page--products-pool-enclosure .bnl-cta-band {
  position: relative;
  background:
    radial-gradient(70% 42% at 36% 30%, color-mix(in srgb, var(--color-pink) 10%, transparent), transparent 60%),
    radial-gradient(70% 42% at 66% 44%, color-mix(in srgb, var(--color-primary) 9%, transparent), transparent 60%),
    linear-gradient(180deg,
      transparent 0%,
      color-mix(in srgb, var(--color-bg-elevated) 55%, transparent) 16%,
      color-mix(in srgb, var(--color-bg-elevated) 90%, transparent) 42%,
      color-mix(in srgb, var(--color-bg-elevated) 90%, transparent) 70%,
      color-mix(in srgb, var(--color-bg-elevated) 45%, transparent) 88%,
      transparent 100%);
  text-align: center;
  overflow: hidden;
}
/* Rev 24: blurred blob retired — its hard clip line at the band's top edge was
   the last visible seam. The glow now lives in contained radial pools below. */
.bnl-page--products-pool-enclosure .bnl-cta-band::before { content: none; }
.bnl-page--products-pool-enclosure .bnl-cta-band .bnl-section__inner {
  position: relative;
}
.bnl-page--products-pool-enclosure .bnl-cta-band .bnl-btn-row {
  justify-content: center;
}
.bnl-page--products-pool-enclosure .bnl-cta-band .bnl-lede {
  margin-left: auto;
  margin-right: auto;
  max-width: 760px;
}

@media (min-width: 768px) {
  .bnl-page--products-pool-enclosure .bnl-section {
    padding: var(--space-xl) var(--space-lg);
  }
  .bnl-page--products-pool-enclosure .bnl-steps__item {
    padding-left: var(--space-2xl);
  }
  .bnl-page--products-pool-enclosure .bnl-pro-band {
    grid-template-columns: 1fr auto;
    align-items: center;
  }
}
@media (prefers-reduced-motion: reduce) {
  .bnl-page--products-pool-enclosure .bnl-btn,
  .bnl-page--products-pool-enclosure .bnl-card {
    transition: none;
  }
  .bnl-page--products-pool-enclosure .bnl-card:hover {
    transform: none;
  }
}



    #vibe .bnl-vibe{margin-top:2rem;}
    .bnl-vibe__card--vibe-warm-gold{background-image:url("/wp-content/uploads/bnlt/pool-enclosure/pool-16-bnl-vibe-card-vibe-warm-gold.webp");}
    .bnl-vibe__card--vibe-ice-white{background-image:url("/wp-content/uploads/bnlt/pool-enclosure/pool-17-bnl-vibe-card-vibe-ice-white.webp");}
    .bnl-vibe__card--vibe-emerald{background-image:url("/wp-content/uploads/bnlt/pool-enclosure/pool-18-bnl-vibe-card-vibe-emerald.webp");}
    .bnl-vibe__card--vibe-candlelight{background-image:url("/wp-content/uploads/bnlt/pool-enclosure/pool-19-bnl-vibe-card-vibe-candlelight.webp");}
    .bnl-vibe__card--vibe-magenta{background-image:url("/wp-content/uploads/bnlt/pool-enclosure/pool-20-bnl-vibe-card-vibe-magenta.webp");}
    #vibe .bnl-vibe__viewport{overflow:hidden;position:relative;border-radius:18px;
      -webkit-mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);
      mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);}
    #vibe .bnl-vibe__track{display:flex;gap:20px;width:max-content;
      animation:bnl-vibe-scroll 55s linear infinite;will-change:transform;}
    #vibe .bnl-vibe:hover .bnl-vibe__track,
    #vibe .bnl-vibe:focus-within .bnl-vibe__track{animation-play-state:paused;}
    @keyframes bnl-vibe-scroll{from{transform:translateX(0);}to{transform:translateX(calc(-50% - 10px));}}
    #vibe .bnl-vibe__card{position:relative;flex:0 0 auto;width:min(68vw,820px);aspect-ratio:4/3;
      border-radius:18px;background-size:cover;background-position:center;margin:0;
      box-shadow:0 12px 40px rgba(0,0,0,.45);border:1px solid rgba(255,255,255,.08);}
    #vibe .bnl-vibe__chip{position:absolute;left:16px;bottom:16px;display:flex;align-items:center;gap:10px;
      padding:.55rem .95rem;border-radius:999px;background:rgba(10,12,20,.62);
      backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.14);
      color:#fff;font-size:.92rem;line-height:1;}
    #vibe .bnl-vibe__chip strong{font-weight:700;letter-spacing:.01em;}
    #vibe .bnl-vibe__chip em{font-style:normal;opacity:.72;font-size:.85em;}
    #vibe .bnl-vibe__dot{width:.7rem;height:.7rem;border-radius:50%;background:var(--vd,#fff);
      box-shadow:0 0 10px var(--vd,#fff);flex:0 0 auto;}
    #vibe .bnl-vibe__hint{margin-top:1rem;text-align:center;font-size:.9rem;opacity:.6;}
    @media (prefers-reduced-motion:reduce){
      #vibe .bnl-vibe__track{animation:none;}
      #vibe .bnl-vibe__viewport{overflow-x:auto;-webkit-overflow-scrolling:touch;mask-image:none;-webkit-mask-image:none;}
    }
    @media (max-width:640px){
      #vibe .bnl-vibe__card{width:82vw;}
      #vibe .bnl-vibe__chip em{display:none;}
    }
    


/* ===== Interactive spec panel (CSS-only port of PoolEnclosureSpecs.jsx) ===== */
#specs .bnl-sp{color:#EDEFEF}
#specs .bnl-sp__r{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
#specs .bnl-sp__ic{flex:none;stroke:#35CFC9}
#specs .bnl-heading--section{text-align:center}
#specs .bnl-sp__feat{cursor:pointer;transition:background .2s ease}
#specs .bnl-sp__feat:hover{background:rgba(53,207,201,0.06)}
#specs .bnl-sp__feat:hover .bnl-sp__feat-t{color:#35CFC9}
#specs .bnl-sp__hint{text-align:center;font-size:.82rem;color:rgba(237,239,239,0.38);margin:-8px 0 14px}
@media (max-width:899px){#specs .bnl-sp__feat:last-of-type{grid-column:1 / -1;justify-content:center}}
#specs .bnl-sp__strip{display:grid;grid-template-columns:repeat(5,1fr);background:#101314;border:1px solid rgba(255,255,255,0.07);border-radius:18px;margin:26px 0 18px;overflow:hidden}
#specs .bnl-sp__feat{display:flex;align-items:center;gap:13px;padding:18px 20px}
#specs .bnl-sp__feat+.bnl-sp__feat{border-left:1px solid rgba(255,255,255,0.07)}
#specs .bnl-sp__feat-t{font-size:.92rem;font-weight:600;line-height:1.25}
#specs .bnl-sp__feat-b{font-size:.82rem;color:rgba(237,239,239,0.6);line-height:1.3;margin-top:2px}
#specs .bnl-sp__layout{display:grid;grid-template-columns:252px 1fr;gap:18px;align-items:start}
#specs .bnl-sp__nav{background:#101314;border:1px solid rgba(255,255,255,0.07);border-radius:18px;padding:8px;position:sticky;top:20px}
#specs .bnl-sp__nav-item{display:flex;align-items:center;gap:13px;width:100%;padding:13px 16px;border-radius:12px;border-left:2.5px solid transparent;color:rgba(237,239,239,0.6);font-size:.94rem;font-weight:500;cursor:pointer;transition:color .2s ease,background .2s ease}
#specs .bnl-sp__nav-item:hover{color:#EDEFEF;background:rgba(255,255,255,0.03)}
#specs .bnl-sp__nav-item .bnl-sp__ic{stroke:currentColor}
#specs .bnl-sp__panel{background:#101314;border:1px solid rgba(255,255,255,0.07);border-radius:18px;padding:26px 28px 30px;min-width:0}
#specs .bnl-sp__view{display:none;animation:bnlSpFade .28s ease}
@keyframes bnlSpFade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
#specs .bnl-sp__ptitle{color:#35CFC9;font-size:1.18rem;font-weight:700;margin:0 0 10px}
#specs .bnl-sp__body{font-size:.97rem;line-height:1.7;margin:0 0 14px;max-width:640px}
#specs .bnl-sp__rows{margin-top:18px}
#specs .bnl-sp__row{display:grid;grid-template-columns:56px 1fr 300px;gap:18px;align-items:center;padding:20px 6px;border-top:1px solid rgba(255,255,255,0.07);border-radius:12px;cursor:pointer;transition:background .2s ease}
#specs .bnl-sp__row:hover{background:rgba(53,207,201,0.045)}
#specs .bnl-sp__row:hover .bnl-sp__row-title{color:#35CFC9}
#specs .bnl-sp__row-ic{align-self:start;margin-top:4px}
#specs .bnl-sp__row-title{display:block;font-size:1.06rem;font-weight:700;margin-bottom:5px;transition:color .2s ease}
#specs .bnl-sp__row-desc{display:block;font-size:.91rem;color:rgba(237,239,239,0.6);line-height:1.6}
#specs .bnl-sp__row-vis{min-height:74px;border-radius:14px;overflow:hidden;display:flex;align-items:center;justify-content:center}
#specs .bnl-sp__row-vis--photo{height:96px;background:#0B0F10;border:1px solid rgba(255,255,255,0.07)}
#specs .bnl-sp__row-chev{display:none}
#specs .bnl-sp__vsvg{width:100%;height:100%;display:block;font-family:inherit}
#specs .bnl-sp__badge{display:flex;align-items:center;justify-content:center;gap:12px;border-radius:14px;border:1px solid rgba(53,207,201,0.28);background:rgba(53,207,201,0.07);padding:16px 20px;width:100%;min-height:74px}
#specs .bnl-sp__badge-big{color:#35CFC9;font-size:1.19rem;font-weight:700;line-height:1.2;letter-spacing:-0.01em}
#specs .bnl-sp__badge-sm{font-size:.85rem;font-weight:500;opacity:.85;margin-top:2px}
#specs .bnl-sp__wheel{border-radius:50%;flex:none;position:relative;display:inline-block;background:conic-gradient(#ff3b30,#ff9500,#ffe234,#8be32f,#2fd0c9,#2f8fe3,#7a4de3,#e34dd0,#ff3b30)}
#specs .bnl-sp__wheel-in{position:absolute;inset:24%;border-radius:50%;background:#0B0F10}
#specs .bnl-sp__wheel-core{position:absolute;inset:36%;border-radius:50%;background:#fff}
#specs .bnl-sp__back{display:inline-flex;align-items:center;gap:7px;color:rgba(237,239,239,0.6);font-size:.88rem;font-weight:600;cursor:pointer;padding:4px 0;margin-bottom:16px}
#specs .bnl-sp__back:hover{color:#EDEFEF}
#specs .bnl-sp__back .bnl-sp__ic{stroke:currentColor}
#specs .bnl-sp__dhead{display:flex;align-items:center;gap:14px;margin-bottom:16px}
#specs .bnl-sp__dhead h3{font-size:1.5rem;font-weight:700;margin:0}
#specs .bnl-sp__dvis{border-radius:16px;overflow:hidden;margin-bottom:20px}
#specs .bnl-sp__dvis--photo{background:#0B0F10;border:1px solid rgba(255,255,255,0.07);height:150px;display:flex;align-items:center;justify-content:center}
#specs .bnl-sp__dvis--badge{max-width:380px}
#specs .bnl-sp__bullets{margin:0;padding:0;list-style:none}
#specs .bnl-sp__bullets li{display:flex;gap:10px;align-items:flex-start;padding:5px 0;font-size:.94rem;color:rgba(237,239,239,0.6);line-height:1.55}
#specs .bnl-sp__bullets .bnl-sp__ic{margin-top:4px}
#specs .bnl-sp__kit{margin-top:20px}
#specs .bnl-sp__kit-label{font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;color:rgba(237,239,239,0.38);font-weight:600;margin:0 0 10px}
#specs .bnl-sp__kit-chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}
#specs .bnl-sp__kit-chip{padding:11px 16px;border-radius:12px;font-size:.94rem;font-weight:700;cursor:pointer;min-width:74px;text-align:center;color:rgba(237,239,239,0.6);border:1px solid rgba(255,255,255,0.07);transition:all .2s ease}
#specs .bnl-sp__kitbar{position:relative;height:8px;border-radius:999px;background:rgba(255,255,255,0.06);margin-bottom:6px;overflow:hidden}
#specs .bnl-sp__kitfill{position:absolute;left:0;top:0;bottom:0;border-radius:999px;background:linear-gradient(90deg,#35CFC9,rgba(53,207,201,0.55));box-shadow:0 0 14px rgba(53,207,201,0.35);transition:width .35s ease}
#specs .bnl-sp__kit-scale{display:flex;justify-content:space-between;font-size:.75rem;color:rgba(237,239,239,0.38);margin-bottom:12px}
#specs .bnl-sp__kitinfo{display:none;border-radius:14px;border:1px solid rgba(53,207,201,0.28);background:rgba(53,207,201,0.07);padding:14px 16px;font-size:.91rem;line-height:1.6}
#specs .bnl-sp__kitinfo strong{color:#35CFC9}
#specs .bnl-sp__dls{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
#specs .bnl-sp__dl{display:inline-flex;align-items:center;gap:8px;padding:12px 16px;border-radius:12px;font-size:.88rem;font-weight:600;text-decoration:none;color:#35CFC9;background:rgba(53,207,201,0.07);border:1px solid rgba(53,207,201,0.28)}
#specs .bnl-sp__dl-cta{display:inline-flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:52px;padding:14px 18px;border-radius:12px;background:#35CFC9;color:#06201f;font-size:.94rem;font-weight:700;text-decoration:none;transition:transform .2s ease,box-shadow .2s ease}
#specs .bnl-sp__dl-cta:hover{transform:translateY(-2px);box-shadow:0 8px 26px rgba(53,207,201,0.3)}
#specs .bnl-sp__dl-cta .bnl-sp__ic{stroke:currentColor}
#specs #sp-v-overview:checked ~ .bnl-sp__layout .bnl-sp__view--overview{display:block}
#specs #sp-v-overview:checked ~ .bnl-sp__layout .bnl-sp__nav label[for="sp-v-overview"]{color:#35CFC9;background:rgba(53,207,201,0.08);border-left-color:#35CFC9;font-weight:700}
#specs #sp-v-overview:focus-visible ~ .bnl-sp__layout .bnl-sp__nav label[for="sp-v-overview"]{outline:2px solid #35CFC9;outline-offset:2px}
#specs #sp-v-architecture:checked ~ .bnl-sp__layout .bnl-sp__view--architecture{display:block}
#specs #sp-v-architecture:checked ~ .bnl-sp__layout .bnl-sp__nav label[for="sp-v-architecture"]{color:#35CFC9;background:rgba(53,207,201,0.08);border-left-color:#35CFC9;font-weight:700}
#specs #sp-v-architecture:focus-visible ~ .bnl-sp__layout .bnl-sp__nav label[for="sp-v-architecture"]{outline:2px solid #35CFC9;outline-offset:2px}
#specs #sp-v-sizes:checked ~ .bnl-sp__layout .bnl-sp__view--sizes{display:block}
#specs #sp-v-sizes:checked ~ .bnl-sp__layout .bnl-sp__nav label[for="sp-v-sizes"]{color:#35CFC9;background:rgba(53,207,201,0.08);border-left-color:#35CFC9;font-weight:700}
#specs #sp-v-sizes:focus-visible ~ .bnl-sp__layout .bnl-sp__nav label[for="sp-v-sizes"]{outline:2px solid #35CFC9;outline-offset:2px}
#specs #sp-v-power:checked ~ .bnl-sp__layout .bnl-sp__view--power{display:block}
#specs #sp-v-power:checked ~ .bnl-sp__layout .bnl-sp__nav label[for="sp-v-power"]{color:#35CFC9;background:rgba(53,207,201,0.08);border-left-color:#35CFC9;font-weight:700}
#specs #sp-v-power:focus-visible ~ .bnl-sp__layout .bnl-sp__nav label[for="sp-v-power"]{outline:2px solid #35CFC9;outline-offset:2px}
#specs #sp-v-connectors:checked ~ .bnl-sp__layout .bnl-sp__view--connectors{display:block}
#specs #sp-v-connectors:checked ~ .bnl-sp__layout .bnl-sp__nav label[for="sp-v-connectors"]{color:#35CFC9;background:rgba(53,207,201,0.08);border-left-color:#35CFC9;font-weight:700}
#specs #sp-v-connectors:focus-visible ~ .bnl-sp__layout .bnl-sp__nav label[for="sp-v-connectors"]{outline:2px solid #35CFC9;outline-offset:2px}
#specs #sp-v-wiring:checked ~ .bnl-sp__layout .bnl-sp__view--wiring{display:block}
#specs #sp-v-wiring:checked ~ .bnl-sp__layout .bnl-sp__nav label[for="sp-v-wiring"]{color:#35CFC9;background:rgba(53,207,201,0.08);border-left-color:#35CFC9;font-weight:700}
#specs #sp-v-wiring:focus-visible ~ .bnl-sp__layout .bnl-sp__nav label[for="sp-v-wiring"]{outline:2px solid #35CFC9;outline-offset:2px}
#specs #sp-v-mounting:checked ~ .bnl-sp__layout .bnl-sp__view--mounting{display:block}
#specs #sp-v-mounting:checked ~ .bnl-sp__layout .bnl-sp__nav label[for="sp-v-mounting"]{color:#35CFC9;background:rgba(53,207,201,0.08);border-left-color:#35CFC9;font-weight:700}
#specs #sp-v-mounting:focus-visible ~ .bnl-sp__layout .bnl-sp__nav label[for="sp-v-mounting"]{outline:2px solid #35CFC9;outline-offset:2px}
#specs #sp-v-track:checked ~ .bnl-sp__layout .bnl-sp__view--track{display:block}
#specs #sp-v-track:checked ~ .bnl-sp__layout .bnl-sp__nav label[for="sp-v-track"]{color:#35CFC9;background:rgba(53,207,201,0.08);border-left-color:#35CFC9;font-weight:700}
#specs #sp-v-track:focus-visible ~ .bnl-sp__layout .bnl-sp__nav label[for="sp-v-track"]{outline:2px solid #35CFC9;outline-offset:2px}
#specs #sp-v-led:checked ~ .bnl-sp__layout .bnl-sp__view--led{display:block}
#specs #sp-v-led:checked ~ .bnl-sp__layout .bnl-sp__nav label[for="sp-v-led"]{color:#35CFC9;background:rgba(53,207,201,0.08);border-left-color:#35CFC9;font-weight:700}
#specs #sp-v-led:focus-visible ~ .bnl-sp__layout .bnl-sp__nav label[for="sp-v-led"]{outline:2px solid #35CFC9;outline-offset:2px}
#specs #sp-v-environmental:checked ~ .bnl-sp__layout .bnl-sp__view--environmental{display:block}
#specs #sp-v-environmental:checked ~ .bnl-sp__layout .bnl-sp__nav label[for="sp-v-environmental"]{color:#35CFC9;background:rgba(53,207,201,0.08);border-left-color:#35CFC9;font-weight:700}
#specs #sp-v-environmental:focus-visible ~ .bnl-sp__layout .bnl-sp__nav label[for="sp-v-environmental"]{outline:2px solid #35CFC9;outline-offset:2px}
#specs #sp-v-control:checked ~ .bnl-sp__layout .bnl-sp__view--control{display:block}
#specs #sp-v-control:checked ~ .bnl-sp__layout .bnl-sp__nav label[for="sp-v-control"]{color:#35CFC9;background:rgba(53,207,201,0.08);border-left-color:#35CFC9;font-weight:700}
#specs #sp-v-control:focus-visible ~ .bnl-sp__layout .bnl-sp__nav label[for="sp-v-control"]{outline:2px solid #35CFC9;outline-offset:2px}
#specs #sp-v-compatibility:checked ~ .bnl-sp__layout .bnl-sp__view--compatibility{display:block}
#specs #sp-v-compatibility:checked ~ .bnl-sp__layout .bnl-sp__nav label[for="sp-v-compatibility"]{color:#35CFC9;background:rgba(53,207,201,0.08);border-left-color:#35CFC9;font-weight:700}
#specs #sp-v-compatibility:focus-visible ~ .bnl-sp__layout .bnl-sp__nav label[for="sp-v-compatibility"]{outline:2px solid #35CFC9;outline-offset:2px}
#specs #sp-v-warranty:checked ~ .bnl-sp__layout .bnl-sp__view--warranty{display:block}
#specs #sp-v-warranty:checked ~ .bnl-sp__layout .bnl-sp__nav label[for="sp-v-warranty"]{color:#35CFC9;background:rgba(53,207,201,0.08);border-left-color:#35CFC9;font-weight:700}
#specs #sp-v-warranty:focus-visible ~ .bnl-sp__layout .bnl-sp__nav label[for="sp-v-warranty"]{outline:2px solid #35CFC9;outline-offset:2px}
#specs #sp-v-downloads:checked ~ .bnl-sp__layout .bnl-sp__view--downloads{display:block}
#specs #sp-v-downloads:checked ~ .bnl-sp__layout .bnl-sp__nav label[for="sp-v-downloads"]{color:#35CFC9;background:rgba(53,207,201,0.08);border-left-color:#35CFC9;font-weight:700}
#specs #sp-v-downloads:focus-visible ~ .bnl-sp__layout .bnl-sp__nav label[for="sp-v-downloads"]{outline:2px solid #35CFC9;outline-offset:2px}
#specs #sp-k-100:checked ~ .bnl-sp__layout .bnl-sp__kitfill{width:10.0%}
#specs #sp-k-100:checked ~ .bnl-sp__layout .bnl-sp__kitinfo--100{display:block}
#specs #sp-k-100:checked ~ .bnl-sp__layout .bnl-sp__kit-chips label[for="sp-k-100"]{background:#35CFC9;color:#06201f;border-color:#35CFC9}
#specs #sp-k-100:checked ~ .bnl-sp__layout .bnl-sp__kit-cur::after{content:"100 ft kit"}
#specs #sp-k-150:checked ~ .bnl-sp__layout .bnl-sp__kitfill{width:15.0%}
#specs #sp-k-150:checked ~ .bnl-sp__layout .bnl-sp__kitinfo--150{display:block}
#specs #sp-k-150:checked ~ .bnl-sp__layout .bnl-sp__kit-chips label[for="sp-k-150"]{background:#35CFC9;color:#06201f;border-color:#35CFC9}
#specs #sp-k-150:checked ~ .bnl-sp__layout .bnl-sp__kit-cur::after{content:"150 ft kit"}
#specs #sp-k-200:checked ~ .bnl-sp__layout .bnl-sp__kitfill{width:20.0%}
#specs #sp-k-200:checked ~ .bnl-sp__layout .bnl-sp__kitinfo--200{display:block}
#specs #sp-k-200:checked ~ .bnl-sp__layout .bnl-sp__kit-chips label[for="sp-k-200"]{background:#35CFC9;color:#06201f;border-color:#35CFC9}
#specs #sp-k-200:checked ~ .bnl-sp__layout .bnl-sp__kit-cur::after{content:"200 ft kit"}
#specs #sp-k-250:checked ~ .bnl-sp__layout .bnl-sp__kitfill{width:25.0%}
#specs #sp-k-250:checked ~ .bnl-sp__layout .bnl-sp__kitinfo--250{display:block}
#specs #sp-k-250:checked ~ .bnl-sp__layout .bnl-sp__kit-chips label[for="sp-k-250"]{background:#35CFC9;color:#06201f;border-color:#35CFC9}
#specs #sp-k-250:checked ~ .bnl-sp__layout .bnl-sp__kit-cur::after{content:"250 ft kit"}
#specs #sp-k-300:checked ~ .bnl-sp__layout .bnl-sp__kitfill{width:30.0%}
#specs #sp-k-300:checked ~ .bnl-sp__layout .bnl-sp__kitinfo--300{display:block}
#specs #sp-k-300:checked ~ .bnl-sp__layout .bnl-sp__kit-chips label[for="sp-k-300"]{background:#35CFC9;color:#06201f;border-color:#35CFC9}
#specs #sp-k-300:checked ~ .bnl-sp__layout .bnl-sp__kit-cur::after{content:"300 ft kit"}
@media (max-width:899px){
#specs .bnl-sp__strip{grid-template-columns:repeat(auto-fit,minmax(140px,1fr))}
#specs .bnl-sp__feat+.bnl-sp__feat{border-left:none}
#specs .bnl-sp__layout{display:block}
#specs .bnl-sp__nav{position:sticky;top:0;z-index:20;display:flex;gap:8px;overflow-x:auto;padding:10px 2px;margin-bottom:12px;background:rgba(10,10,10,0.88);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:none;border-radius:0;scrollbar-width:none}
#specs .bnl-sp__nav::-webkit-scrollbar{display:none}
#specs .bnl-sp__nav-item{flex:none;width:auto;padding:9px 15px;border-radius:999px;border:1px solid rgba(255,255,255,0.07);border-left-width:1px;background:#101314;font-size:.86rem;font-weight:600}
#specs .bnl-sp__nav-item .bnl-sp__ic{display:none}
#specs .bnl-sp__panel{padding:20px 16px 24px}
#specs .bnl-sp__row{grid-template-columns:44px 1fr auto;gap:12px;padding:16px 4px}
#specs .bnl-sp__row-vis{display:none}
#specs .bnl-sp__row-chev{display:block;color:rgba(237,239,239,0.38)}
#specs .bnl-sp__row-chev .bnl-sp__ic{stroke:currentColor}
#specs .bnl-sp__dvis--photo{height:110px}
#specs .bnl-sp__dhead h3{font-size:1.3rem}
}
@media (max-width:899px){
#specs #sp-v-overview:checked ~ .bnl-sp__layout .bnl-sp__nav label[for="sp-v-overview"]{background:#35CFC9;color:#06201f;border-color:#35CFC9}
#specs #sp-v-architecture:checked ~ .bnl-sp__layout .bnl-sp__nav label[for="sp-v-architecture"]{background:#35CFC9;color:#06201f;border-color:#35CFC9}
#specs #sp-v-sizes:checked ~ .bnl-sp__layout .bnl-sp__nav label[for="sp-v-sizes"]{background:#35CFC9;color:#06201f;border-color:#35CFC9}
#specs #sp-v-power:checked ~ .bnl-sp__layout .bnl-sp__nav label[for="sp-v-power"]{background:#35CFC9;color:#06201f;border-color:#35CFC9}
#specs #sp-v-connectors:checked ~ .bnl-sp__layout .bnl-sp__nav label[for="sp-v-connectors"]{background:#35CFC9;color:#06201f;border-color:#35CFC9}
#specs #sp-v-wiring:checked ~ .bnl-sp__layout .bnl-sp__nav label[for="sp-v-wiring"]{background:#35CFC9;color:#06201f;border-color:#35CFC9}
#specs #sp-v-mounting:checked ~ .bnl-sp__layout .bnl-sp__nav label[for="sp-v-mounting"]{background:#35CFC9;color:#06201f;border-color:#35CFC9}
#specs #sp-v-track:checked ~ .bnl-sp__layout .bnl-sp__nav label[for="sp-v-track"]{background:#35CFC9;color:#06201f;border-color:#35CFC9}
#specs #sp-v-led:checked ~ .bnl-sp__layout .bnl-sp__nav label[for="sp-v-led"]{background:#35CFC9;color:#06201f;border-color:#35CFC9}
#specs #sp-v-environmental:checked ~ .bnl-sp__layout .bnl-sp__nav label[for="sp-v-environmental"]{background:#35CFC9;color:#06201f;border-color:#35CFC9}
#specs #sp-v-control:checked ~ .bnl-sp__layout .bnl-sp__nav label[for="sp-v-control"]{background:#35CFC9;color:#06201f;border-color:#35CFC9}
#specs #sp-v-compatibility:checked ~ .bnl-sp__layout .bnl-sp__nav label[for="sp-v-compatibility"]{background:#35CFC9;color:#06201f;border-color:#35CFC9}
#specs #sp-v-warranty:checked ~ .bnl-sp__layout .bnl-sp__nav label[for="sp-v-warranty"]{background:#35CFC9;color:#06201f;border-color:#35CFC9}
#specs #sp-v-downloads:checked ~ .bnl-sp__layout .bnl-sp__nav label[for="sp-v-downloads"]{background:#35CFC9;color:#06201f;border-color:#35CFC9}
}
@media (prefers-reduced-motion:reduce){
#specs .bnl-sp__view{animation:none}
#specs .bnl-sp__kitfill,#specs .bnl-sp__row,#specs .bnl-sp__nav-item,#specs .bnl-sp__kit-chip,#specs .bnl-sp__dl-cta{transition:none}
}



    #compare-cta .bnl-vs__stack{text-align:center;max-width:900px;margin:0 auto;}
    #compare-cta .bnl-vs__brand{font-family:var(--font-heading-proposed);font-weight:800;font-size:clamp(1.5rem,3.4vw,2.4rem);letter-spacing:-0.01em;}
    #compare-cta .bnl-vs__badge{display:inline-flex;align-items:center;justify-content:center;width:64px;height:64px;border-radius:50%;
      margin:18px auto;font-weight:800;font-size:1.25rem;color:#fff;border:1.5px solid var(--color-pink);
      box-shadow:var(--hglow-pink);background:color-mix(in srgb, var(--color-pink) 14%, transparent);}
    #compare-cta .bnl-vs__viewport{overflow:hidden;margin-top:6px;
      -webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);
      mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);}
    #compare-cta .bnl-vs__track{display:flex;gap:14px;width:max-content;animation:bnlVsScroll 26s linear infinite;will-change:transform;padding:10px 0 14px;}
    #compare-cta .bnl-vs__viewport:hover .bnl-vs__track,
    #compare-cta .bnl-vs__viewport:focus-within .bnl-vs__track{animation-play-state:paused;}
    @keyframes bnlVsScroll{from{transform:translateX(0)}to{transform:translateX(calc(-50% - 7px))}}
    #compare-cta .bnl-vs__chip{flex:0 0 auto;display:inline-block;padding:14px 26px;border-radius:999px;text-decoration:none;
      color:var(--color-primary);border:1.5px solid var(--color-primary);font-weight:700;font-size:1.02rem;
      box-shadow:var(--hglow-teal);background:transparent;transition:box-shadow .2s ease,background .2s ease,transform .18s ease;}
    #compare-cta .bnl-vs__chip:hover{box-shadow:var(--hglow-teal-hi);background:color-mix(in srgb, var(--color-primary) 12%, transparent);transform:translateY(-2px) scale(1.05);}
    #compare-cta .bnl-vs__hint{font-size:.85rem;opacity:.55;margin-top:10px;}
    @media (prefers-reduced-motion:reduce){
      #compare-cta .bnl-vs__track{animation:none;}
      #compare-cta .bnl-vs__viewport{overflow-x:auto;-webkit-overflow-scrolling:touch;mask-image:none;-webkit-mask-image:none;}
      #compare-cta .bnl-vs__chip{transition:none;}
    }
    
/* ============================================================================
   rev41 · COMPARE THEM ALL — the wheel needed a destination
   The brand chips were the only way into /compare, and each one narrows you to
   a single matchup. This is the "show me everything" door: one target, wide,
   centre-stage, with the brand gradient running through the border rather than
   flooding the fill — chrome stays near-monochrome, the colour reads as light.
   ============================================================================ */
#compare-cta .bnl-cta-all{margin-top:26px;display:flex;flex-direction:column;align-items:center;gap:10px;}
#compare-cta .bnl-cta-all__btn{
  position:relative;display:inline-flex;align-items:center;justify-content:center;gap:14px;
  min-height:62px;padding:18px 40px;border-radius:var(--radius-pill);
  font-family:var(--font-heading-proposed);font-weight:800;
  font-size:clamp(1.05rem,3.6vw,1.3rem);letter-spacing:-.01em;
  color:#fff;text-decoration:none;isolation:isolate;
  background:linear-gradient(#0d0f11,#0d0f11) padding-box,
             var(--gradient-brand) border-box;
  border:2px solid transparent;
  box-shadow:0 0 0 rgba(0,0,0,0), 0 14px 40px -18px rgba(0,0,0,.9);
  transition:transform .22s cubic-bezier(.2,.7,.3,1), box-shadow .28s ease;
}
#compare-cta .bnl-cta-all__glow{
  position:absolute;inset:-2px;border-radius:inherit;z-index:-1;
  background:var(--gradient-brand);filter:blur(16px);opacity:.32;
  transition:opacity .28s ease;
}
#compare-cta .bnl-cta-all__arrow{
  font-size:1.15em;line-height:1;transition:transform .24s cubic-bezier(.2,.7,.3,1);
}
#compare-cta .bnl-cta-all__btn:hover,
#compare-cta .bnl-cta-all__btn:focus-visible{transform:translateY(-3px);}
#compare-cta .bnl-cta-all__btn:hover .bnl-cta-all__glow,
#compare-cta .bnl-cta-all__btn:focus-visible .bnl-cta-all__glow{opacity:.6;}
#compare-cta .bnl-cta-all__btn:hover .bnl-cta-all__arrow,
#compare-cta .bnl-cta-all__btn:focus-visible .bnl-cta-all__arrow{transform:translateX(5px);}
#compare-cta .bnl-cta-all__btn:active{transform:translateY(-1px) scale(.99);}
#compare-cta .bnl-cta-all__sub{
  font-size:.86rem;color:var(--color-text-muted);text-align:center;max-width:34ch;line-height:1.4;
}
/* the glow breathes so the button reads as the live target on a still page */
@media (prefers-reduced-motion:no-preference){
  #compare-cta .bnl-cta-all__glow{animation:bnl-cta-breathe 4.2s ease-in-out infinite;}
}
@keyframes bnl-cta-breathe{0%,100%{opacity:.26}50%{opacity:.5}}



    #contractors .bnl-pro2{max-width:980px;margin:0 auto;text-align:center;}
    #contractors .bnl-pro2 h2{margin-bottom:14px;}
    #contractors .bnl-pro2 .bnl-lede{max-width:760px;margin:0 auto 30px;}
    #contractors .bnl-pro2__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(215px,1fr));gap:14px;margin:0 0 32px;}
    #contractors .bnl-pro2__tile{display:flex;align-items:center;gap:12px;text-align:left;
      padding:16px 18px;border-radius:14px;border:1px solid color-mix(in srgb, var(--color-primary) 32%, transparent);
      background:color-mix(in srgb, var(--color-primary) 6%, transparent);font-weight:600;font-size:.95rem;line-height:1.35;}
    #contractors .bnl-pro2__tile svg{flex:none;width:20px;height:20px;stroke:var(--color-primary);}
    #contractors .bnl-pro2__cta{display:inline-block;}
    @media (max-width:640px){#contractors .bnl-pro2__grid{grid-template-columns:1fr 1fr;} #contractors .bnl-pro2__tile{font-size:.88rem;padding:13px 14px;}}
    


/* ===== Interactive Glow Layer (Austen 07-27: everything clickable glows, heavy) ===== */
:root{
  --hglow-pink: 0 0 14px rgba(227,5,107,.55), 0 0 44px rgba(227,5,107,.38);
  --hglow-pink-hi: 0 0 18px rgba(227,5,107,.75), 0 0 60px rgba(227,5,107,.5);
  --hglow-teal: 0 0 14px rgba(0,169,181,.5), 0 0 40px rgba(0,169,181,.32);
  --hglow-teal-hi: 0 0 18px rgba(0,169,181,.7), 0 0 56px rgba(0,169,181,.45);
  --hglow-teal-soft: 0 0 10px rgba(53,207,201,.28), 0 0 26px rgba(53,207,201,.18);
}
/* Hover lift + grow on all buttons */
.bnl-page--products-pool-enclosure .bnl-btn{transition:box-shadow .2s ease,background-color .2s ease,transform .18s ease;will-change:transform}
.bnl-page--products-pool-enclosure .bnl-btn:hover{transform:translateY(-2px) scale(1.05)}
.bnl-page--products-pool-enclosure .bnl-btn:active{transform:translateY(0) scale(0.98)}
@media (prefers-reduced-motion:reduce){.bnl-page--products-pool-enclosure .bnl-btn,.bnl-page--products-pool-enclosure .bnl-btn:hover{transform:none;transition:box-shadow .2s ease,background-color .2s ease}}
/* Hero title: larger + deeper overlap onto the video */
.bnl-page--products-pool-enclosure .bnl-hero__title{font-size:clamp(2.7rem,6.2vw,4.8rem);text-shadow:0 3px 22px rgba(0,0,0,.85),0 0 40px rgba(0,0,0,.5)}
.bnl-page--products-pool-enclosure .bnl-hero__content{margin-top:-96px}
@media (min-width:900px){.bnl-page--products-pool-enclosure .bnl-hero__content{margin-top:-170px}}
/* Buttons */
.bnl-page--products-pool-enclosure .bnl-btn--primary{box-shadow:var(--hglow-pink)}
.bnl-page--products-pool-enclosure .bnl-btn--primary:hover{box-shadow:var(--hglow-pink-hi);background:color-mix(in srgb, var(--color-pink) 14%, transparent)}
.bnl-page--products-pool-enclosure .bnl-btn--secondary{box-shadow:var(--hglow-teal)}
.bnl-page--products-pool-enclosure .bnl-btn--secondary:hover{box-shadow:var(--hglow-teal-hi)}
.bnl-page--products-pool-enclosure .bnl-btn--ghost{box-shadow:var(--hglow-pink)}
.bnl-page--products-pool-enclosure .bnl-btn--ghost:hover{box-shadow:var(--hglow-pink-hi)}
/* Text links */
.bnl-page--products-pool-enclosure .bnl-link{text-shadow:0 0 12px rgba(0,169,181,.75)}
.bnl-page--products-pool-enclosure .bnl-link:hover{text-shadow:0 0 16px rgba(0,169,181,1)}
/* FAQ questions */
.bnl-page--products-pool-enclosure .bnl-faq__q{text-shadow:0 0 10px rgba(255,255,255,.22);transition:text-shadow .2s ease,color .2s ease}
.bnl-page--products-pool-enclosure .bnl-faq__q:hover{color:var(--color-primary);text-shadow:0 0 14px rgba(0,169,181,.8)}
/* Before/after slider handle (range thumb) */
.bnl-page--products-pool-enclosure .bnl-ba-slider__range::-webkit-slider-thumb{box-shadow:var(--hglow-teal)}
.bnl-page--products-pool-enclosure .bnl-ba-slider__range::-moz-range-thumb{box-shadow:var(--hglow-teal)}
/* Holiday season cards (hover-zoom targets) */
.bnl-page--products-pool-enclosure .bnl-season__card{box-shadow:var(--hglow-teal-soft);border-radius:14px}
/* Spec panel interactives */
#specs .bnl-sp__nav-item, #specs .bnl-sp__feat, #specs .bnl-sp__kit-chip,
#specs .bnl-sp__dl, #specs .bnl-sp__dl-cta, #specs .bnl-sp__back{box-shadow:var(--hglow-teal-soft)}
#specs .bnl-sp__row{box-shadow:inset 0 0 0 1px rgba(53,207,201,.10), var(--hglow-teal-soft)}
#specs .bnl-sp__nav-item:hover, #specs .bnl-sp__feat:hover, #specs .bnl-sp__kit-chip:hover,
#specs .bnl-sp__dl:hover, #specs .bnl-sp__row:hover{box-shadow:var(--hglow-teal)}
#specs .bnl-sp__dl-cta:hover{box-shadow:var(--hglow-teal-hi)}
@media (prefers-reduced-motion:reduce){
  .bnl-page--products-pool-enclosure .bnl-faq__q{transition:none}
}

/* ==== unified pill (canonical, from home) ==== */
.bnl-pill,
.bnl-k__chip,.bnl-k__tag,.bnl-vs__chip,.bnl-vibe__chip,.bnl-wash__chip,
.bnl-cs__chip,.bnl-rv__chip,.bnl-sp__kit-chip,.bnl-val__tag,.bnl-rot__tag,
.bnl-sc__tag,.bnl-compare-cta__chip{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  border-radius:var(--radius-pill);
  font-family:var(--font-heading-proposed);font-weight:700;line-height:1.15;
  letter-spacing:.02em;
  background:color-mix(in srgb,var(--color-bg-elevated) 92%,transparent);
  border:1px solid color-mix(in srgb,var(--color-primary) 34%,var(--color-border));
  color:var(--color-text);
  -webkit-appearance:none;appearance:none;
}
.bnl-k__chip,.bnl-k__tag,.bnl-vs__chip,.bnl-vibe__chip,.bnl-wash__chip,
.bnl-cs__chip,.bnl-rv__chip,.bnl-sp__kit-chip,.bnl-val__tag,.bnl-rot__tag,
.bnl-sc__tag{ padding:7px 14px;font-size:var(--text-small); }
/* eyebrows: one treatment everywhere */
.bnl-hero__eyebrow,.bnl-eyebrow,.bnl-sc__kicker,.bnl-acc__kicker,.bnl-kicker__t{
  font-family:var(--font-heading-proposed);
  font-size:11px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;
}

/* ==== coverflow cards, ported from home rev34 ==== */
/* ---- the card ---- */
.bnl-page--products-pool-enclosure .bnl-dcard{transform-style:preserve-3d;}
.bnl-page--products-pool-enclosure .bnl-dcard__inner{
  position:relative;display:flex;flex-direction:column;height:100%;
  border-radius:var(--radius-md);
  background:#141414;border:1px solid var(--color-border);
  transform-style:preserve-3d;
}
/* rim light — a tilted surface should catch an edge */
.bnl-page--products-pool-enclosure .bnl-dcard__inner::before{
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:2;
  background:linear-gradient(158deg, rgba(255,255,255,.085) 0%, rgba(255,255,255,.02) 34%, transparent 58%);
}
.bnl-page--products-pool-enclosure .bnl-dcard__body{
  padding:14px 16px 16px;display:flex;flex-direction:column;flex:1;
  transform-style:preserve-3d;position:relative;z-index:1;
}
.bnl-page--products-pool-enclosure .bnl-dcard__head{display:flex;align-items:center;gap:10px;margin-bottom:9px;}
.bnl-page--products-pool-enclosure .bnl-dcard__ic{
  flex:none;width:30px;height:30px;display:grid;place-items:center;border-radius:var(--radius-pill);
  border:1px solid currentColor;box-shadow:0 0 16px -4px currentColor;
}
.bnl-page--products-pool-enclosure .bnl-dcard__ic svg{width:15px;height:15px;}
.bnl-page--products-pool-enclosure .bnl-dcard__who{
  margin:0;font-family:var(--font-heading-proposed);font-size:10px;
  font-weight:700;letter-spacing:.16em;text-transform:uppercase;line-height:1.2;
}
.bnl-page--products-pool-enclosure .bnl-dcard__verb{
  font-family:var(--font-heading-proposed);font-weight:800;
  font-size:clamp(22px,5.6vw,30px);line-height:.96;letter-spacing:-.05em;margin:0 0 7px;
}
.bnl-page--products-pool-enclosure .bnl-dcard__verb span{display:inline;}
.bnl-page--products-pool-enclosure .bnl-dcard__rule{height:2px;width:52px;border-radius:2px;margin:0 0 9px;background:linear-gradient(90deg,currentColor,transparent);}
.bnl-page--products-pool-enclosure .bnl-dcard__hook{
  font-family:var(--font-heading-proposed);font-weight:700;
  font-size:14px;line-height:1.28;letter-spacing:-.015em;color:#fff;margin:0 0 10px;
}
.bnl-page--products-pool-enclosure .bnl-dcard__list{display:none;}
.bnl-page--products-pool-enclosure .bnl-dcard__cta{
  margin-top:auto;align-self:stretch;padding:11px var(--space-md);min-height:40px;font-size:12.5px;
}
.bnl-page--products-pool-enclosure .bnl-dcard__login{display:none;}
@media (min-width:860px){
  .bnl-page--products-pool-enclosure .bnl-dcard__body{padding:18px 20px 20px;}
.bnl-page--products-pool-enclosure .bnl-dcard__ic{width:36px;height:36px;}
.bnl-page--products-pool-enclosure .bnl-dcard__ic svg{width:17px;height:17px;}
.bnl-page--products-pool-enclosure .bnl-dcard__who{font-size:11px;}
.bnl-page--products-pool-enclosure .bnl-dcard__verb{font-size:34px;margin-bottom:9px;letter-spacing:-.052em;}
.bnl-page--products-pool-enclosure .bnl-dcard__rule{width:62px;margin-bottom:11px;}
.bnl-page--products-pool-enclosure .bnl-dcard__hook{font-size:16px;margin-bottom:12px;}
.bnl-page--products-pool-enclosure .bnl-dcard__list{
    display:block;list-style:none;padding:0;margin:0 0 14px;
    font-size:12.5px;color:var(--color-text-muted);
  }
.bnl-page--products-pool-enclosure .bnl-dcard__list li{padding:5px 0;border-top:1px solid color-mix(in srgb, var(--color-border) 45%, transparent);}
.bnl-page--products-pool-enclosure .bnl-dcard__list li:nth-child(n+3){display:none;}
.bnl-page--products-pool-enclosure .bnl-dcard__cta{font-size:13px;}
.bnl-page--products-pool-enclosure .bnl-dcard--design .bnl-dcard__login{
    display:block;margin-top:10px;text-align:center;
    font-family:var(--font-heading-proposed);font-size:11.5px;font-weight:600;
    color:var(--color-primary);text-decoration:none;
  }
.bnl-page--products-pool-enclosure .bnl-dcard--design .bnl-dcard__login:hover{text-decoration:underline;}
}

/* each path card carries its own distinctly tinted gradient ground */
.bnl-page--products-pool-enclosure .bnl-dcard--live .bnl-dcard__inner{
  background:linear-gradient(158deg,#062a30 0%,#0d1a1d 46%,#101010 100%);
}
.bnl-page--products-pool-enclosure .bnl-dcard--install .bnl-dcard__inner{
  background:linear-gradient(158deg,#2e0620 0%,#1d0d16 46%,#101010 100%);
}
.bnl-page--products-pool-enclosure .bnl-dcard--sell .bnl-dcard__inner{
  background:linear-gradient(158deg,#331904 0%,#1f1409 46%,#101010 100%);
}
.bnl-page--products-pool-enclosure .bnl-dcard--design .bnl-dcard__inner{
  background:linear-gradient(158deg,#062a30 0%,#1a0d28 42%,#2b0722 72%,#101010 100%);
}
/* ---- per-path accents ---- */
.bnl-page--products-pool-enclosure .bnl-dcard--live .bnl-dcard__inner{border-color:color-mix(in srgb, var(--color-primary) 48%, var(--color-border));}
.bnl-page--products-pool-enclosure .bnl-dcard--live .bnl-dcard__verb,
.bnl-page--products-pool-enclosure .bnl-dcard--live .bnl-dcard__who,
.bnl-page--products-pool-enclosure .bnl-dcard--live .bnl-dcard__ic,
.bnl-page--products-pool-enclosure .bnl-dcard--live .bnl-dcard__rule{color:var(--color-primary);}
.bnl-page--products-pool-enclosure .bnl-dcard--install .bnl-dcard__inner{border-color:color-mix(in srgb, var(--color-pink) 48%, var(--color-border));}
.bnl-page--products-pool-enclosure .bnl-dcard--install .bnl-dcard__verb,
.bnl-page--products-pool-enclosure .bnl-dcard--install .bnl-dcard__who,
.bnl-page--products-pool-enclosure .bnl-dcard--install .bnl-dcard__ic,
.bnl-page--products-pool-enclosure .bnl-dcard--install .bnl-dcard__rule{color:var(--color-pink);}
.bnl-page--products-pool-enclosure .bnl-dcard--sell .bnl-dcard__inner{border-color:color-mix(in srgb, var(--color-orange) 48%, var(--color-border));}
.bnl-page--products-pool-enclosure .bnl-dcard--sell .bnl-dcard__verb,
.bnl-page--products-pool-enclosure .bnl-dcard--sell .bnl-dcard__who,
.bnl-page--products-pool-enclosure .bnl-dcard--sell .bnl-dcard__ic,
.bnl-page--products-pool-enclosure .bnl-dcard--sell .bnl-dcard__rule{color:var(--color-orange);}
.bnl-page--products-pool-enclosure .bnl-dcard--design .bnl-dcard__inner{border-color:color-mix(in srgb, var(--color-pink) 52%, var(--color-primary));}
.bnl-page--products-pool-enclosure .bnl-dcard--design .bnl-dcard__verb{
  background:var(--gradient-brand);-webkit-background-clip:text;background-clip:text;
  color:var(--color-pink);-webkit-text-fill-color:transparent;
}
.bnl-page--products-pool-enclosure .bnl-dcard--design .bnl-dcard__who,
.bnl-page--products-pool-enclosure .bnl-dcard--design .bnl-dcard__ic{color:var(--color-primary);}
.bnl-page--products-pool-enclosure .bnl-dcard--design .bnl-dcard__rule{background:var(--gradient-brand);}
/* ---- the stage ---- */
#perf .bnl-rot{margin:var(--space-ml) 0 0;}
#perf .bnl-rot__stage{
  /* rev18: card is 274px; the stage was 326px, leaving ~50px of dead air
     between the card and the controls once the photo slots came out */
  position:relative;height:296px;
  perspective:1100px;perspective-origin:50% 46%;
  transform-style:preserve-3d;
  touch-action:pan-y;cursor:grab;user-select:none;-webkit-user-select:none;
}
#perf .bnl-rot__stage.is-drag{cursor:grabbing;}
#perf .bnl-rot__glow{
  position:absolute;left:50%;top:8px;width:min(760px,94vw);height:250px;
  margin-left:max(-380px,-47vw);pointer-events:none;border-radius:50%;
  background:radial-gradient(ellipse at center, color-mix(in srgb, var(--color-primary) 13%, transparent) 0%, transparent 68%);
}
#perf .bnl-rot__item{
  --w:64vw;
  position:absolute;left:50%;top:0;width:var(--w);height:274px;
  margin-left:calc(var(--w) / -2);
  transform-style:preserve-3d;
  transition:transform .66s cubic-bezier(.22,.61,.36,1), opacity .66s ease, filter .66s ease;
  will-change:transform;
}
#perf .bnl-rot__stage.is-drag .bnl-rot__item{transition:none;}
/* ---- coverflow geometry — EVERY card tilted on two axes ---- */
#perf .bnl-rot__item[data-pos="0"]{
  transform:translateX(0) translateZ(0)
            rotateY(calc(-9deg + var(--bnl-ry))) rotateX(calc(3.5deg + var(--bnl-rx)))
            scale(1);
  opacity:1;filter:none;z-index:5;
}
#perf .bnl-rot__item[data-pos="1"]{
  transform:translateX(70%) translateZ(-140px) rotateY(-46deg) rotateX(5deg) scale(.9);
  opacity:.6;filter:blur(.8px);z-index:3;
}
#perf .bnl-rot__item[data-pos="-1"]{
  transform:translateX(-70%) translateZ(-140px) rotateY(32deg) rotateX(5deg) scale(.9);
  opacity:.6;filter:blur(.8px);z-index:3;
}
#perf .bnl-rot__item[data-pos="2"],
#perf .bnl-rot__item[data-pos="-2"]{
  transform:translateX(0) translateZ(-360px) rotateY(-9deg) rotateX(3.5deg) scale(.82);
  opacity:.14;filter:blur(2.5px);z-index:1;
}
#perf .bnl-rot__item[data-pos="0"] .bnl-dcard__inner{pointer-events:auto;}
#perf .bnl-rot__item:not([data-pos="0"]) .bnl-dcard__inner{pointer-events:none;}
/* pointer tracking wants a short transition, not the 660ms travel curve */
#perf .bnl-rot__item.is-tracking{transition:transform .12s linear;}
/* ---- directional shadow separation on the front card ---- */
#perf .bnl-rot__item[data-pos="0"] .bnl-dcard__inner{
  box-shadow:-16px 28px 48px -20px rgba(0,0,0,.9), 0 2px 0 rgba(255,255,255,.04) inset;
}
#perf .bnl-rot__item[data-pos="0"] .bnl-dcard--live  .bnl-dcard__inner{box-shadow:-16px 28px 48px -20px rgba(0,0,0,.9), var(--glow-ambient-teal);}
#perf .bnl-rot__item[data-pos="0"] .bnl-dcard--install .bnl-dcard__inner{box-shadow:-16px 28px 48px -20px rgba(0,0,0,.9), var(--glow-ambient-pink);}
#perf .bnl-rot__item[data-pos="0"] .bnl-dcard--sell    .bnl-dcard__inner{box-shadow:-16px 28px 48px -20px rgba(0,0,0,.9), 0 0 48px -12px color-mix(in srgb, var(--color-orange) 55%, transparent);}
#perf .bnl-rot__item[data-pos="0"] .bnl-dcard--design  .bnl-dcard__inner{box-shadow:-16px 28px 48px -20px rgba(0,0,0,.9), var(--glow-ambient-teal), var(--glow-ambient-pink);}
/* ---- internal translateZ parallax — content floats above the surface ---- */
#perf .bnl-rot__item[data-pos="0"] .bnl-dcard__head{transform:translateZ(30px);}
#perf .bnl-rot__item[data-pos="0"] .bnl-dcard__verb{transform:translateZ(24px);}
#perf .bnl-rot__item[data-pos="0"] .bnl-dcard__rule{transform:translateZ(18px);}
#perf .bnl-rot__item[data-pos="0"] .bnl-dcard__hook{transform:translateZ(13px);}
#perf .bnl-rot__item[data-pos="0"] .bnl-dcard__list{transform:translateZ(8px);}
#perf .bnl-rot__item[data-pos="0"] .bnl-dcard__cta{transform:translateZ(20px);}
/* ---- cursor-tracked specular glare ---- */
#perf .bnl-rot__item[data-pos="0"] .bnl-dcard__inner::after{
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:3;
  background:radial-gradient(240px circle at var(--bnl-mx,50%) var(--bnl-my,26%),
             rgba(255,255,255,.16), rgba(255,255,255,.05) 38%, transparent 64%);
  opacity:0;transition:opacity .32s ease;mix-blend-mode:screen;
}
#perf .bnl-rot__item[data-pos="0"].is-tracking .bnl-dcard__inner::after{opacity:1;}

  #perf .bnl-rot__item[data-pos="0"]{animation:bnl-card-float 7s ease-in-out infinite;}


/* the shadow the front card floats above — offset to match the tilt */
#perf .bnl-rot__shadow{
  position:absolute;left:50%;top:274px;width:min(340px,50vw);height:24px;
  margin-left:max(-178px,-26vw);border-radius:50%;pointer-events:none;
  background:radial-gradient(ellipse at center, rgba(0,0,0,.82) 0%, rgba(0,0,0,.34) 46%, transparent 74%);
  filter:blur(9px);
  transition:transform .66s cubic-bezier(.22,.61,.36,1), opacity .66s ease;
}
#perf .bnl-rot__stage.is-drag .bnl-rot__shadow{transition:none;}
/* ---- nav ---- */
#perf .bnl-rot__nav{display:flex;flex-direction:column;align-items:center;gap:10px;margin-top:6px;}
#perf .bnl-rot__arrows{display:flex;align-items:center;justify-content:center;gap:10px;}
#perf .bnl-rot__arrow{
  width:38px;height:38px;flex:none;border-radius:50%;display:flex;align-items:center;justify-content:center;
  cursor:pointer;color:#EDEFEF;font-size:16px;line-height:1;
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.16);
  transition:background .2s ease,border-color .2s ease,box-shadow .2s ease;
}
#perf .bnl-rot__arrow--prev{
  border-color:color-mix(in srgb, var(--color-pink) 70%, transparent);
  color:#fff;box-shadow:var(--glow-ambient-pink);
}
#perf .bnl-rot__arrow--prev:hover{box-shadow:var(--hglow-pink-hi);background:color-mix(in srgb, var(--color-pink) 14%, transparent);}
#perf .bnl-rot__arrow--next{
  border-color:color-mix(in srgb, var(--color-primary) 70%, transparent);
  color:#fff;box-shadow:var(--glow-ambient-teal);
}
#perf .bnl-rot__arrow--next:hover{box-shadow:var(--hglow-teal-hi);background:color-mix(in srgb, var(--color-primary) 14%, transparent);}
#perf .bnl-rot__dots{display:flex;gap:6px;flex-wrap:wrap;justify-content:center;}
#perf .bnl-rot__dot{
  cursor:pointer;font:inherit;font-family:var(--font-heading-proposed);font-weight:700;
  font-size:10.5px;letter-spacing:.09em;text-transform:uppercase;
  display:inline-flex;align-items:center;gap:7px;padding:8px 12px;border-radius:var(--radius-pill);
  background:transparent;border:1px solid var(--color-border);color:var(--color-text-muted);
  transition:color .25s ease,border-color .25s ease,box-shadow .25s ease;
}
#perf .bnl-rot__dot::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;opacity:.45;}
#perf .bnl-rot__dot:hover{color:#fff;border-color:var(--color-text-muted);}
#perf .bnl-rot__dot[aria-selected="true"]{color:var(--dot,#fff);border-color:var(--dot,#fff);box-shadow:0 0 14px -2px var(--dot,#fff);}
#perf .bnl-rot__dot[aria-selected="true"]::before{opacity:1;}
#perf .bnl-rot__hint{text-align:center;color:var(--color-text-muted);font-size:11px;margin-top:7px;}
#perf .bnl-rot.is-manual .bnl-rot__hint{opacity:.4;}
@media (min-width:560px){ #perf .bnl-rot__item{--w:300px;}
}
@media (min-width:860px){
  #perf .bnl-rot__stage{height:452px;perspective:1500px;}
#perf .bnl-rot__item{--w:352px;height:424px;}
#perf .bnl-rot__item[data-pos="1"]{transform:translateX(76%) translateZ(-170px) rotateY(-44deg) rotateX(4deg) scale(.9);}
#perf .bnl-rot__item[data-pos="-1"]{transform:translateX(-76%) translateZ(-170px) rotateY(30deg) rotateX(4deg) scale(.9);}
#perf .bnl-rot__item[data-pos="2"],#perf .bnl-rot__item[data-pos="-2"]{transform:translateX(0) translateZ(-440px) rotateY(-9deg) rotateX(3deg) scale(.82);}
#perf .bnl-rot__shadow{top:428px;width:300px;margin-left:-150px;height:30px;}
#perf .bnl-rot__glow{height:360px;}
#perf .bnl-rot__dot{font-size:12px;padding:9px 15px;}
#perf .bnl-rot__arrow{width:42px;height:42px;}
#perf .bnl-rot__stage{perspective:none;}
#perf .bnl-rot__item{animation:none!important;filter:none!important;}
#perf .bnl-rot__item[data-pos="1"],#perf .bnl-rot__item[data-pos="-1"],
  #perf .bnl-rot__item[data-pos="2"],#perf .bnl-rot__item[data-pos="-2"]{transform:none;opacity:0;pointer-events:none;}
#perf .bnl-rot__item[data-pos="0"]{transform:none;}
#perf .bnl-rot__item[data-pos="0"] .bnl-dcard__head,
  #perf .bnl-rot__item[data-pos="0"] .bnl-dcard__verb,
  #perf .bnl-rot__item[data-pos="0"] .bnl-dcard__rule,
  #perf .bnl-rot__item[data-pos="0"] .bnl-dcard__hook,
  #perf .bnl-rot__item[data-pos="0"] .bnl-dcard__list,
  #perf .bnl-rot__item[data-pos="0"] .bnl-dcard__cta{transform:none;}
#perf .bnl-rot__item[data-pos="0"] .bnl-dcard__inner::after{display:none;}
/* rules and dividers that carry the brand gradient can drift too */
  .bnl-page--products-pool-enclosure .bnl-dcard--design .bnl-dcard__rule{
    background-size:230% 100%;
    animation:bnl-grad-drift 9s ease-in-out infinite;
  }
}

/* ============================================================================
   rev18 · CARD POLISH
   Drop shadows do almost nothing on a near-black page, so elevation has to come
   from edges and gradient light instead. Three additions: a lit top bevel, a
   soft floor-glow inside the card face, and a slightly hotter accent edge on
   whichever card is actually front-and-centre.
============================================================================ */
/* 1 · lit top bevel — a 1px highlight that fades toward the sides, the way a
   real extruded edge catches light from above */
.bnl-page--products-pool-enclosure .bnl-dcard__inner{
  background-clip:padding-box;
  isolation:isolate;
}
.bnl-page--products-pool-enclosure .bnl-dcard__inner > .bnl-dcard__bevel{
  position:absolute;left:9%;right:9%;top:0;height:1px;z-index:4;
  pointer-events:none;border-radius:1px;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.42),transparent);
  opacity:.5;
}
/* 2 · the accent edge gets hotter on the front card only, so the coverflow has
   a clear focal point rather than four equally-lit cards */
#perf .bnl-rot__item[data-pos="0"] .bnl-dcard--live    .bnl-dcard__inner{border-color:color-mix(in srgb, var(--color-primary) 72%, var(--color-border));}
#perf .bnl-rot__item[data-pos="0"] .bnl-dcard--install .bnl-dcard__inner{border-color:color-mix(in srgb, var(--color-pink) 72%, var(--color-border));}
#perf .bnl-rot__item[data-pos="0"] .bnl-dcard--sell    .bnl-dcard__inner{border-color:color-mix(in srgb, var(--color-orange) 72%, var(--color-border));}
#perf .bnl-rot__item[data-pos="0"] .bnl-dcard--design  .bnl-dcard__inner{border-color:color-mix(in srgb, var(--color-pink) 62%, var(--color-primary));}
#perf .bnl-rot__item[data-pos="0"] .bnl-dcard__bevel{opacity:.95;}
/* 3 · floor glow inside the card face — the accent colour pooling at the base,
   which is what actually sells these as lit objects */
.bnl-page--products-pool-enclosure .bnl-dcard__inner::before{
  background:
    linear-gradient(158deg, rgba(255,255,255,.085) 0%, rgba(255,255,255,.02) 34%, transparent 58%),
    radial-gradient(120% 46% at 50% 104%, var(--bnl-cardfloor, transparent) 0%, transparent 72%);
}
.bnl-page--products-pool-enclosure .bnl-dcard--live   {--bnl-cardfloor:color-mix(in srgb, var(--color-primary) 22%, transparent);}
.bnl-page--products-pool-enclosure .bnl-dcard--install{--bnl-cardfloor:color-mix(in srgb, var(--color-pink) 22%, transparent);}
.bnl-page--products-pool-enclosure .bnl-dcard--sell   {--bnl-cardfloor:color-mix(in srgb, var(--color-orange) 20%, transparent);}
.bnl-page--products-pool-enclosure .bnl-dcard--design {--bnl-cardfloor:color-mix(in srgb, var(--color-pink) 20%, transparent);}
/* the back cards should not compete: kill their floor glow entirely */
#perf .bnl-rot__item:not([data-pos="0"]) .bnl-dcard{--bnl-cardfloor:transparent;}
/* --- carousel and rail arrows --- */
  #perf .bnl-rot__arrow,
  .bnl-page--products-pool-enclosure .bnl-sysrail__arrow{width:44px;height:44px;}
/* --- path pills under the carousel --- */
  #perf .bnl-rot__dot{min-height:42px;}
/* ============================================================================
   rev31 · THE CAROUSEL EARNS ITS SPACE
   Cards were 64vw x 274px, which left the front card floating in a lot of
   room. Sized up to 74vw x 348px, the stage follows, and the controls move up
   to sit directly beneath the card instead of across a gap — so the thing that
   tells you which way you can go is attached to the thing that moves.
============================================================================ */
#perf .bnl-rot__item{--w:74vw;height:348px;}
#perf .bnl-rot__stage{height:372px;perspective-origin:50% 44%;}
#perf .bnl-rot__shadow{top:348px;}
#perf .bnl-rot__nav{margin-top:2px;gap:8px;}
#perf .bnl-rot__hint{margin-top:5px;}
@media (min-width:560px){ #perf .bnl-rot__item{--w:352px;}
}
@media (min-width:820px){
  #perf .bnl-rot__stage{height:534px;}
#perf .bnl-rot__item{--w:412px;height:506px;}
#perf .bnl-rot__shadow{top:510px;width:352px;margin-left:-176px;}
}
  #perf .bnl-rot__item[data-pos="0"]{animation:bnl-card-float 9s ease-in-out infinite;}
#perf .bnl-rot__item[data-pos="0"]{
  transform:translateX(0) translateY(var(--bnl-fy,0px)) translateZ(0)
            rotateY(calc(-9deg + var(--bnl-ry))) rotateX(calc(3.5deg + var(--bnl-rx)))
            scale(1);
}

  #perf .bnl-rot__shadow{animation:bnl-card-shadow 9s ease-in-out infinite;}


/* ============================================================================
   rev32 · THE CARD NEVER ACTUALLY GREW
   `.bnl-dcard__inner` carries height:100%, but its parent `.bnl-dcard` had no
   height of its own, so the percentage resolved against an auto-height box and
   collapsed straight back to content height. The item container grew to 349px
   in rev31; the visible card stayed at 178px, and the 171px left over is the
   gap. Giving the card a height makes the chain resolve, so the card fills the
   space instead of leaving it below itself.
============================================================================ */
#perf .bnl-rot__item .bnl-dcard{height:100%;}
#perf .bnl-rot__item{height:330px;}
#perf .bnl-rot__stage{height:352px;}
#perf .bnl-rot__shadow{top:330px;}
#perf .bnl-rot__nav{margin-top:0;}
/* the extra room is spent on the content, not left as air inside the card */
#perf .bnl-rot__item .bnl-dcard__body{padding:20px 20px 20px;gap:2px;}
#perf .bnl-rot__item .bnl-dcard__hook{margin-bottom:14px;}
#perf .bnl-rot__item .bnl-dcard__cta{margin-top:auto;min-height:46px;}
@media (min-width:820px){
  #perf .bnl-rot__item{height:430px;}
#perf .bnl-rot__stage{height:456px;}
#perf .bnl-rot__shadow{top:430px;}
#perf .bnl-rot__item .bnl-dcard__body{padding:26px 26px 24px;}
}/* rev40: close @media (min-width:820px) — was unclosed, trapping every rule below in a desktop-only scope */

/* ============================================================================
   rev34 · THE BULLETS WERE ALREADY WRITTEN
   Three to four points per card exist in the markup and have been hidden on
   anything under 860px since the cards were too short to hold them. They are
   331px now, so they come back — the first two on a phone, all of them on
   desktop, with the CTA still pinned to the bottom edge.
============================================================================ */
#perf .bnl-rot__item .bnl-dcard__list{
  display:block;list-style:none;padding:0;margin:8px 0 12px;
  font-size:11.6px;line-height:1.32;color:#B9C0C4;
}
#perf .bnl-rot__item .bnl-dcard__list li{
  position:relative;padding:6px 0 6px 15px;
  border-top:1px solid color-mix(in srgb, var(--color-border) 55%, transparent);
}
#perf .bnl-rot__item .bnl-dcard__list li:first-child{border-top:0;padding-top:2px;}
/* the marker takes the path's own accent, so each card is keyed by its light */
#perf .bnl-rot__item .bnl-dcard__list li::before{
  content:"";position:absolute;left:2px;top:calc(0.66em + 6px);
  width:5px;height:5px;border-radius:50%;
  background:currentColor;opacity:.9;
  box-shadow:0 0 8px -1px currentColor;
}
#perf .bnl-rot__item .bnl-dcard__list li:first-child::before{top:calc(0.66em + 2px);}
#perf .bnl-rot__item .bnl-dcard__list li:nth-child(n+3){display:none;}
@media (min-width:820px){
  #perf .bnl-rot__item .bnl-dcard__list{font-size:12.8px;margin:10px 0 14px;}
#perf .bnl-rot__item .bnl-dcard__list li:nth-child(n+3){display:list-item;}
#perf .bnl-rot__item .bnl-dcard__list li:nth-child(n+5){display:none;}
}
/* the bullet text stays neutral; only the marker carries the accent */
#perf .bnl-rot__item .bnl-dcard__list li{color:#B9C0C4;}
/* ============================================================================
   rev34 · THE VERB STOPS BLENDING IN
   Each verb was a flat fill of the path's own accent sitting on a card tinted
   with that same accent — teal on teal, pink on pink. Value and hue both too
   close, so the headline sank into its own background.

   Two changes. The verb now runs a gradient from near-white through the accent,
   so the first word reads at full contrast and the colour arrives underneath
   it. And the second word is set in the display face at a heavier weight with
   tighter tracking, so the two halves separate by form as well as by tone.
============================================================================ */
#perf .bnl-rot__item .bnl-dcard__verb{
  font-size:clamp(25px,6.6vw,34px);
  letter-spacing:-.055em;
  line-height:.94;
  -webkit-text-fill-color:transparent;
  background-clip:text;-webkit-background-clip:text;
  background-image:linear-gradient(96deg,
    #FFFFFF 0%, #FFFFFF 26%,
    color-mix(in srgb, currentColor 62%, #FFFFFF) 48%,
    currentColor 76%,
    color-mix(in srgb, currentColor 78%, #000000) 100%);
  background-size:190% 100%;
  filter:drop-shadow(0 1px 10px color-mix(in srgb, currentColor 34%, transparent));
}
@media (prefers-reduced-motion:no-preference){
  #perf .bnl-rot__item[data-pos="0"] .bnl-dcard__verb{
    animation:bnl-grad-drift 11s ease-in-out infinite;
  }
}
/* the two words get different weight so the lockup has an internal rhythm */
#perf .bnl-rot__item .bnl-dcard__verb span:first-child{font-weight:500;letter-spacing:-.03em;}
#perf .bnl-rot__item .bnl-dcard__verb span:last-child{font-weight:800;}
/* the rule under it becomes a lit bar rather than a fade */
#perf .bnl-rot__item .bnl-dcard__rule{
  height:2.5px;width:64px;
  background:linear-gradient(90deg, currentColor 0%, currentColor 42%, transparent 100%);
  box-shadow:0 0 12px -2px currentColor;
}
/* and the hook line lifts off the accent wash */
#perf .bnl-rot__item .bnl-dcard__hook{
  color:#FFFFFF;font-size:13.2px;line-height:1.26;margin-bottom:4px;
  text-shadow:0 1px 6px rgba(0,0,0,.55);
}
/* card ground cools slightly so an accent headline has something to sit on */
#perf .bnl-rot__item .bnl-dcard__inner{background:#101214;}
.bnl-dcard--app .bnl-dcard__login{
    display:block;margin-top:10px;text-align:center;
    font-family:var(--font-heading-proposed);font-size:11.5px;font-weight:600;
    color:var(--color-primary);text-decoration:none;
  }
.bnl-dcard--app .bnl-dcard__login:hover{text-decoration:underline;}
.bnl-dcard--invisible .bnl-dcard__inner{
  background:linear-gradient(158deg,#062a30 0%,#0d1a1d 46%,#101010 100%);
}
.bnl-dcard--build .bnl-dcard__inner{
  background:linear-gradient(158deg,#2e0620 0%,#1d0d16 46%,#101010 100%);
}
.bnl-dcard--sealed .bnl-dcard__inner{
  background:linear-gradient(158deg,#331904 0%,#1f1409 46%,#101010 100%);
}
.bnl-dcard--app .bnl-dcard__inner{
  background:linear-gradient(158deg,#062a30 0%,#1a0d28 42%,#2b0722 72%,#101010 100%);
}
.bnl-dcard--invisible .bnl-dcard__inner{border-color:color-mix(in srgb, var(--color-primary) 48%, var(--color-border));}
.bnl-dcard--invisible .bnl-dcard__verb,
.bnl-page--products-pool-enclosure .bnl-dcard--invisible .bnl-dcard__who,
.bnl-page--products-pool-enclosure .bnl-dcard--invisible .bnl-dcard__ic,
.bnl-page--products-pool-enclosure .bnl-dcard--invisible .bnl-dcard__rule{color:var(--color-primary);}
.bnl-dcard--build .bnl-dcard__inner{border-color:color-mix(in srgb, var(--color-pink) 48%, var(--color-border));}
.bnl-dcard--build .bnl-dcard__verb,
.bnl-page--products-pool-enclosure .bnl-dcard--build .bnl-dcard__who,
.bnl-page--products-pool-enclosure .bnl-dcard--build .bnl-dcard__ic,
.bnl-page--products-pool-enclosure .bnl-dcard--build .bnl-dcard__rule{color:var(--color-pink);}
.bnl-dcard--sealed .bnl-dcard__inner{border-color:color-mix(in srgb, var(--color-orange) 48%, var(--color-border));}
.bnl-dcard--sealed .bnl-dcard__verb,
.bnl-page--products-pool-enclosure .bnl-dcard--sealed .bnl-dcard__who,
.bnl-page--products-pool-enclosure .bnl-dcard--sealed .bnl-dcard__ic,
.bnl-page--products-pool-enclosure .bnl-dcard--sealed .bnl-dcard__rule{color:var(--color-orange);}
.bnl-dcard--app .bnl-dcard__inner{border-color:color-mix(in srgb, var(--color-pink) 52%, var(--color-primary));}
.bnl-dcard--app .bnl-dcard__verb{
  background:var(--gradient-brand);-webkit-background-clip:text;background-clip:text;
  color:var(--color-pink);-webkit-text-fill-color:transparent;
}
.bnl-dcard--app .bnl-dcard__who,
.bnl-page--products-pool-enclosure .bnl-dcard--app .bnl-dcard__ic{color:var(--color-primary);}
.bnl-dcard--app .bnl-dcard__rule{background:var(--gradient-brand);}
.bnl-dcard--invisible  .bnl-dcard__inner{box-shadow:-16px 28px 48px -20px rgba(0,0,0,.9), var(--glow-ambient-teal);}
.bnl-dcard--build .bnl-dcard__inner{box-shadow:-16px 28px 48px -20px rgba(0,0,0,.9), var(--glow-ambient-pink);}
.bnl-dcard--sealed    .bnl-dcard__inner{box-shadow:-16px 28px 48px -20px rgba(0,0,0,.9), 0 0 48px -12px color-mix(in srgb, var(--color-orange) 55%, transparent);}
.bnl-dcard--app  .bnl-dcard__inner{box-shadow:-16px 28px 48px -20px rgba(0,0,0,.9), var(--glow-ambient-teal), var(--glow-ambient-pink);}
.bnl-dcard--app .bnl-dcard__rule{
    background-size:230% 100%;
    animation:bnl-grad-drift 9s ease-in-out infinite;
  }
.bnl-dcard--invisible    .bnl-dcard__inner{border-color:color-mix(in srgb, var(--color-primary) 72%, var(--color-border));}
.bnl-dcard--build .bnl-dcard__inner{border-color:color-mix(in srgb, var(--color-pink) 72%, var(--color-border));}
.bnl-dcard--sealed    .bnl-dcard__inner{border-color:color-mix(in srgb, var(--color-orange) 72%, var(--color-border));}
.bnl-dcard--app  .bnl-dcard__inner{border-color:color-mix(in srgb, var(--color-pink) 62%, var(--color-primary));}
.bnl-dcard--invisible   {--bnl-cardfloor:color-mix(in srgb, var(--color-primary) 22%, transparent);}
.bnl-dcard--build{--bnl-cardfloor:color-mix(in srgb, var(--color-pink) 22%, transparent);}
.bnl-dcard--sealed   {--bnl-cardfloor:color-mix(in srgb, var(--color-orange) 20%, transparent);}
.bnl-dcard--app {--bnl-cardfloor:color-mix(in srgb, var(--color-pink) 20%, transparent);}
#perf .bnl-rot__item .bnl-dcard__list li:nth-child(n+3){display:list-item;}
#perf .bnl-rot__item .bnl-dcard__list li:nth-child(n+4){display:none;}
@media (min-width:820px){#perf .bnl-rot__item .bnl-dcard__list li:nth-child(n+4){display:list-item;}}
#perf .bnl-rot__item .bnl-dcard__body{padding-bottom:18px;}



/* ============================================================================
   rev40 · MOBILE TAP TARGETS  (BRI-281)
   Mobile is ~70% of traffic. Standalone controls below were 15–43px tall.
   Where growing the box would move the layout, the hit area is expanded with
   an absolutely-positioned ::after instead, so nothing visually shifts.
   Inline links inside a sentence are deliberately left alone — WCAG 2.5.8
   exempts them, and padding them out would break the paragraph.
   ============================================================================ */
.bnl-page--products-pool-enclosure .bnl-crumbs a,
.bnl-page--products-pool-enclosure .bnl-stats__note{position:relative;}
.bnl-page--products-pool-enclosure .bnl-crumbs a::after,
.bnl-page--products-pool-enclosure .bnl-stats__note::after{
  content:"";position:absolute;inset:-16px -8px;
}
.bnl-page--products-pool-enclosure .bnl-eco-links a{
  display:inline-flex;align-items:center;min-height:44px;
}
#perf .bnl-rot__dot{
  min-width:44px;min-height:44px;
}
#perf .bnl-rot__arrow{
  min-width:44px;min-height:44px;
}

/* ============================================================================
   rev41 · THE SLIDER HAS TO TEACH ITSELF
   It opened at 50/50, which reads as a static split image — nothing says the
   line moves. It now opens at 70% dark so the lit side is a sliver you want to
   pull open, the handle carries a "Drag" label, and it nudges a few times on
   load then rests. Interaction cancels the nudge.
   ============================================================================ */
.bnl-page--products-pool-enclosure .bnl-ba-slider__knob{
  width:58px;height:58px;
  border-width:2px;
  background:color-mix(in srgb, var(--color-bg) 40%, transparent);
  box-shadow:0 0 0 6px color-mix(in srgb, var(--color-white) 10%, transparent),
             0 10px 30px -8px rgba(0,0,0,.9);
  letter-spacing:.12em;
}
.bnl-page--products-pool-enclosure .bnl-ba-slider__cue{
  position:absolute;top:calc(50% + 40px);left:50%;transform:translateX(-50%);
  font-family:var(--font-heading-proposed);font-weight:700;
  font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--color-white);
  padding:5px 11px;border-radius:var(--radius-pill);
  background:color-mix(in srgb, var(--color-bg) 62%, transparent);
  border:1px solid color-mix(in srgb, var(--color-white) 45%, transparent);
  backdrop-filter:blur(6px);white-space:nowrap;pointer-events:none;z-index:2;
}
@media (prefers-reduced-motion:no-preference){
  .bnl-page--products-pool-enclosure .bnl-ba-slider--cue .bnl-ba-slider__divider{
    animation:bnl-ba-nudge 2.6s ease-in-out 5;
  }
  .bnl-page--products-pool-enclosure .bnl-ba-slider--cue .bnl-ba-slider__cue{
    animation:bnl-ba-cuefade 2.6s ease-in-out 5;
  }
  .bnl-page--products-pool-enclosure .bnl-ba-slider:focus-within .bnl-ba-slider__divider,
  .bnl-page--products-pool-enclosure .bnl-ba-slider:active .bnl-ba-slider__divider,
  .bnl-page--products-pool-enclosure .bnl-ba-slider:focus-within .bnl-ba-slider__cue,
  .bnl-page--products-pool-enclosure .bnl-ba-slider:active .bnl-ba-slider__cue{animation:none;}
}
@keyframes bnl-ba-nudge{
  0%,100%{transform:translateX(-50%)}
  42%{transform:translateX(calc(-50% - 13px))}
  62%{transform:translateX(calc(-50% + 7px))}
}
@keyframes bnl-ba-cuefade{0%,100%{opacity:.72}50%{opacity:1}}

/* ============================================================================
   rev41 · APP-IN-HAND PROOF SHOT (#ecosystem)
   A real install, a real phone, four systems grouped on one screen. This is the
   "one app" claim shown rather than asserted, so it leads the section and the
   hotspot diagram follows as the explainer.
   ============================================================================ */
.bnl-page--products-pool-enclosure .bnl-appshot{
  margin:var(--space-lg) 0 var(--space-ml);
  border-radius:var(--radius-md);overflow:hidden;
  border:1px solid color-mix(in srgb, var(--color-primary) 34%, var(--color-border));
  box-shadow:var(--glow-ambient-teal), 0 20px 60px -26px rgba(0,0,0,.95);
  background:var(--color-bg-elevated);
}
.bnl-page--products-pool-enclosure .bnl-appshot img{
  display:block;width:100%;height:auto;border-radius:0;box-shadow:none;
}
.bnl-page--products-pool-enclosure .bnl-appshot figcaption{
  padding:16px 18px 18px;display:block;
}
.bnl-page--products-pool-enclosure .bnl-appshot figcaption b{
  display:block;font-family:var(--font-heading-proposed);font-weight:800;
  font-size:1.02rem;letter-spacing:-.01em;color:var(--color-text);margin-bottom:4px;
}
.bnl-page--products-pool-enclosure .bnl-appshot figcaption span{
  color:var(--color-text-muted);font-size:var(--text-small);line-height:1.5;
}

/* ============================================================================
   rev41 · SEASON CARDS REBUILT
   Was: repeat(4,1fr) at every width, so four cards fought over a 390px phone,
   and :hover scale(1.35) pushed the zoomed card outside the grid. Hover also
   does nothing on the majority device.
   Now: 2-up on phones, 4-up from 820px. The zoom happens to the IMAGE inside a
   fixed frame, so nothing overflows and it works on tap. Each frame is keyed to
   its own season colour, which is the one place saturated colour is allowed —
   it is coming off the lights in the photograph.
   ============================================================================ */
.bnl-page--products-pool-enclosure .bnl-season{
  display:grid;grid-template-columns:repeat(2,1fr);gap:14px;
}
@media (min-width:820px){
  .bnl-page--products-pool-enclosure .bnl-season{grid-template-columns:repeat(4,1fr);gap:18px;}
}
.bnl-page--products-pool-enclosure .bnl-season__card{
  margin:0;position:relative;overflow:hidden;
  border-radius:16px;aspect-ratio:4/3;
  border:1px solid color-mix(in srgb, var(--season,#35CFC9) 42%, var(--color-border));
  box-shadow:0 0 34px -16px var(--season,#35CFC9), 0 14px 34px -18px rgba(0,0,0,.9);
  transform:translateZ(0);
  transition:transform .34s cubic-bezier(.2,.7,.3,1), box-shadow .34s ease, border-color .34s ease;
  outline:none;cursor:pointer;
}
.bnl-page--products-pool-enclosure .bnl-season__card img{
  width:100%;height:100%;object-fit:cover;display:block;border-radius:0;box-shadow:none;
  transform:scale(1.02);
  transition:transform .5s cubic-bezier(.2,.7,.3,1);
}
.bnl-page--products-pool-enclosure .bnl-season__card:hover,
.bnl-page--products-pool-enclosure .bnl-season__card:focus-visible,
.bnl-page--products-pool-enclosure .bnl-season__card:active{
  transform:translateY(-5px);
  border-color:var(--season,#35CFC9);
  box-shadow:0 0 52px -12px var(--season,#35CFC9), 0 22px 46px -18px rgba(0,0,0,.95);
}
.bnl-page--products-pool-enclosure .bnl-season__card:hover img,
.bnl-page--products-pool-enclosure .bnl-season__card:focus-visible img,
.bnl-page--products-pool-enclosure .bnl-season__card:active img{transform:scale(1.16);}
/* each frame carries its own season's light */
.bnl-page--products-pool-enclosure .bnl-season__card:nth-child(1){--season:#E23B3B;}
.bnl-page--products-pool-enclosure .bnl-season__card:nth-child(2){--season:#FA6A1E;}
.bnl-page--products-pool-enclosure .bnl-season__card:nth-child(3){--season:#3C7BE8;}
.bnl-page--products-pool-enclosure .bnl-season__card:nth-child(4){--season:#25C368;}
@media (prefers-reduced-motion:reduce){
  .bnl-page--products-pool-enclosure .bnl-season__card,
  .bnl-page--products-pool-enclosure .bnl-season__card img{transition:none;}
}

/* ============================================================================
   rev41 · THE CARD DECK FLEXES
   The stack only moved after you let go, so on a phone — where there is no
   hover tilt to fall back on — it read as a flat picture of a carousel. The
   drag now drives two custom properties off the pointer (`--bnl-dxn` signed,
   `--bnl-dxa` absolute) and every card responds: the front one leans and gives
   back a little depth, its neighbours trail at a fraction of the travel. On
   release the vars are dropped and the spring curve carries it home.
   ============================================================================ */
#perf .bnl-rot__item .bnl-dcard{
  transform:
    translateX(calc(var(--bnl-dxn, 0) * 34px))
    rotateY(calc(var(--bnl-dxn, 0) * -7deg))
    scale(calc(1 - var(--bnl-dxa, 0) * 0.035));
  transform-origin:50% 60%;
  transition:transform .52s cubic-bezier(.16,1.16,.3,1);
  will-change:transform;
}
/* while the finger is down the card tracks it directly — no lag, no easing */
#perf .bnl-rot__stage.is-drag .bnl-rot__item .bnl-dcard{transition:none;}
/* the flanking cards trail, which is what sells it as one connected deck */
#perf .bnl-rot__item[data-pos="1"] .bnl-dcard,
#perf .bnl-rot__item[data-pos="-1"] .bnl-dcard{
  transform:
    translateX(calc(var(--bnl-dxn, 0) * 20px))
    rotateY(calc(var(--bnl-dxn, 0) * -4deg));
}
#perf .bnl-rot__item[data-pos="2"] .bnl-dcard,
#perf .bnl-rot__item[data-pos="-2"] .bnl-dcard{
  transform:translateX(calc(var(--bnl-dxn, 0) * 11px));
}
/* the floor shadow tracks the lean so the card never looks unmoored */
#perf .bnl-rot__shadow{
  transform:translateX(calc(var(--bnl-dxn, 0) * 22px))
            scaleX(calc(1 - var(--bnl-dxa, 0) * 0.12));
  transition:transform .52s cubic-bezier(.16,1.16,.3,1);
}
#perf .bnl-rot__stage.is-drag .bnl-rot__shadow{transition:none;}
#perf .bnl-rot__stage{cursor:grab;}
#perf .bnl-rot__stage.is-drag{cursor:grabbing;}
@media (prefers-reduced-motion:reduce){
  #perf .bnl-rot__item .bnl-dcard,
  #perf .bnl-rot__item[data-pos="1"] .bnl-dcard,
  #perf .bnl-rot__item[data-pos="-1"] .bnl-dcard,
  #perf .bnl-rot__item[data-pos="2"] .bnl-dcard,
  #perf .bnl-rot__item[data-pos="-2"] .bnl-dcard,
  #perf .bnl-rot__shadow{transform:none;transition:none;}
}
