/* STEKLOBOX theme 02: deep black surfaces with restrained yellow rules. */
:root {
  --ink: #020303;
  --ink-soft: #0f1113;
  --panel: #17191c;
  --line: #2d3237;
  --paper: #08090a;
  --paper-strong: #17191c;
  --text: #efefeb;
  --muted: #a9afb5;
  --yellow: #ffed27;
  --yellow-deep: #d7c400;
}

body {
  color: var(--text);
  background: var(--paper);
}

.site-header {
  background: rgb(2 3 3 / 97%);
  border-bottom: 2px solid var(--yellow);
}

.section,
.service-section {
  color: var(--text);
  background: var(--paper);
}

.section-dark,
.subpage-hero,
.final-cta,
.site-footer {
  color: var(--text);
  background: var(--ink);
}

.services,
.centers,
.reviews,
.faq,
#price,
.chip-real-proof,
.comfort-band,
.service-section {
  border-top: 2px solid rgb(255 237 39 / 68%);
}

.section-heading h2,
.split-copy h2,
.process-intro h2,
.price-copy h2,
.faq-layout h2,
.result-strip-copy h2,
.comfort-grid h2,
.service-section h2,
.center-name h3,
.center-card h3,
.service-card h3,
.review-card blockquote,
.faq-list summary,
.accordion summary {
  color: var(--text);
}

.section-heading > p,
.split-copy > p,
.process-intro > p:not(.section-kicker),
.price-copy > p,
.service-card p:not(.service-number),
.service-price span,
.process-list p,
.repair-steps p,
.center-name span,
.center-location p,
.center-card .center-area,
.center-card p,
.review-card footer span,
.faq-list details p,
.accordion details p,
.result-strip-copy p,
.chip-real-item figcaption span,
.comfort-grid p,
.service-section p {
  color: var(--muted);
}

.section-kicker,
.eyebrow,
.process-list > li > span,
.repair-steps > li > span,
.center-index {
  color: var(--yellow);
}

.service-card,
.center-card,
.review-card,
.faq-list details,
.accordion details {
  color: var(--text);
  background: var(--paper-strong);
  border-color: var(--line);
}

.service-card,
.review-card {
  border-top: 3px solid var(--yellow);
}

.service-price,
.process-list li,
.repair-steps li,
.center-card .center-hours {
  border-color: var(--line);
}

.text-button:hover,
.review-store-link:hover {
  color: var(--yellow);
}

.center-filter-button,
.route-button,
.center-map {
  color: var(--text);
  background: var(--paper-strong);
  border-color: #4a4f56;
}

.center-filter-button:hover,
.route-button:hover,
.center-map:hover {
  color: var(--ink);
  background: var(--yellow);
  border-color: var(--yellow);
}

.center-filter-button.is-active {
  color: var(--ink);
  background: var(--yellow);
  border-color: var(--yellow-deep);
}

.center-list {
  border-top: 3px solid var(--yellow);
}

.center-row {
  border-bottom-color: var(--line);
}

.center-row:hover {
  background: #0f1113;
  box-shadow: inset 3px 0 0 var(--yellow);
}

.center-location address,
.center-card address {
  color: var(--text);
}

.proof,
.chip-real-proof,
.comfort-band {
  color: var(--text);
  background: var(--ink-soft);
  border-bottom-color: var(--line);
}

.result-strip {
  color: var(--text);
  background: var(--panel);
  border-top: 3px solid var(--yellow);
  border-bottom-color: var(--line);
}

.chip-real-item img {
  background: var(--panel);
}

.center-card.is-pilot {
  color: var(--text);
  background: var(--ink);
  border-color: var(--yellow-deep);
}

.center-card.is-pilot address {
  color: var(--text);
}

.approval-inline,
.approval-note {
  color: var(--text);
  background: var(--panel);
  border-left-color: var(--yellow);
}

.button-dark {
  color: var(--text);
  background: var(--panel);
  border-color: #4a4f56;
}

.button-ghost:hover,
.button-outline-light:hover {
  color: var(--ink);
  background: var(--yellow);
  border-color: var(--yellow);
}

dialog,
.dialog-head,
.channel-option {
  color: var(--text);
  background: var(--paper-strong);
}

.dialog-head,
.channel-option {
  border-color: var(--line);
}

.dialog-topic {
  color: var(--muted);
  background: var(--ink-soft);
  border-color: var(--line);
}

.dialog-topic strong {
  color: var(--text);
}

.channel-option:hover {
  border-color: var(--yellow);
}

.services-more,
.three-photo-list li {
  background: var(--ink-soft);
}

.service-section {
  border-bottom-color: var(--line);
}

/* The glass selector already uses a dark system; these values align it with theme 02. */
.page {
  --bg: #08090a;
  --surface: #0f1113;
  --surface-raised: #17191c;
  --line: #2d3237;
  --text: #efefeb;
  --muted: #a9afb5;
  --accent: #ffed27;
  --accent-ink: #020303;
}

.page .header {
  background: rgb(2 3 3 / 97%);
  border-bottom: 2px solid var(--accent);
}

.page .selectorSection,
.page .recommendationSection,
.page .guaranteeSection,
.page .comparisonSection,
.page .finalSection {
  border-top: 2px solid rgb(255 237 39 / 68%);
}

.page .mainImage,
.page .thumbnails button,
.page .lightbox img {
  background: var(--surface-raised);
}

/* Privacy and cookie information are part of the same visual system. */
.privacy-page {
  color: #efefeb;
  background: #08090a;
}

.privacy-header {
  background: #020303;
  border-bottom: 2px solid #ffed27;
}

.privacy-kicker,
.privacy-back,
.privacy-document a {
  color: #ffed27;
}

.privacy-document h1,
.privacy-document h2 {
  color: #efefeb;
}

.privacy-document h2 {
  padding-left: 14px;
  border-left: 3px solid #ffed27;
}

.privacy-document p {
  color: #a9afb5;
}

@media (prefers-reduced-motion: no-preference) {
  .center-row,
  .route-button,
  .center-map,
  .center-filter-button {
    transition: color 140ms ease, background-color 140ms ease, border-color 140ms ease, box-shadow 140ms ease;
  }
}