/* CUSTOM VARIABLE CONFIGURATION - THEME: COLORFUL (Auditory Care) */
:root {
  /* Dimensions & Shapes */
  --bz-core-width: 1180px;
  --bz-rounding: 16px; /* Soft structure style */
  --bz-shadow-potency: 0 20px 40px rgba(0, 0, 0, 0.45), 0 0 25px rgba(0, 242, 254, 0.18); /* Deep deep shadow + spread */

  /* Color Palette matching "colorful" theme with hearing health vibes (deep energetic ocean blue & neon highlights) */
  --bz-color-canvas: #090e17;
  --bz-color-pane: #131b2e;
  --bz-color-pane-alt: #1a243d;
  --bz-color-ink: #f8fafc;
  --bz-color-ink-muted: #94a3b8;
  
  /* Vibrant gradients & accents */
  --bz-color-flare: #ff2a5f; /* Neon pink/red */
  --bz-color-pulse: #00f0ff; /* Electric cyan */
  --bz-vibe-grad: linear-gradient(135deg, #00f0ff 0%, #ff2a5f 100%);
  --bz-vibe-btn: linear-gradient(135deg, #ff2a5f 0%, #ff7a00 100%);
  
  /* Fonts */
  --bz-font-display: 'Oswald', sans-serif;
  --bz-font-body: 'Poppins', sans-serif;
}

/* Base resets & visual alignment */
body {
  font-family: var(--bz-font-body);
  background-color: var(--bz-color-canvas);
  color: var(--bz-color-ink);
  overflow-x: hidden;
}

/* Semantic Container Width Rule */
.bz-max-width {
  max-width: var(--bz-core-width);
  width: 100%;
}

/* Typography styles matching font-heading and heading-case rules */
.bz-main-heading {
  font-family: var(--bz-font-display);
  text-transform: uppercase; /* Heading Case: Uppercase */
  color: var(--bz-color-ink);
  letter-spacing: 0.05em;
  background: linear-gradient(to right, #ffffff, #00f0ff);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.bz-brand-title {
  font-family: var(--bz-font-display);
}

.bz-readable-text {
  color: var(--bz-color-ink-muted);
}

/* Header style styling */
.bz-topbar {
  background-color: var(--bz-color-pane);
  border-bottom: 2px solid var(--bz-color-pane-alt);
  z-index: 20;
}

.bz-brand-logo {
  color: var(--bz-color-pulse);
}

/* Image graphic container */
.bz-graphic-wrapper {
  background-color: var(--bz-color-pane);
  border: 1px solid var(--bz-color-pane-alt);
  border-radius: var(--bz-rounding);
  box-shadow: var(--bz-shadow-potency);
}

/* Split layout content card styling */
.bz-info-sheet {
  background-color: var(--bz-color-pane);
  border: 1px solid var(--bz-color-pane-alt);
  border-radius: var(--bz-rounding);
  box-shadow: var(--bz-shadow-potency);
}

.bz-badge-tag {
  background: var(--bz-vibe-grad);
  color: var(--bz-color-canvas);
  border-radius: 999px; /* Badges are always pill-style for premium look */
  box-shadow: 0 4px 12px rgba(0, 240, 255, 0.3);
}

/* Guarantee badge layout (icon-left style) */
.bz-protection-badge {
  background-color: var(--bz-color-pane-alt);
  border-left: 4px solid var(--bz-color-pulse);
  border-radius: var(--bz-rounding);
}

/* Price Box - Badge Variant (Accent Background) */
.bz-pricing-wrap {
  background-color: var(--bz-color-pane-alt);
  border: 2px solid var(--bz-color-pulse);
  border-radius: var(--bz-rounding);
  min-width: 180px;
  box-shadow: 0 0 15px rgba(0, 240, 255, 0.2);
}

.bz-amount {
  color: var(--bz-color-pulse);
  font-family: var(--bz-font-display);
}

/* CTA Button Styles */
.bz-cta-trigger {
  background: var(--bz-vibe-btn);
  color: #ffffff;
  border-radius: var(--bz-rounding);
  text-shadow: 1px 1px 2px rgba(0,0,0,0.4);
  box-shadow: 0 8px 20px rgba(255, 42, 95, 0.4);
  font-family: var(--bz-font-display);
}

.bz-cta-trigger:hover {
  box-shadow: 0 10px 25px rgba(255, 42, 95, 0.6);
}

/* Segment separators & Feature structures */
.bz-feature-strip {
  background-color: var(--bz-color-pane);
  border: 1px solid var(--bz-color-pane-alt);
  border-radius: var(--bz-rounding);
  box-shadow: var(--bz-shadow-potency);
  transition: transform 0.2s ease-in-out;
}

.bz-feature-strip:hover {
  transform: translateY(-2px);
}

.bz-round-icon {
  background: var(--bz-vibe-grad);
}

/* Testimonials Base Layout */
.bz-testimonials-base {
  background-color: var(--bz-color-pane-alt);
}

.bz-testimonial-node {
  background-color: var(--bz-color-pane);
  border-top: 4px solid var(--bz-color-pulse); /* Border-top 4px style from Preset A rule */
  border-radius: var(--bz-rounding);
  box-shadow: var(--bz-shadow-potency);
}

.bz-avatar-circle {
  background: var(--bz-vibe-grad);
  color: var(--bz-color-canvas);
}

/* Footer Section base configuration */
.bz-footer {
  background-color: var(--bz-color-pane);
  border-top: 2px solid var(--bz-color-pane-alt);
  z-index: 20;
}