/* Halogen proof-page additions. Shared review geometry remains in
   review-ultra3-stage1.css; this file supplies only halogen-specific color
   and evidence treatments for the OSRAM Night Breaker 200 proof. */

.halogen-review-proof {
  --bf-nav-brand: var(--bf-accent-dark);
  --bf-nav-brand-dark: #8e4040;
}

/* Keep the site navigation consistent with every other section. The halogen
   accent still applies throughout the review article, but it must not recolor
   the active menu item or the vehicle selector in the global header. */
.halogen-review-proof .bf-header {
  --bf-nav-brand: #2c709b;
  --bf-nav-brand-dark: #215777;
  --bf-nav-brand-soft: #edf3f7;
  --bf-nav-brand-border: #b8c9d4;
}

.halogen-review-proof .ultra3-review-hero {
  background:
    radial-gradient(circle at 88% 16%, rgba(211, 109, 109, .25), transparent 35%),
    linear-gradient(135deg, #2a2022 0%, #1c1719 66%, #151214 100%);
  border-color: #493034;
}

.halogen-review-proof .ultra3-review-hero .r-meta .score-tag {
  color: #fff4f1;
  background: rgba(211, 109, 109, .27);
  border-color: rgba(232, 168, 168, .35);
}

.halogen-review-proof .ultra3-review-hero .review-product-photo img {
  aspect-ratio: 4 / 3;
  object-fit: contain;
}

.halogen-review-proof .ultra3-hero-actions .page-action.secondary {
  color: #fff1ee;
  background: rgba(211, 109, 109, .1);
  border-color: rgba(232, 168, 168, .62);
}

.halogen-review-proof .ultra3-hero-actions .page-action.secondary:hover {
  background: rgba(211, 109, 109, .27);
}

.halogen-review-proof .ultra3-hero-actions .ultra3-price-action {
  color: #e6d4d1;
  background: transparent;
  border-color: rgba(255, 255, 255, .28);
}

.halogen-review-proof .review-hero-disclosures {
  background: #fff8f6;
  border-color: #ecd8d3;
}

.halogen-review-proof .ultra3-build-slider-viewport {
  background: #fff;
}

.halogen-review-proof .ultra3-build-slide img {
  aspect-ratio: 4 / 3;
  object-fit: contain;
}

.halogen-context-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin-top: 28px;
}

