/* brakes.css — scoped additions for RU brake service pages */

body.service-brakes-page .sd-cta {
  background:
    linear-gradient(180deg, rgba(26, 33, 51, 0.96) 0%, rgba(17, 22, 37, 1) 100%);
}

body.service-brakes-page .sd-cta__overlay {
  background: linear-gradient(135deg, rgba(255, 176, 0, 0.045) 0%, rgba(255, 176, 0, 0.01) 34%, transparent 72%);
}

body.service-brakes-page .location-grid > * {
  background-color: var(--bg-surface);
}

body.service-brakes-page .location__info {
  background:
    linear-gradient(180deg, rgba(26, 33, 51, 0.98) 0%, rgba(17, 22, 37, 0.96) 100%);
}

body.service-brakes-page .contact__form {
  background:
    linear-gradient(180deg, rgba(17, 22, 37, 0.98) 0%, rgba(17, 22, 37, 0.92) 100%) !important;
  border: 1px solid var(--border-grid) !important;
  box-shadow: none;
}

body.service-brakes-page .location__map {
  background-color: var(--bg-main);
}

body.service-brakes-page .gb-choice-card--disc .gb-choice-card__photo,
body.service-brakes-page .gb-choice-card--drum .gb-choice-card__photo {
  background-position: center;
}

body.service-brakes-page .gb-choice-card--disc .gb-choice-card__icon,
body.service-brakes-page .gb-choice-card--drum .gb-choice-card__icon {
  color: var(--accent-primary);
}

/* Brake pages follow the АКПП/MКПП service rhythm. */
body.service-brakes-page {
  --service-flow-space: var(--space-2xl);
  --service-flow-space-tight: var(--space-xl);
  --service-title-space: var(--space-lg);
  --service-copy-space: var(--space-md);
  --service-panel-pad: var(--space-xl);
  --service-panel-pad-wide: var(--space-2xl);
}

@media (min-width: 1025px) {
  body.service-brakes-page {
    --service-flow-space: var(--space-xl);
    --service-flow-space-tight: var(--space-lg);
    --service-title-space: var(--space-md);
    --service-copy-space: var(--space-sm);
    --service-panel-pad: var(--space-lg);
    --service-panel-pad-wide: var(--space-xl);
  }

  body.service-brakes-page .sd-hero {
    min-height: 54vh;
    padding-bottom: var(--space-3xl);
  }

  body.service-brakes-page .sd-hero__content {
    gap: var(--space-md);
    max-width: min(980px, 78vw);
    padding-top: 144px;
  }

  body.service-brakes-page .sd-hero__title {
    max-width: 980px;
    font-size: clamp(2.25rem, 4.1vw, 3.75rem);
    line-height: 1;
  }

  body.service-brakes-page .sd-hero__lead {
    max-width: 680px;
    font-size: 0.95rem;
    line-height: 1.6;
  }

  body.service-brakes-page .gb-hero-stat {
    padding: var(--space-lg);
  }

  body.service-brakes-page .gb-hero-stat__number {
    font-size: clamp(1.55rem, 3.6vw, 2.25rem);
  }

  body.service-brakes-page .gb-hero-stat__label {
    font-size: 0.66rem;
    line-height: 1.45;
  }

  body.service-brakes-page .gb-local-nav__pill {
    padding: 0.45rem 0.85rem;
    font-size: 0.7rem;
  }
}

body.service-brakes-page .sd-main {
  gap: var(--service-flow-space);
  padding-top: var(--service-flow-space);
  padding-bottom: var(--service-flow-space);
}

body.service-brakes-page .sd-content {
  gap: var(--service-flow-space);
}

body.service-brakes-page .sd-content > :where(section, article, div, nav) {
  margin-block: 0;
}

body.service-brakes-page .sd-intro > h2,
body.service-brakes-page .gb-section-title {
  margin: 0 0 var(--service-title-space);
}

body.service-brakes-page .gb-section-text,
body.service-brakes-page .gb-section-text p {
  margin: 0 0 var(--service-copy-space);
}

body.service-brakes-page .gb-section-text:last-child,
body.service-brakes-page .gb-section-text p:last-child {
  margin-bottom: 0;
}

body.service-brakes-page :is(.gb-local-nav, .gb-page-section, .gb-hero-stats, .gb-urgency-block, .gb-diagnostics-card, .gb-cta-block, .brands-marquee) {
  margin-bottom: 0;
}

body.service-brakes-page .gb-local-nav {
  gap: var(--space-xs);
  padding-top: 0;
  padding-bottom: var(--space-md);
}

