/* ============================================================
   dub-pages.css — Page-specific overrides + waveform SVG animations
   ============================================================ */

/* ── Hero waveform animation ─────────────────────────────── */
@keyframes dub-wave-pulse {
  0%, 100% { transform: scaleY(1); }
  50%       { transform: scaleY(0.35); }
}

.dub-wave-bar {
  transform-origin: bottom;
  animation: dub-wave-pulse 1.8s ease-in-out infinite;
}
.dub-wave-bar--amber { fill: #F5A623; }
.dub-wave-bar--green { fill: #34D399; }
.dub-wave-bar--dim   { fill: rgba(245,166,35,0.30); }

/* ── CTA band sweep animation ─────────────────────────────── */
@keyframes dub-sweep {
  0%   { transform: translateX(-60px); }
  100% { transform: translateX(60px); }
}
.dub-cta-sweep {
  animation: dub-sweep 3.5s ease-in-out infinite alternate;
}

/* ── Use-case pain-point list ─────────────────────────────── */
.dub-pain-list {
  background: var(--bg-white);
  padding: 80px 0;
}
.dub-pain-list__inner {
  max-width: var(--max-width);
  margin: 0 auto;
  padding: 0 var(--container-px);
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  align-items: center;
}
.dub-pain-list__title { color: var(--fg-light-primary); margin-bottom: 24px; }
.dub-pain-list__items { display: flex; flex-direction: column; gap: 20px; }
.dub-pain-list__item {
  display: flex;
  gap: 16px;
  align-items: flex-start;
}
.dub-pain-list__item-icon {
  width: 36px;
  height: 36px;
  flex-shrink: 0;
  border-radius: 50%;
  background: rgba(168,104,0,0.10);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--accent-aa-light);
  font-size: 0.875rem;
  margin-top: 2px;
}
.dub-pain-list__item-text {
  font-size: 1rem;
  color: var(--fg-light-secondary);
  line-height: 1.65;
}
.dub-pain-list__item-text strong { color: var(--fg-light-primary); }
.dub-pain-list__solution {
  padding: 28px 32px;
  background: var(--bg-cream);
  border-radius: var(--radius-lg);
  border: 1px solid var(--border-light);
}
.dub-pain-list__solution-label {
  font-family: var(--heading-font);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--accent-aa-light);
  margin-bottom: 12px;
}
.dub-pain-list__solution-text {
  font-size: 1.0625rem;
  color: var(--fg-light-secondary);
  line-height: 1.75;
}

@media (max-width: 760px) {
  .dub-pain-list__inner { grid-template-columns: 1fr; }
}

/* ── Use-case feature highlight 2-col ────────────────────────*/
.dub-uc-features {
  background: var(--bg-cream);
  padding: 80px 0;
}
.dub-uc-features__inner {
  max-width: var(--max-width);
  margin: 0 auto;
  padding: 0 var(--container-px);
}
.dub-uc-features__title { color: var(--fg-light-primary); margin-bottom: 40px; text-align: center; }
.dub-uc-feature-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
}
.dub-uc-feature-card {
  background: var(--bg-white);
  border-radius: var(--radius-lg);
  padding: 32px 28px;
  border: 1px solid var(--border-light);
}
.dub-uc-feature-card__icon {
  width: 44px;
  height: 44px;
  border-radius: var(--radius-md);
  background: rgba(168,104,0,0.10);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--accent-aa-light);
  font-size: 1.125rem;
  margin-bottom: 16px;
}
.dub-uc-feature-card__title {
  font-family: var(--heading-font);
  font-size: 1rem;
  font-weight: 600;
  color: var(--fg-light-primary);
  margin-bottom: 8px;
}
.dub-uc-feature-card__body { font-size: 0.9375rem; color: var(--fg-light-secondary); line-height: 1.65; }

@media (max-width: 640px) {
  .dub-uc-feature-grid { grid-template-columns: 1fr; }
}

/* ── Waveform comparison (inline SVG) ────────────────────────*/
.dub-waveform-compare {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
.dub-waveform-compare__panel {
  background: var(--bg-cream);
  border-radius: var(--radius-lg);
  padding: 16px;
  border: 1px solid var(--border-light);
}
.dub-waveform-compare__label {
  font-family: var(--heading-font);
  font-size: 0.8125rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--fg-light-secondary);
  margin-bottom: 12px;
}

/* ── Pricing team note ───────────────────────────────────────*/
.dub-pricing-team-note {
  text-align: center;
  font-size: 0.9375rem;
  color: var(--fg-light-secondary);
}
.dub-pricing-team-note a { color: var(--accent-aa-light); text-decoration: underline; }

/* ── 404 fallback ─────────────────────────────────────────── */
.dub-page--404 {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 80px var(--container-px);
  text-align: center;
  background: var(--bg-dark);
}
.dub-page--404 h1 { color: var(--fg-dark-primary); font-size: 6rem; line-height: 1; }
.dub-page--404 p  { color: var(--fg-dark-secondary); font-size: 1.125rem; margin: 16px 0 32px; }

/* ── Print ────────────────────────────────────────────────── */
@media print {
  .dub-nav, .dub-cta-band, .cookie-banner, .dub-footer { display: none; }
  body { background: white; color: black; }
}