.halogen-context-grid aside {
  min-width: 0;
  padding: 18px 20px;
  border: 1px solid color-mix(in srgb, var(--bf-accent) 24%, var(--line));
  border-radius: var(--radius-sm);
  background: linear-gradient(135deg, var(--bf-accent-soft), #fff 78%);
}

.halogen-context-grid strong,
.halogen-context-grid p {
  display: block;
}

.halogen-context-grid strong {
  color: var(--ink);
  font-size: 13px;
  line-height: 1.4;
}

.halogen-context-grid p {
  margin: 5px 0 0;
  color: var(--ink-2);
  font-size: 13px;
  line-height: 1.62;
}

.halogen-video-card {
  display: grid;
  grid-template-columns: 150px minmax(0, 1fr);
  gap: 18px;
  align-items: center;
  margin-top: 14px;
  padding: 10px;
  color: var(--ink);
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: var(--surface);
  box-shadow: var(--shadow-sm);
  text-decoration: none;
}

.halogen-video-card:hover {
  color: var(--ink);
  border-color: color-mix(in srgb, var(--bf-accent) 48%, var(--line));
  text-decoration: none;
}

.halogen-video-card img {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  border-radius: 5px;
}

.halogen-video-card span,
.halogen-video-card small,
.halogen-video-card strong,
.halogen-video-card em {
  display: block;
  min-width: 0;
}

.halogen-video-card small {
  color: var(--bf-accent-dark);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .08em;
  line-height: 1.4;
  text-transform: uppercase;
}

.halogen-video-card strong {
  margin-top: 3px;
  font-size: 15px;
  line-height: 1.4;
}

.halogen-video-card em {
  margin-top: 3px;
  color: var(--ink-2);
  font-size: 12px;
  font-style: normal;
  line-height: 1.5;
}

.halogen-current-data-note,
.halogen-current-chart-evidence {
  padding: 18px 20px;
  border: 1px solid color-mix(in srgb, var(--bf-accent) 30%, var(--line));
  border-radius: var(--radius-sm);
  background: linear-gradient(135deg, var(--bf-accent-soft), #fff 78%);
}

.halogen-current-data-note {
  margin-top: 14px;
}

.halogen-current-chart-evidence {
  margin: 0 0 18px;
}

.halogen-current-data-note span,
.halogen-current-chart-evidence span,
.halogen-current-data-note strong,
.halogen-current-chart-evidence strong {
  display: block;
}

.halogen-current-data-note span,
.halogen-current-chart-evidence span {
  color: var(--bf-accent-dark);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .08em;
  line-height: 1.4;
  text-transform: uppercase;
}

.halogen-current-data-note strong,
.halogen-current-chart-evidence strong {
  margin-top: 4px;
  color: var(--ink);
  font-size: 16px;
  line-height: 1.4;
}

.halogen-current-data-note p,
.halogen-current-chart-evidence p {
  margin: 5px 0 0;
  color: var(--ink-2);
  font-size: 13px;
  line-height: 1.6;
}

.halogen-review-proof .ultra3-beam-metrics,
.halogen-review-proof .ultra3-beam-projector .ultra3-beam-metrics {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.halogen-reference-facts,
.halogen-ownership-facts {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1px;
  margin: 0 0 24px;
  padding: 1px;
  background: var(--line);
}

.halogen-reference-facts > div,
.halogen-ownership-facts > div {
  min-width: 0;
  padding: 14px;
  background: #fff;
}

.halogen-reference-facts dt,
.halogen-ownership-facts dt {
  color: var(--ink-3);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .07em;
  line-height: 1.4;
  text-transform: uppercase;
}

.halogen-reference-facts dd,
.halogen-ownership-facts dd {
  margin: 5px 0 0;
  color: var(--ink);
  font-size: 17px;
  font-weight: 700;
  line-height: 1.25;
}

.halogen-photo-status {
  margin: 0 0 24px;
  padding: 20px 22px;
  border: 1px dashed color-mix(in srgb, var(--bf-accent) 34%, var(--line));
  border-radius: var(--radius-sm);
  background: linear-gradient(135deg, var(--bf-accent-soft), #fff 78%);
}

.halogen-photo-status span,
.halogen-photo-status strong {
  display: block;
}

.halogen-photo-status span {
  color: var(--bf-accent-dark);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.halogen-photo-status strong {
  margin-top: 4px;
  color: var(--ink);
  font-size: 17px;
  line-height: 1.35;
}

.halogen-photo-status p {
  margin: 5px 0 0;
  color: var(--ink-2);
  font-size: 13px;
  line-height: 1.55;
}

.halogen-ownership-grid {
  display: grid;
  grid-template-columns: minmax(300px, .8fr) minmax(0, 1.2fr);
  gap: 18px;
  align-items: stretch;
  margin: 24px 0 30px;
}

.halogen-ownership-grid .hardware-meter-card {
  margin: 0;
}

.halogen-ownership-facts {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 0;
}

.halogen-ownership-facts > div {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.halogen-ownership-facts span {
  display: block;
  margin-top: 3px;
  color: var(--ink-2);
  font-size: 10px;
  line-height: 1.45;
}

.halogen-review-proof .ultra3-install-copy {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(24px, 3vw, 40px);
}

.halogen-review-proof .ultra3-install-copy .ultra3-ownership-subsection {
  min-width: 0;
}

.halogen-review-proof .ultra3-closing-actions,
.halogen-review-proof .ultra3-support-cta {
  border-color: color-mix(in srgb, var(--bf-accent) 34%, var(--line));
}

.halogen-review-proof .ultra3-support-cta {
  background: #fff8f6;
}

.halogen-review-proof .browse-types {
  border-color: color-mix(in srgb, var(--bf-accent) 22%, var(--line));
}

@media (max-width: 860px) {
  .halogen-context-grid,
  .halogen-ownership-grid,
  .halogen-review-proof .ultra3-install-copy {
    grid-template-columns: 1fr;
  }

  .halogen-reference-facts {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 600px) {
  .halogen-video-card {
    grid-template-columns: 104px minmax(0, 1fr);
    gap: 12px;
  }

  .halogen-reference-facts,
  .halogen-ownership-facts {
    grid-template-columns: 1fr;
  }

}

@media (max-width: 360px) {
  .halogen-review-proof .ultra3-beam-metrics,
  .halogen-review-proof .ultra3-beam-projector .ultra3-beam-metrics {
    grid-template-columns: 1fr;
  }
}