body.service-brakes-page .brands-marquee {
  padding-top: var(--service-title-space);
  padding-bottom: var(--service-title-space);
}

body.service-brakes-page :is(.gb-rating-summary, .gb-crosslink) {
  padding: var(--service-panel-pad) var(--service-panel-pad-wide);
}

body.service-brakes-page :is(.gb-diagnostics-card, .gb-cta-block) {
  padding: var(--service-panel-pad-wide);
}

body.service-brakes-page :is(.gb-symptom-card, .gb-type-card, .gb-trust-item, .gb-review-card, .gb-service-card, .gb-risk-stage, .gb-step) {
  padding: var(--service-panel-pad) var(--space-lg);
}

body.service-brakes-page :is(.gb-rating-summary, .gb-pricing-table, .gb-reviews-grid, .gb-trust, .gb-faq, .gb-crosslink) {
  margin: 0;
}

body.service-brakes-page .gb-hero-stat--text-metric .gb-hero-stat__number {
  display: inline-block;
  max-width: 100%;
  font-size: clamp(1.75rem, 4vw, 2.5rem);
  line-height: 1;
  white-space: nowrap;
  letter-spacing: 0;
}

body:is(.service-disc-brakes-page, .service-drum-brakes-page, .service-suspension-page) #types .gb-types-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

body.service-brakes-page .gb-crosslink {
  grid-template-columns: 32px minmax(0, 1fr);
  row-gap: var(--space-xs);
}

body.service-brakes-page .gb-crosslink > iconify-icon {
  grid-column: 1;
  grid-row: 1 / -1;
}

body.service-brakes-page .gb-crosslink > div {
  grid-column: 2;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

body.service-brakes-page .gb-crosslink__title {
  margin-top: 0;
  overflow-wrap: anywhere;
}

body.service-brakes-page .gb-crosslink > div > div:last-child,
body.service-brakes-page .gb-crosslink > div > p {
  color: var(--text-muted);
  font-family: var(--font-body);
  font-size: 0.88rem;
  font-weight: 400;
  line-height: 1.55;
  text-transform: none;
  margin: 0;
}

body.service-brakes-page .gb-checklist {
  margin-top: var(--service-title-space);
}

body.service-brakes-page .gb-review-card__author {
  margin-top: var(--space-sm);
  padding-top: var(--space-sm);
}

body.service-brakes-page .gb-pricing-note {
  margin-top: var(--space-md);
}

body.service-brakes-page .gb-lower-section--faq .gb-faq {
  margin-bottom: 0;
  gap: 1px;
  background: var(--border-grid);
  border: 1px solid var(--border-grid);
  border-top: none;
}

body.service-brakes-page .gb-lower-section--faq .gb-faq-item {
  margin-bottom: 0;
  border: none;
  background: var(--bg-main);
}

body.service-brakes-page .gb-lower-section--cta {
  border: 1px solid var(--border-grid);
  border-left: 4px solid var(--accent-primary);
  background:
    linear-gradient(90deg, rgba(255, 176, 0, 0.08) 0%, rgba(255, 176, 0, 0) 24%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.015) 0%, rgba(255, 255, 255, 0) 100%),
    var(--bg-surface);
  box-shadow: none;
}

body.service-brakes-page .gb-lower-section--cta .gb-cta-block__desc {
  color: var(--text-muted);
}

@media (max-width: 900px) {
  body.service-brakes-page .sd-main {
    gap: var(--service-flow-space-tight);
  }

  body:is(.service-disc-brakes-page, .service-drum-brakes-page, .service-suspension-page) #types .gb-types-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  body.service-brakes-page {
    --service-flow-space: var(--space-xl);
    --service-flow-space-tight: var(--space-lg);
    --service-title-space: var(--space-md);
    --service-copy-space: var(--space-sm);
    --service-panel-pad: var(--space-lg);
    --service-panel-pad-wide: var(--space-lg);
  }

  body.service-brakes-page .sd-sidebar-mobile {
    padding-top: var(--space-md);
    padding-bottom: var(--space-md);
  }

  body.service-brakes-page .sd-main {
    padding-top: var(--service-flow-space);
    padding-bottom: var(--service-flow-space);
  }

  body.service-brakes-page .gb-local-nav {
    padding-bottom: var(--space-sm);
  }

  body.service-brakes-page .gb-local-nav__pill {
    padding: 0.72rem 0.9rem;
  }

  body:is(.service-disc-brakes-page, .service-drum-brakes-page, .service-suspension-page) #types .gb-types-grid {
    grid-template-columns: 1fr;
  }
}
